Skip to content

Instantly share code, notes, and snippets.

View asvny's full-sized avatar
🎯
Focusing

Annamalai Saravanan asvny

🎯
Focusing
View GitHub Profile
// used to retrieve template content
const templates = new Map;
// used to retrieve node updates
const updates = new WeakMap;
// hyperHTML, the nitty gritty
function hyperHTML(chunks, ...interpolations) {
// if the static chunks are unknown
@asvny
asvny / FocusTrap.js
Created October 27, 2018 06:26
FocusTrap custom component using LitElement
import {
html,
LitElement
} from "https://unpkg.com/@polymer/lit-element@0.6.2/lit-element.js?module";
const KEYCODE_TAB = 9;
class FocusTrap extends LitElement {
constructor() {
super();
@asvny
asvny / useFocusTrap.jsx
Created October 26, 2018 04:55
FocusTrap - React Hook
// Based on https://hiddedevries.nl/en/blog/2017-01-29-using-javascript-to-trap-focus-in-an-element
import React, { useRef, useEffect } from 'react';
const KEYCODE_TAB = 9;
function useFocusTrap() {
const elRef = useRef(null);
function handleFocus(e) {
@asvny
asvny / catch.ts
Created August 31, 2018 02:41
Catch decorator in typescript
function Catch(E, callback) {
return function (target, key: string, descriptor: PropertyDescriptor) {
if(descriptor === undefined) {
descriptor = Object.getOwnPropertyDescriptor(target, key);
}
var originalMethod = descriptor.value;
descriptor.value = function () {
try {
@asvny
asvny / focus.js
Created August 29, 2018 01:29
Autofocus for all HTML Elements
(_ => {
const target = document.documentElement;
// config object
const config = {
attributes: true,
attributeOldValue: true,
characterData: true,
characterDataOldValue: true,
childList: true,
@asvny
asvny / native-create-element.js
Created August 19, 2018 14:52 — forked from sergiodxa/native-create-element.js
Example implementation of the same API of React.createElement but using native DOM elements
// use JSX with el instead of React.createElement
/** @jsx createElement */
const Children = {
only(children) {
if (children.length > 1 || children.length === 0) {
throw new Error('The children must have only one element');
}
return children[0];
}
@asvny
asvny / animate.js
Created June 12, 2018 12:47
Animate
const rafPromise = _ => new Promise(r => requestAnimationFrame(r));
const transEndPromise = ele => new Promise(r => {
ele.addEventListener('transitionend', function f() {
ele.removeEventListener('transitionend', f);
r();
});
});
const animate = (ele, styles) => {
@asvny
asvny / semver-check.re
Last active April 8, 2018 10:17
Semver check
module Semver = {
let checkVersion = (a, b) => {
let x = String.index(a, '.');
let y = String.index(b, '.');
let _b = x > y ? String.concat(String.make(x - y, '0'), [b]) : b;
let _a = y > x ? String.concat(String.make(y - x, '0'), [a]) : a;
let cmp = String.compare(_a, _b);
if (cmp == 0) {
0;
} else if (cmp > 0) {
@asvny
asvny / components.ui-btn.js
Created August 31, 2017 02:43
New Twiddle
import Ember from 'ember';
const { Logger: { assert } , tryInvoke } = Ember;
const PromiseProxy = Ember.Object.extend(Ember.PromiseProxyMixin);
const isPromise = (p) => typeof p === 'object' && p !== null && typeof p.then === 'function';
export default Ember.Component.extend({
tagName: 'button',
@asvny
asvny / components.delete-blog.js
Created August 31, 2017 01:36 — forked from jamesarosen/components.delete-blog.js
passing-deferreds-down
import Ember from 'ember';
export default Ember.Component.extend({
classNames: [ 'delete-blog' ],
sudoDeferred: null,
isDone: false,
isWorking: false,
message: null,