Drexel grid views

drexel-grids.js

// --------------------------------------------------
// Drexel grids and view templates.
// --------------------------------------------------
define(function (require) {
  
  // dependencies
  var _ = require('underscore');
  
  return {
    // --------------------------------------------------
    // grid rectangles - numbers in percentage
    //   rect( x, y, width, height )
    //
    grids: {
      // vertical split
      "a": [
        rect(50, 0, 51, 100),
        rect(0, 0, 51, 100)
      ],
      // horizontal split
      "e": [
        rect(0, 50, 100, 51),
        rect(0, 0, 100, 51)
      ],
      // three columns
      "i": [
        rect(66.6, 0, 33.5, 100),
        rect(33.3, 0, 33.5, 100),
        rect(0, 0, 33.5, 100)
      ],
      // combo split right
      "o": [
        rect(50, 0, 51, 51),
        rect(50, 50, 51, 51),
        rect(0, 0, 51, 100)
      ],
      // combo split left
      "u": [
        rect(50, 0, 51, 100),
        rect(0, 50, 51, 51),
        rect(0, 0, 51, 51)
      ]
    },
    
    // --------------------------------------------------
    // article url IDs mapped to views + templates
    //
    articles: {
      'beyond': {
        view: require('base/article'),
        template: require('text!templates/beyond.html')
      },
      'magic': {
        view: require('base/article'),
        template: require('text!templates/magic.html')
      },
      'contrary': {
        view: require('base/article'),
        template: require('text!templates/contrary.html')
      },
      'through': {
        view: require('base/article'),
        template: require('text!templates/through.html')
      },
      'enjoy': {
        view: require('base/article'),
        template: require('text!templates/enjoy.html')
      },
      'wild': {
        view: require('base/article'),
        template: require('text!templates/wild.html')
      },
      'nights': {
        view: require('base/article'),
        template: require('text!templates/nights.html')
      },
      'better': {
        view: require('base/article'),
        template: require('text!templates/better.html')
      },
      'struggle': {
        view: require('base/article'),
        template: require('text!templates/struggle.html')
      },
      'curious': {
        view: require('base/article'),
        template: require('text!templates/curious.html')
      },
      'jump': {
        view: require('base/article'),
        template: require('text!templates/jump.html')
      },
      'impossible': {
        view: require('base/article'),
        template: require('text!templates/impossible.html')
      },
      'dream': {
        view: require('base/article'),
        template: require('text!templates/dream.html')
      },
      'jenny': {
        view: require('base/article'),
        template: require('text!templates/jenny.html')
      },
      'sally': {
        view: require('base/article'),
        template: require('text!templates/sally.html')
      },
      'ryan': {
        view: require('base/article'),
        template: require('text!templates/ryan.html')
      },
      'justin': {
        view: require('base/article'),
        template: require('text!templates/justin.html')
      }
    },

    // --------------------------------------------------
    // List of custom cursors to be used for the grid
    //
    cursors: ['cur1', 'cur2', 'cur3']
  };
  
  // --------------------------------------------------
  // utils
  
  function rect(x, y, w, h) {
    var args = _.map(arguments, function (arg) {
      return arg === 0 ? arg : arg + '%';
    });
    return { x: args[0], y: args[1], width: args[2], height: args[3] };
  }
  
});