[264] | 1 | /** rft/ui/content - Load page content |
---|
| 2 | * |
---|
| 3 | * The rft/ui/content module is responsible for loading content in the app. |
---|
| 4 | * Content is loaded by calling: |
---|
| 5 | * content.goTo('pageId'); |
---|
| 6 | * The page is then loaded from pages/pageId.html. This should contain one top node. |
---|
| 7 | * This top node gets a _Page widget instantiated on it. The template should not |
---|
| 8 | * specify another widget on the topnode. A page controller can be specified by |
---|
| 9 | * the data-rft-mixin attribute to a class inherited from _PageController. |
---|
| 10 | * You can also specify methods in the template in script tags as: |
---|
| 11 | * <script type="rft/method" data-rft-method-name="onVisit|onLeave"> |
---|
| 12 | * // code |
---|
| 13 | * </script> |
---|
| 14 | * The two relevant events are onVisit and onLeave. After loading and starting |
---|
| 15 | * the complete page onVisit is called. Use this to link widgets together and |
---|
| 16 | * load any dynamic content not handled by widget logic already. |
---|
| 17 | * The event onLeave is called before navigating to another page. If false is |
---|
| 18 | * returned from this function, the navigation will be cancelled. You can use |
---|
| 19 | * this e.g. to ask confirmation of changed values are not saved. |
---|
| 20 | */ |
---|
[263] | 21 | define(['dojo/_base/declare','dojo/_base/connect','dojo/_base/xhr', |
---|
| 22 | 'dojo/_base/lang','dojo/_base/Deferred','dojo/hash', |
---|
| 23 | 'dojo/io-query','dijit','rft/util','rft/ui/_Page'], |
---|
| 24 | function(declare,connect,xhr,lang,Deferred,hash,uriQuery,dijit,util,_Page){ |
---|
[257] | 25 | return new (function() { |
---|
| 26 | var self = this; |
---|
[263] | 27 | var currentHash = ""; |
---|
| 28 | var currentPage = null; |
---|
[256] | 29 | |
---|
[257] | 30 | var HRI = declare(null,{ |
---|
[260] | 31 | constructor: function() { |
---|
[263] | 32 | this._path = this._fixPath('/'); |
---|
[257] | 33 | this._args = {}; |
---|
| 34 | if ( arguments.length == 1 ) { |
---|
| 35 | this.hash(arguments[0]); |
---|
| 36 | } else if ( arguments.length == 2 ) { |
---|
| 37 | this.path(arguments[0]); |
---|
| 38 | this.args(arguments[1]); |
---|
| 39 | } |
---|
| 40 | }, |
---|
| 41 | path: function(path) { |
---|
| 42 | if ( path ) |
---|
| 43 | this._path = this._fixPath(path); |
---|
| 44 | return this._path; |
---|
| 45 | }, |
---|
| 46 | args: function(args) { |
---|
| 47 | if ( args && lang.isObject(args) ) |
---|
| 48 | this._args = args; |
---|
| 49 | return this._args; |
---|
| 50 | }, |
---|
| 51 | hash: function(hash) { |
---|
| 52 | if ( hash && lang.isString(hash) ) { |
---|
| 53 | var parts = hash.split('!'); |
---|
| 54 | if ( parts[1] ) |
---|
| 55 | this._path = this._fixPath(parts[1]); |
---|
| 56 | if ( parts[2] ) |
---|
| 57 | this._args = uriQuery.queryToObject(parts[2]); |
---|
| 58 | } |
---|
| 59 | return '!'+this._path+'!'+uriQuery.objectToQuery(this._args); |
---|
| 60 | }, |
---|
| 61 | _fixPath: function(path) { |
---|
| 62 | if ( !lang.isString(path) || util.isEmptyString(path) ) { |
---|
| 63 | path = "/"; |
---|
| 64 | } |
---|
| 65 | if ( path[0] != '/' ) { |
---|
| 66 | path = '/'+path; |
---|
| 67 | } |
---|
| 68 | if ( path[path.length-1] == '/' ) { |
---|
| 69 | path = path + "index"; |
---|
| 70 | } |
---|
| 71 | return path; |
---|
| 72 | } |
---|
[256] | 73 | }); |
---|
| 74 | |
---|
[257] | 75 | function _goTo(hri,replace) { |
---|
| 76 | var contentPane = dijit.byId('content'); |
---|
[263] | 77 | var dfd = new Deferred(); |
---|
[257] | 78 | var newHash = hri.hash(); |
---|
[263] | 79 | |
---|
| 80 | // if already there, return |
---|
| 81 | if ( currentHash === newHash ) { |
---|
| 82 | dfd.resolve(); |
---|
| 83 | return dfd.promise; |
---|
[257] | 84 | } |
---|
[263] | 85 | |
---|
| 86 | // check if we can leave current page |
---|
| 87 | if ( currentPage ) { |
---|
| 88 | if ( currentPage.onLeave() === false ) { |
---|
[264] | 89 | // restore hash if changed by hand or back button |
---|
| 90 | hash(currentHash); |
---|
[263] | 91 | dfd.reject(); |
---|
| 92 | return dfd.promise; |
---|
| 93 | } |
---|
[274] | 94 | currentPage = null; |
---|
[263] | 95 | } |
---|
| 96 | |
---|
| 97 | // update hash |
---|
| 98 | currentHash = newHash; |
---|
[257] | 99 | hash(newHash,replace); |
---|
[263] | 100 | |
---|
| 101 | // load html |
---|
[274] | 102 | var pageUrl = 'rft/pages'+hri.path()+'.html'; |
---|
[257] | 103 | xhr.get({ |
---|
[263] | 104 | url: pageUrl, |
---|
[260] | 105 | failOk: true |
---|
[257] | 106 | }) |
---|
[263] | 107 | |
---|
| 108 | // initialize page or create error message |
---|
[257] | 109 | .then(function(html){ |
---|
[274] | 110 | contentPane.set('content',html); |
---|
| 111 | var rootNode = contentPane.containerNode.firstChild; |
---|
| 112 | currentPage = dijit.byNode(rootNode); |
---|
| 113 | if ( !currentPage ) { |
---|
| 114 | currentPage = new _Page({},rootNode); |
---|
| 115 | } |
---|
[263] | 116 | dfd.resolve(); |
---|
[257] | 117 | },function(){ |
---|
[274] | 118 | contentPane.set('content',"<div>Page "+hri.path()+" not found.</div>"); |
---|
[263] | 119 | dfd.reject(); |
---|
[257] | 120 | }); |
---|
[263] | 121 | return dfd.promise; |
---|
[256] | 122 | } |
---|
| 123 | |
---|
[257] | 124 | self.initial = function(path,args) { |
---|
[263] | 125 | if ( currentHash ) { |
---|
[260] | 126 | var dfd = new Deferred(); |
---|
[263] | 127 | dfd.resolve(); |
---|
[260] | 128 | return dfd.promise; |
---|
[257] | 129 | } |
---|
| 130 | if ( hash() ) { |
---|
| 131 | var hri = new HRI(hash()); |
---|
[260] | 132 | return _goTo(hri, true); |
---|
[257] | 133 | } else { |
---|
[260] | 134 | return _goTo(new HRI(path,args)); |
---|
[257] | 135 | } |
---|
| 136 | } |
---|
| 137 | |
---|
| 138 | self.goTo = function(path,args) { |
---|
[260] | 139 | return _goTo(new HRI(path,args)); |
---|
[257] | 140 | } |
---|
| 141 | |
---|
| 142 | connect.subscribe('/dojo/hashchange', function(){ |
---|
| 143 | _goTo(new HRI(hash())); |
---|
[256] | 144 | }); |
---|
[257] | 145 | |
---|
| 146 | })(); |
---|
| 147 | }); |
---|