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 if changed values are not saved. |
---|
20 | */ |
---|
21 | define([ |
---|
22 | 'dojo/_base/Deferred', |
---|
23 | 'dojo/_base/json', |
---|
24 | 'dojo/_base/lang', |
---|
25 | 'dojo/_base/xhr', |
---|
26 | 'dojo/dom-attr', |
---|
27 | 'dojo/dom-construct', |
---|
28 | 'dijit/registry', |
---|
29 | './ui/_Page', |
---|
30 | 'dojo/domReady!' |
---|
31 | ],function(Deferred,json,lang,xhr,attr,domConstruct,registry,_Page){ |
---|
32 | return new (function(){ |
---|
33 | var self = this; |
---|
34 | var inited = false; |
---|
35 | |
---|
36 | var okay = new Deferred(); |
---|
37 | okay.resolve(); |
---|
38 | okay = okay.promise; |
---|
39 | |
---|
40 | var fail = new Deferred(); |
---|
41 | fail.reject(); |
---|
42 | fail = fail.promise; |
---|
43 | |
---|
44 | var contentPane = null; |
---|
45 | self.goToImpl = null; |
---|
46 | self.initialImpl = null; |
---|
47 | |
---|
48 | self.init = function() { |
---|
49 | contentPane = registry.byId('content'); |
---|
50 | inited = true; |
---|
51 | }; |
---|
52 | |
---|
53 | self.goTo = function(path,args) { |
---|
54 | if ( !inited ) { return fail; } |
---|
55 | if ( self.goToImpl !== null ) { |
---|
56 | return self.goToImpl(path,args); |
---|
57 | } else { |
---|
58 | return fail; |
---|
59 | } |
---|
60 | }; |
---|
61 | |
---|
62 | self.initial = function(path,args) { |
---|
63 | if ( !inited ) { return fail; } |
---|
64 | if ( self.initialImpl !== null ) { |
---|
65 | return self.initialImpl(path,args); |
---|
66 | } else { |
---|
67 | return fail; |
---|
68 | } |
---|
69 | }; |
---|
70 | |
---|
71 | self._loadPage = function(path,args) { |
---|
72 | if ( !inited ) { return fail; } |
---|
73 | var dfd = new Deferred(); |
---|
74 | |
---|
75 | function getFirstNode(html) { |
---|
76 | var nodeOrFragment = domConstruct.toDom(html); |
---|
77 | if (nodeOrFragment instanceof Element) { |
---|
78 | return nodeOrFragment; |
---|
79 | } |
---|
80 | if (nodeOrFragment instanceof DocumentFragment) { |
---|
81 | console.warn("Fragment found, will only use first Element"); |
---|
82 | for (var i in nodeOrFragment.childNodes) { |
---|
83 | var node = nodeOrFragment.childNodes[i]; |
---|
84 | if (node instanceof Element) { |
---|
85 | return node; |
---|
86 | } |
---|
87 | } |
---|
88 | } |
---|
89 | return domConstruct.toDom('<div>No Element found in template.</div>'); |
---|
90 | } |
---|
91 | |
---|
92 | function mixinArgs(node) { |
---|
93 | var props = {}; |
---|
94 | if ( attr.has(node,'data-dojo-props') ) { |
---|
95 | props = json.fromJson(attr.get(node,'data-dojo-props')); |
---|
96 | } |
---|
97 | lang.mixin(props,{pageArgs:args}); |
---|
98 | var jsonStr = json.toJson(props); |
---|
99 | attr.set(node,'data-dojo-props',jsonStr.slice(1,jsonStr.length-1)); |
---|
100 | } |
---|
101 | |
---|
102 | // load html |
---|
103 | var pageUrl = 'rft/pages'+path+'.html'; |
---|
104 | xhr.get({ |
---|
105 | url: pageUrl, |
---|
106 | failOk: true |
---|
107 | }) |
---|
108 | // initialize page or create error message |
---|
109 | .then(function(html){ |
---|
110 | var rootNode = getFirstNode(html); |
---|
111 | mixinArgs(rootNode); |
---|
112 | contentPane.set('content',rootNode); |
---|
113 | var page = registry.byNode(rootNode); |
---|
114 | if ( !page ) { |
---|
115 | page = new _Page({},rootNode); |
---|
116 | } |
---|
117 | dfd.resolve(page); |
---|
118 | },function(){ |
---|
119 | contentPane.set('content',"<div>Page "+path+" not found.</div>"); |
---|
120 | dfd.reject(); |
---|
121 | }); |
---|
122 | |
---|
123 | return dfd.promise; |
---|
124 | }; |
---|
125 | |
---|
126 | })(); |
---|
127 | }); |
---|