aboutsummaryrefslogtreecommitdiff
path: root/js/panels/components-panel.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/components-panel.reel')
-rwxr-xr-xjs/panels/components-panel.reel/components-panel.js70
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
7var Montage = require("montage/core/core").Montage, 7var 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
13String.prototype.capitalizeFirstChar = function() { 13String.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; 369 break;
384 370
385 } 371 }