aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Components
diff options
context:
space:
mode:
authorPierre Frisch2011-12-22 07:25:50 -0800
committerValerio Virgillito2012-01-27 11:18:17 -0800
commitb89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch)
tree0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/panels/Components
parent2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff)
downloadninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/panels/Components')
-rw-r--r--js/panels/Components/Components.xml28
-rw-r--r--js/panels/Components/ComponentsPanel.js47
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.css11
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html34
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js145
5 files changed, 265 insertions, 0 deletions
diff --git a/js/panels/Components/Components.xml b/js/panels/Components/Components.xml
new file mode 100644
index 00000000..b3056330
--- /dev/null
+++ b/js/panels/Components/Components.xml
@@ -0,0 +1,28 @@
1<?xml version="1.0" encoding="ISO-8859-1"?>
2<tree id="Components">
3 <folder id="montageComponents" label="Montage Components">
4 <leaf id="Button" label="Button" />
5 <leaf id="Checkbox" label="Checkbox" />
6 <leaf id="DynamicText" label="Dynamic Text" />
7 <leaf id="FlowController" label="FlowController" />
8 <leaf id="HotText" label="HotText" />
9 <leaf id="HotTextUnit" label="HotTextUnit" />
10 <leaf id="ImageContainer" label="Image Container" />
11 <leaf id="Progress" label="Progress" />
12 <leaf id="Scrollview" label="Scrollview" />
13 <leaf id="Slider" label="Slider" />
14 <leaf id="TextArea" label="TextArea" />
15 <leaf id="Textfield" label="Textfield" />
16 <leaf id="Toggle" label="Toggle" />
17 </folder>
18 <folder id="metaComponents" label="Meta Components">
19 <leaf id="Condition" label="Condition" />
20 <leaf id="Repetition" label="Repetition" />
21 <leaf id="Slot" label="Slot" />
22 <leaf id="Substitution" label="Substitution" />
23 </folder>
24 <folder id="htmlPresets" label="HTML Components">
25 <leaf id="html_button" label="Button" />
26 <leaf id="html_input" label="Text Input" />
27 </folder>
28</tree> \ No newline at end of file
diff --git a/js/panels/Components/ComponentsPanel.js b/js/panels/Components/ComponentsPanel.js
new file mode 100644
index 00000000..df1d74bb
--- /dev/null
+++ b/js/panels/Components/ComponentsPanel.js
@@ -0,0 +1,47 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7var Montage = require("montage/core/core").Montage;
8
9var PanelBase = require("js/panels/PanelBase").PanelBase;
10var ComponentsPanelBase = require("js/panels/Components/ComponentsPanelBase.reel").ComponentsPanelBase;
11
12exports.ComponentsPanel = Montage.create(PanelBase, {
13 id : {value : "componentsPanel", writable:true, enumerable:true, configurable:true},
14 panelName : {value : "Components", writable:true, enumerable:true, configurable:true},
15 panelHeaderID : {value : "componentsPanelHeader", writable:true, enumerable:true, configurable:true},
16 disclosureIconID : {value : "componentsPanelDisclosureIcon", writable:true, enumerable:true, configurable:true},
17 closeButtonID : {value : "componentsPanelCloseButton", writable:true, enumerable:true, configurable:true},
18 panelContentID : {value : "componentsPanelContent", writable:true, enumerable:true, configurable:true},
19
20 init : {
21 value : function()
22 {
23 this.contentHeight = 200;
24 this.minHeight = 100;
25 this.defaultHeight = 200;
26
27 /* OLD WAY -- Removing the temporary div
28 // TODO: Remove this comment once this is tested.
29 var panelContainer = document.createElement("div");
30 this._componentsPanelBase = ComponentsPanelBase.create();
31 this._componentsPanelBase.element = panelContainer;
32
33 this.content = this._componentsPanelBase;
34 this._componentsPanelBase.needsDraw = true;
35 */
36
37 this.content = ComponentsPanelBase.create();
38 }
39 },
40
41 _componentsPanelBase:{
42 enumerable: true,
43 value: null,
44 writable:true
45 }
46
47}); \ No newline at end of file
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.css b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.css
new file mode 100644
index 00000000..ac250c83
--- /dev/null
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.css
@@ -0,0 +1,11 @@
1/* <copyright>
2 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5 </copyright> */
6
7.treeHolder{
8 width: 227px;
9 background: red;
10 padding-left: 13px;
11}
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
new file mode 100644
index 00000000..df104ecc
--- /dev/null
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
@@ -0,0 +1,34 @@
1<!DOCTYPE html>
2<!-- <copyright>
3 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
4 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
5 (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
6 </copyright> -->
7<html lang="en">
8 <head>
9 <meta http-equiv="content-type" content="text/html; charset=utf-8" />
10 <link rel="stylesheet" type="text/css" href="ComponentsPanelBase.css">
11
12 <script type="text/montage-serialization">
13 {
14 "owner": {
15 "module": "js/panels/Components/ComponentsPanelBase.reel",
16 "name": "ComponentsPanelBase",
17 "properties": {
18 "element": {"#": "components_panel"}
19 }
20 }
21 }
22 </script>
23
24 </head>
25 <body>
26
27 <div id="components_panel" class="components_panel">
28 <div class="treeHolder">
29 <ul id="comp_tree"></ul>
30 </div>
31 </div>
32
33 </body>
34</html> \ No newline at end of file
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
new file mode 100644
index 00000000..41afefa5
--- /dev/null
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
@@ -0,0 +1,145 @@
1/* <copyright>
2This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
3No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
4(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
5</copyright> */
6
7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component,
9 NJUtils = require("js/lib/NJUtils").NJUtils;
10
11var treeControlModule = require("js/components/tree.reel");
12
13var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, {
14 _hasFocus: {
15 enumerable: false,
16 value: false
17 },
18 prepareForDraw: {
19 enumerable: false,
20 value: function() {
21 var treeHolderDiv = document.getElementById("comp_tree");
22 var componentsTree = treeControlModule.Tree.create();
23 componentsTree.element = treeHolderDiv;
24 componentsTree.dataProvider = this._loadXMLDoc("js/panels/Components/Components.xml");
25 componentsTree.needsDraw = true;
26
27 this.eventManager.addEventListener( "executeAddComponent", this, false);
28 }
29 },
30 willDraw: {
31 enumerable: false,
32 value: function() {
33
34 }
35 },
36 draw: {
37 enumerable: false,
38 value: function() {
39
40 }
41 },
42
43 _loadXMLDoc: {
44 value:function(dname) {
45 if (window.XMLHttpRequest) {
46 xhttp = new XMLHttpRequest();
47 }
48 xhttp.open("GET", dname, false);
49 xhttp.send();
50 return xhttp.responseXML;
51 }
52 },
53
54 handleExecuteAddComponent: {
55 value: function(evt) {
56 this.addComponentToStage(evt.detail.component, evt.detail.dropX, evt.detail.dropY)
57 }
58 },
59
60 addComponentToStage:{
61 value:function(componentType, dropX, dropY){
62 var compW = 100,
63 compH = 100,
64 elementType = "div",
65 componentContainer,
66 componentElement;
67
68 if(componentType == "Button"){
69 compW = 118;
70 compH = 52;
71 }else if(componentType == "Checkbox"){
72 compW = 53;
73 compH = 53;
74// el