From f32c95d9ed404b6435d94097da68f3c787f3dda0 Mon Sep 17 00:00:00 2001 From: Ashwin Hegde Date: Wed, 3 Jun 2015 11:58:42 +0530 Subject: [PATCH 1/2] Updates eg6->8 --- kit/example-6/index.html | 2 +- kit/example-7/app/init.js | 14 +++++++++++--- kit/example-7/config.js | 5 ++++- kit/example-7/index.html | 15 +++++++++++++-- kit/example-8/app/init.js | 14 +++++++++++--- kit/example-8/config.js | 5 ++++- kit/example-8/index.html | 15 +++++++++++++-- 7 files changed, 57 insertions(+), 13 deletions(-) diff --git a/kit/example-6/index.html b/kit/example-6/index.html index c8fa793..b714312 100644 --- a/kit/example-6/index.html +++ b/kit/example-6/index.html @@ -12,7 +12,7 @@

JavaScript Module Loading using Require.js

How to run this example.

    -
  1. Open Example-5.html in browser using any HTTP-SERVER.
  2. +
  3. Open Example-6.html in browser using any HTTP-SERVER.
  4. Press F12, go to console tab.
  5. See the message get displayed on that console tab.
diff --git a/kit/example-7/app/init.js b/kit/example-7/app/init.js index 4bbfa4b..368bb76 100644 --- a/kit/example-7/app/init.js +++ b/kit/example-7/app/init.js @@ -1,10 +1,18 @@ +/** + * The goal of this file is to provide the basic understanding: + * -> How to global object store + * + * How to run this example. + * 1. Open Example-7.html in browser. + * 2. Press F12, go to console tab. + * 3. See the message get displayed on that console tab. + */ + define(["config"], function(config) { "use strict"; var url = config.url; - - console.log(url); - + console.log("Global Url: ", url); }); \ No newline at end of file diff --git a/kit/example-7/config.js b/kit/example-7/config.js index 89a17ad..550422c 100644 --- a/kit/example-7/config.js +++ b/kit/example-7/config.js @@ -1,3 +1,7 @@ +/** + * @module: Global object; use to store global application setting. + */ + define([], function() { "use strict"; @@ -6,5 +10,4 @@ define([], function() { url: "http://www.google.com" }; - }); \ No newline at end of file diff --git a/kit/example-7/index.html b/kit/example-7/index.html index dd082d9..70f104e 100644 --- a/kit/example-7/index.html +++ b/kit/example-7/index.html @@ -1,11 +1,22 @@ - Example 6 + + Example 7 + -

Require.js Integration.

+

JavaScript Module Loading using Require.js

+ +

How to run this example.

+ +
    +
  1. Open Example-7.html in browser using any HTTP-SERVER.
  2. +
  3. Press F12, go to console tab.
  4. +
  5. See the message get displayed on that console tab.
  6. +
+ \ No newline at end of file diff --git a/kit/example-8/app/init.js b/kit/example-8/app/init.js index 4bbfa4b..4c21419 100644 --- a/kit/example-8/app/init.js +++ b/kit/example-8/app/init.js @@ -1,10 +1,18 @@ +/** + * The goal of this file is to provide the basic understanding: + * -> How to bust require.js cache. + * + * How to run this example. + * 1. Open Example-8.html in browser. + * 2. Press F12, go to console tab. + * 3. See the message get displayed on that console tab. + */ + define(["config"], function(config) { "use strict"; var url = config.url; - - console.log(url); - + console.log("Global Url: ", url); }); \ No newline at end of file diff --git a/kit/example-8/config.js b/kit/example-8/config.js index 89a17ad..550422c 100644 --- a/kit/example-8/config.js +++ b/kit/example-8/config.js @@ -1,3 +1,7 @@ +/** + * @module: Global object; use to store global application setting. + */ + define([], function() { "use strict"; @@ -6,5 +10,4 @@ define([], function() { url: "http://www.google.com" }; - }); \ No newline at end of file diff --git a/kit/example-8/index.html b/kit/example-8/index.html index 870ee3c..6429d66 100644 --- a/kit/example-8/index.html +++ b/kit/example-8/index.html @@ -1,11 +1,22 @@ - Example 7 + + Example 8 + -

Require.js Integration.

+

JavaScript Module Loading using Require.js

+ +

How to run this example.

+ +
    +
  1. Open Example-7.html in browser using any HTTP-SERVER.
  2. +
  3. Press F12, go to console tab.
  4. +
  5. See the message get displayed on that console tab.
  6. +
+ \ No newline at end of file From 8cab7a41347b25de0044c10c47c0507f2e28156c Mon Sep 17 00:00:00 2001 From: Ashwin Hegde Date: Wed, 3 Jun 2015 12:30:42 +0530 Subject: [PATCH 2/2] Updates main comments for Eg3->8 --- kit/example-2/index.html | 6 +++--- kit/example-3/index.html | 5 +++++ kit/example-3/main.js | 4 ++++ kit/example-4/main.js | 10 ++++++++++ kit/example-5/main.js | 20 +++++++++++++++----- kit/example-6/main.js | 20 +++++++++++++++----- kit/example-7/main.js | 25 ++++++++++++++++--------- kit/example-8/index.html | 2 +- kit/example-8/main.js | 14 +++++++++++++- 9 files changed, 82 insertions(+), 24 deletions(-) diff --git a/kit/example-2/index.html b/kit/example-2/index.html index 09227d9..f78ca07 100644 --- a/kit/example-2/index.html +++ b/kit/example-2/index.html @@ -12,13 +12,13 @@

JavaScript Module Loading using Require.js

How to run this example.

    -
  1. Open Example-1.html in browser using any HTTP-SERVER.
  2. +
  3. Open Example-2.html in browser using any HTTP-SERVER.
  4. Press F12, go to console tab.
  5. See the message get displayed on that console tab.
- - + + diff --git a/kit/example-3/index.html b/kit/example-3/index.html index 3f21547..d733958 100644 --- a/kit/example-3/index.html +++ b/kit/example-3/index.html @@ -17,6 +17,11 @@

JavaScript Module Loading using Require.js

  • See the message get displayed on that console tab.
  • + \ No newline at end of file diff --git a/kit/example-3/main.js b/kit/example-3/main.js index c893b9d..1bc54c8 100644 --- a/kit/example-3/main.js +++ b/kit/example-3/main.js @@ -1,6 +1,10 @@ /** * require is global now, thus can be accessed by window.require; * Require.js config API, takes require.js configuration object. + * + * @config-options: + -> paths: Specify the path for js files; It is relative to the baseUrl; + if baseUrl is not provided then by default baseUrl path will become the path where the require.js main file reference. */ requirejs.config({ paths: { diff --git a/kit/example-4/main.js b/kit/example-4/main.js index 4f76acf..9bdc5a4 100644 --- a/kit/example-4/main.js +++ b/kit/example-4/main.js @@ -1,3 +1,10 @@ +/** + * require is global now, thus can be accessed by window.require; + * Require.js config API, takes require.js configuration object. + * + * @config-options: + -> baseUrl: Specify the baseUrl Url, As baseUrl is specify the path for js files will change and will be relative to this baseUrl; + */ requirejs.config({ baseUrl: "libs", @@ -7,6 +14,9 @@ requirejs.config({ } }); +/** + * Require.js onError method to handle Async timeout error. + */ requirejs.onError = function(err) { if (err.requireType === 'timeout') { alert("error: " + err); diff --git a/kit/example-5/main.js b/kit/example-5/main.js index 9596172..3b9cfa8 100644 --- a/kit/example-5/main.js +++ b/kit/example-5/main.js @@ -1,3 +1,10 @@ +/** + * require is global now, thus can be accessed by window.require; + * Require.js config API, takes require.js configuration object. + * + * @config-options: + -> shim (deps): Help to manage dependencies loading + */ requirejs.config({ baseUrl: "libs", @@ -14,12 +21,15 @@ requirejs.config({ } }); +/** + * Require.js onError method to handle Async timeout error. + */ requirejs.onError = function(err) { - if (err.requireType === 'timeout') { - alert("error: " + err); - } else { - throw err; - } + if (err.requireType === 'timeout') { + alert("error: " + err); + } else { + throw err; + } }; require(['app/init']); \ No newline at end of file diff --git a/kit/example-6/main.js b/kit/example-6/main.js index bd5c9cc..ea91f7b 100644 --- a/kit/example-6/main.js +++ b/kit/example-6/main.js @@ -1,3 +1,10 @@ +/** + * require is global now, thus can be accessed by window.require; + * Require.js config API, takes require.js configuration object. + * + * @config-options: + -> shim (exports): Help to check it the provided library is AMD supported. + */ requirejs.config({ baseUrl: "libs", @@ -13,12 +20,15 @@ requirejs.config({ } }); +/** + * Require.js onError method to handle Async timeout error. + */ requirejs.onError = function(err) { - if (err.requireType === 'timeout') { - alert("error: " + err); - } else { - throw err; - } + if (err.requireType === 'timeout') { + alert("error: " + err); + } else { + throw err; + } }; require(['app/init']); \ No newline at end of file diff --git a/kit/example-7/main.js b/kit/example-7/main.js index d509da8..dfaa06f 100644 --- a/kit/example-7/main.js +++ b/kit/example-7/main.js @@ -1,15 +1,22 @@ +/** + * require is global now, thus can be accessed by window.require; + * Require.js config API, takes require.js configuration object. + */ requirejs.config({ - paths: { - app: 'app' - } + paths: { + app: 'app' + } }); +/** + * Require.js onError method to handle Async timeout error. + */ requirejs.onError = function(err) { - if (err.requireType === 'timeout') { - alert("error: " + err); - } else { - throw err; - } + if (err.requireType === 'timeout') { + alert("error: " + err); + } else { + throw err; + } }; -requirejs(['app/init']); \ No newline at end of file +require(['app/init']); \ No newline at end of file diff --git a/kit/example-8/index.html b/kit/example-8/index.html index 6429d66..c52e5d6 100644 --- a/kit/example-8/index.html +++ b/kit/example-8/index.html @@ -12,7 +12,7 @@

    JavaScript Module Loading using Require.js

    How to run this example.

      -
    1. Open Example-7.html in browser using any HTTP-SERVER.
    2. +
    3. Open Example-8.html in browser using any HTTP-SERVER.
    4. Press F12, go to console tab.
    5. See the message get displayed on that console tab.
    diff --git a/kit/example-8/main.js b/kit/example-8/main.js index d5e792d..4917561 100644 --- a/kit/example-8/main.js +++ b/kit/example-8/main.js @@ -1,3 +1,12 @@ +/** + * require is global now, thus can be accessed by window.require; + * Require.js config API, takes require.js configuration object. + * + * @config-options: + -> deps: Load & executes the dependencies file rightaway in Async way. + -> callback: This function will get executed immediately after loading the deps files. + -> urlArgs: Appends query string for each loading file; This feature can be used to Require.js cache bust. + */ requirejs.config({ paths: { app: 'app' @@ -5,12 +14,15 @@ requirejs.config({ deps: ["app/init"], callback: function() { - console.log("In callback"); + console.log("In Requirejs callback api method"); }, urlArgs: "bust=" + (new Date()).getTime() }); +/** + * Require.js onError method to handle Async timeout error. + */ requirejs.onError = function(err) { if (err.requireType === 'timeout') { alert("error: " + err);