Skip to content

Instantly share code, notes, and snippets.

@kotarok
kotarok / kanafn.json
Last active December 6, 2021 09:55
Karabiner setting file for my own key bind modification.
{
"title": "KanaFN (“keyexchange”-compatible)",
"rules": [
{
"description": "KanaFN: japanese_kana to fn unlesss alone",
"manipulators": [
{
"type": "basic",
"from": {
"key_code": "japanese_kana",
@kotarok
kotarok / .csscomb.json
Last active March 1, 2018 11:15
My CSS Comb setting
{
"remove-empty-rulesets": true,
"always-semicolon": true,
"color-shorthand": true,
"leading-zero": false,
"unitless-zero": true,
"color-case": "lower",
"element-case": "lower",
"quotes": "single",
"space-before-combinator": " ",
var PositionObserver = function(callback, options) {
this.root = window;
this.rootMargin = this.buildRootMargin_('0');
this.threasholds = undefined;
this.els_ = [];
this.callback_ = callback;
this.init_(options);
this.listen_();
}
@kotarok
kotarok / ripple.scss
Created November 26, 2017 20:50
Material Design ripple effect Sass mixin
@mixin ripple($color: rgba(#fff, .2)) {
position: relative;
overflow: hidden;
&::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
width: 5px;
@kotarok
kotarok / myKeyhacConfig.py
Last active July 13, 2017 05:32
My Keyhac setting
import sys
import os
import datetime
import subprocess
from keyhac import *
def configure(keymap):
@kotarok
kotarok / picoquery.js
Created January 23, 2017 13:06
Array based tiny jQuery subset alternative with minimum number of methods.
var pq = function(q, f) {
return new pq.Obj(q);
};
pq.Obj = function(q) {
if (typeof q === 'string') {
return this.find(q);
} else if (q instanceof pq.Obj) {
return q;
} else if (q instanceof HTMLElement) {
@kotarok
kotarok / nq.js
Last active February 17, 2017 13:31
Array based tiny jQuery subset alternative with minimum number of methods + useful functionalities. Less than 1kb gzipped.
(function(window) {
'use strict';
var camelize = function(str) {
str = str.replace(/^\s+/, '');
return str.replace(/[\W]+([a-z0-9])(\w*)/ig, function(match, p1, p2) {
return p1.toUpperCase() + p2;
});
};
@kotarok
kotarok / JSONP.js
Last active August 23, 2016 03:10
Simple JSONP caller. Load JSON data as JSONP with given function.
var JSONP = function(apiurl, params, options) {
if (params) {
this.apiurl = this.constructURL_(apiurl, params);
}
this.conf = {
callbackKey: 'callback',
callbackName: 'uni',
paramDelimiter: '&'
@kotarok
kotarok / processTextNodes.js
Last active December 5, 2019 10:35
Walk DOM tree to extract textNode and apply given mutator function.
/**
* Extract textNodes from the tree of given root element. And apply given
* function to each textNodes.
* @param {HTMLElement} rootEl Target DOM sub tree root.
* @param {Function} processor Processor function
* @param {Object} option Config to override
*/
var processTextNodes = function(rootEl, processor, option) {
var conf = {
dummyElementName: 'dummy',
@kotarok
kotarok / watchInview.js
Last active October 4, 2016 15:28
Watch if the given element is in viewport and fires 'inview' and 'outview' event respectively.
var watchInview = function(el) {
// Get most closest element which has scrollbar.
var scrollContainer = getAncestors(el).find(function(el) {
return el.scrollHeight > el.offsetHeight || el.scrollWidth > el.offsetWidth;
});
el.scrollContainer =
(scrollContainer instanceof HTMLBodyElement)? window: scrollContainer;