Skip to content

Instantly share code, notes, and snippets.

@Skateside
Skateside / dom.js
Created April 22, 2014 14:51
Playing with simply but highly-efficient DOM selections
var dom = {
toArray: function (nodes) {
var array = [];
if (nodes) {
array = typeof nodes.length === 'number' ?
Array.prototype.slice.call(nodes) :
/**
* Creates a string of an element, showing the node name and all attributes.
* This is mainly useful for debugging in Internet Explorer where a DOM node
* representation isn't shown in the console.
*
* @param {Element} elem Element to stringify.
* @return {string} String representation of the element.
*/
function stringifyElem(elem) {
@Skateside
Skateside / onclasschange.js
Created March 27, 2014 11:32
Nothing short of a hack, but a surprisingly useful one when you can't change the main scripts.
/**
* Add a handler to check if a class changes on a given element.
* The handler will get two arguments: the new class and the old class.
*
* @param {Element} element Element whos class changes should be watched.
* @param {Function} func Function to call when the class changes.
*/
var onclasschange = (function () {
'use strict';
@Skateside
Skateside / placeholder.js
Last active December 17, 2015 17:09
An object-oriented shim for placeholder text. This requires the jQuery library.
/*globals $, document */
/**
* A simple shim for the placeholder attribute.
*/
if (typeof (document.createElement('input')).placeholder !== 'string') {
$(function () {
'use strict';
@Skateside
Skateside / inheritance.js
Created May 9, 2013 11:33
Playing around with simplifying inheritance in JavaScript. Not sure if this ill ever work, but worth playing with, I think.
function forin(obj, fn) {
var prop = '';
for (prop in obj) {
if (Object.prototype.hasOwnProperty.call(obj, prop)) {
fn.call(null, obj[prop], prop, obj);
}
@Skateside
Skateside / jsdoc.js
Last active December 17, 2015 03:49
This is a simple exploration of the Google Closure Compiler's use of JSDoc and the @type's needed to validate the code.
/*
General notes:
Curly braces around the types seem to be optional. "{number}" works the same as
"number".
*/
@Skateside
Skateside / prototype.js
Last active October 14, 2015 01:08
Just a simpler version of SK80.create from the mixin micro library. Note to self: integrate this
/**
* Extends one object with another. The object in the first argument is
* modified.
*
* @param {Object} source Source object to extend.
* @param {Object} extra Additional properties to add to the source object.
* @return {Object} Modified source object.
*/
function extendObject(source, extra) {
@Skateside
Skateside / supportsSelector.js
Created November 14, 2012 10:18
CSS selector support ion a handy function
// Detects whether or not a given CSS selector is supported by the current
// browser.
//
// Takes:
// selector (String) The CSS selector to test.
// Returns:
// (Boolean) true if the selector is supported, false
// otherwise.
var supportsSelector = (function () {
@Skateside
Skateside / modular.css
Last active July 6, 2016 18:45
Having read up on SMACSS, I put together a basic starting point for all my style sheets. This is that starting point.
/* # Base rules
This style sheet attempts to show how CSS selectors can be limited to no more
than a single class (although there are exceptions). Keeping to such a
restriction helps contain the styling to a module and allows for easier
sub-classes of modules. It also enables the surgical classes (below) to work.
## Universal rules
@Skateside
Skateside / Basic shim.js
Created October 8, 2012 20:26
Started using mixins quite a bit so I built a few functions to make it easier.
// These shims patch methods that the SK80 micro-library uses. References to the
// ES5 spec have been included to ensure that the shims are as close to
// standards as possible.
(function () {
'use strict';
var isStringArray = 'a'[0] === 'a',
objProto = Object.prototype,
toString = objProto.toString;