Skip to content

Instantly share code, notes, and snippets.


Dawid Karabin hinok

View GitHub Profile
hinok / _icons.scss
Created Jan 2, 2014 — forked from morewry/_icons.scss
Compass sprites generate placeholders instead of classes (newer version doesn't require listfiles.rb)
View _icons.scss
$disable-magic-sprite-selectors: true;
$icons-inline: true;
$icons-sprite-base-class: "%icons-sprite";
$icons-layout: smart;
$icons: sprite-map("icons/*.png");
@import "icons/*.png";
@each $img in sprite-names($icons) {
%icon-#{$img} {
@extend %icons-sprite;
View launch_sublime_from_terminal.markdown

Launch Sublime Text 3 from the Mac OS X Terminal

Sublime Text 3 ships with a CLI called subl (why not "sublime", go figure). This utility is hidden in the following folder (assuming you installed Sublime in /Applications like normal folk. If this following line opens Sublime Text for you, then bingo, you're ready.

open /Applications/Sublime\

You can find more (official) details about subl here:


View .zshrc
gifify() {
if [[ -n "$1" ]]; then
if [[ $2 == '--good' ]]; then
ffmpeg -i $1 -r 10 -vcodec png out-static-%05d.png
time convert -verbose +dither -layers Optimize -resize 600x600\> out-static*.png GIF:- | gifsicle --colors 128 --delay=5 --loop --optimize=3 --multifile - > $1.gif
rm out-static*.png
ffmpeg -i $1 -s 600x400 -pix_fmt rgb24 -r 10 -f gif - | gifsicle --optimize=3 --delay=3 > $1.gif
View user-timing-rum.js
// Support routines for automatically reporting user timing for common analytics platforms
// Currently supports Google Analytics, Boomerang and SOASTA mPulse
// In the case of boomerang, you will need to map the event names you want reported
// to timer names (for mPulse these need to be custom0, custom1, etc) using a global variable:
// rumMapping = {'aft': 'custom0'};
(function() {
var wtt = function(n, t, b) {
t = Math.round(t);
if (t >= 0 && t < 3600000) {
// Google Analytics

AngularJS Directive Attribute Binding Explanation

When using directives, you often need to pass parameters to the directive. This can be done in several ways. The first 3 can be used whether scope is true or false. This is still a WIP, so validate for yourself.

  1. Raw Attribute Strings

    <div my-directive="some string" another-param="another string"></div>
hinok / SassMeister-input.scss
Last active Apr 7, 2017
Generated by
View SassMeister-input.scss
// I created standalone package, look here
// ----
// libsass (v3.0.2)
// ----
View find.js
* Module dependencies
var util = require('util'),
actionUtil = require('../../node_modules/sails/lib/hooks/blueprints/actionUtil');
* Find Records
hinok / gist:a3d413004df3e1ff4bb0
Created Jan 18, 2015
Improved {{#each}} for Ember 1.9 / Handlebars 2.0.0
View gist:a3d413004df3e1ff4bb0
A replacement for #each that provides an index value (and other helpful values) for each iteration.
Unless using `foo in bar` format, the item at each iteration will be accessible via the `item` variable.
Simple Example
{{#eachIndexed bar in foo}}
{{index}} - {{bar}}
View ember-document-bind.js
import Ember from 'ember';
var get = Ember.get;
export default Ember.Component.extend({
didInsertElement: function(){
Ember.$(document).bind('click', this.closeThis);
closeThis: function(event) {

OS X Screencast to animated GIF

This gist shows how to create a GIF screencast using only free OS X tools: QuickTime, ffmpeg, and gifsicle.

Screencapture GIF


To capture the video (filesize: 19MB), using the free "QuickTime Player" application:

You can’t perform that action at this time.