Skip to content

Instantly share code, notes, and snippets.

View olivmonnier's full-sized avatar
💭
¯\_(ツ)_/¯

Olivier Monnier olivmonnier

💭
¯\_(ツ)_/¯
18 followers · 39 following
View GitHub Profile
@OrionReed
OrionReed / dom3d.js
Last active July 22, 2024 08:58
3D DOM viewer, copy-paste this into your console to visualise the DOM topographically.
// 3D Dom viewer, copy-paste this into your console to visualise the DOM as a stack of solid blocks.
// You can also minify and save it as a bookmarklet (https://www.freecodecamp.org/news/what-are-bookmarklets/)
(() => {
const SHOW_SIDES = false; // color sides of DOM nodes?
const COLOR_SURFACE = true; // color tops of DOM nodes?
const COLOR_RANDOM = false; // randomise color?
const COLOR_HUE = 190; // hue in HSL (https://hslpicker.com)
const MAX_ROTATION = 180; // set to 360 to rotate all the way round
const THICKNESS = 20; // thickness of layers
const DISTANCE = 10000; // ¯\\_(ツ)_/¯
@semlinker
semlinker / index.html
Last active January 31, 2024 10:55
Implement Concurrent Download of Large Files in JavaScript
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Concurrent Download Demo</title>
<script src="multi-thread-download.js"></script>
</head>
<body>
@raganwald
raganwald / implicit.js
Last active February 15, 2019 08:31
Balanced parentheses solution with implicit state
function balanced (string) {
const iterator = string[Symbol.iterator]();
return balancedIterator(iterator) === true;
}
const CLOSE = {
'(': ')',
'[': ']',
'{': '}'
@ireade
ireade / sw.js
Last active May 28, 2024 19:17
Handle broken images with the service worker
self.addEventListener('install', (e) => {
e.waitUntil(
caches.open("precache").then((cache) => cache.add("/broken.png"))
);
});
function isImage(fetchRequest) {
return fetchRequest.method === "GET" && fetchRequest.destination === "image";
}
@alvaropinot
alvaropinot / map-to-object.js
Created October 3, 2017 17:58
"FUNctional" 😜 Map 🗺 to object 🔑
const obj = { a: 1, c: 3, b: 2 }
// Map from object.
const myMap = new Map(Object.entries(obj))
// Map to Object.
// NOTE: Keys will be cast to strings by `.toString`, so any "complex" key like for example `[1, 2]` will become `1,2`
const newObj = [...myMap.entries()]
.reduce((acc, [key, value]) => (Object.assign(acc, { [key]: value })), {})
@PaulKinlan
PaulKinlan / applyTemplate.js
Last active September 12, 2018 08:02
Simple Templating
const applyTemplate = (templateElement, data) => {
const element = templateElement.content.cloneNode(true);
const treeWalker = document.createTreeWalker(element, NodeFilter.SHOW_ELEMENT, () => NodeFilter.FILTER_ACCEPT);
while(treeWalker.nextNode()) {
const node = treeWalker.currentNode;
for(let bindAttr in node.dataset) {
let isBindableAttr = (bindAttr.indexOf('bind_') == 0) ? true : false;
if(isBindableAttr) {
let dataKeyString = node.dataset[bindAttr];
@SitePointEditors
SitePointEditors / dom-helper.js
Created March 28, 2017 09:56 — forked from m3g4p0p/dom-helper.js
Mini jQuery, sort of.
/**
* A collection of helper prototype for everyday DOM traversal, manipulation,
* and event binding. Sort of a minimalist jQuery, mainly for demonstration
* purposes. MIT @ m3g4p0p
*/
window.$ = (function (undefined) {
/**
* Duration constants
* @type {Object}
@PaulKinlan
PaulKinlan / monitorEvents.js
Created October 14, 2016 07:38
monitorEvents.js
function monitorEvents(element) {
var log = function(e) { console.log(e);};
var events = [];
for(var i in element) {
if(i.startsWith("on")) events.push(i.substr(2));
}
events.forEach(function(eventName) {
element.addEventListener(eventName, log);
});
@homam
homam / Callback-monad.js
Last active March 2, 2017 19:39
class Callback {
constructor(f) {
// this.run = f
this.run = callback => {
try {
f(callback)
} catch (ex) {
callback(ex, null)
}
@nepsilon
nepsilon / a-better-setup-for-git.md
Last active October 19, 2020 19:15
A better setup for Git — First published in fullweb.io issue #46

A better setup for Git

Git default configuration is good but it can be personalized to improve your workflow efficiency. Here are some good lines to put in your ~/.gitconfig:

# The basics, who you commit as:
[user]
  name = John Doe
  email = john@doe.org