JSFiddle

  • playing w/ some OO js stuff

    class, sub class, yay

    function generateGetSet(prop) {
        var p = prop.toLowerCase();
        this.prototype['get'+prop] = function () { return this[p]; };
        this.prototype['set'+prop] = function ...
  • Highlightable div

    testing

    var highlight_width = $(".playerView").width() * .2;
    
    
    $(".playerHolder > .highlight").css("width", highlight_width);
    
    $(".playerHolder").on("mouseenter", ".playerView",  function(e) {
        $(e.target)
            .siblings(".highlight ...
  • Randomly select a defined number of items from an array

    No-Library (pure JS), HTML, CSS, JavaScript

    function getRandomItemsFrom(arr, numberOfItems) {
        if ( arr instanceof Array === false || arr.length === 0 ) return false;
        if ( numberOfItems === undefined || numberOfItems <= 0 ) return false;
        
        var results     = [],
            usedIndexes = {},
            randomIndex;
    
        while ( results.length !== numberOfItems ) {
            randomIndex = Math.floor(Math.random() * arr.length);
    
            if ( usedIndexes.hasOwnProperty(randomIndex) === false ) {
                usedIndexes[randomIndex] = true;
                results.push(arr[randomIndex]);
            }
        }
        
        return results;
    }
    
    
    var alphabet = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
    console.log('10 items: ' + getRandomItemsFrom(alphabet, 10));
    console.log('1 item: '   + getRandomItemsFrom(alphabet, 1));
    console.log('20 items: ' + getRandomItemsFrom(alphabet, 20));
    console.log('6 items: '  + getRandomItemsFrom(alphabet, 6));
    console.log('4 items: '  + getRandomItemsFrom(alphabet, 4));
    console.log('7 items: '  + getRandomItemsFrom(alphabet, 7));
    console.log('12 items: ' + getRandomItemsFrom(alphabet, 12));
    
    document.body.innerHTML = "<div>" + getRandomItemsFrom(alphabet ...</=>
  • Send a data payload along with a delete request from a Backbone.Model

    Done by passing specific AJAX options in to the .destroy() call. It's a little gross because it exposes you to the underlying AJAX workings which should be kept abstracted. It's good because it's a quick fix and requires very little additional code.

    // Extend from the enhanced model so that you can get the overridden sync method
    var Book = Backbone.Model.extend({
        urlRoot ...
  • Send a data payload along with a delete request from a Backbone.Model

    Done by extending the Backbone.Model implementation and overriding the destroy function and creating a new base model or w/e people call them.

    // Create your own 'enhanced' model 
    Backbone.EnhancedModel = Backbone.Model.extend({
        destroy: function( options ) {
            if ( options.data ) {
                // properly formats data for ...
  • Send a data payload along with a delete request from a Backbone.Model #9 is the latest revision

    Simple global override of the Backbone.sync method that formats delete requests into application/json and stringifies the data. It will be called from all CRUD functions, but it provides clean usage (can still call .destroy()) and very little overhead.

    // Save a copy of the old Backbone.sync function so you can call it later.
    var oldBackboneSync = Backbone.sync;
    
    // Override ...
  • Showing CSS orientation change #18 is the latest revision

    by resizing browser

    /*****
    
    ////////////////// RESIZE ////////////////////////// >>>>
    
    ******/
  • differences between body & document

    jQuery 2.x (edge), HTML, CSS, JavaScript

    var clusterfk, html, propertiesDiv = $('#properties'),
        body = document.body;
    
    var clusterfk = _.extend({}, body, document);
    
    for (prop in clusterfk) {
        html = $("<div>" + prop ...</div>
  • Live Updating Table using Backbone.js #17 is the latest revision

    Doesn't poll real data, data is generated by overriding Backbone.fetch :s

    var PollingCollection = Backbone.Collection.extend({
        url: "path/to/data/source",
        model: new Backbone.Model(),
        initialize: function (model, options) {
            this.options ...
  • deferred image loading for mobile

    yayz

    function loadAllTheImages() {
        $("img").each(function(){
            $(this).attr('src', $(this).attr('data-src'));
        });
    }
    
    $(window).load(function(){
        if ( $(window).width() > 500 ) {
            loadAllTheImages(); // !
        } else ...