aboutsummaryrefslogtreecommitdiff
path: root/js/panels/binding/edit-binding-view.reel
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/binding/edit-binding-view.reel')
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.css11
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.html4
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.js83
3 files changed, 56 insertions, 42 deletions
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
index 01feb5cc..0ca82179 100644
--- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.css
@@ -14,7 +14,7 @@
14 top: 0; 14 top: 0;
15 width: 100%; 15 width: 100%;
16 -webkit-transition-property: -webkit-transform; 16 -webkit-transition-property: -webkit-transform;
17 -webkit-transition-duration: .55s; 17 -webkit-transition-duration: 550ms;
18 -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99); 18 -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99);
19 -webkit-user-select: text; 19 -webkit-user-select: text;
20} 20}
@@ -55,13 +55,16 @@
55 position:relative; 55 position:relative;
56 top: -1px; 56 top: -1px;
57 left: -1px; 57 left: -1px;
58 -webkit-transition: opacity 550ms linear;
58} 59}
59.object-fields-container { 60.object-fields-container {
60 -webkit-box-flex: 1; 61 -webkit-box-flex: 1;
61 padding-top: 1px; 62 padding-top: 1px;
62 width: 1px; 63 width: 1px;
63} 64}
64 65.no-object {
66 opacity: 0;
67}
65 68
66.edit-binding-view ul { 69.edit-binding-view ul {
67 padding: 0; 70 padding: 0;
@@ -116,6 +119,10 @@
116 width: 80%; 119 width: 80%;
117} 120}
118 121
122.hintable-field .hintable-hint {
123 color: #7C7C7C;
124}
125
119.hintable-field:focus { 126.hintable-field:focus {
120 border: 1px solid #313131; 127 border: 1px solid #313131;
121} \ No newline at end of file 128} \ No newline at end of file
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
index 91a5426f..d5409883 100644
--- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html
@@ -155,7 +155,7 @@
155 <div data-montage-id="source-object-icon" class="object-icon"></div> 155 <div data-montage-id="source-object-icon" class="object-icon"></div>
156 </div> 156 </div>
157 <div class="object-fields-container"> 157 <div class="object-fields-container">
158 <span data-montage-id="sourceObjectField" class="hintable-field">Test</span> 158 <span data-montage-id="sourceObjectField" class="hintable-field"></span>
159 <span data-montage-id="so-pp" class="hintable-field so-pp"></span> 159 <span data-montage-id="so-pp" class="hintable-field so-pp"></span>
160 </div> 160 </div>
161 </div> 161 </div>
@@ -165,7 +165,7 @@
165 <div data-montage-id="bound-object-icon" class="object-icon"></div> 165 <div data-montage-id="bound-object-icon" class="object-icon"></div>
166 </div> 166 </div>
167 <div class="object-fields-container"> 167 <div class="object-fields-container">
168 <span data-montage-id="boundObjectField" class="hintable-field">Test</span> 168 <span data-montage-id="boundObjectField" class="hintable-field"></span>
169 <span data-montage-id="bo-pp" class="hintable-field bo-pp"></span> 169 <span data-montage-id="bo-pp" class="hintable-field bo-pp"></span>
170 </div> 170 </div>
171 </div> 171 </div>
diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.js b/js/panels/binding/edit-binding-view.reel/edit-binding-view.js
index 62a47aaf..46fe9681 100644
--- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.js
+++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.js
@@ -65,6 +65,10 @@ var editBindingView = exports.EditBindingView = Montage.create(Component, {
65 65
66 this._sourceObject = value; 66 this._sourceObject = value;
67 67
68 if(value) {
69 this.sourceObjectPropertyPathField.hints = this.application.ninja.objectsController.getPropertiesFromObject(value);
70 }
71
68 this.needsDraw = true; 72 this.needsDraw = true;
69 } 73 }
70 }, 74 },
@@ -74,9 +78,12 @@ var editBindingView = exports.EditBindingView = Montage.create(Component, {
74 get : function() { return this._boundObject; }, 78 get : function() { return this._boundObject; },
75 set : function(value) { 79 set : function(value) {
76 if(value === this._boundObject) { return; } 80 if(value === this._boundObject) { return; }
77 console.log("Bound Object being set to ", value);
78 this._boundObject = value; 81 this._boundObject = value;
79 82
83 if(value) {
84 this.boundObjectPropertyPathField.hints = this.application.ninja.objectsController.getPropertiesFromObject(value);
85 }
86
80 this.needsDraw = true; 87 this.needsDraw = true;
81 } 88 }
82 }, 89 },
@@ -85,12 +92,8 @@ var editBindingView = exports.EditBindingView = Montage.create(Component, {
85 sourceObjectPropertyPath : { 92 sourceObjectPropertyPath : {
86 get : function() { return this._sourceObjectPropertyPath; }, 93 get : function() { return this._sourceObjectPropertyPath; },
87 set : function(value) { 94 set : function(value) {
88 console.log("Source Object Property Path being set to ", value);
89
90 if(value === this._sourceObjectPropertyPath) { return; } 95 if(value === this._sourceObjectPropertyPath) { return; }
91 96
92
93
94 this._sourceObjectPropertyPath = value; 97 this._sourceObjectPropertyPath = value;
95 98
96 this.needsDraw = true; 99 this.needsDraw = true;
@@ -144,26 +147,27 @@ var editBindingView = exports.EditBindingView = Montage.create(Component, {
144 // clear form values 147 // clear form values
145 this.clearForm(); 148 this.clearForm();
146 149
147 // set up hints for hintable components 150 if(value) {
148 this.objectIdentifiers = this.getObjectIdentifiers(); 151 // set up hints for hintable components
149 console.log("setting hints to ", this.objectIdentifiers); 152 this.objectIdentifiers = this.getObjectIdentifiers();
150 this.boundObjectField.hints = this.objectIdentifiers; 153 this.boundObjectField.hints = this.objectIdentifiers;
151 this.sourceObjectField.hints = this.objectIdentifiers; 154 this.sourceObjectField.hints = this.objectIdentifiers;
152 155
153 if(value.sourceObject) { 156 if(value.sourceObject) {
154 this.sourceObjectIdentifier = value.sourceObject.identifier || value.sourceObject._montage_metadata.label; 157 this.sourceObjectIdentifier = value.sourceObject.identifier || value.sourceObject._montage_metadata.label;
155 this.sourceObjectPropertyPath = value.sourceObjectPropertyPath || ''; 158 this.sourceObjectPropertyPath = value.sourceObjectPropertyPath || '';
156 } 159 }
157 160
158 if(value.boundObject) { 161 if(value.boundObject) {
159 this.boundObjectIdentifier = value.boundObject.identifier || ''; 162 this.boundObjectIdentifier = value.boundObject.identifier || '';
160 this.boundObjectPropertyPath = value.boundObjectPropertyPath || ''; 163 this.boundObjectPropertyPath = value.boundObjectPropertyPath || '';
161 this.isNewBinding = false; 164 this.isNewBinding = false;
162 } else { 165 } else {
163 this.isNewBinding = true; 166 this.isNewBinding = true;
164 } 167 }
165 168
166 this.oneway = value.oneway; 169 this.oneway = value.oneway;
170 }
167 171
168 this.needsDraw = true; 172 this.needsDraw = true;
169 } 173 }
@@ -187,25 +191,29 @@ var editBindingView = exports.EditBindingView = Montage.create(Component, {
187 191
188 clearForm : { 192 clearForm : {
189 value: function() { 193 value: function() {
190 for(var field in this) { 194 var fields = ["sourceObjectField",
191 if(this.hasOwnProperty(field)) { 195 "boundObjectField",
192 field.value = ''; 196 "sourceObjectPropertyPathField",
193 } 197 "boundObjectPropertyPathField"];
194 } 198
199 fields.forEach(function(fieldName) {
200 this[fieldName].value = "";
201 }, this);
202
203 this._bindingArgs = null;
204
195 this.dirty = false; 205 this.dirty = false;
196 } 206 }
197 }, 207 },
198 208
199 saveForm : { 209 saveForm : {
200 value: function() { 210 value: function() {
201 debugger;