Skip to content

Instantly share code, notes, and snippets.

Building ideas

Jabran Rafique⚡️ jabranr

Building ideas
View GitHub Profile
View minimal-analytics-snippet.js
(function (context, trackingId, options) {
const history = context.history;
const doc = document;
const nav = navigator || {};
const storage = localStorage;
const encode = encodeURIComponent;
const pushState = history.pushState;
const typeException = 'exception';
const generateId = () => Math.random().toString(36);
const getId = () => {
View lol.js
// paste in your console
speechSynthesis.onvoiceschanged = function() {
var msg = new SpeechSynthesisUtterance();
msg.voice = this.getVoices().filter(v => == 'Cellos')[0];
msg.text = Object.keys(window).join(' ');
staltz /
Last active Dec 28, 2018
How to show migration guides in GitHub Markdown

How to show migration guides in GitHub Markdown

Use the diff code highlighting tag.

  - foo
  + bar


macalac / gist:d1c17c5edc4b6cb4e20e
Last active Jul 31, 2017 — forked from saetia/gist:1623487
Clean Install – OS X 10.11 El Capitan
View gist:d1c17c5edc4b6cb4e20e

OS X Preferences

most of these require logout/restart to take effect

# Enable character repeat on keydown
defaults write -g ApplePressAndHoldEnabled -bool false

# Set a shorter Delay until key repeat
p3t3r67x0 /
Last active Aug 3, 2020
A CSS pseudo-element is used to style specified parts of an element. In some cases you can style native HTML controls with vendor specific pseudo-elements. Here you will find an list of cross browser specific pseudo-element selectors.

Styling native elements

Native HTML controls are a challenge to style. You can style any element in the web platform that uses Shadow DOM with a pseudo element ::pseudo-element or the /deep/ path selector.

video::webkit-media-controls-timeline {
  background-color: lime;

video /deep/ input[type=range] {
jabranr / vanilla-javascript-bootstrap.js
Last active Dec 2, 2015
Vanilla JavaScript Bootstrap
View vanilla-javascript-bootstrap.js
* This is small, light weight vanilla JavaScript Bootstrap script.
* It comes handy in situations where a framework i.e. jQuery is used only
* for "load" and "ready" events etc. This small script will not only save
* lot of bytes but also gives a basic start on writing object literal JavaScript.
* Learn more about object literal JavaScript at following resource:
jabranr / custom-callback-with-google-maps-loading-flow.js
Last active Aug 29, 2015
Custom callback with Google Maps loading flow
View custom-callback-with-google-maps-loading-flow.js
// setup
!(function(root) {
var AsyncGoogleMap = (function() {
// constructor
function AsyncGoogleMap(canvas, lat, lng, zoom, callback) {
if ( typeof canvas === 'undefined' )
jabranr / basic-facebook-login-flow.js
Last active Aug 29, 2015
Basic Facebook login and data retrieval flow
View basic-facebook-login-flow.js
// Check and verify user status or prompt for authorization
function checkUserStatus(response) {
var permissions = {
scope: '' // email
if ( isConnectedUser(response) )
return FB.api('/me', gotUserInfo);
return FB.login(checkUserStatus, permissions);
jonathantneal /
Last active May 22, 2020
Local SSL websites on macOS Sierra

Local SSL websites on macOS Sierra

These instructions will guide you through the process of setting up local, trusted websites on your own computer.

These instructions are intended to be used on macOS Sierra, but they have been known to work in El Capitan, Yosemite, Mavericks, and Mountain Lion.

NOTE: You may substitute the edit command for nano, vim, or whatever the editor of your choice is. Personally, I forward the edit command to Sublime Text:

alias edit="/Applications/Sublime\"
You can’t perform that action at this time.