Skip to content

Instantly share code, notes, and snippets.

@jpdevries
jpdevries / promisemilk.js
Created May 30, 2017 12:42
An introduction to JavaScript Promises using a real world analogy
// A husband forges out into the night...
// promising his wife to go to the store and come back with milk
const goToStore = new Promise((res, rej) => {
// do our code
// then when we are done, call res()
// if anything goes wrong, throw an error by calling rej()
const wentToStore = Math.random() <= .75; // 75% chance he remembers to go to the store
@jpdevries
jpdevries / axe-core-table-test.html
Created May 7, 2017 01:28
Ensure that each table header in a data table refers to data cells issue?
<table>
<thead>
<tr>
<th>Media</th>
<th>Filename</th>
</tr>
</thead>
<tbody>
<tr>
<td><img src="http://j4p.us/433U312j1Z0S/Screen%20Shot%202017-05-07%20at%203.24.10%20AM.png" alt="YOLO"></td><!-- fails axe-core https://dequeuniversity.com/rules/axe/2.1/th-has-data-cells -->
import React from 'react';
import ReactDOM from 'react-dom';
import { EurekaMediaBrowser, actions } from 'eureka-browser';
import decoratedActions from './modxactions';
module.exports = function(opts = window.EUREKA_CONFIG) {
const config = opts,
props = Object.assign({}, {
@jpdevries
jpdevries / csun2017.md
Last active March 3, 2017 19:37
CSUN 2017 Notes

CSUN 2017

February 27 — Introduction to Mobile Web Accessibility Testing & Development

  • Put <caption> on all tables (even if you .visually-hide it. Really important.
  • Put the unique part of page titles first. Like <title>Contact Us | Thinkful</title>. Better for tabs.
  • Use <footer role="contentinfo"> because <footer> has poor implicit role support
  • Whenever you do aria-hidden="true" also do tabindex="-1" so it won't receive focus (otherwise it will get focus but they won't hear anything)
  • ARIA actually has better browser support than HTML5. Wow.
@jpdevries
jpdevries / iseven.js
Created February 11, 2017 06:35
Check if a Number is Even with less division
/* function isEven(num) { if num is a really large number this will require A LOT of recursive division
return num % 2 === 0; // infinite module divisions
}*/
function isEven(num) {
num = parseInt(num.toString().slice(-1)); // the rightmost digit of any even number is also even so just check that
return num % 2 === 0;
}
@jpdevries
jpdevries / index.html
Last active December 30, 2016 16:56
Font Size Preference Widget
<form id="font-size-widget" class="widget">
<h2 id="font-size"><noscript>Please enable JavaScript to </noscript>Choose a Font Size</h2>
<fieldset>
<legend>Font Size</legend>
<div>
<input type="radio" name="fontsize" id="fontsize__normal" value="normal" checked disabled>
<label for="fontsize__normal">Normal</label>
</div>
<?php
/**
*
* Plugin fires OnWebPagePrerender system event, loads Minify HTML by Mr Clay and minifies the requested Resource HTML inc. inline css and js.
*
* If used in conjunction with StatCache the minified HTML is cached and served as a flat file via IIS Rewrite.
*
* CREDITS
*
* http://rtfm.modx.com/revolution/2.x/developing-in-modx/basic-development/plugins
@jpdevries
jpdevries / SassMeister-input.scss
Created February 9, 2016 18:07
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
%greedy {
width:100%;
}
div {
// we can do this
@jpdevries
jpdevries / SassMeister-input.scss
Created February 9, 2016 18:05
Generated by SassMeister.com.
// ----
// libsass (v3.2.5)
// ----
%greedy {
width:100%;
}
div {
// wish we could do this
@jpdevries
jpdevries / math.js
Created January 2, 2016 02:46
cool math in js
function distanceBetweenTwoPoints(_a,_b) {
return Math.sqrt(Math.pow(Math.abs(_a.y - _b.y),2) + Math.pow(Math.abs(_a.x - _b.x),2))
}