Skip to content

Instantly share code, notes, and snippets.

🐳

JiHan Kim laziel

🐳
Block or report user

Report or block laziel

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@laziel
laziel / color-comparison.js
Last active Oct 11, 2019
Color comparison function for RGB (isLighterThan, isDarkerThan)
View color-comparison.js
/** Extracted from https://gist.github.com/alexandrudima/bda598fbed179a581986b634cc94ab8d */
/**
* Returns the number in the set [0, 1].
* - O => Darkest Black.
* - 1 => Lightest white.
* @see http://www.w3.org/TR/WCAG20/#relativeluminancedef
*
* @param {Object} color
* @param {Number} color.r
@laziel
laziel / exif-orientation.js
Created May 16, 2019
EXIF image orientation
View exif-orientation.js
/**
* Get image orientation from EXIF header
*
* Referenced:
* - https://gist.github.com/nezed/d536ccdace84c6f2ef13da47a8fd6bdb
* - https://gist.github.com/wonnage/9d2e73d9228f5a0b300d75babe2c3796
* - https://github.com/blueimp/JavaScript-Load-Image/blob/master/js/load-image-meta.js
*
* @param {String} imageUrl
* @return {Promise}
@laziel
laziel / youtube.js
Created Nov 17, 2018 — forked from max-te/youtube.js
Download Youtube-Video in node.js
View youtube.js
var http = require('http')
var fs = require('fs')
var argv = require('optimist').argv
var rxVideoID = /v=([\]\[!"#$%'()*+,.\/:;<=>?@\^_`{|}~-\w]*)/
var link = argv._.toString()
var videoID = link.match(rxVideoID)[1]
http.get("http://www.youtube.com/get_video_info?video_id="+videoID, function(res) {
var chunks = []
@laziel
laziel / draggable.js
Created Jul 3, 2018
Pure JavaScript Draggable
View draggable.js
(function () {
const wrapper = document.querySelector(`#test`);
const pos = {};
const moveDrag = evt => {
// const { scrollLeft, scrollTop } = document.scrollingElement;
const o = {
top: wrapper.offsetTop - (pos.clientY - evt.clientY),
left: wrapper.offsetLeft - (pos.clientX - evt.clientX)
@laziel
laziel / water_ripple_canvas.js
Created May 3, 2017 — forked from StuPig/water_ripple_canvas.js
Use JavaScript and canvas to create water ripple effect
View water_ripple_canvas.js
/*
* Water Canvas by Almer Thie (http://code.almeros.com).
* Description: A realtime water ripple effect on an HTML5 canvas.
* Copyright 2010 Almer Thie. All rights reserved.
*
* Example: http://code.almeros.com/code-examples/water-effect-canvas/
* Tutorial: http://code.almeros.com/water-ripple-canvas-and-javascript
*/
@laziel
laziel / 094607.md
Created Apr 6, 2016 — forked from marocchino/094607.md
ES6시대의 JavaScript
View 094607.md

ES6시대의 JavaScript

안녕하세요. 사원사업부의 마루야마@h13i32maru입니다. 최근의 Web 프론트엔드의 변화는 매우 격렬해서, 조금 눈을 땐 사이에 점점 새로운 것이 나오고 있더라구요. 그런 격렬한 변화중 하나가 ES6이라는 차세대 JavaScript의 사양입니다. 이 ES6는 현재 재정중으로 집필시점에서는 Draft Rev31이 공개되어있습니다.

JavaScript는 ECMAScript(ECMA262)라는 사양을 기반으로 구현되어있습니다. 현재 모던한 Web 브라우저는 ECMAScript 5.1th Edition을 기반으로 한 JavaScript실행 엔진을 탑재하고 있습니다. 그리고 다음 버전인 ECMAScript 6th Edition이 현재 재정중으로, 약칭으로 ES6이라는 명칭이 사용되고 있습니다.

View login-check.js
(function(){
var networks = [{
url: "https://squareup.com/login?return_to=%2Ffavicon.ico",
name: "Square"
}, {
url: "https://www.instagram.com/accounts/login/?next=%2Ffavicon.ico",
name: "Instagram"
}, {
url: "https://twitter.com/login?redirect_after_login=%2Ffavicon.ico",
name: "Twitter"
View leftpad.js
module.exports = leftpad;
function leftpad (str, len, ch) {
str = String(str);
var i = -1;
if (!ch && ch !== 0)
ch = ' ';
len = len - str.length;
while (++i < len) {
str = ch + str;
}
View github-corner.html
<a href="http://your-url" class="github-corner">
<svg width="80" height="80" viewBox="0 0 250 250"
style="fill:#151513; color:#fff; position: absolute; top: 0; border: 0; right: 0;">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path
d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path>
<path
d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9
@laziel
laziel / cssvar.css
Created Dec 10, 2015
css variables
View cssvar.css
$a: 4;
$b: 3;
.slide {
position: absolute;
top: 0;
left: calc(50vw - #{$a/$b/2*100vh});
width: $a/$b*100vh;
height: 100vh;
You can’t perform that action at this time.