aboutsummaryrefslogtreecommitdiff
path: root/js/components
diff options
context:
space:
mode:
authorJose Antonio Marquez2012-05-21 09:53:19 -0700
committerJose Antonio Marquez2012-05-21 09:53:19 -0700
commitc087ca289bc6d6eb26d0f5543ec6d1df1ba5dd4e (patch)
tree3d9b50fa845ba3d80fdc159275a9fece7ef69911 /js/components
parentb844fb34e9500560adcc8f9e860f7328f4db014f (diff)
parent10471fc02fa75040baf337bc62ff683854793f81 (diff)
downloadninja-c087ca289bc6d6eb26d0f5543ec6d1df1ba5dd4e.tar.gz
Merge branch 'refs/heads/Ninja-DOM-Architecture' into Document
Diffstat (limited to 'js/components')
-rwxr-xr-xjs/components/radio.reel/radio.html9
-rwxr-xr-xjs/components/radio.reel/radio.js24
-rwxr-xr-xjs/components/ui/color-chip.reel/color-chip.js13
-rwxr-xr-xjs/components/ui/file-input.reel/file-input.js2
-rwxr-xr-xjs/components/ui/input-group.reel/input-group.html3
-rwxr-xr-xjs/components/ui/property-control.reel/property-control.js12
6 files changed, 46 insertions, 17 deletions
diff --git a/js/components/radio.reel/radio.html b/js/components/radio.reel/radio.html
index 01b76b92..cee4c369 100755
--- a/js/components/radio.reel/radio.html
+++ b/js/components/radio.reel/radio.html
@@ -11,13 +11,18 @@
11 "owner": { 11 "owner": {
12 "prototype": "js/components/radio.reel", 12 "prototype": "js/components/radio.reel",
13 "properties": { 13 "properties": {
14 "element": {"#": "ch_comp"} 14 "element": {"#": "radio_comp"},
15 "labelField": {"#": "labelField"},
16 "radioField": {"#": "radioField"}
15 } 17 }
16 } 18 }
17 } 19 }
18 </script> 20 </script>
19</head> 21</head>
20<body> 22<body>
21 <input data-montage-id="ch_comp" class="nj-skinned" type="radio"> 23 <div data-montage-id="radio_comp">
24 <input data-montage-id="radioField" class="nj-skinned" type="radio">
25 <label data-montage-id="labelField" class="nj-skinned"></label>
26 </div>
22</body> 27</body>
23</html> \ No newline at end of file 28</html> \ No newline at end of file
diff --git a/js/components/radio.reel/radio.js b/js/components/radio.reel/radio.js
index c661ec11..cec4f52e 100755
--- a/js/components/radio.reel/radio.js
+++ b/js/components/radio.reel/radio.js
@@ -62,7 +62,7 @@ exports.RadioGroup = Montage.create(Component, {
62 { 62 {
63 value:function(radio) 63 value:function(radio)
64 { 64 {
65 radio.element.setAttribute("name", this.name); 65 radio.radioField.setAttribute("name", this.name);
66 radio.addEventListener("change", this, false); 66 radio.addEventListener("change", this, false);
67 this.radios.push(radio); 67 this.radios.push(radio);
68 } 68 }
@@ -104,6 +104,14 @@ exports.Radio = Montage.create(Component, {
104 value: null 104 value: null
105 }, 105 },
106 106
107 labelField: {
108 value: null
109 },
110
111 radioField: {
112 value: null
113 },
114
107 _checked: { 115 _checked: {
108 enumerable: false, 116 enumerable: false,
109 value: false 117 value: false
@@ -140,13 +148,13 @@ exports.Radio = Montage.create(Component, {
140 { 148 {
141 this._valueSyncedWithInputField = true; 149 this._valueSyncedWithInputField = true;
142 this._wasSetByCode = false; 150 this._wasSetByCode = false;
143 this.checked = this.element.checked; 151 this.checked = this.radioField.checked;
144 } 152 }
145 }, 153 },
146 handleClick: { 154 handleClick: {
147 value: function() { 155 value: function() {
148 this._wasSetByCode = false; 156 this._wasSetByCode = false;
149 this.checked = !this.element.checked; 157 this.checked = !this.radioField.checked;
150 } 158 }
151 }, 159 },
152 160
@@ -154,7 +162,7 @@ exports.Radio = Montage.create(Component, {
154 value: function() { 162 value: function() {
155 if(!this._valueSyncedWithInputField) 163 if(!this._valueSyncedWithInputField)
156 { 164 {
157 this.element.checked = this._checked; 165 this.radioField.checked = this._checked;
158 } 166 }
159 this._valueSyncedWithInputField = false; 167 this._valueSyncedWithInputField = false;
160 } 168 }
@@ -163,15 +171,13 @@ exports.Radio = Montage.create(Component, {
163 prepareForDraw: { 171 prepareForDraw: {
164 value: function() { 172 value: function() {
165 if (this.label !== null) { 173 if (this.label !== null) {
166 var b = document.createElement("label"); 174 this.labelField.innerHTML = this.label;
167 b.innerHTML = this.label;
168 this.element.appendChild(b);
169 b.addEventListener("click", this, false);
170 } 175 }
176 this.element.addEventListener("click", this, false);
171 if (this.group !== null) { 177 if (this.group !== null) {
172 this.group.addRadio(this); 178 this.group.addRadio(this);
173 } 179 }
174 this.element.addEventListener("change", this, false); 180 this.radioField.addEventListener("change", this, false);
175 } 181 }
176 } 182 }
177 183
diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js
index 4e64b2e8..630dcd4b 100755
--- a/js/components/ui/color-chip.reel/color-chip.js
+++ b/js/components/ui/color-chip.reel/color-chip.js
@@ -33,6 +33,11 @@ var ColorChip = exports.ColorChip = Montage.create(Component, {
33 value: {r:0, g:0, b:0, a:1, css:'rgb(0,0,0)', mode:'rgb'} 33 value: {r:0, g:0, b:0, a:1, css:'rgb(0,0,0)', mode:'rgb'}
34 }, 34 },
35 35
36 chipBtn: {
37 serializable: true,
38 value: null
39 },
40
36 changeDelegate: { 41 changeDelegate: {
37 value: function(event) { 42 value: function(event) {
38 this.color = event._event.color; 43 this.color = event._event.color;
@@ -60,7 +65,7 @@ var ColorChip = exports.ColorChip = Montage.create(Component, {
60 this.icon.style.display = "none"; 65 this.icon.style.display = "none";
61 } 66 }
62 67
63 this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset}; 68 this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, nocolor: true, offset: this.offset};
64 this.application.ninja.colorController.addButton(this.mode, this.chipBtn); 69 this.application.ninja.colorController.addButton(this.mode, this.chipBtn);
65 70
66 } 71 }
@@ -80,9 +85,13 @@ var ColorChip = exports.ColorChip = Montage.create(Component, {
80 b = colorObj.value.b; 85 b = colorObj.value.b;
81 a = colorObj.value.a; 86 a = colorObj.value.a;
82 css = colorObj.css; 87 css = colorObj.css;
88 this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css});
89 } else {
90 mode = "nocolor";
91 this.chipBtn.color(mode, null);
92
83 } 93 }
84 94
85 this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css});
86 this.chipBtn.addEventListener("change", this, false); 95 this.chipBtn.addEventListener("change", this, false);
87 } 96 }
88 } 97 }
diff --git a/js/components/ui/file-input.reel/file-input.js b/js/components/ui/file-input.reel/file-input.js
index b57f7c21..584380ec 100755
--- a/js/components/ui/file-input.reel/file-input.js
+++ b/js/components/ui/file-input.reel/file-input.js
@@ -38,7 +38,7 @@ var FileInput = exports.FileInput = Montage.create(Component, {
38 { 38 {
39 value:function(event) 39 value:function(event)
40 { 40 {
41 if(event.currentTarget.id === "fileInputControl") 41 if(event.currentTarget.type === "file")
42 { 42 {
43 this.filePath = this.inputField.value; 43 this.filePath = this.inputField.value;
44 } 44 }
diff --git a/js/components/ui/input-group.reel/input-group.html b/js/components/ui/input-group.reel/input-group.html
index ba85c089..7da4a855 100755
--- a/js/components/ui/input-group.reel/input-group.html
+++ b/js/components/ui/input-group.reel/input-group.html
@@ -25,7 +25,8 @@
25 "bindings": { 25 "bindings": {
26 "data": { 26 "data": {
27 "boundObject": {"@": "propList"}, 27 "boundObject": {"@": "propList"},
28 "boundObjectPropertyPath": "objectAtCurrentIteration" 28 "boundObjectPropertyPath": "objectAtCurrentIteration",
29 "oneway": true
29 } 30 }
30 }, 31 },
31 "listeners": [ 32 "listeners": [
diff --git a/js/components/ui/property-control.reel/property-control.js b/js/components/ui/property-control.reel/property-control.js
index c28979a9..20ec173e 100755
--- a/js/components/ui/property-control.reel/property-control.js
+++ b/js/components/ui/property-control.reel/property-control.js
@@ -120,8 +120,13 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, {
120 set: function (data) { 120 set: function (data) {
121 if (data !== this._data) { 121 if (data !== this._data) {
122 this._data = data; 122 this._data = data;
123 this.label = data.label; 123 if(data) {
124 this.controlType = data.controlType; 124 this._label = data.label;
125 this._controlType = data.controlType;
126 } else {
127 this._label = "";
128 this._controlType = null;
129 }
125 this.needsDraw = true; 130 this.needsDraw = true;
126 } 131 }
127 } 132 }
@@ -143,6 +148,9 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, {
143 { 148 {
144 value:function(event) 149 value:function(event)
145 { 150 {
151