aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorValerio Virgillito2012-02-09 00:52:39 -0800
committerValerio Virgillito2012-02-09 00:52:39 -0800
commite2539230b8a297fa972af6d53fe9de3ef2ad43fa (patch)
treec82ad619ce1babb3957e044c48d25792e2788c8e
parentc7df002135328edac03e72a1e4b331b2c72667f8 (diff)
downloadninja-e2539230b8a297fa972af6d53fe9de3ef2ad43fa.tar.gz
Switching the components panel to use the new ninja tree component.
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat
-rw-r--r--js/components/treeview/ninja-leaf.reel/ninja-leaf.js6
-rw-r--r--js/panels/Components/Components.xml6
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html19
-rw-r--r--js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js172
-rw-r--r--user-document-templates/montage-application-cloud/main.reel/main.js20
5 files changed, 81 insertions, 142 deletions
diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.js b/js/components/treeview/ninja-leaf.reel/ninja-leaf.js
index bd566b26..ec2e7495 100644
--- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.js
+++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.js
@@ -19,14 +19,14 @@ exports.Leaf = Montage.create(TreeNode, {
19 }, 19 },
20 prepareForDraw: { 20 prepareForDraw: {
21 value : function() { 21 value : function() {
22 this.activationEvent = this.activationEvent || 'click'; 22 this.activationEvent = this.activationEvent || 'dblclick';
23 this.label._element.addEventListener(this.activationEvent, this.handleNodeActivation.bind(this), false); 23 this.label._element.addEventListener(this.activationEvent, this.handleNodeActivation.bind(this), false);
24 } 24 }
25 }, 25 },
26 handleNodeActivation: { 26 handleNodeActivation: {
27 value: function(e) { 27 value: function(e) {
28 console.log(this.sourceObject); 28 //console.log(this.sourceObject);
29 this.treeView.contentController.delegate.applyPresetSelection(this.sourceObject); 29 this.treeView.contentController.delegate.applySelection(this.sourceObject);
30 } 30 }
31 }, 31 },
32 draw : { 32 draw : {
diff --git a/js/panels/Components/Components.xml b/js/panels/Components/Components.xml
deleted file mode 100644
index e076602e..00000000
--- a/js/panels/Components/Components.xml
+++ /dev/null
@@ -1,6 +0,0 @@
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 </folder>
6</tree> \ No newline at end of file
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
index a9dda673..6d7c8a2c 100644
--- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.html
@@ -11,22 +11,12 @@
11 11
12 <script type="text/montage-serialization"> 12 <script type="text/montage-serialization">
13 { 13 {
14 "componentControllerArrayTemp": {
15 "module": "montage/ui/controller/array-controller",
16 "name": "ArrayController",
17 "bindings": {
18 "content": {
19 "boundObject": {"@": "owner"},
20 "boundObjectPropertyPath": "components"
21 }
22 }
23 },
24
25 "owner": { 14 "owner": {
26 "module": "js/panels/Components/ComponentsPanelBase.reel", 15 "module": "js/panels/Components/ComponentsPanelBase.reel",
27 "name": "ComponentsPanelBase", 16 "name": "ComponentsPanelBase",
28 "properties": { 17 "properties": {
29 "element": {"#": "components_panel"} 18 "element": {"#": "components_panel"},
19 "controller": {"@": "componentsTree"}
30 } 20 }
31 }, 21 },
32 22
@@ -41,7 +31,7 @@
41 "bindings": { 31 "bindings": {
42 "content": { 32 "content": {
43 "boundObject": {"@": "owner"}, 33 "boundObject": {"@": "owner"},
44 "boundObjectPropertyPath": "data2" 34 "boundObjectPropertyPath": "components"
45 } 35 }
46 } 36 }
47 }, 37 },
@@ -68,9 +58,6 @@
68 <body> 58 <body>
69 59
70 <div id="components_panel" class="components_panel"> 60 <div id="components_panel" class="components_panel">
71 <div class="treeHolder">
72 <ul id="comp_tree"></ul>
73 </div>
74 <div id="componentsContainer"></div> 61 <div id="componentsContainer"></div>
75 </div> 62 </div>
76 63
diff --git a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
index 338e7e0d..4828839b 100644
--- a/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
+++ b/js/panels/Components/ComponentsPanelBase.reel/ComponentsPanelBase.js
@@ -19,7 +19,30 @@ String.prototype.capitalizeFirstChar = function() {
19var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, { 19var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component, {
20 20
21 components: { 21 components: {
22 value: null 22 value: {
23 "text": "styles",
24 "children": [
25 {
26 "text": "Montage Components",
27 "children": [
28 {
29 "text": "Button",
30 "dataFile" : "node_modules/components-data/button.json",
31 "component": "button"
32 },
33 {
34 "text": "Text Field",
35 "dataFile" : "node_modules/components-data/textfield.json",
36 "component": "textfield"
37 }
38 ]
39 }
40 ]
41 }
42 },
43
44 componentsData: {
45 value: {}
23 }, 46 },
24 47
25 componentsToLoad: { 48 componentsToLoad: {
@@ -30,81 +53,9 @@ var ComponentsPanelBase = exports.ComponentsPanelBase = Montage.create(Component
30 value: 0 53 value: 0
31 }, 54 },
32 55
33 data2: {
34 value: {
35 "text": "styles",
36 "children": [{
37 "text": "Box Styles",
38 "children": [
39 {
40 "text": "Border-Radius",
41 "classNameBase" : "border-radius",
42 "styles" : {
43 "border-radius": "100px",
44 "border" : "1px solid #333"
45 }
46 },
47 {
48 "text": "Drop Shadow",
49 "classNameBase" : "drop-shadow",
50 "styles" : {
51 "box-shadow": "2px 2px 50px rgba(0,0,0,0.5)",
52 "border" : "1px solid #CCC"
53 }
54 },
55 {
56 "text": "Fancy Box",
57 "classNameBase" : "fancy-box",
58 "styles" : {
59 "box-shadow": "inset 0 0 0 1px #666, inset 0 0 0 2px rgba(225, 225, 225, 0.4), 0 0 20px -10px #333",
60 "border" : "1px solid #FFF",
61 "border-radius": "30px",
62 "background-color": "#7db9e8",
63 "background-image": "-webkit-linear-gradient(top, rgba(255,255,255,0.74) 0%,rgba(255,255,255,0) 100%)"
64 }
65 }]
66 }, {
67 "text": "Text Styles",
68 "children": [
69 { "text": "Italic" },
70 { "text": "Text Shadow" },
71 { "text": "Text Color" } ]
72 }, {
73 "text": "Color Styles",
74 "children": [
75 { "text": "Background Gradient" },
76 { "text": "Background Color" },
77 { "text": "Text Highlight" } ]
78 }]
79 }
80 },
81
82 _testButtonJson: {
83 value: {
84 "component": "button",
85
86 "module": "montage/ui/button.reel",
87
88 "name": "Button",
89
90 "properties": [
91 {
92 "name": "label",
93 "type": "string",
94 "default": "Button"
95 },
96 {
97 "name": "enabled",
98 "type": "boolean",
99 "default": "true"
100 }
101 ]
102