Skip to content

Instantly share code, notes, and snippets.

View nfreear's full-sized avatar

Nick Freear nfreear

View GitHub Profile
/**
* Analytics without cookies ~ Yay!
*
* @copyright Nick Freear, 28-June-2021.
* @see https://developers.google.com/analytics/devguides/collection/analyticsjs/cookies-user-id#using_localstorage_to_store_the_client_id;
*/
const ANALYTICS_ID: string = 'UA-XXXXXX-YY';
const GA_LOCAL_STORAGE_KEY: string = 'ga:clientId';
const GA_DEBUG = false;
@nfreear
nfreear / inject-bot.bookmarklet.js
Last active June 25, 2021 08:06
Javascript to inject a Bot in an <iframe> into the nQuire mission builder | https://nquire.org.uk/
/**
Javascript to inject a Bot in an <iframe> into the nQuire mission builder.
@author NDF, 24-June-2021
@see https://nquire.org.uk/mission-builder/
@see https://tinymce.github.io/tinymce-demos/email/webmail-rich-text-editor.html
javascript:(() => {
//.
})();
@nfreear
nfreear / bootstrap4.print.css
Last active June 21, 2021 18:48
🖨️ Print styles extracted from Bootstrap 4 (v4.6.0) | https://github.com/twbs/bootstrap/blob/v4.6.0/scss/_print.scss | 🖨️
/*!
Print styles extracted from Bootstrap 4 (v4.6.0)
"v5: Drop all print styles and classes" :~ https://github.com/twbs/bootstrap/pull/28339;
V4 Docs :~ https://getbootstrap.com/docs/4.0/utilities/display/#display-in-print;
Code :~ https://github.com/twbs/bootstrap/blob/v4.6.0/scss/_print.scss;
Also :~ https://github.com/h5bp/main.css/blob/main/dist/_print.css;
*/
:root {
@nfreear
nfreear / print-pdf-test.css.html
Last active June 16, 2021 09:22
A print CSS and PDF test HTML page.
<!doctype html><html lang="en">
<meta charset="UTF-8" />
<link rel="gist" href="https://gist.github.com/nfreear/51eaee1781e5e5c885a474432b2e1325" />
<title> Print CSS / PDF test </title>
<!--<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/paper-css/0.3.0/paper.css"> -->
<style>
@nfreear
nfreear / beforeUnload-event-test.js.html
Created May 30, 2021 08:36
`beforeUnload` event test
<!doctype html> <title> `beforeUnload` event test </title>
<h1> <tt>beforeUnload</tt> event test </h1>
<h2><a href="?reload=1">Reload page</a></h2>
<script>
window.addEventListener('beforeunload', (event) => {
@nfreear
nfreear / Content-Security-Policy.csp.html
Last active May 25, 2021 15:39
Draft Content-Security-Policy - for OU Media Player.
<!doctype html> <title> Content-Security-Policy test </title>
<base href="https://mediaplayer.open.ac.uk/" />
<meta
http-equiv="Content-Security-Policy"
content="
default-src 'self' 'unsafe-inline' https://*.open.ac.uk ;
frame-ancestors 'self' https://*.open.ac.uk http://*.open.ac.uk https://*.open.edu ;
script-src 'self' 'unsafe-inline' https://*.open.ac.uk https://*.googleapis.com ;
@nfreear
nfreear / url-param.js.html
Last active May 25, 2021 10:55
Display URL parameters
<!doctype html> <title> URL params test </title>
<style>
body { color: #222; font: 1rem/1.7 sans-serif; margin: .2rem; }
pre { font-size: 1.05rem; }
</style>
<h1> URL parameters </h1>
@nfreear
nfreear / accessible-pie-chart.html
Last active May 20, 2021 19:42
Example of an accessible pie chart within a HTML <canvas>, with WAI-ARIA roles and properties.
<!doctype html> <title> Accessible Pie Chart </title>
<base href="https://en.wikipedia.org/wiki/Pie_chart#Example" /><!-- Make links in table work! -->
<style>
*, *:before, *:after { box-sizing: border-box; }
body { margin: 1rem auto; max-width: 36rem; }
canvas, table { width: 100%; }
canvas, [role=figure], table { border: .1rem solid #999; padding: .6rem; }
hr { border-top: .4rem solid #999; margin: 3rem 0; }
@nfreear
nfreear / skip-link.js.html
Created May 18, 2021 13:29
Imagining native skip links (after Kitty Giraudel)