Skip to content

Instantly share code, notes, and snippets.

View dreamyguy's full-sized avatar
⚡
👨‍💻 Code-bending

Wallace Sidhrée dreamyguy

⚡
👨‍💻 Code-bending
47 followers · 31 following
View GitHub Profile
@dreamyguy
dreamyguy / lazyScript.js
Last active July 31, 2017 08:01
Only lazy-load 3rd party script tag once the placeholder that interacts with it is visible on viewport
/* ===================================
* Only lazy-load 3rd party script tag once the placeholder that interacts with it is visible on viewport.
*
* Copyright (c) 2017, Wallace Sidhrée
* MIT License
====================================== */
var lazyScript = function(elId, scriptUrl, threshold) {
// polyfill requestAnimationFrame for ie9
window.requestAnimationFrame = window.requestAnimationFrame || function(f) { return setTimeout(f, 1000/60); };
@dreamyguy
dreamyguy / vertical-spacing.scss
Last active February 16, 2017 14:17
Vertical spacing mixin for Zurb Foundation
/* ===================================
* Vertical spacing for Zurb Foundation Grid
*
* Copyright (c) 2017, Wallace Sidhrée
* MIT License
====================================== */
$vs-positions: top bottom;
$vs-total: 8 !default; // range of classes to be created (in this case 1-8)
$vs: $gutter-size-half;
@dreamyguy
dreamyguy / a-toggler.js
Last active January 6, 2017 09:19
Generic toggler
$(function() {
// multi-toggler
var toggleItems = function(opts) {
var options = {
wrapper: 'wrapper', // id
toggler: 'toggler', // id
togglerOn: 'toggler-on', // class for toggler on state
togglerOff: 'toggler-off', // class for toggler off state
items: 'toggle-item', // class that will hide/show element(s)
classShow: 'toggle-show', // class applied to shown elements
@dreamyguy
dreamyguy / atom-editor-react.md
Created June 14, 2016 11:36
Atom - Useful packages and dependencies for Atom when developing with React
@dreamyguy
dreamyguy / IE10-11-and-IE12-conditions.scss
Created June 8, 2016 15:01
IE conditions for IE10-11 & MSEdge (IE12+)
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
// IE10+ styles go here
top: rem-calc(3);
}
// Reset styles for MSEdge, which usually works as well as Chrome
@supports (-ms-accelerator:true) {
// IEEdge 12+ styles go here
top: rem-calc(10);
}
@dreamyguy
dreamyguy / find-files-older-than.sh
Last active April 29, 2016 08:57
Find files that are older than x days while excluding directories
find . -mtime +200 -name "*.js" -not -path "./components/*" -not -path "./node_modules/*" -not -path "./.git/*" -print
@dreamyguy
dreamyguy / install-osx-from-external-drive.md
Last active January 6, 2016 23:34
OSX's fresh install from external media

  • Download the latest OSX from App Store.

    • The installer will open itself after its download. Do not proceed with install - close it!
    • Once downloaded the installer will be available on Applications folder.

  • Run the following command, taking care to rename the OSX version accordingly and to specify the name of the volume (make sure the command is typed in a single line):

sudo /Applications/Install\ OS\ X\ El\ Capitan.app/Contents/Resources/createinstallmedia --volume /Volumes/<name-of-volume> --applicationpath /Applications/Install\ OS\ X\ El\ Capitan.app --nointeraction

  • The prompt will ask for system password...
@dreamyguy
dreamyguy / gulp-run-tasks-in-series.js
Created October 26, 2015 17:22
Running tasks in series, i.e. Task Dependency
// ref: https://github.com/gulpjs/gulp/blob/master/docs/recipes/running-tasks-in-series.md
// ----------- method 1 ----------- //
gulp.task('2', ['1'], function() {
var stream = gulp.src()
// do some concatenation, minification, etc.
.pipe(gulp.dest());
return stream; // return the stream as the completion hint
@dreamyguy
dreamyguy / SassMeister-input.scss
Created January 20, 2015 21:23
Generated by SassMeister.com.
// ----
// Sass (v3.4.9)
// Compass (v1.0.1)
// ----
// set pixel reference base
$pixelBase: 16 !default;
// strip the unit of measure and return it
@function parseInt($n) {
@dreamyguy
dreamyguy / randomly-load-functions.html
Last active August 29, 2015 14:07
Load 1 out of N number of javascript functions randomly
<!DOCTYPE html>
<html>
<head>
<title>Random Functions</title>
<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
</head>
<body>
<div id="top" style="height: 400px"></div>
<div id="bottom" style="height: 400px"></div>
<script type="text/javascript">