Skip to content

Instantly share code, notes, and snippets.

View gokulkrishh's full-sized avatar

Gokulakrishnan Kalaikovan gokulkrishh

View GitHub Profile

Screencapture and animated gifs

I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).

Capturing (Easy)

  1. Launch quicktime player
  2. do Screen recording

screen shot 2014-10-22 at 11 16 23 am

/*
* Lets you use your browser's back/forward buttons for in-page navigation by
* adding custom 'next' and 'previous' events to the window object.
*
* Copyright (c) 2011 Tobias Schneider <schneider@jancona.com>
* This script is freely distributable under the terms of the MIT license.
*
* Example:
*
* window.addEventListener('next', function(){
@gokulkrishh
gokulkrishh / objectObserve.js
Created November 3, 2015 07:33
Use Object.observe with polyfill
/*
Example for Object.observe
Polyfill: https://github.com/MaxArt2501/object-observe
Detects: Add, Update, Delete properties
Supported Browser: http://caniuse.com/object-observe
@gokulkrishh
gokulkrishh / Atom Editor Config
Last active November 18, 2015 17:46
Atom editor config
3dd2222c-c7ea-ebf2-c4fb-86c36ffbe4ed
"*":
"exception-reporting":
userId: "3dd2222c-c7ea-ebf2-c4fb-86c36ffbe4ed"
welcome:
showOnStartup: false
core:
themes: [
@gokulkrishh
gokulkrishh / sublime user.json
Last active November 19, 2015 06:02
Sublime user configuration for dotfile
{
"auto_complete": true,
"bold_folder_labels": true,
"caret_extra_width": 2,
"folder_exclude_patterns":
[
".svn",
".git",
".hg",
"CVS",
@gokulkrishh
gokulkrishh / Atom Config.cson
Created November 19, 2015 06:04
Atom Editor configuration
"*":
welcome:
showOnStartup: false
core:
themes: [
"atom-dark-ui"
"one-dark-syntax"
]
editor:
invisibles: {}
@gokulkrishh
gokulkrishh / Align an element horizontally & vertically center in css.markdown
Created January 7, 2016 07:18
Align an element horizontally & vertically center in css
@gokulkrishh
gokulkrishh / sw.js
Last active February 11, 2016 12:08
Service worker installation steps
//Cache polyfil to support cacheAPI in browsers
importScripts('/cache-polyfill.js');
//Cache name
var staticCache = "my-static-files";
//Files to cache
var filesToCache = [
"/",
"images/logo.jpg",
@gokulkrishh
gokulkrishh / sw.js
Last active February 11, 2016 12:37
Service worker activate event
//Activate event will be triggered once after registering, also used to clean up caches
self.addEventListener("activate", function (event) {
var cacheWhitelist = ['my-static-files'];
event.waitUntil(
caches.keys()
.then(function (allCaches) {
//Check all caches and delete old caches here
allCaches.map(function (cacheName) {
@gokulkrishh
gokulkrishh / esnextbin.md
Last active August 8, 2016 05:46
esnextbin sketch