WeiChiaChang’s gists

tomhicks / plink-plonk.js

Last active November 12, 2024 19:08

Listen to your web pages

	/*
	Copy this into the console of any web page that is interactive and doesn't
	do hard reloads. You will hear your DOM changes as different pitches of
	audio.

	I have found this interesting for debugging, but also fun to hear web pages
	render like UIs do in movies.
	*/

	const audioCtx = new (window.AudioContext \|\| window.webkitAudioContext)()

rauchg / index.html

Created November 27, 2019 12:07

Next level Phone UX

	<!DOCTYPE html>
	<html>
	<head>
	<title>Next level UX</title>
	<meta charset="UTF-8" />
	</head>

	<body>
	<p>
	<label>

mathdroid / never.gif

Last active February 11, 2024 22:25

Never

zaydek-old / bookmark.min.js

Last active May 28, 2024 19:18

A *simple* CSS debugger. To use, bookmark "Debug CSS" at https://zaydek.github.io/debug.css. Learn more here https://medium.freecodecamp.org/88529aa5a6a3 and https://youtu.be/2QdzahteCCs?t=1m25s (starts at 1:25)

/* debug.css | MIT License | zaydek.github.com/debug.css */ if (!("is_debugging" in window)) { is_debugging = false; var debug_el = document.createElement("style"); debug_el.append(document.createTextNode(`*:not(g):not(path) { color: hsla(210, 100%, 100%, 0.9) !important; background: hsla(210, 100%,  50%, 0.5) !important; outline: solid 0.25rem hsla(210, 100%, 100%, 0.5) !important; box-shadow: none !important; filter: none !important; }`)); } function enable_debugger() { if (!is_debugging) { document.head.appendChild(debug_el); is_debugging = true; } } function disable_debugger() { if (is_debugging) { document.head.removeChild(debug_el); is_debugging = false; } } !is_debugging ? enable_debugger() : disable_debugger();

oliveratgithub / emojis.json

Last active November 14, 2024 11:47

Emoji-list with emojis, names, shortcodes, unicode and html entities [massive list]

	{
	"emojis": [
	{"emoji": "👩‍👩‍👧‍👧", "name": "family: woman, woman, girl, girl", "shortname": ":woman_woman_girl_girl:", "unicode": "1F469 200D 1F469 200D 1F467 200D 1F467", "html": "👩&zwj;👩&zwj;👧&zwj;👧", "category": "People & Body (family)", "order": ""},
	{"emoji": "👩‍👩‍👧‍👦", "name": "family: woman, woman, girl, boy", "shortname": ":woman_woman_girl_boy:", "unicode": "1F469 200D 1F469 200D 1F467 200D 1F466", "html": "👩&zwj;👩&zwj;👧&zwj;👦", "category": "People & Body (family)", "order": ""},
	{"emoji": "👩‍👩‍👦‍👦", "name": "family: woman, woman, boy, boy", "shortname": ":woman_woman_boy_boy:", "unicode": "1F469 200D 1F469 200D 1F466 200D 1F466", "html": "👩&zwj;👩&zwj;👦&zwj;👦", "category": "People & Body (family)", "order": ""},
	{"emoji": "👨‍👩‍👧‍👧", "name": "family: man, woman, girl, girl", "shortname": ":man_woman_girl_girl:", "unicode": "1F468 200D 1F469 200D 1F467 200D 1F467", "html": "👨&zwj;👩&z

myshov / function_invocation.js

Last active August 19, 2024 12:23

11 Ways to Invoke a Function

	console.log(1);
	(_ => console.log(2))();
	eval('console.log(3);');
	console.log.call(null, 4);
	console.log.apply(null, [5]);
	new Function('console.log(6)')();
	Reflect.apply(console.log, null, [7])
	Reflect.construct(function(){console.log(8)}, []);
	Function.prototype.apply.call(console.log, null, [9]);
	Function.prototype.call.call(console.log, null, 10);

robertpeteuil / GitHub Language Colors in CSS and JSON

Last active November 1, 2024 19:41

GitHub Language Colors in CSS and JSON

This Gist contains the GitHub Language colors in CSS and JSON formats in seperate files.

msmfsd / es7-async-await.js

Last active February 4, 2024 17:38

Javascript fetch JSON with ES7 Async Await

	// Async/Await requirements: Latest Chrome/FF browser or Babel: https://babeljs.io/docs/plugins/transform-async-to-generator/
	// Fetch requirements: Latest Chrome/FF browser or Github fetch polyfill: https://github.com/github/fetch

	// async function
	async function fetchAsync () {
	// await response of fetch call
	let response = await fetch('https://api.github.com');
	// only proceed once promise is resolved
	let data = await response.json();
	// only proceed once second promise is resolved

gaearon / connect.js

Last active November 14, 2024 08:35

connect.js explained

	// connect() is a function that injects Redux-related props into your component.
	// You can inject data and callbacks that change that data by dispatching actions.
	function connect(mapStateToProps, mapDispatchToProps) {
	// It lets us inject component as the last step so people can use it as a decorator.
	// Generally you don't need to worry about it.
	return function (WrappedComponent) {
	// It returns a component
	return class extends React.Component {
	render() {
	return (

pachacamac / codepenclone.html

Created April 29, 2016 12:52

Mini Codepen Clone with sharing function

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>MiniCodepenClone</title>
	<style>
	body,textarea,iframe{ margin:0; box-sizing:border-box; }
	textarea,iframe { width:100%; height:50vh; float:left; }
	textarea { color:#eee; background:#111; font-family:monospace; font-size:11pt; line-height:1.4; width:33.33%; }
	#shareBtn { position:absolute; bottom:0; left:0; }

WesleyZen WeiChiaChang