Skip to content

Instantly share code, notes, and snippets.

@rayou
rayou / machine.js
Created October 20, 2020 04:42
Generated by XState Viz: https://xstate.js.org/viz
const dropdownMachine = Machine({
id: "dropdown",
initial: "idle",
context: {
items: [],
query: "",
},
on: {
UPDATE_ITEMS: {
actions: "updateItems",
@rayou
rayou / imageBlobToObjectURL.js
Last active September 10, 2020 12:31
Image Blob to ObjectURL
// Fetch
fetch("https://dummyimage.com/100x100/000/fff.png")
.then((res) => res.blob())
.then((data) => {
const objectURL = URL.createObjectURL(data);
const img = document.createElement("img");
img.src = objectURL;
document.body.append(img);
});
@rayou
rayou / index.html
Created June 3, 2020 02:12
Wrap text in <input type="button">
<input type="button" class="wrap" value="This is a long text">
@rayou
rayou / clearfix.css
Created June 15, 2016 06:34
cross-browser clearfix
/* ref: http://nicolasgallagher.com/micro-clearfix-hack/ */
/**
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* contenteditable attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that are clearfixed.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
@rayou
rayou / matchesSelector.js
Created June 14, 2015 05:31
matchesSelector.js
function matchesSelector(el, selector) {
var p = Element.prototype;
var f = p.matches || p.webkitMatchesSelector || p.mozMatchesSelector || p.msMatchesSelector || function(s) {
return [].indexOf.call(document.querySelectorAll(s), this) !== -1;
};
return f.call(el, selector);
}
@rayou
rayou / insertRule.js
Created June 14, 2015 05:30
insertRule.js
var sheet = (function() {
// Create the <style> tag
var style = document.createElement('style');
// Add a media (and/or media query) here if you'd like!
// style.setAttribute('media', 'screen')
// style.setAttribute('media', 'only screen and (max-width : 1024px)')
// WebKit hack :(
style.appendChild(document.createTextNode(''));
@rayou
rayou / isNative.js
Created June 14, 2015 05:30
isNative.js
;(function() {
// Used to resolve the internal `[[Class]]` of values
var toString = Object.prototype.toString;
// Used to resolve the decompiled source of functions
var fnToString = Function.prototype.toString;
// Used to detect host constructors (Safari > 4; really typed array specific)
var reHostCtor = /^\[object .+?Constructor\]$/;
@rayou
rayou / getAbsoluteUrl.js
Created June 14, 2015 05:29
getAbsoluteUrl
var getAbsoluteUrl = (function() {
var a;
return function(url) {
if(!a) a = document.createElement('a');
a.href = url;
return a.href;
};
})();
@rayou
rayou / once.js
Created June 14, 2015 05:29
once.js
function once(fn, context) {
var result;
return function() {
if(fn) {
result = fn.apply(context || this, arguments);
fn = null;
}
return result;
@rayou
rayou / poll.js
Created June 14, 2015 05:28
poll
function poll(fn, callback, errback, timeout, interval) {
var endTime = Number(new Date()) + (timeout || 2000);
interval = interval || 100;
(function p() {
// If the condition is met, we're done!
if(fn()) {
callback();
}
// If the condition isn't met but the timeout hasn't elapsed, go again