sashomaga

require.js

Nov 19th, 2013
76
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. //lazy loading
  2.         //modul loader -> load js files with ajax requests
  3.         //data-main -> config
  4.         //script sufix must be omited
  5.         //relative path from app-config directory
  6.  
  7.         /* app-config.js */
  8.         (function () {
  9.             require.config({
  10.                 paths: {
  11.                     "jquery": "libs/jquery-2.0.3"
  12.                 }
  13.             });
  14.  
  15.             //require jquery for function
  16.             //can be used path too -> "libs/jquery-2.0.3" without config
  17.             require(["jquery"], function ($) {
  18.                 $("html").append("module loaded");
  19.             });
  20.         }());
  21.  
  22.         /* moduls */
  23.         // moduls 1 per file
  24.         // name of modul is path of file
  25.         // function define creates modul
  26.         define(function () {
  27.             //do
  28.             return something
  29.         }())
  30.         // or define just data modul json
  31.         define({ someJson: true })
  32.         // no dependencies
  33.         define(function () {
  34.             var Class = (function () { .............. }())
  35.             return Class;
  36.         });
  37.         // with dependencies
  38.         define(['dependance modul1', 'dependance modul2' ...], function () {
  39.             var Class = (function () { .............. }())
  40.             return Class;
  41.         });
  42.         // dependance objects are paramethers of function
  43.         define(['rsvp','qjuery'], function(rsvp, $))
  44.  
  45.         //something like main  method
  46.         require(["jquery","mustache", "app/data-persister", "app/controls"], function ($, mustache, data, controls) {
  47.             data.people()
  48.                 .then(function (people) {
  49.            
  50.                     var personTemplateString = $("#person-template").html();
  51.  
  52.                     var template = mustache.compile(personTemplateString);
  53.  
  54.                     var listView = controls.listView(people);
  55.                     var listViewHtml = listView.render(template);
  56.  
  57.                     $("body").append(listViewHtml);
  58.  
  59.                 }, function (err) {
  60.                     console.error(err);
  61.                 });
  62.         });
  63.  
  64.        // all moduls load their own dependences but not overlap if olready loaded
  65.        // dependences loads in parallel (if depends each other)
  66.        // moduls return objects (but not mandatory)
Advertisement
Add Comment
Please, Sign In to add comment