Skip to content

Commit

Permalink
dojox/mobile: declare singletons in a way more understandable to me a…
Browse files Browse the repository at this point in the history 
…nd the doc parser. Although, it seems like these singletons could and should be replaced by a simple hash of functions, like we did for the parser.

Refs #13101 !strict.

git-svn-id: http://svn.dojotoolkit.org/src/dojox/trunk@29031 560b804f-0ae3-0310-86f3-f6aa0a117693
  • Loading branch information
@wkeese
wkeese committed Jun 25, 2012
1 parent 3f5fa0a commit 54a1c6c
Show file tree
Hide file tree
Showing 6 changed files with 132 additions and 182 deletions.
201 changes: 100 additions & 101 deletions mobile/deviceTheme.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,12 +7,103 @@

// module:
// dojox/mobile/deviceTheme
// summary:
// Automatic theme loader

var dm = lang && lang.getObject("dojox.mobile", true) || {};

var deviceTheme = new function(){
var DeviceTheme = function(){
// summary:
// Automatic theme loader.
// description:
// This module detects the user agent of the browser and loads the
// appropriate theme files. It can be enabled by simply requiring
// dojox/mobile/deviceTheme from your application.
//
// You can also pass an additional query parameter string,
// device={theme id} to force a specific theme through the browser
// URL input. The available theme ids are Android, BlackBerry,
// Custom, iPhone, and iPad. The names are case-sensitive. If the given
// id does not match, the iPhone theme is used.
//
// | http://your.server.com/yourapp.html // automatic detection
// | http://your.server.com/yourapp.html?theme=Android // forces Android theme
//
// To simulate a particular device, the user agent may be
// overridden by setting dojoConfig.mblUserAgent.
//
// By default, an all-in-one theme file (e.g. themes/iphone/iphone.css) is
// loaded. The all-in-one theme files contain style sheets for all the
// dojox/mobile widgets regardless of whether they are used in your
// application or not.
// If you want to choose what theme files to load, you can specify them
// via dojoConfig as shown in the following example:
//
// | data-dojo-config="parseOnLoad:true, mblThemeFiles:['base','Button']"
//
// Or you may want to use dojox/mobile/themeFiles as follows to get the
// same result. Note that the assignment has to be done before loading
// deviceTheme.js.
//
// | dojo.require("dojox.mobile");
// | dojox.mobile.themeFiles = ['base','Button'];
// | dojo.require("dojox.mobile.deviceTheme");
//
// In the case of this example, if iphone is detected, for example, the
// following files will be loaded:
//
// | dojox/mobile/themes/iphone/base.css
// | dojox/mobile/themes/iphone/Button.css
//
// If you want to load style sheets for your own custom widgets, you can
// specify a package name along with a theme file name in an array.
//
// | ['base',['com.acme','MyWidget']]
//
// In this case, the following files will be loaded.
//
// | dojox/mobile/themes/iphone/base.css
// | com/acme/themes/iphone/MyWidget.css
//
// If you specify '@theme' as a theme file name, it will be replaced with
// the theme folder name (e.g. 'iphone'). For example,
//
// | ['@theme',['com.acme','MyWidget']]
//
// will load the following files.
//
// | dojox/mobile/themes/iphone/iphone.css
// | com/acme/themes/iphone/MyWidget.css
//
// Note that loading of the theme files is performed asynchronously by
// the browser, so you cannot assume that the load has been completed
// when your application is initialized. For example, if some widget in
// your application uses node dimensions that cannot be determined
// without CSS styles being applied to them to calculate its layout at
// initialization, the layout calculation may fail.
//
// A possible workaround for this problem is to use dojo.require to load
// deviceTheme.js and place it in a separate `<script>` block immediately
// below the script tag that loads dojo.js as below. However, this is not
// guaranteed to solve the problem.
//
// | <script src="dojo.js"></script>
// | <script>
// | dojo.require("dojox.mobile.deviceTheme");
// | </script>
// | <script>
// | dojo.require("dojox.mobile");
// | ....
//
// Another option is to use deviceTheme.js as non-dojo JavaScript code.
// You could load deviceTheme.js prior to loading dojo.js using a
// script tag as follows.
//
// | <script src="dojox/mobile/deviceTheme.js"
// | data-dojo-config="mblThemeFiles:['base','Button']"></script>
// | <script src="dojo/dojo.js" data-dojo-config="parseOnLoad: true"></script>
//
// A safer solution would be to not use deviceTheme and use `<link>`
// or `@import` instead to load the theme files.

if(!win){
win = window;
win.doc = document;
Expand Down Expand Up @@ -164,105 +255,13 @@
}
}
};
}();
};

// Singleton. (TODO: can we replace DeviceTheme class and singleton w/a simple hash of functions?)
var deviceTheme = new DeviceTheme();

deviceTheme.loadDeviceTheme();
window.deviceTheme = dm.deviceTheme = deviceTheme;

/*=====
return {
// summary:
// Automatic theme loader.
// description:
// This module detects the user agent of the browser and loads the
// appropriate theme files. It can be enabled by simply requiring
// dojox/mobile/deviceTheme from your application.
//
// You can also pass an additional query parameter string,
// device={theme id} to force a specific theme through the browser
// URL input. The available theme ids are Android, BlackBerry,
// Custom, iPhone, and iPad. The names are case-sensitive. If the given
// id does not match, the iPhone theme is used.
//
// | http://your.server.com/yourapp.html // automatic detection
// | http://your.server.com/yourapp.html?theme=Android // forces Android theme
//
// To simulate a particular device, the user agent may be
// overridden by setting dojoConfig.mblUserAgent.
//
// By default, an all-in-one theme file (e.g. themes/iphone/iphone.css) is
// loaded. The all-in-one theme files contain style sheets for all the
// dojox/mobile widgets regardless of whether they are used in your
// application or not.
// If you want to choose what theme files to load, you can specify them
// via dojoConfig as shown in the following example:
//
// | data-dojo-config="parseOnLoad:true, mblThemeFiles:['base','Button']"
//
// Or you may want to use dojox/mobile/themeFiles as follows to get the
// same result. Note that the assignment has to be done before loading
// deviceTheme.js.
//
// | dojo.require("dojox.mobile");
// | dojox.mobile.themeFiles = ['base','Button'];
// | dojo.require("dojox.mobile.deviceTheme");
//
// In the case of this example, if iphone is detected, for example, the
// following files will be loaded:
//
// | dojox/mobile/themes/iphone/base.css
// | dojox/mobile/themes/iphone/Button.css
//
// If you want to load style sheets for your own custom widgets, you can
// specify a package name along with a theme file name in an array.
//
// | ['base',['com.acme','MyWidget']]
//
// In this case, the following files will be loaded.
//
// | dojox/mobile/themes/iphone/base.css
// | com/acme/themes/iphone/MyWidget.css
//
// If you specify '@theme' as a theme file name, it will be replaced with
// the theme folder name (e.g. 'iphone'). For example,
//
// | ['@theme',['com.acme','MyWidget']]
//
// will load the following files.
//
// | dojox/mobile/themes/iphone/iphone.css
// | com/acme/themes/iphone/MyWidget.css
//
// Note that loading of the theme files is performed asynchronously by
// the browser, so you cannot assume that the load has been completed
// when your application is initialized. For example, if some widget in
// your application uses node dimensions that cannot be determined
// without CSS styles being applied to them to calculate its layout at
// initialization, the layout calculation may fail.
//
// A possible workaround for this problem is to use dojo.require to load
// deviceTheme.js and place it in a separate `<script>` block immediately
// below the script tag that loads dojo.js as below. However, this is not
// guaranteed to solve the problem.
//
// | <script src="dojo.js"></script>
// | <script>
// | dojo.require("dojox.mobile.deviceTheme");
// | </script>
// | <script>
// | dojo.require("dojox.mobile");
// | ....
//
// Another option is to use deviceTheme.js as non-dojo JavaScript code.
// You could load deviceTheme.js prior to loading dojo.js using a
// script tag as follows.
//
// | <script src="dojox/mobile/deviceTheme.js"
// | data-dojo-config="mblThemeFiles:['base','Button']"></script>
// | <script src="dojo/dojo.js" data-dojo-config="parseOnLoad: true"></script>
//
// A safer solution would be to not use deviceTheme and use `<link>`
// or `@import` instead to load the theme files.
};
=====*/

return deviceTheme;
});
18 changes: 7 additions & 11 deletions mobile/iconUtils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,11 @@ define([

// module:
// dojox/mobile/iconUtils
// summary:
// Utilities to create an icon (image, CSS sprite image, or DOM Button).

var iconUtils = new function(){
var IconUtils = function(){
// summary:
// Utilities to create an icon (image, CSS sprite image, or DOM Button).

this.setupSpriteIcon = function(/*DomNode*/iconNode, /*String*/iconPos){
// summary:
// Sets up CSS sprite for a foreground image.
Expand Down Expand Up @@ -231,12 +232,7 @@ define([
}
};
};

/*=====
return {
// summary:
// Utilities to create an icon (image, CSS sprite image, or DOM Button).
};
=====*/
return iconUtils;

// Return singleton. (TODO: can we replace IconUtils class and singleton w/a simple hash of functions?)
return new IconUtils();
});
18 changes: 7 additions & 11 deletions mobile/lazyLoadUtils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,11 @@ define([

// module:
// dojox/mobile/lazyLoadUtils
// summary:
// Utilities to lazy-loading of Dojo widgets.

var lazyLoadUtils = new function(){
var LazyLoadUtils = function(){
// summary:
// Utilities to lazy-loading of Dojo widgets.

this._lazyNodes = [];
var _this = this;
if(config.parseOnLoad){
Expand Down Expand Up @@ -88,13 +89,8 @@ define([
return d;
}
};

/*=====
return {
// summary:
// Utilities to lazy-loading of Dojo widgets.
};
=====*/
return lazyLoadUtils;

// Return singleton. (TODO: can we replace LazyLoadUtils class and singleton w/a simple hash of functions?)
return new LazyLoadUtils();
});

16 changes: 6 additions & 10 deletions mobile/migrationAssist.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -147,12 +147,13 @@ define([

// module:
// dojox/mobile/migrationAssist
// summary:
// Dojo Mobile 1.6/1.7 to 1.8 migration assistance.

var currentTheme;

var migrationAssist = new function(){
var MigrationAssist = function(){
// summary:
// Dojo Mobile 1.6/1.7 to 1.8 migration assistance.

var get = function(w, key){
return w[key] || w.srcNodeRef && w.srcNodeRef.getAttribute(key);
};
Expand Down Expand Up @@ -420,11 +421,6 @@ define([
}
});

/*=====
return {
// summary:
// Dojo Mobile 1.6/1.7 to 1.8 migration assistance.
};
=====*/
return migrationAssist;
// Return singleton. (TODO: can we replace LazyLoadUtils class and singleton w/a simple hash of functions?)
return new MigrationAssist();
});
37 changes: 5 additions & 32 deletions mobile/pageTurningUtils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,38 +9,10 @@ define([
], function(kernel, array, connect, event, domClass, domConstruct, domStyle){
// module:
// dojox/mobile/pageTurningUtils
// summary:
// Utilities to provide page turning effects just like turning a real book.
// example:
// | require([
// | "dojo/ready",
// | "dojox/mobile/pageTurningUtils"
// | ], function(ready, pageTurningUtils){
// | var utils = new pageTurningUtils();
// | ready(function(){
// | utils.init(300, 400); // Specify width and height by pixels
// | utils.initCatalog(document.getElementById("catalog"));
// | });
// | );
// | <div id="catalog">
// | <div id="page1">
// | <div id="front1"><img src="img1.png"></div>
// | <div id="back1"><img src="img2.png"></div>
// | </div>
// | <div id="page2">
// | <div id="front2"><img src="img3.png"></div>
// | <div id="back2"><img src="img4.png"></div>
// | </div>
// | <div id="page3">
// | <div id="front3"><img src="img5.png"></div>
// | <div id="back3"></div>
// | </div>
// | </div>

kernel.experimental("dojox.mobile.pageTurningUtils");

/*=====
return {
var PageTurningUtils = function(){
// summary:
// Utilities to provide page turning effects just like turning a real book.
// example:
Expand Down Expand Up @@ -68,9 +40,7 @@ define([
// | <div id="back3"></div>
// | </div>
// | </div>
};
=====*/
return function(){

this.w = 0;
this.h = 0;
this.turnfrom = "top";
Expand Down Expand Up @@ -617,4 +587,7 @@ define([
childNodes[2] && domStyle.set(childNodes[2], "display", "none"); // shadowNode
};
};

// Return singleton. (TODO: can we replace PageTurningUtils class and singleton w/a simple hash of functions?)
return new PageTurningUtils();
});
Loading

0 comments on commit 54a1c6c

Please sign in to comment.