]>
Commit | Line | Data |
---|---|---|
6527f429 DM |
1 | /*\r |
2 | * This file is generated by Sencha Cmd and should NOT be edited. It will be replaced\r | |
3 | * during an upgrade.\r | |
4 | */\r | |
5 | \r | |
6 | // This flag is checked by many Components to avoid compatibility warnings when\r | |
7 | // the code is running under the slicer\r | |
8 | Ext.slicer = true;\r | |
9 | \r | |
10 | Ext.require([\r | |
11 | 'Ext.layout.Context'\r | |
12 | ]);\r | |
13 | \r | |
14 | Ext.theme = Ext.apply(Ext.theme || {}, {\r | |
15 | /**\r | |
16 | * The array of all component manifests. These objects have the following set of\r | |
17 | * properties recognized by the slicer:\r | |
18 | * @private\r | |
19 | */\r | |
20 | _manifest: [],\r | |
21 | \r | |
22 | /**\r | |
23 | * The collection of shortcuts for a given alias (e.g., 'widget.panel'). This is an\r | |
24 | * object keyed by alias whose values are arrays of shortcut definitions.\r | |
25 | * @private\r | |
26 | */\r | |
27 | _shortcuts: {},\r | |
28 | \r | |
29 | doRequire : function(xtype) {\r | |
30 | if(xtype.indexOf("widget.") != 0) {\r | |
31 | xtype = "widget." + xtype;\r | |
32 | }\r | |
33 | Ext.require([xtype]);\r | |
34 | },\r | |
35 | \r | |
36 | /**\r | |
37 | * Adds one ore more component entries to the theme manifest. These entries will be\r | |
38 | * instantiated by the `Ext.theme.render` method when the page is ready.\r | |
39 | *\r | |
40 | * Usage:\r | |
41 | *\r | |
42 | * Ext.theme.addManifest({\r | |
43 | * xtype: 'widget.menu',\r | |
44 | * folder: 'menu',\r | |
45 | * delegate: '.x-menu-item-link',\r | |
46 | * filename: 'menu-item-active',\r | |
47 | * config: {\r | |
48 | * floating: false,\r | |
49 | * width: 200,\r | |
50 | * items: [{\r | |
51 | * text: 'test',\r | |
52 | * cls: 'x-menu-item-active'\r | |
53 | * }]\r | |
54 | * }\r | |
55 | * },{\r | |
56 | * //...\r | |
57 | * });\r | |
58 | *\r | |
59 | * @param manifest {Object} An object with type of component, slicing information and\r | |
60 | * component configuration. If this parameter is an array, each element is treated as\r | |
61 | * a manifest entry. Otherwise, each argument passed is treated as a manifest entry.\r | |
62 | *\r | |
63 | * @param manifest.xtype {String} The xtype ('grid') or alias ('widget.grid'). This\r | |
64 | * is used to specify the type of component to create as well as a potential key to\r | |
65 | * any `shortcuts` defined for the xtype.\r | |
66 | *\r | |
67 | * @param manifest.config {Object} The component configuration object. The properties\r | |
68 | * of this depend on the `xtype` of the component.\r | |
69 | *\r | |
70 | * @param [manifest.delegate] {String} The DOM query to use to select the element to\r | |
71 | * slice. The default is to slice the primary element of the component.\r | |
72 | *\r | |
73 | * @param [manifest.parentCls] An optional CSS class to add to the parent of the\r | |
74 | * component.\r | |
75 | *\r | |
76 | * @param [manifest.setup] {Function} An optional function to be called to initialize\r | |
77 | * the component.\r | |
78 | * @param manifest.setup.component {Ext.Component} The component instance\r | |
79 | * @param manifest.setup.container {Element} The component's container.\r | |
80 | *\r | |
81 | * @param [manifest.folder] {String} The folder in to which to produce image slices.\r | |
82 | * Only applies to Ext JS 4.1 (removed in 4.2).\r | |
83 | *\r | |
84 | * @param [manifest.filename] {String} The base filename for slices.\r | |
85 | * Only applies to Ext JS 4.1 (removed in 4.2).\r | |
86 | *\r | |
87 | * @param [manifest.reverse] {Boolean} True to position the slices for linear gradient\r | |
88 | * background at then opposite "end" (right or bottom) and apply the stretch to the\r | |
89 | * area before it (left or top). Only applies to Ext JS 4.1 (removed in 4.2).\r | |
90 | */\r | |
91 | addManifest: function (manifest) {\r | |
92 | var all = Ext.theme._manifest;\r | |
93 | var add = Ext.isArray(manifest) ? manifest : arguments;\r | |
94 | \r | |
95 | if(manifest.xtype) {\r | |
96 | Ext.theme.doRequire(manifest.xtype);\r | |
97 | }\r | |
98 | \r | |
99 | for (var i = 0, n = add.length; i < n; ++i) {\r | |
100 | if(add[i].xtype) {\r | |
101 | Ext.theme.doRequire(add[i].xtype);\r | |
102 | }\r | |
103 | all.push(add[i]);\r | |
104 | }\r | |
105 | },\r | |
106 | \r | |
107 | /**\r | |
108 | * Adds one or more shortcuts to the rendering process. A `shortcut` is an object that\r | |
109 | * looks the same as a `manifest` entry. These are combined by copying the properties\r | |
110 | * from the shortcut over those of the manifest entry. In basic terms:\r | |
111 | *\r | |
112 | * var config = Ext.apply(Ext.apply({}, manfiest.config), shortcut.config);\r | |
113 | * var entry = Ext.apply(Ext.apply({}, manfiest), shortcut);\r | |
114 | * entry.config = config;\r | |
115 | *\r | |
116 | * This is not exactly the process, but the idea is the same. The difference is that\r | |
117 | * the `ui` of the manifest entry is used to replace any `"{ui}"` substrings found in\r | |
118 | * any string properties of the shortcut or its `config` object.\r | |
119 | *\r | |
120 | * Usage:\r | |
121 | *\r | |
122 | * Ext.theme.addShortcuts({\r | |
123 | * 'widget.foo': [{\r | |
124 | * config: {\r | |
125 | * }\r | |
126 | * },{\r | |
127 | * config: {\r | |
128 | * }\r | |
129 | * }],\r | |
130 | *\r | |
131 | * 'widget.bar': [ ... ]\r | |
132 | * });\r | |
133 | */\r | |
134 | addShortcuts: function (shortcuts) {\r | |
135 | var all = Ext.theme._shortcuts;\r | |
136 | \r | |
137 | for (var key in shortcuts) {\r | |
138 | \r | |
139 | var add = shortcuts[key];\r | |
140 | var xtype = Ext.theme.addWidget(key);\r | |
141 | var existing = all[xtype];\r | |
142 | \r | |
143 | Ext.theme.doRequire(xtype);\r | |
144 | for(var i=0; i < add.length; i++) {\r | |
145 | var config = add[i];\r | |
146 | if(config.xtype) {\r | |
147 | Ext.theme.doRequire(config.xtype);\r | |
148 | }\r | |
149 | }\r | |
150 | \r | |
151 | if (!existing) {\r | |
152 | all[xtype] = existing = [];\r | |
153 | }\r | |
154 | \r | |
155 | existing.push.apply(existing, add);\r | |
156 | }\r | |
157 | },\r | |
158 | \r | |
159 | /**\r | |
160 | * This method ensures that a given string has the specified prefix (e.g., "widget.").\r | |
161 | * @private\r | |
162 | */\r | |
163 | addPrefix: function (prefix, s) {\r | |
164 | if (!s || (s.length > prefix.length && s.substring(0,prefix.length) === prefix)) {\r | |
165 | return s;\r | |
166 | }\r | |
167 | return prefix + s;\r | |
168 | },\r | |
169 | \r | |
170 | /**\r | |
171 | * This method returns the given string with "widget." added to the front if that is\r | |
172 | * not already present.\r | |
173 | * @private\r | |
174 | */\r | |
175 | addWidget: function (str) {\r | |
176 | return Ext.theme.addPrefix('widget.', str);\r | |
177 | },\r | |
178 | \r | |
179 | /**\r | |
180 | * This method accepts an manifest entry and a shortcut entry and returns the merged\r | |
181 | * version.\r | |
182 | * @private\r | |
183 | */\r | |
184 | applyShortcut: function (manifestEntry, shortcut) {\r | |
185 | var ui = manifestEntry.ui;\r | |
186 | var config = Ext.theme.copyProps({}, manifestEntry.config);\r | |
187 | var entry = Ext.theme.copyProps({}, manifestEntry);\r | |
188 | \r | |
189 | if (ui && !config.ui) {\r | |
190 | config.ui = ui;\r | |
191 | }\r | |
192 | if (shortcut) {\r | |
193 | var tpl = { ui: ui };\r | |
194 | Ext.theme.copyProps(entry, shortcut, tpl);\r | |
195 | Ext.theme.copyProps(config, shortcut.config, tpl);\r | |
196 | }\r | |
197 | \r | |
198 | entry.xtype = Ext.theme.addWidget(entry.xtype);\r | |
199 | entry.config = config; // both guys have "config" so smash merged one on now...\r | |
200 | return entry;\r | |
201 | },\r | |
202 | \r | |
203 | /**\r | |
204 | * This method copies property from a `src` object to a `dest` object and reaplces\r | |
205 | * `"{foo}"` fragments of any string properties as defined in the `tpl` object.\r | |
206 | *\r | |
207 | * var obj = Ext.theme.copyProps({}, {\r | |
208 | * foo: 'Hello-{ui}'\r | |
209 | * }, {\r | |
210 | * ui: 'World'\r | |
211 | * });\r | |
212 | *\r | |
213 | * console.log('obj.foo: ' + obj.foo); // logs "Hello-World"\r | |
214 | *\r | |
215 | * @return {Object} The `dest` object or a new object (if `dest` was null).\r | |
216 | * @private\r | |
217 | */\r | |
218 | copyProps: function (dest, src, tpl) {\r | |
219 | var out = dest || {};\r | |
220 | var replacements = [];\r | |
221 | var token;\r | |
222 | \r | |
223 | if (src) {\r | |
224 | if (tpl) {\r | |
225 | for (token in tpl) {\r | |
226 | replacements.push({\r | |
227 | re: new RegExp('\\{' + token + '\\}', 'g'),\r | |
228 | value: tpl[token]\r | |
229 | });\r | |
230 | }\r | |
231 | }\r | |
232 | \r | |
233 | for (var key in src) {\r | |
234 | var val = src[key];\r | |
235 | if (tpl && typeof val === 'string') {\r | |
236 | for (var i = 0; i < replacements.length; ++ i) {\r | |
237 | val = val.replace(replacements[i].re, replacements[i].value);\r | |
238 | }\r | |
239 | }\r | |
240 | out[key] = val;\r | |
241 | }\r | |
242 | }\r | |
243 | \r | |
244 | return out;\r | |
245 | },\r | |
246 | \r | |
247 | /**\r | |
248 | * Renders a component given its manifest and shortcut entries.\r | |
249 | * @private\r | |
250 | */\r | |
251 | renderWidget: function (manifestEntry, shortcut) {\r | |
252 | var entry = Ext.theme.applyShortcut(manifestEntry, shortcut);\r | |
253 | var config = entry.config;\r | |
254 | var widget = Ext.create(entry.xtype, config);\r | |
255 | var ct = Ext.fly(document.body).createChild({ cls: 'widget-container' });\r | |
256 | \r | |
257 | Ext.theme.currentWidget = widget;\r | |
258 | \r | |
259 | if (widget.floating === true) {\r | |
260 | widget.floating = { shadow: false };\r | |
261 | }\r | |
262 | if (widget.floating) {\r | |
263 | widget.focusOnToFront = false;\r | |
264 | }\r | |
265 | \r | |
266 | if (entry.setup) {\r | |
267 | entry.setup.call(widget, widget, ct);\r | |
268 | } else {\r | |
269 | widget.render(ct);\r | |
270 | if (widget.floating) {\r | |
271 | widget.showAt(0, 0);\r | |
272 | ct.setHeight(widget.getHeight());\r | |
273 | }\r | |
274 | }\r | |
275 | \r | |
276 | var el = widget.el;\r | |
277 | if (entry.delegate) {\r | |
278 | el = el.down(entry.delegate);\r | |
279 | }\r | |
280 | \r | |
281 | el.addCls('x-slicer-target'); // this is what generateSlicerManifest looks for\r | |
282 | \r | |
283 | if (entry.over) {\r | |
284 | widget.addOverCls();\r | |
285 | }\r | |
286 | if (config.parentCls) {\r | |
287 | el.parent().addCls(config.parentCls);\r | |
288 | }\r | |
289 | \r | |
290 | if (Ext.theme.legacy) {\r | |
291 | // The 4.1 approach has some interesting extra pieces\r | |
292 | //\r | |
293 | var data = {};\r | |
294 | if (entry.reverse) {\r | |
295 | data.reverse = true;\r | |
296 | }\r | |
297 | if (entry.filename) {\r | |
298 | data.filename = entry.filename;\r | |
299 | }\r | |
300 | if (entry.folder) {\r | |
301 | data.folder = entry.folder;\r | |
302 | }\r | |
303 | if (entry.offsets) {\r | |
304 | data.offsets = entry.offsets;\r | |
305 | }\r | |
306 | \r | |
307 | Ext.theme.setData(el.dom, data);\r | |
308 | }\r | |
309 | \r | |
310 | Ext.theme.currentWidget = null;\r | |
311 | },\r | |
312 | \r | |
313 | /**\r | |
314 | * Renders all of the components that have been added to the manifest.\r | |
315 | * @private\r | |
316 | */\r | |
317 | render: function () {\r | |
318 | console.log("rendering widgets...")\r | |
319 | var manifest = Ext.theme._manifest;\r | |
320 | var shortcuts = Ext.theme._shortcuts;\r | |
321 | \r | |
322 | for (var k = 0, n = manifest ? manifest.length : 0; k < n; ++k) {\r | |
323 | var manifestEntry = manifest[k];\r | |
324 | var xtype = Ext.theme.addWidget(manifestEntry.xtype);\r | |
325 | var widgetShortcuts = xtype ? shortcuts[xtype] : null;\r | |
326 | \r | |
327 | if (xtype && manifestEntry.ui && widgetShortcuts) {\r | |
328 | for (var i = 0; i < widgetShortcuts.length; i++) {\r | |
329 | Ext.theme.renderWidget(manifestEntry, widgetShortcuts[i]);\r | |
330 | }\r | |
331 | } else {\r | |
332 | Ext.theme.renderWidget(manifestEntry);\r | |
333 | }\r | |
334 | }\r | |
335 | },\r | |
336 | \r | |
337 | /**\r | |
338 | * Renders all components (see `render`) and notifies the Slicer that things are ready.\r | |
339 | * @private\r | |
340 | */\r | |
341 | run: function () {\r | |
342 | var extjsVer = Ext.versions.extjs;\r | |
343 | var globalData = {};\r | |
344 | \r | |
345 | if (Ext.layout.Context) {\r | |
346 | Ext.override(Ext.layout.Context, {\r | |
347 | run: function () {\r | |
348 | var ok = this.callParent(),\r | |
349 | widget = Ext.theme.currentWidget;\r | |
350 | if (!ok && widget) {\r | |
351 | Ext.Error.raise("Layout run failed: " + widget.id);\r | |
352 | }\r | |
353 | return ok;\r | |
354 | }\r | |
355 | });\r | |
356 | }\r | |
357 | \r | |
358 | console.log("loading widget definitions...");\r | |
359 | \r | |
360 | // Previous to Ext JS 4.2, themes and their manifests where defined differently.\r | |
361 | // So pass this along if we are hosting a pre-4.2 theme.\r | |
362 | //\r | |
363 | if (extjsVer && extjsVer.isLessThan(new Ext.Version("4.2"))) {\r | |
364 | globalData.format = "1.0"; // tell the Slicer tool\r | |
365 | Ext.theme.legacy = true; // not for our own data collection\r | |
366 | \r | |
367 | // Check for the Cmd3.0/ExtJS4.1 variables:\r | |
368 | //\r | |
369 | if (Ext.manifest && Ext.manifest.widgets) {\r | |
370 | Ext.theme.addManifest(Ext.manifest.widgets);\r | |
371 | }\r | |
372 | if (Ext.shortcuts) {\r | |
373 | Ext.theme.addShortcuts(Ext.shortcuts);\r | |
374 | }\r | |
375 | if (Ext.userManifest && Ext.userManifest.widgets) {\r | |
376 | Ext.theme.addManifest(Ext.userManifest.widgets);\r | |
377 | }\r | |
378 | }\r | |
379 | \r | |
380 | Ext.theme.setData(document.body, globalData);\r | |
381 | Ext.theme.render();\r | |
382 | Ext.theme.generateSlicerManifest();\r | |
383 | },\r | |
384 | \r | |
385 | generateSlicerManifest: function() {\r | |
386 | var now = new Date().getTime(),\r | |
387 | me = Ext.theme,\r | |
388 | // This function is defined by slicer.js (the framework-independent piece)\r | |
389 | gsm = window && window['generateSlicerManifest'],\r | |
390 | delta;\r | |
391 | \r | |
392 | me.generateStart = me.generateStart || now;\r | |
393 | delta = now - me.generateStart;\r | |
394 | \r | |
395 | if(gsm) {\r | |
396 | gsm();\r | |
397 | } else if(delta < (10 * 1000)){\r | |
398 | // allow the outer script wrapper a chance to inject the capture function\r | |
399 | // but stop trying after 10 seconds\r | |
400 | Ext.defer(Ext.theme.generateSlicerManifest, 100);\r | |
401 | }\r | |
402 | },\r | |
403 | \r | |
404 | /**\r | |
405 | * Sets the `data-slicer` attribute to the JSON-encoded value of the provided data.\r | |
406 | * @private\r | |
407 | */\r | |
408 | setData: function (el, data) {\r | |
409 | if (data) {\r | |
410 | var json = Ext.encode(data);\r | |
411 | if (json !== '{}') {\r | |
412 | el.setAttribute('data-slicer', json);\r | |
413 | }\r | |
414 | }\r | |
415 | },\r | |
416 | \r | |
417 | /**\r | |
418 | * This used to be `loadExtStylesheet`.\r | |
419 | * @private\r | |
420 | */\r | |
421 | loadCss: function (src, callback) {\r | |
422 | var xhr = new XMLHttpRequest();\r | |
423 | \r | |
424 | xhr.open('GET', src);\r | |
425 | \r | |
426 | xhr.onload = function() {\r | |
427 | var css = xhr.responseText,\r | |
428 | head = document.getElementsByTagName('head')[0],\r | |
429 | style = document.createElement('style');\r | |
430 | \r | |
431 | // There's bugginess in the next gradient syntax in WebKit r84622\r | |
432 | // This might be fixed in a later WebKit, but for now we're going to\r | |
433 | // strip it out here since compass generates it.\r | |
434 | //\r | |
435 | // TODO: Upgrade to later WebKit revision\r | |
436 | css = css.replace(/background(-image)?: ?-webkit-linear-gradient(?:.*?);/g, '');\r | |
437 | \r | |
438 | style.type = 'text/css';\r | |
439 | style.innerText = css;\r | |
440 | \r | |
441 | head.appendChild(style);\r | |
442 | callback();\r | |
443 | };\r | |
444 | \r | |
445 | xhr.send(null);\r | |
446 | }\r | |
447 | });\r | |
448 | \r | |
449 | console.log("registering ready listener...");\r | |
450 | Ext.onReady(Ext.theme.run, Ext.theme);\r |