Browse files

Continuing to work on init function.

  • Loading branch information...
1 parent 9275476 commit f3e9641c52b3b42db5e3f5379a9841f96322b2f3 @zhouyaoji zhouyaoji committed Nov 13, 2012
View
124 docs/dev_guide/code_exs/binding_events.rst
@@ -9,9 +9,10 @@ Binding Events
Summary
=======
-This example shows how to bind events to a mojit, configure code to run on the client, and make AJAX
-calls to the YQL Web service. The application listens for events and then makes AJAX calls to
-YQL to get Flickr photo information.
+This example shows how to bind events to a mojit, configure code to run
+on the client, and make AJAX calls to the YQL Web service. The application
+listens for events and then makes AJAX calls to YQL to get Flickr photo
+information.
The following topics will be covered:
@@ -32,12 +33,13 @@ Implementation Notes
Configuring the Application to Run on the Client
------------------------------------------------
-Mojito lets you configure applications to run on either the server or client side. This example uses
-binders that are deployed to the client, so we need to configure Mojito to deploy the application
-to the client, where it will be executed by the browser.
+Mojito lets you configure applications to run on either the server or client
+side. This example uses binders that are deployed to the client, so we need
+to configure Mojito to deploy the application to the client, where it will
+be executed by the browser.
-To configure Mojito to run on the client, you simply set the ``"deploy"`` property to ``true`` in
-``application.json`` as seen below.
+To configure Mojito to run on the client, you simply set the ``"deploy"``
+property to ``true`` in ``application.json`` as seen below.
.. code-block:: javascript
@@ -61,9 +63,9 @@ To configure Mojito to run on the client, you simply set the ``"deploy"`` proper
Getting Data with YQL in the Model
----------------------------------
-In the mojit model, the `YUI YQL Query Utility <http://developer.yahoo.com/yui/3/yql/>`_ is used to
-get Flickr photo information. To access the utility in your model, specify ``'yql'`` in the
-``requires`` array as seen in the code snippet below:
+In the mojit model, the `YUI YQL Query Utility <http://developer.yahoo.com/yui/3/yql/>`_
+is used to get Flickr photo information. To access the utility in your model,
+specify ``'yql'`` in the ``requires`` array as seen in the code snippet below:
.. code-block:: javascript
@@ -73,10 +75,10 @@ get Flickr photo information. To access the utility in your model, specify ``'yq
...
}, '0.0.1', {requires: ['yql']});
-This code example uses the ``flickr.photos.search`` table to get information for photos that have a
-title, description, or tags containing a string. For example, the YQL statement below returns Flickr
-photo information for those photos that have a title, description, or tags containing the string
-"Manhattan".
+This code example uses the ``flickr.photos.search`` table to get information
+for photos that have a title, description, or tags containing a string. For
+example, the YQL statement below returns Flickr photo information for those
+photos that have a title, description, or tags containing the string "Manhattan".
Copy the query below into the `YQL Console <http://developer.yahoo.com/yql/console/>`_,
replace ``{your_flickr_api_key}`` with your own Flickr API key, and then click **TEST**
@@ -90,7 +92,7 @@ seen here:
``http://farm + {farm} + static.flickr.com/ + {server} + / + {id} + _ + {secret} + .jpg``
-In the ``model.js`` of ``PagerMojit`` shown below, the ``YQL`` function uses the YQL statement above
+In the ``model.server.js`` of ``PagerMojit`` shown below, the ``YQL`` function uses the YQL statement above
to get photo data, then parses the returned response to create the photo URIs. The model then wraps
the photo information in an object and stores those objects in the ``images`` array that is sent to
the controller through the ``callback`` function.
@@ -663,54 +665,52 @@ To set up and run ``binding_events``:
* @constructor
*/
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
- index: function(actionContext) {
- var page = actionContext.params.getFromMerged('page');
- var start;
- page = parseInt(page) || 1;
- if ((!page) || (page<1)) {
- page = 1;
- }
- // Page param is 1 based, but the model is 0 based
- start = (page - 1) * PAGE_SIZE;
- var model = actionContext.models.PagerMojit;
- // Data is an array of images
- model.getData('mojito', start, PAGE_SIZE, function(data) {
- Y.log('DATA: ' + Y.dump(data));
- var theData = {
- data: data, // images
- hasLink: false,
- prev: {
- title: "prev" // opportunity to localize
- },
- next: {
- link: createLink(actionContext, {page: page+1}),
- title: "next"
- },
- query: 'mojito'
- };
- if (page > 1) {
- theData.prev.link = createLink(actionContext, {page: page-1});
- theData.hasLink = true;
+
+ index: function(actionContext) {
+ var page = actionContext.params.getFromMerged('page');
+ var start;
+ page = parseInt(page) || 1;
+ if ((!page) || (page<1)) {
+ page = 1;
}
- actionContext.done(theData);
- });
- }
- };
- // Generate the link to the next page based on:
- // - mojit id
- // - action
- // - params
- function createLink(actionContext, params) {
- var mergedParams = Y.mojito.util.copy(actionContext.params.getFromMerged());
- for (var k in params) {
- mergedParams[k] = params[k];
+ // Page param is 1 based, but the model is 0 based
+ start = (page - 1) * PAGE_SIZE;
+ var model = actionContext.models.PagerMojit;
+ // Data is an array of images
+ model.getData('mojito', start, PAGE_SIZE, function(data) {
+ Y.log('DATA: ' + Y.dump(data));
+ var theData = {
+ data: data, // images
+ hasLink: false,
+ prev: {
+ title: "prev" // opportunity to localize
+ },
+ next: {
+ link: createLink(actionContext, {page: page+1}),
+ title: "next"
+ },
+ query: 'mojito'
+ };
+ if (page > 1) {
+ theData.prev.link = createLink(actionContext, {page: page-1});
+ theData.hasLink = true;
+ }
+ actionContext.done(theData);
+ });
+ }
+ };
+ // Generate the link to the next page based on:
+ // - mojit id
+ // - action
+ // - params
+ function createLink(actionContext, params) {
+ var mergedParams = Y.mojito.util.copy(actionContext.params.getFromMerged());
+ for (var k in params) {
+ mergedParams[k] = params[k];
+ }
+ return actionContext.url.make('frame', 'index', Y.QueryString.stringify(mergedParams));
}
- return actionContext.url.make('frame', 'index', Y.QueryString.stringify(mergedParams));
- }
- }, '0.0.1', {requires: ['dump']});
+ }, '0.0.1', {requires: ['dump']});
#. To get Flickr photo information using YQL, replace the code in ``model.server.js`` with
the following:
View
4 docs/dev_guide/code_exs/views_multiple_devices.rst
@@ -223,9 +223,7 @@ To set up and run ``device_views``:
YUI.add('device', function(Y, NAME) {
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
+
/* Method corresponding to the 'index' action.
*
* @param ac {Object} The action context that
View
2 docs/dev_guide/getting_started/mojito_getting_started_requirements.rst
@@ -1,5 +1,3 @@
-
-
============
Prerequisite
============
View
4 docs/dev_guide/getting_started/mojito_getting_started_tutorial.rst
@@ -154,10 +154,6 @@ controller outputs different results.
*/
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
-
/**
* Method corresponding to the 'index' action.
*
View
1 docs/dev_guide/intro/index.rst
@@ -1,4 +1,3 @@
-
==================
Introducing Mojito
==================
View
19 docs/dev_guide/intro/mojito_configuring.rst
@@ -273,8 +273,6 @@ Mojito and Cocktails.
+------------------------+---------------+-----------+-------------------------------+--------------------------------------------------------------------------------+
-
-
.. _specs_obj:
specs Object
@@ -780,9 +778,6 @@ the application-level ``Foo`` mojit, the controller of the Bar mojit would inclu
YUI.add('BarMojit', function(Y, NAME) {
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
index: function(actionContext) {
actionContext.done({title: "Body"});
}
@@ -1210,18 +1205,20 @@ The ``init`` function in the binder instead of a configuration object is passed
Application-Level Configurations
--------------------------------
-Only the mojit controller has access to application-level configurations through the
-``actionContext`` object.
+Only the mojit controller has access to application-level configurations
+using the ActionContext ``Config`` addon.
.. _access-applicationjson:
application.json
################
-The controller functions that are passed an ``actionContext`` object can reference the
-application configurations in ``application.json`` with ``ac.app.config``. For example, if
-you wanted to access the ``specs`` object defined in ``application.json``,
-you would use ``ac.app.config.spec``.
+The controller functions that are passed an ``actionContext`` object can get the
+application configurations in ``application.json`` with the method ``getAppConfig``
+of the ``Config`` addon.
+
+For example, if you wanted to access the ``specs`` object defined in ``application.json``,
+you would use ``ac.config.getAppConfig()``.
.. _access-routesjson:
View
149 docs/dev_guide/intro/mojito_mvc.rst
@@ -227,10 +227,7 @@ A controller should have the following basic structure:
// Module name is {mojit-name}
// Constructor for the Controller class.
Y.namespace('mojito.controllers')[NAME] = {
- // The spec configuration is passed to init
- init: function(config) {
- this.config = config;
- },
+
/**
* Method corresponding to the 'index' action.
* @param ac {Object} The ActionContext object
@@ -258,10 +255,6 @@ Several objects and methods form the backbone of the controller.
framework.
- ``Y.namespace('mojito.controllers')[NAME]`` - (required) creates a namespace that makes
functions available as Mojito actions.
-- ``init`` - (optional) if you provide an ``init`` function on your controller, Mojito
- will call it as it creates a controller instance, passing in the mojit specification.
- You can store the specification on the ``this`` reference for use within controller
- functions.
- ``this`` - a reference pointing to an instance of the controller that the function is
running within. This means that you can refer to other functions described within
``Y.namespace('mojito.controllers')[NAME]`` using ``this.otherFunction``. This is
@@ -280,12 +273,9 @@ by other functions, and the ``this`` reference allows the ``index`` function to
YUI.add('status', function(Y, NAME) {
Y.namespace('mojito.controllers')[NAME] = {
- init: function(spec) {
- this.spec = spec;
- this.date = new Date();
- },
+
index: function(ac) {
- var dateString = ac.intl.formatDate(this.date);
+ var dateString = ac.intl.formatDate(new Date());
var status = ac.params.getFromMerged('status');
var user = ac.params.getFromMerged('user');
var status = {
@@ -353,9 +343,7 @@ actions.
YUI.add('Stateful', function(Y, NAME) {
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
+
index: function(ac) {
ac.done({id: this.config.id});
},
@@ -366,69 +354,6 @@ actions.
// The requires array list the YUI module dependencies
}, '0.0.1', {requires: []});
-.. _mvc-controllers-ref:
-
-Initializing and Referencing a Controller Instance
---------------------------------------------------
-
-If the controller has an ``init`` function, Mojito will call it as it creates a controller
-instance. The ``init`` function is passed the mojit ``config`` object, which is
-defined in ``application.json`` or ``defaults.json``. See the
-`config Object <./mojito_configuring.html#config-object>`_ for the specifications.
-
-You can also use ``init`` to store other initialization data on ``this`` as seen below:
-
-.. code-block:: javascript
-
- YUI.add('PlaceFinder', function(Y, NAME) {
- Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- this.geo_api = "http://where.yahooapis.com/geocode";
- },
- ...
- };
- }, '0.0.1', {requires: []});
-
-Within your controller actions and the ``init`` action, the ``this`` reference points to
-an instance of the controller the action is running within. This means that you can refer
-to other functions or actions described within ``Y.namespace('mojito.controllers')[NAME]``
-using the syntax ``this.{otherFunction}``. This is helpful when you've added some utility
-functions onto your controller that do not accept an ActionContext object as the argument,
-but you wish to use for several actions.
-
-In the example controller below, the ``health`` function uses ``this`` to call the utility
-function ``get_bmi``.
-
-.. code-block:: javascript
-
- YUI.add('HealthStats', function(Y, NAME) {
- Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
- index: function(ac) {
- ac.done({id: this.config.id});
- },
- health: function(ac) {
- var health_stats = ac.params.getAll();
- var weight=health_stats['weight'],height = health_stats['height'], metric=health_stats['metric'];
- var bmi = this.get_bmi(weight,height,metric)
- ac.done({ bmi: bmi });
- },
- };
- function get_bmi(weight, height, metric){
- var bmi = 0;
- if(metric) {
- bmi = weight/(height*height);
- } else {
- bmi = (weight*703)/(height*height);
- }
- return bmi;
- }
- }, '0.0.1', {requires: []});
-
-.. _controllers-calling_models:
.. _mvc-controllers-call_model:
@@ -451,9 +376,7 @@ model of the ``simple`` mojit.
YUI.add('simple', function(Y, NAME) {
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
+
index: function(ac) {
var model = ac.models.get('simpleModel');
model.get_data (function(data) {
@@ -497,9 +420,7 @@ object to the ``index`` template.
* @constructor
*/
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
+
/**
* Method corresponding to the 'index' action.
* @param ac {Object} The action context that
@@ -542,9 +463,7 @@ object to the ``profile`` template instead of the default ``user`` template.
* @constructor
*/
Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- },
+
/**
* Method corresponding to the 'index' action.
* @param ac {Object} The action context that
@@ -591,61 +510,7 @@ post. The ``try-catch`` clause will catch any errors made calling ``getPost``, a
}
...
-.. _mvc-controllers-save_state:
-
-Saving State
-------------
-
-You can maintain the state within controllers when they are running on the client because
-the client-side Mojito runtime is long-lived. You **cannot** maintain state within server
-controllers because the controller is discarded after the page has been generated and
-served to the client.
-
-In the example ``controller.client.js`` below, the ``pitch`` function stores the variable
-``ball`` on ``this``. If client code invokes ``pitch``, the ``ball`` parameter it sends
-will be stored in controller instance state. If ``catch`` function is invoked, that state
-variable is retrieved and sent back in a callback.
-.. code-block:: javascript
-
- YUI.add('Stateful', function(Y, NAME) {
- Y.namespace('mojito.controllers')[NAME] = {
- init: function(config) {
- this.config = config;
- this.time = new Date().getTime();
- },
- index: function(ac) {
- ac.done({id: this.config.id});
- },
- pitch: function(ac) {
- this.logit('pitch');
- // Use the Params addon to get the 'ball' parameter.
- // getFromMerged() allows you to retrieve routing,
- // request, and query string parameters.
- this.ball = ac.params.getFromMerged('ball');
- ac.done();
- },
- catch: function(ac) {
- // Save a reference to the current object
- // for later use.
- var me = this;
- this.logit('catch');
- ac.models.get('StatefulModel').getData(function(err, data) {
- ac.done({
- ball: me.ball,
- time: me.time,
- model: data.modelId
- });
- });
- },
- logit: function(msg) {
- Y.log(msg + this.time, 'warn');
- }
- };
- }, '0.0.1', {requires: [
- 'mojito-models-addon',
- 'StatefulModel'
- ]});
.. _mojito_mvc-views:
View
2 docs/dev_guide/reference/mojito_cmdline.rst
@@ -1,5 +1,3 @@
-
-
===================
Mojito Command Line
===================
View
2 docs/dev_guide/reference/mojito_troubleshooting.rst
@@ -1,5 +1,3 @@
-
-
===============
Troubleshooting
===============

0 comments on commit f3e9641

Please sign in to comment.