Changeset 263 for Dev/branches/rest-dojo-ui/client/rft/ui

Timestamp:

02/16/12 14:47:39 (13 years ago)

Author:

hendrikvanantwerpen

Message:

• [Client] Finished page framework. See rft/ui/content.js or test files for details.
• [Client] Allow login by pressing Enter.
• [API] On exception include details in json response.
• [Server Use Exceptions when save() fails, iso return values.

Location:

Dev/branches/rest-dojo-ui/client/rft/ui

Files:

• LoginDialog.html (modified) (1 diff)
• LoginDialog.js (modified) (3 diffs)
• TestPageController.js (copied) (copied from Dev/branches/rest-dojo-ui/client/rft/ui/Page.js) (1 diff)
• _Page.js (moved) (moved from Dev/branches/rest-dojo-ui/client/rft/ui/Page.js) (1 diff)
• _PageController.js (added)

Dev/branches/rest-dojo-ui/client/rft/ui/LoginDialog.html

@@ -14 +14 @@
                 <input data-dojo-type="dijit.form.TextBox" name="password" type="password" class="loginInput" />
             </fieldset>
+            <button type="submit" data-dojo-type="dijit.form.Button" data-dojo-attach-event="onClick:onLogin">Login</button>
+            <button type="button" data-dojo-type="dijit.form.Button" data-dojo-attach-event="onClick:onCancel">Cancel</button>
         </form>
-        <button type="button" data-dojo-type="dijit.form.Button" data-dojo-attach-event="onClick:onLogin">Login</button>
-        <button type="button" data-dojo-type="dijit.form.Button" data-dojo-attach-event="onClick:onCancel">Cancel</button>
         <div data-dojo-attach-point="loginErrors"></div>
     </div>

Dev/branches/rest-dojo-ui/client/rft/ui/LoginDialog.js

@@ -1 @@
-define(['dojo/_base/declare','dojo/_base/lang','dijit/Dialog','dijit/_WidgetsInTemplateMixin',
-    '../auth', 'dojo/text!./LoginDialog.html','../content',
-    'dijit/form/Form','dijit/form/Button','dijit/form/TextBox'],
-    function (declare, lang, Dialog, _WidgetsInTemplateMixin, auth, template, content) {
+define(['dojo/_base/declare','dojo/_base/lang','dojo/_base/event','dijit/Dialog',
+    'dijit/_WidgetsInTemplateMixin','../auth', 'dojo/text!./LoginDialog.html',
+    '../content','dijit/form/Form','dijit/form/Button','dijit/form/TextBox'],
+    function (declare, lang, event, Dialog, _WidgetsInTemplateMixin, auth, template, content) {
         return declare([Dialog,_WidgetsInTemplateMixin], {
             templateString: template,
@@ -8 +8 @@
             title: "Login",
             baseClass: "rftLoginDialog",
+            startup: function() {
+                this.inherited(arguments);
+                this.loginForm.on('submit',lang.hitch(this,'onLogin'));
+            },
             show: function() {
                 this.loginErrors.innerHTML = '';
@@ -13 +17 @@
                 this.inherited(arguments);
             },
-            onLogin: function() {
+            onLogin: function(evt) {
                 this.loginErrors.innerHTML = '';
                 var data = this.loginForm.get('value');
-                var hide = lang.hitch(this,"hide");
                 auth.login(data.username,data.password)
-                .then(function() {
-                    hide();
+                .then(lang.hitch(this,function() {
+                    this.hide();
                     content.initial();
-                },function() {
+                }),lang.hitch(this,function() {
                     this.loginErrors.innerHTML = 'Login failed.';
-                })
+                }));
+                event.stop(evt);
                 return false;
             }

Dev/branches/rest-dojo-ui/client/rft/ui/TestPageController.js

@@ -1 @@
-define(['dojo/_base/declare','dojo/query','dojo/_base/json','dojo/dom-attr','dojo/_base/lang','dijit/registry','dijit/_WidgetBase','dijit/_Container'],
-    function(declare,query,json,attr,lang,registry,_WidgetBase,_Container){
-        return declare('rft.ui.Page',[_WidgetBase,_Container],{
-            postCreate: function() {
-                this.inherited(arguments);
-                this.args = {};
-                var props = attr.get(this.domNode,'data-rft-props');
-                if ( props ) {
-                    props = json.fromJson.call(this,'{'+props+'}');
-                    lang.mixin(this.args,props);
-                }
-            },
-            startup: function() {
-                this.inherited(arguments);
-                query('[data-rft-attach-point]').forEach(lang.hitch(this,function(node){
-                    var name = attr.get(node,'data-rft-attach-point');
-                    this[name] = registry.byNode(node) || node;
+define(['dojo/_base/declare','dojo/_base/lang','dojo/_base/event','rft/content',
+    'dojo/store/JsonRest','dojo/data/ObjectStore','rft/ui/_PageController','dijit/registry'],
+    function(declare,lang,event,content,JsonRest,ObjectStore,_PageController,registry) {
+        return declare([_PageController],{
+            onVisit: function() {
+                this._store = new JsonRest({
+                    target:"../server/api.php/data/Session/",
+                    idProperty: 'uid'
+                });
+
+                function setEnabledRecursive(node,value) {
+                    registry.findWidgets(node).forEach(function(w){
+                        w.set('disabled',!value);
+                        setEnabledRecursive(w.domNode,value);
+                    });
+                };
+
+                setEnabledRecursive(this.form.domNode,false);
+
+                var refreshGrid = lang.hitch(this,function(){
+                    this.grid.setStore(ObjectStore({
+                        objectStore: this._store
+                    }),'');
+                });
+                refreshGrid();
+                
+                var getSelectedItem = lang.hitch(this,function(evt){
+                    var items = this.grid.selection.getSelected();
+                    if (items.length)
+                        return items[0];
+                    return null;
+                });
+                
+                this.grid.on('rowclick',lang.hitch(this,function(evt){
+                    var obj = getSelectedItem();
+                    if ( obj) {
+                        this.form.set('value', obj);
+                        setEnabledRecursive(this.form.domNode, true);
+                    } else {
+                        setEnabledRecursive(this.form.domNode, false);
+                        this.form.reset();
+                    }
                 }));
-                this.init();
-            },
-            init: function(){}
+
+                this.grid.on('rowdblclick',lang.hitch(this,function(evt){
+                    var obj = getSelectedItem();
+                    content.goTo('/session',{
+                        uid:obj.uid
+                    });
+                }));
+
+                var submitHandler = lang.hitch(this,function(evt){
+                    this.errors.innerHTML = '';
+                    var newObj = this.form.get('value');
+                    var obj = getSelectedItem();
+                    obj = lang.mixin(obj,newObj);
+                    //this._store.put(newObj,{id:obj.uid})
+                    this._store.put(obj,{
+                        overwrite:true
+                    })
+                    .then(lang.hitch(this,function(){
+                        refreshGrid();
+                    }),lang.hitch(this,function(e){
+                        this.errors.innerHTML = e.toString();
+                    }));
+                    event.stop(evt);
+                    return false;
+                });
+                
+                this.form.on('submit',submitHandler);
+            }
         });
     });

Dev/branches/rest-dojo-ui/client/rft/ui/_Page.js

@@ -1 @@
-define(['dojo/_base/declare','dojo/query','dojo/_base/json','dojo/dom-attr','dojo/_base/lang','dijit/registry','dijit/_WidgetBase','dijit/_Container'],
-    function(declare,query,json,attr,lang,registry,_WidgetBase,_Container){
-        return declare('rft.ui.Page',[_WidgetBase,_Container],{
-            postCreate: function() {
+define(['dojo/_base/declare','dojo/_base/lang','dojo/_base/array','dojo/parser','dojo/query','dojo/_base/Deferred',
+    'dijit/_WidgetBase','dijit/_TemplatedMixin','dijit/_WidgetsInTemplateMixin','rft/ui/_PageController'],
+    function(declare,lang,array,parser,query,Deferred,_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_PageController){
+        return declare('rft.ui._Page',[_WidgetBase,_TemplatedMixin,_WidgetsInTemplateMixin,_PageController],{
+            _controllerLoaded: false,
+            _hasStarted: false,
+            _triggeredOnVisit: false,
+            pageController: null, /* class derived from rft.ui._PageController, mixed in at creation */
+            buildRendering: function() {
                 this.inherited(arguments);
-                this.args = {};
-                var props = attr.get(this.domNode,'data-rft-props');
-                if ( props ) {
-                    props = json.fromJson.call(this,'{'+props+'}');
-                    lang.mixin(this.args,props);
+                var dfd = new Deferred();
+                var mixinType = this.domNode.getAttribute("data-rft-mixin");
+                if ( mixinType ) {
+                    require([mixinType],lang.hitch(this,function(SomePageController){
+                        declare.safeMixin(this,new SomePageController());
+                        dfd.resolve();
+                    }));
+                } else {
+                    dfd.resolve();
                 }
+                dfd.then(lang.hitch(this,function(){
+                    var methods = query('> script[type^="rft/method"]',this.domNode).orphan();
+                    array.forEach(methods,lang.hitch(this,function(s){
+                        var method = s.getAttribute("data-rft-method");
+                        var func = parser._functionFromScript(s);
+                        this[method] = func;
+                    }));
+                    this._controllerLoaded = true;
+                    this._triggerOnVisit();
+                }));
             },
             startup: function() {
                 this.inherited(arguments);
-                query('[data-rft-attach-point]').forEach(lang.hitch(this,function(node){
-                    var name = attr.get(node,'data-rft-attach-point');
-                    this[name] = registry.byNode(node) || node;
-                }));
-                this.init();
+                this._hasStarted = true;
+                this._triggerOnVisit();
             },
-            init: function(){}
+            _triggerOnVisit: function() {
+                if ( this._controllerLoaded && this._hasStarted && !this._triggeredOnVisit ) {
+                    this._triggeredOnVisit = false;
+                    this.onVisit();
+                }
+            }
         });
     });