aboutsummaryrefslogtreecommitdiff
path: root/js/panels/Components/ComponentsPanelBase.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/Components/ComponentsPanelBase.reel')
-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
3 files changed, 190 insertions, 0 deletions
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// elementType = "input";
75 }else if(componentType == "DynamicText"){
76 compW = 100;
77 compH = 20;
78 }else if(componentType == "FlowController"){
79 compW = 800;
80 compH = 320;
81 }else if(componentType == "HotText"){
82 compW = 50;
83 compH = 18;
84// elementType = "input";
85 }else if(componentType == "HotTextUnit"){
86 compW = 45;
87 compH = 18;
88 }else if(componentType == "ImageContainer"){
89 compW = 285;
90 compH = 232;
91 }else if(componentType == "Progress"){
92 compW = 300;
93 compH = 9;
94 }else if(componentType == "Scrollview"){
95 compW = 200;
96 compH = 200;
97 }else if(componentType == "Slider"){
98 compW = 200;
99 compH = 55;
100 }else if(componentType == "TextArea"){
101 compW = 312;
102 compH = 112;
103 elementType = "textarea";
104 }else if(componentType == "Textfield"){
105 compW = 312;
106 compH = 34;
107 elementType = "input";
108 }else if(componentType == "Toggle"){
109 compW = 60;
110 compH = 22;
111 elementType = "span";
112 }else if(componentType == "ToggleButton"){
113 compW = 118;
114 compH = 52;
115 }else{
116 compW = 100;
117 compH = 25;
118 }
119
120 componentContainer = NJUtils.makeNJElement("div", componentType, "component");
121 componentContainer.elementModel.isComponent = true;
122
123 var styles = {
124 'position': 'absolute',
125 'top' : dropY + 'px',
126 'left' : dropX + 'px',
127 'width' : compW + 'px',
128 'height' : compH + 'px',
129 '-webkit-transform-style' : 'preserve-3d',
130 '-webkit-transform' : 'perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)'
131 };
132
133
134 componentElement = NJUtils.makeNJElement(elementType, "ComponentDiv", "block");
135
136 componentContainer.appendChild(componentElement);
137
138 NJevent("elementAdding", {"el": componentContainer, "data":styles});
139
140 var componentRef = this.application.ninja.currentDocument._window.addComponent(componentElement, componentType);
141 this.application.ninja.currentDocument._userComponentSet[componentContainer.uuid] = componentRef;
142
143 }
144 }
145}); \ No newline at end of file