Skip to content

Instantly share code, notes, and snippets.

View Matt-Moore's full-sized avatar

LM Matt-Moore

6 followers · 1 following
View GitHub Profile
@Matt-Moore
Matt-Moore / page.html.erb
Last active October 8, 2019 16:50
Basic styling for SVG based star ratings. Squares are used for placeholders.
<div class="rating">
<table>
<% [*10...51].each do |number| %>
<% rating = number.to_f / 10 %>
<tr>
<th><%= rating %></th>
<td>
<svg width="240" height="40" viewBox="0 0 240 40" data-rating="<%= rating %>">
<g data-rating="1">
<path d="M 0,0 20,0 20,40 0,40z" />
@Matt-Moore
Matt-Moore / dynamic-filter-list.html
Created February 12, 2020 16:57
Dynamically hide filter buttons that don't fit within a horizontal space. The final button in the list should open a `dialog` with all (optionally only those missing) filter options.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Listing Grid full - Listty</title>
<script src="https://assets.canbotics.xyz/global/scripts/jquery-3.4.1.min.js" defer></script>
<script src="blah.js" defer></script>
@Matt-Moore
Matt-Moore / array-sort-mixed-localecompare.js
Created March 21, 2020 18:34
Sort arrays that contain both strings and numbers.
myArray = ['A Item','31','C item', 'B Item', 3, 10, 'Zebra', 8109, '7,900'];
// [3, "7,900", 10, "31", 8109, "A Item", "B Item", "C item", "Zebra"]
myArray.sort((a, b) => {
return a.toString(10).localeCompare(b, undefined, {numeric: true, ignorePunctuation: true});
});
@Matt-Moore
Matt-Moore / find-duplicate-ids.js
Last active February 9, 2021 20:39
Small scripts for finding WCAG non-compliance issues.
(function findDuplicateIds() {
const list = Array.from(document.querySelectorAll('[id]'));
const duplicates = {};
let duplicateList;
list.forEach((element) => {
if (!(element.id in duplicates)) {
duplicates[element.id] = [];
}
@Matt-Moore
Matt-Moore / wcag-issue-finder.js
Last active June 2, 2022 18:41
A collection of classes that combine my other scripts and clarify some issues.
class Issue {
static all = [];
static count = 0;
static reFilename = /\.\S/;
constructor(element) {
this.element = element;
Issue.all.push(this);