Skip to content

Instantly share code, notes, and snippets.

Eric Shepherd arkitrave

Block or report user

Report or block arkitrave

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@arkitrave
arkitrave / tile-fit.js
Last active Oct 9, 2015
Will the tile fit? If you have a grid, but have some items which occupy multiple grid spaces, in a responsive layout, where can you place these larger tiles safely?
View tile-fit.js
// Find out if a given tile can slot into a given grid position.
function willItFloat (opts) {
var
start = new Date().getTime(),
pos = opts.position, // The grid position requested (0-based)
size = opts.maxTileSpan, // The maximum number of tile "slots" this tile can take up
cols = opts.maxPageColumns, // The maximum number of columns the page can have at full width
arrays,
intersection;
@arkitrave
arkitrave / backbone-view-private-methods.js
Created Jul 1, 2015
Private methods in Backbone views
View backbone-view-private-methods.js
define('my_view',
[jquery, underscore, backbone],
function ($, _, Backbone) {
// These will all have "this" bound correctly
var
MyView,
helpers;
View Foundations of AMD module syntax
foo = 'abc';
console.log(foo.length);
console.log(0.1+0.2);
//////////
var foo = {};
console.log('------ foo');
View A functional JS secret santa generator
function secretSantaGenerator (num) {
var participants = _.shuffle(_.range(1, num));
return _.map(participants, function (val, index, list) {
return [
val,
list[index + 1] ? list[index + 1] : list[0]
];
});
}
View breakpoints.less
/* less than 480px
_______
/_ __(_)___ __ __
/ / / / __ \/ / / /
/ / / / / / / /_/ /
/_/ /_/_/ /_/\__, /
/____/
*/
@media (max-width: @layout-tiny-max) {
View require_wrapper.js
/* FOR REFERENCE PURPOSES ONLY. CODE IS AUTHORED BY KEVAN DAVIS, COPYRIGHT 2010-2014 GILT GROUPE. */
/*jshint asi: false, bitwise: true, boss: false, curly: true, eqeqeq: true, eqnull: false, evil: false, forin: false, immed: true, laxbreak: false, newcap: true, noarg: true, noempty: true, nonew: false, nomen: false, onevar: true, plusplus: false, regexp: false, undef: true, sub: false, strict: false, white: false */
/*jshint browser: true, maxerr: 50, passfail: false */
/*global define: false */
/**
* requirejs wrapper
*
* will use either requirejs or global variables based on several factors,
View template-blog-3.js
Gilt.Template.render(
'baz', // The name of this feed or template type
data[0], // The data object to render
function(html) { // The callback function
Gilt.Notify.publish('feedTemplated', [html]);
},
{ version : 'bar' } // Options, in this case an alternate version
);
View template-blog-2.js
Gilt.Template.register('baz', '<div class="foo">' +
'<div class="foo-image">' +
'<img src="{{images/0}}" fullsrc="{{images/0}}" alt="{{{title}}}" />' +
'</div>' +
'<div class="foo-text">' +
'<h1>{{{brand_name}}}</h1>' +
'<h2>{{{title}}}</h2>' +
'</div>' +
'</div>',
{ version : 'bar' }
View template-blog-1.js
handlebars : {
cache: [],
render : function (name, template, content, context, callback) {
try {
if (!cache[name]) {
cache[name] = Handlebars.compile(template);
}
callback(cache[name](content, context));
} catch (e) {
// console.log('Could not render. Handlebars might not be installed');
@arkitrave
arkitrave / template-compare.js
Created Feb 14, 2011
Comparison of templated vs. non-templated HTML rendering
View template-compare.js
// Rendering markup with loops and string concatenation
for (var i = 0; i < foo.name.length; i++) {
content += '<li><a href="foo/' + foo.id[i] + '">' + foo.name[i] + '</a></li>';
}
// Rendering with a JavaScript template
content = '{{#foo}}' +
'<li><a href="foo/${id}">${name}</a></li>' +
'{{/foo}}';
You can’t perform that action at this time.