Skip to content

Instantly share code, notes, and snippets.

Avatar
💀
calc(dev*design)

Adam Argyle argyleink

💀
calc(dev*design)
View GitHub Profile
View Getting started with requirejs.md

This is a small collection of scripts showing how to use require.js. It's only one of several ways of setting up a require.js project, but it's enough to get started.

At its core, require.js is about three things:

  1. Dependency management
  2. Modularity
  3. Dynamic script loading

The following files show how these are achieved.

@argyleink
argyleink / .htaccess mobile redirect
Last active Dec 19, 2015
Dead simple ipad (or whatever), redirect to custom index.html. I made this so that the viewport meta data can be present immediately for ipad, to prevent flashing of content. This is a great way around many JS hacks.
View .htaccess mobile redirect
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} "ipad" [NC]
RewriteRule ipad.html [L,QSA]
@argyleink
argyleink / SVG htaccess
Created Jul 17, 2013
Teach Apache to serve SVG
View SVG htaccess
AddType image/svg+xml svg
AddType image/svg+xml svgz
@argyleink
argyleink / vendorPrefix.js
Created Apr 22, 2013
Require.js ready vendor prefix extractor
View vendorPrefix.js
vendor.prefix = (function () {
'use strict';
var styles = window.getComputedStyle(document.documentElement, '')
, pre = (Array.prototype.slice
.call(styles)
.join('')
.match(/-(moz|webkit|ms)-/) || (styles.OLink === '' && ['', 'o'])
)[1]
, dom = ('WebKit|Moz|MS|O').match(new RegExp('(' + pre + ')', 'i'))[1];
@argyleink
argyleink / jquery.animate3d.js
Created Apr 22, 2013
Source: http://cameronspear.com/blog/animating-translate3d-with-jquery/ Plugin so jquery supports animating translate3d positions with callbacks
View jquery.animate3d.js
;(function($) {
var delay = 0;
$.fn.translate3d = function(translations, speed, easing, complete) {
var opt = $.speed(speed, easing, complete);
opt.easing = opt.easing || 'ease';
translations = $.extend({x: 0, y: 0, z: 0}, translations);
return this.each(function() {
var $this = $(this);
@argyleink
argyleink / rAF.polyfill.js
Created Apr 22, 2013
Require ready Request Animation Frame shim
View rAF.polyfill.js
(function() {
var lastTime = 0;
var vendors = ['ms', 'moz', 'webkit'];
for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {
window.requestAnimationFrame = window[vendors[x]+'RequestAnimationFrame'];
window.cancelAnimationFrame =
window[vendors[x]+'CancelAnimationFrame'] || window[vendors[x]+'CancelRequestAnimationFrame'];
}
if (!window.requestAnimationFrame)
@argyleink
argyleink / jsModule
Last active Dec 16, 2015
Favorite JavaScript Module Pattern
View jsModule
app.module = (function(){
'use strict';
function publicFunction() {
}
function privateFunction() {
}
View touchEventWireup
function inferInputModel() {
if (window.navigator.msPointerEnabled) {
return 'pointer';
} else if (window.ontouchstart !== undefined) {
return 'touch';
} else {
return 'unknown';
}
}
View hole.js
var Robot = function(robot) {};
Robot.prototype.onIdle = function(ev) {
var robot = ev.robot;
robot.ahead(20);
robot.rotateCannon(10);
};
Robot.prototype.onWallCollision = function(ev) {
@argyleink
argyleink / dabblet.css
Created Feb 25, 2013
Flexbox sandbox for destroying
View dabblet.css
/**
* Flexbox sandbox for destroying
*/
.flexbox {
display:flex;
}
.flex1 {
flex:1;
}