diff options
author | Eric Guzman | 2012-06-11 13:28:42 -0700 |
---|---|---|
committer | Eric Guzman | 2012-06-11 13:28:42 -0700 |
commit | 3a4727ffc350216a434a7c6977b6a23653b77780 (patch) | |
tree | c5dff306f8803c36a16163ba5df1e7f492e762b5 /js/panels/components-panel.reel | |
parent | d6b46ba496c9c8974ae39bb476aea35bcd1ddaf1 (diff) | |
parent | 337efc667372326ae2f9984d89a47bb151016774 (diff) | |
download | ninja-3a4727ffc350216a434a7c6977b6a23653b77780.tar.gz |
Merge branch 'binding' of github.com:dhg637/ninja-internal into binding
Diffstat (limited to 'js/panels/components-panel.reel')
-rwxr-xr-x | js/panels/components-panel.reel/components-panel.js | 70 |
1 files changed, 28 insertions, 42 deletions
diff --git a/js/panels/components-panel.reel/components-panel.js b/js/panels/components-panel.reel/components-panel.js index 3ad1763d..e6b7a6e3 100755 --- a/js/panels/components-panel.reel/components-panel.js +++ b/js/panels/components-panel.reel/components-panel.js | |||
@@ -4,11 +4,11 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot | |||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | 4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. |
5 | </copyright> */ | 5 | </copyright> */ |
6 | 6 | ||
7 | var Montage = require("montage/core/core").Montage, | 7 | var Montage = require("montage/core/core").Montage, |
8 | Component = require("montage/ui/component").Component, | 8 | Component = require("montage/ui/component").Component, |
9 | NJUtils = require("js/lib/NJUtils").NJUtils; | 9 | ElementController = require("js/controllers/elements/element-controller").ElementController, |
10 | ClassUUID = require("js/components/core/class-uuid").ClassUuid, | 10 | ClassUUID = require("js/components/core/class-uuid").ClassUuid, |
11 | PIData = require("js/data/pi/pi-data").PiData; | 11 | PIData = require("js/data/pi/pi-data").PiData; |
12 | 12 | ||
13 | String.prototype.capitalizeFirstChar = function() { | 13 | String.prototype.capitalizeFirstChar = function() { |
14 | return this.charAt(0).toUpperCase() + this.slice(1); | 14 | return this.charAt(0).toUpperCase() + this.slice(1); |
@@ -40,11 +40,6 @@ exports.ComponentsPanel = Montage.create(Component, { | |||
40 | "component": "picasa-carousel" | 40 | "component": "picasa-carousel" |
41 | }, | 41 | }, |
42 | { | 42 | { |
43 | "text": "Search Bar", | ||
44 | "dataFile" : "node_modules/components-data/searchfield.json", | ||
45 | "component": "searchfield" | ||
46 | }, | ||
47 | { | ||
48 | "text": "Youtube Channel", | 43 | "text": "Youtube Channel", |
49 | "dataFile" : "node_modules/components-data/youtube-channel.json", | 44 | "dataFile" : "node_modules/components-data/youtube-channel.json", |
50 | "component": "youtube-channel" | 45 | "component": "youtube-channel" |
@@ -278,28 +273,35 @@ exports.ComponentsPanel = Montage.create(Component, { | |||
278 | that = this; | 273 | that = this; |
279 | element = this.makeComponent(component.component); | 274 | element = this.makeComponent(component.component); |
280 | 275 | ||
281 | this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addComponent(element, {name: component.name, path: component.module}, function(instance, element) { | 276 | this.application.ninja.currentDocument.model.views.design.iframe.contentWindow.addComponent(element, |
277 | {name: component.name, path: component.module, firstDraw: {cb: this.componentInstanceOnFirstDraw, ctx: this}}, | ||
278 | function(instance, element) { | ||
282 | 279 | ||
283 | //var pos = that.getStageCenter(); | 280 | //var pos = that.getStageCenter(); |
284 | 281 | ||
285 | var styles = { | 282 | var styles = { |
286 | 'position': 'absolute', | 283 | 'position': 'absolute', |
287 | 'left' : that.dragPosition[0] + 'px', | 284 | 'left' : that.dragPosition[0] + 'px', |
288 | 'top' : that.dragPosition[1] + 'px' | 285 | 'top' : that.dragPosition[1] + 'px' |
289 | }; | 286 | }; |
290 | 287 | ||
291 | var defaultStyles = component.defaultStyles; | 288 | var defaultStyles = component.defaultStyles; |
292 | if(defaultStyles) { | 289 | if(defaultStyles) { |
293 | for(var n in defaultStyles) { | 290 | for(var n in defaultStyles) { |
294 | styles[n] = defaultStyles[n]; | 291 | styles[n] = defaultStyles[n]; |
292 | } | ||
295 | } | 293 | } |
296 | } | ||
297 | |||
298 | that.application.ninja.currentDocument.model.setComponentInstance(instance, element); | ||
299 | 294 | ||
300 | that.application.ninja.elementMediator.addElements(element, styles); | 295 | //that.application.ninja.elementMediator.addElements(element, styles); |
301 | }); | 296 | ElementController.addElement(element, styles); |
297 | }); | ||
298 | |||
299 | } | ||
300 | }, | ||
302 | 301 | ||
302 | componentInstanceOnFirstDraw: { | ||
303 | value: function(instance) { | ||
304 | this.application.ninja.elementMediator.addElements(instance.element); | ||
303 | } | 305 | } |
304 | }, | 306 | }, |
305 | 307 | ||
@@ -310,76 +312,60 @@ exports.ComponentsPanel = Montage.create(Component, { | |||
310 | switch(name) { | 312 | switch(name) { |
311 | case "anchor": | 313 | case "anchor": |
312 | el = document.application.njUtils.make("a", null, this.application.ninja.currentDocument); | 314 | el = document.application.njUtils.make("a", null, this.application.ninja.currentDocument); |
313 | document.application.njUtils.createModelForComponent(el, "Anchor"); | ||
314 | el.setAttribute("href", "http://www.motorola.com"); | 315 | el.setAttribute("href", "http://www.motorola.com"); |
315 | el.innerHTML = "link"; | 316 | el.innerHTML = "link"; |
316 | break; | 317 | break; |
317 | case "button": | 318 | case "button": |
318 | el = document.application.njUtils.make(name, null, this.application.ninja.currentDocument); | 319 | el = document.application.njUtils.make(name, null, this.application.ninja.currentDocument); |
319 | document.application.njUtils.createModelForComponent(el, "Button"); | ||
320 | el.setAttribute("type", "button"); | 320 | el.setAttribute("type", "button"); |
321 | el.innerHTML = "Button"; | 321 | el.innerHTML = "Button"; |
322 | break; | 322 | break; |
323 | case "checkbox": | 323 | case "checkbox": |
324 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); | 324 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); |
325 | document.application.njUtils.createModelForComponent(el, "Checkbox"); | ||
326 | el.setAttribute("type", "checkbox"); | 325 | el.setAttribute("type", "checkbox"); |
327 | break; | 326 | break; |
328 | case "imageComponent": | 327 | case "imageComponent": |
329 | el = document.application.njUtils.make("image", null, this.application.ninja.currentDocument); | 328 | el = document.application.njUtils.make("image", null, this.application.ninja.currentDocument); |
330 | document.application.njUtils.createModelForComponent(el, "Image"); | ||
331 | el.setAttribute("width", 200); | 329 | el.setAttribute("width", 200); |
332 | el.setAttribute("height", 200); | 330 | el.setAttribute("height", 200); |
333 | break; | 331 | break; |
334 | case "numberInput": | 332 | case "numberInput": |
335 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); | 333 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); |
336 | document.application.njUtils.createModelForComponent(el, "Number Input"); | ||
337 | el.setAttribute("type", "number"); | 334 | el.setAttribute("type", "number"); |
338 | break; | 335 | break; |
339 | case "select": | 336 | case "select": |
340 | el = document.application.njUtils.make("select", null, this.application.ninja.currentDocument); | 337 | el = document.application.njUtils.make("select", null, this.application.ninja.currentDocument); |
341 | document.application.njUtils.createModelForComponent(el, "SelectInput"); | ||
342 | break; | 338 | break; |
343 | case "radioButton": | 339 | case "radioButton": |
344 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); | 340 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); |
345 | document.application.njUtils.createModelForComponent(el, "Radio Button"); | ||
346 | el.setAttribute("type", "radio"); | 341 | el.setAttribute("type", "radio"); |
347 | break; | 342 | break; |
348 | case "rangeInput": | 343 | case "rangeInput": |
349 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); | 344 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); |
350 | document.application.njUtils.createModelForComponent(el, "Range Input"); | ||
351 | el.setAttribute("type", "range"); | 345 | el.setAttribute("type", "range"); |
352 | break; | 346 | break; |
353 | case "textfield": | 347 | case "textfield": |
354 | case "searchfield": | ||
355 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); | 348 | el = document.application.njUtils.make("input", null, this.application.ninja.currentDocument); |
356 | document.application.njUtils.createModelForComponent(el, "Textfield"); | ||
357 | el.setAttribute("type", "text"); | 349 | el.setAttribute("type", "text"); |
358 | break; | 350 | break; |
359 | case "textarea": | 351 | case "textarea": |
360 | el = document.application.njUtils.make("textarea", null, this.application.ninja.currentDocument); | 352 | el = document.application.njUtils.make("textarea", null, this.application.ninja.currentDocument); |
361 | document.application.njUtils.createModelForComponent(el, "Textarea"); | ||
362 | break; | 353 | break; |
363 | case "toggleButton": | 354 | case "toggleButton": |
364 | el = document.application.njUtils.make("button", null, this.application.ninja.currentDocument); | 355 | el = document.application.njUtils.make("button", null, this.application.ninja.currentDocument); |
365 | document.application.njUtils.createModelForComponent(el, "Toggle Button"); | ||
366 | el.innerHTML = "Off"; | 356 | el.innerHTML = "Off"; |
367 | break; | 357 | break; |
368 | case "map": | 358 | case "map": |
369 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 359 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
370 | document.application.njUtils.createModelForComponent(el, "Map"); | ||
371 | break; | 360 | break; |
372 | case "feedreader": | 361 | case "feedreader": |
373 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 362 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
374 | document.application.njUtils.createModelForComponent(el, "Feed Reader"); | ||
375 | break; | 363 | break; |
376 | case "picasa-carousel": | 364 | case "picasa-carousel": |
377 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 365 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
378 | document.application.njUtils.createModelForComponent(el, "Picasa Carousel"); | ||
379 | break; | 366 | break; |
380 | case "youtube-channel": | 367 | case "youtube-channel": |
381 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); | 368 | el = document.application.njUtils.make("div", null, this.application.ninja.currentDocument); |
382 | document.application.njUtils.createModelForComponent(el, "Youtube Channel"); | ||
383 | break; |