Skip to content

Instantly share code, notes, and snippets.

@peol
peol / gazer.js
Last active August 29, 2015 14:02
Autogenerate folders/files
var Gaze = require("gaze").Gaze;
var gaze = new Gaze("test_struct/**/*.js");
gaze.on("ready", function(watcher) {
this.watched(function(e, f) {
var files = [];
Object.keys(f).forEach(function(k) {
f[k].forEach(function(file) {
files.push(file);
});
@peol
peol / hbs-handlebars.patch
Created September 19, 2012 13:00
hbs-handlebars.patch
--- Handlebars.js Wed Sep 19 14:47:36 2012
+++ handlebars-1.0.rc.1.js Wed Sep 19 14:47:40 2012
@@ -1,3 +1,4 @@
+(function () {
// lib/handlebars/base.js
var Handlebars = {};
@@ -93,6 +94,7 @@
Handlebars.log(context);
});
@peol
peol / msdn-addy-julian.md
Created March 14, 2012 20:33
Creating Responsive Applications Using jQuery Deferred and Promises

Today we’re going to explore the concept of deferreds - an important feature found in JavaScript toolkits such as dojo and MochiKit, which recently also made its debut to popular JavaScript library jQuery. Deferreds offer a solution for abstracting non-blocking elements (such as the response to ajax requests) and achieve this by creating a ‘promise’ which aims to return a response at some point in the future. If you haven’t come across the concept of ‘promises’ before, we'll be covering them in some detail shortly.

At a high-level, deferreds can be thought of as a way to represent

@peol
peol / docs.md
Created March 9, 2012 16:54 — forked from addyosmani/docs.md
basket.js docs

##basket.js 0.2

###Introduction

basket.js is a small JavaScript library supporting localStorage caching of scripts. If script(s) have previously been saved locally, they will simply be loaded and injected into the current document. If not, they will be XHR'd in for use right away, but cached so that no additional loads are required in the future.

###Why localStorage?

Tests by Bing and Google have shown that there are performance benefits to caching assets in localStorage (especially on mobile) when compared to simply reading and writing from the standard browser cache. This project is currently working on replicating these tests in the public so that we have definitive statistics on whether this is true.

@peol
peol / qunit.md
Created February 26, 2012 08:39
QUnit/SinonJS/Backbone.js

#Backbone.js Testing With QUnit & SinonJS

QUnit is a powerful JavaScript test suite written by Jörn Zaefferer and used by many large open-source projects (such as jQuery and Backbone.js) to test their code. It's both capable of testing standard JavaScript code in the browser as well as code on the server-side (where environments supported include Rhino, V8 and SpiderMonkey). This makes it a robust solution for a number of use-cases.

Quite a few Backbone.js contributors feel that QUnit is a better introductory framework for testing if you don't wish to start off with Jasmine and BDD right away. As we'll see later on in this chapter, QUnit can also be combined with third-party solutions such as SinonJS to produce an even more powerful testing solution supporting spies and mocks, which some say is preferable over Jasmine.

My personal recommendation is that it's worth comparing both frameworks and opting for the solution that you feel the most comfortable with.

@peol
peol / algorithm-desc.md
Created December 6, 2011 09:51
Algorithm for getting the most optimal percentage that is divisible by X columns (sum up to 100%)

Description

This issue is a really common one and I'm about to get it solved for a customer. I have 100% width to work with, and I got X columns that should span equally (sum up to 100%). Browsers handle decimals in percent values differently, so I want to create an algorithm that finds the optimal total percentage (within a threshold, say 95% - 100%) that creates the total minimum decimals per column.

Prerequisites

  • The algorithm needs to find the optimal percentage within a threshold
  • X column classes should be generated, and should be included in the calculation when looking for the optimal percentage (i.e. .col-1 { width: 10%; } .col-2 { width: 20%; } [...])
@peol
peol / scraps.md
Created September 14, 2011 17:28 — forked from addyosmani/scraps.md
Scraps

/*Copyright Addy Osmani, 2011. Permission is not granted to re-publish this content unless otherwise stated. Its a work in progress :) */

#Essential jQuery Plugin Patterns (WIP)

##Introduction

I occasionally write about implementing design patterns in JavaScript. They're an excellent way of building upon proven approaches to solving common development problems and I think there's a lot of benefit to using them. That said, whilst well-known JavaScript patterns are useful, there's another side of development that can benefit from it's very own set of design patterns - jQuery plugins. The official jQuery plugin authoring guide offers a great starting point for getting into writing plugins and widgets, but let's attempt to take this further.

Plugin development has evolved over the past few years. We no longer have just one way of writing plugins, but many. They can be complex, they can be challenging but at the end of the day they can still be beautiful. I began to think about plugin patterns after seeing a n

@peol
peol / css-named-colors-in-webkit.js
Created August 31, 2011 08:39
All named CSS colors in webkit as a JS Object
// Source: http://www.google.com/codesearch#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/platform/ColorData.gperf&exact_package=chromium&type=cs
// There's also an RGB one defined here: http://www.google.com/codesearch#OAMlx_jo-ck/src/third_party/WebKit/Source/WebCore/inspector/front-end/Color.js&exact_package=chromium&q=indianred&l=393
var CSS_NAMED_COLORS = {
aliceblue: "#f0f8ff",
antiquewhite: "#faebd7",
aqua: "#00ffff",
aquamarine: "#7fffd4",
azure: "#f0ffff",
beige: "#f5f5dc",
@peol
peol / codereview.md
Created August 25, 2011 15:43 — forked from addyosmani/codereview.md
Lessons from a JavaScript code review

#Lessons From A JavaScript Code Review

I was recently asked to review some code and thought I might share some of the feedback I provided as it includes a mention of JavaScript fundamentals that are always useful to bear in mind.

####Problem: Functions to be used as callbacks (as well as objects) are passed as parameters to other functions without any type validation.

Feedback: For functions, at minimum 1) test to ensure the callback exists and 2) do a typeof check to avoid issues with the app attempting to execute input which may not in fact be a valid function at all.

if (callback && typeof(callback) === "function"){
@peol
peol / relative-time-duration.js
Created August 5, 2011 16:19
Small, versatile relative time/duration function
/**
* Copyright(c) 2011 Andrée Hansson
* @peolanha
* http://github.com/peol
*
* License: Do whatever you want, some attribution would be nice
*
* Small, versatile relative time function, options:
* asArray: Returns the data in an array, each entry has [0] = number, [1] = string representation
* filterValues: Removes all entries with 0 as value