Skip to content

Instantly share code, notes, and snippets.

View AshKyd's full-sized avatar
🐳
a frood who really knows where his towel is

Ash Kyd AshKyd

🐳
a frood who really knows where his towel is
View GitHub Profile
@AshKyd
AshKyd / gist:750c81d436badedb809fdb1f2c4eb3fc
Created July 15, 2024 04:43
Update NPM dependencies to latest
npx npm-check-updates -u
function cancellable() {
let isRunning = true;
const p = new Promise((resolve, reject) => {
setTimeout(() => {
if (!isRunning) return reject();
resolve();
}, 1000)
});
@AshKyd
AshKyd / methodSpy.js
Created May 29, 2024 01:38
Spy on video element methods and log when & where they're called from
['pause', 'play'].forEach(method => {
const oldMethod = video[method];
video[method] = function () {
console.log(`${method} (dom call)`, { video, e: new Error('here') });
return oldMethod.apply(video);
};
});
@AshKyd
AshKyd / photos.js
Last active March 6, 2024 10:35
Delete photos, videos, and reviews from the Google Maps desktop site. Huge disclaimer: these will probably get out of date at some point and may not work. You should read and understand the code before you do anything with it.
// delete photos from Google Maps
(async () => {
const sleep = (time) => new Promise(resolve => setTimeout(resolve,time));
const go = async () => {
// click the kebab
document.querySelector('button[jsaction*="pane.photo.actionMenu"]:not([aria-hidden="true"])').click();
await sleep(200);
// click the delete menu item
document.querySelector('#action-menu div[role="menuitemradio"]').click();
@AshKyd
AshKyd / readme.md
Last active January 12, 2024 03:19
Failsafe way to programmatically play a video, falling back to muted

https://developer.chrome.com/blog/autoplay

  1. Safari will not autoplay any videos when in low power mode.
    1. Requires a user interaction, after which the remainder of autoplay videos in the page work fine.
    2. Interaction means some form of click interaction. Doesn't even matter on what.
    3. Attempting to trigger an unumuted video with the element.play() api only works after interaction. Attempting this without an interaction will throw immediately, it does NOT return a rejected promise.
    4. It's not straightforward to detect the low power behaviour happening because Safari runs through all the standard video events as if the video is playing correclty. But the very last event will be "paused" which we can use to show a button to start the interactive.
  2. Chrome will always play muted autoplay videos.
  3. Attempting to play an unmuted video in Chrome with element.play() will return a rejected promise.
function dataTransferItemToArrayBuffer(dataTransferItem){
return new Promise((resolve, reject) => {
if(dataTransferItem.kind !== 'file') {return reject(new Error('DataTransferItem is not of kind "file"'));}
const file = dataTransferItem.getAsFile();
var reader = new FileReader();
reader.onload = function() {
var arrayBuffer = this.result,
array = new Uint8Array(arrayBuffer);
@AshKyd
AshKyd / index.html
Created December 17, 2023 06:36
iOS Chat bubbles
<p class="send">Hey there! What's up</p>
<p class="receive">Checking out iOS7 you know..</p>
<p class="send">Check out this bubble!</p>
<p class="receive">It's pretty cool…</p>
<p class="receive">Not gonna lie!</p>
<p class="send">Yeah it's pure CSS &amp; HTML</p>
<p class="receive">Wow that's impressive. But what's even more impressive is that this bubble is really high.</p>
@AshKyd
AshKyd / makeTsv.js
Created November 29, 2023 00:32
Make a tsv file out of a geojson blob. The properties must all be consistent or this won't really work.
const geojson = require('file.geojson');
function makeLine(object){
return Object.keys(object).map(key => {
const value = object[key];
if(!['string', 'number'].includes(typeof value)) return '-';
return value;
}).join('\t')
}
@AshKyd
AshKyd / search.js
Created November 23, 2023 00:38
search through a gzip file line by line on the client
function search(keyword) {
let chunks = 0;
isSearching = true;
return fetch(`${__webpack_public_path__}/placeNames.tsv.gz`).then(async res => {
const blob = await res.blob();
const ds = new DecompressionStream('gzip');
const reader = blob.stream().pipeThrough(ds).pipeThrough(new TextDecoderStream()).getReader();
let partialLine = '';
@AshKyd
AshKyd / colourToRgba.js
Created November 20, 2023 03:13
Convert any HTML colour to its rgb equivalent using HTML5 canvas. Suitable for use in a web worker using OffscreenCanvas.
const colourToRgbaMemo = {};
/**
* Parse and convert HTML colours to RGB representations.
* @param {string} sourceColour - Any valid HTML colour. E.g. ('#ff0000', 'rgba(128,128,255)' or 'hotpink')
* @returns {number[]} RGB triplet representing the given colour. If the colour was invalid, returns black.
*/
export function colourToRgb(sourceColour) {
// return from cache if available
if (colourToRgbaMemo[sourceColour]) return colourToRgbaMemo[sourceColour];