aboutsummaryrefslogtreecommitdiff
path: root/js/panels/binding
diff options
context:
space:
mode:
Diffstat (limited to 'js/panels/binding')
-rw-r--r--js/panels/binding/binding-item.reel/binding-item.js14
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.css25
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.html127
-rw-r--r--js/panels/binding/edit-binding-view.reel/edit-binding-view.js196
4 files changed, 326 insertions, 36 deletions
diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js
index 55230fc3..a1017020 100644
--- a/js/panels/binding/binding-item.reel/binding-item.js
+++ b/js/panels/binding/binding-item.reel/binding-item.js
@@ -12,6 +12,10 @@ exports.BindingItem = Montage.create(Component, {
12 sourceObjectLabel : { value: null }, 12 sourceObjectLabel : { value: null },
13 boundObjectLabel : { value: null }, 13 boundObjectLabel : { value: null },
14 14
15 bindingArgs : {
16 value: null
17 },
18
15 _sourceObject : { value: null }, 19 _sourceObject : { value: null },
16 sourceObject : { 20 sourceObject : {
17 get: function() { 21 get: function() {
@@ -73,7 +77,9 @@ exports.BindingItem = Montage.create(Component, {
73 }, 77 },
74 set: function(value) { 78 set: function(value) {
75 if(value === this._oneway) { return; } 79 if(value === this._oneway) { return; }
80
76 this._oneway = value; 81 this._oneway = value;
82
77 this.needsDraw = true; 83 this.needsDraw = true;
78 } 84 }
79 }, 85 },
@@ -82,13 +88,19 @@ exports.BindingItem = Montage.create(Component, {
82 88
83 handleDirectionToggleButtonAction : { 89 handleDirectionToggleButtonAction : {
84 value: function(e) { 90 value: function(e) {
91 var controller = this.application.ninja.objectsController;
92
85 this.oneway = !this.oneway; 93 this.oneway = !this.oneway;
94 controller.editBinding(this.bindingArgs, {
95 oneway: !this.bindingArgs.oneway
96 });
97 controller.currentItem = controller.currentItem;
86 } 98 }
87 }, 99 },
88 100
89 handleEditButtonAction : { 101 handleEditButtonAction : {
90 value: function(e) { 102 value: function(e) {
91 this.parentComponent.parentComponent.displayEditView(); 103 this.parentComponent.parentComponent.displayEditView(this.bindingArgs);
92 } 104 }
93 }, 105 },
94 106
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 b0249c6c..aa539cd6 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
@@ -9,11 +9,14 @@
9 color: #FFF; 9 color: #FFF;
10 font-size: 11px; 10 font-size: 11px;
11 height: 100%; 11 height: 100%;
12 /*left: 100%;*/ 12 left: 100%;
13 /*position: absolute;*/ 13 position: absolute;
14 /*top: 0;*/ 14 top: 0;
15 width: 100%; 15 width: 100%;
16 -webkit-transition: -webkit-transform 140ms ease-in; 16 -webkit-transition-property: -webkit-transform, box-shadow;
17 -webkit-transition-duration: .55s, .2s;
18 -webkit-transition-timing-function: cubic-bezier(.44,.19,0,.99);
19 -webkit-user-select: text;
17} 20}
18 21
19.edit-binding-view ul { 22.edit-binding-view ul {
@@ -26,11 +29,19 @@
26 list-style-type: none; 29 list-style-type: none;
27} 30}
28 31
32.edit-binding-view label {
33 display: inline-block;
34 width: 50%;
35}
36
29/* hintable fields */ 37/* hintable fields */
30 38
31.so-pp, .bo-pp { 39.hintable-field {
32 border: 1px solid #313131;
33 padding: 1px 4px;
34 background-color: #444; 40 background-color: #444;
41 border: 1px solid #313131;
42 display: inline-block;
43 height: 13px;
35 margin-left: 5px; 44 margin-left: 5px;
45 padding: 1px 4px;
46 width: 45%;
36} \ No newline at end of file 47} \ 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 1d502a3e..604d4871 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
@@ -13,34 +13,53 @@
13 "owner": { 13 "owner": {
14 "prototype": "js/panels/binding/edit-binding-view.reel", 14 "prototype": "js/panels/binding/edit-binding-view.reel",
15 "properties": { 15 "properties": {
16 "element": {"#": "edit-binding"} 16 "element": {"#": "edit-binding"},
17 "sourceObjectField" : {"@": "sourceObjectField" },
18 "boundObjectField" : {"@": "boundObjectField" },
19 "sourceObjectPropertyPathField" : {"@": "sourceObjectPropertyPathField" },
20 "boundObjectPropertyPathField" : {"@": "boundObjectPropertyPathField" },
21 "directionCheckbox" : {"@": "directionCheckbox" },
22 "saveButton":{ "@": "saveButton" },
23 "cancelButton":{ "@": "cancelButton" },
24 "deleteButton":{ "@": "deleteButton" }
17 } 25 }
18 }, 26 },
19 "objectsList" : { 27 "sourceObjectField": {
20 "prototype": "montage/ui/controller/array-controller", 28 "prototype": "js/components/hintable.reel",
21 "bindings" : {
22 "content": {"<-": "@owner.objectsList"}
23 }
24 },
25 "sourceObjectSelect": {
26 "prototype": "montage/ui/select-input.reel",
27 "properties": { 29 "properties": {
28 "element": {"#": "sourceObjectSelect"}, 30 "startOnEvent": "click",
29 "contentController": {"@": "objectsList"} 31 "element": {"#": "sourceObjectField"}
30 32 },
31 } 33 "bindings": {
34 "value": {"<-": "@owner.sourceObjectIdentifier"}
35 },
36 "listeners" : [
37 {
38 "type": "change",
39 "listener": {"@": "owner"}
40 }
41 ]
32 }, 42 },
33 "boundObjectSelect": { 43 "boundObjectField": {
34 "prototype": "montage/ui/select-input.reel", 44 "prototype": "js/components/hintable.reel",
35 "properties": { 45 "properties": {
36 "element": {"#": "boundObjectSelect"}, 46 "startOnEvent": "click",
37 "contentController": {"@": "objectsList"} 47 "element": {"#": "boundObjectField"}
38 48 },
39 } 49 "bindings": {
50 "value": {"<-": "@owner.boundObjectIdentifier"}
51 },
52 "listeners" : [
53 {
54 "type": "change",
55 "listener": {"@": "owner"}
56 }
57 ]
40 }, 58 },
41 "sourceObjectPropertyPathField": { 59 "sourceObjectPropertyPathField": {
42 "prototype": "js/components/hintable.reel", 60 "prototype": "js/components/hintable.reel",
43 "properties": { 61 "properties": {
62 "startOnEvent": "click",
44 "element": {"#": "so-pp"}, 63 "element": {"#": "so-pp"},
45 "identifier": "sourceProperty" 64 "identifier": "sourceProperty"
46 }, 65 },
@@ -57,6 +76,7 @@
57 "boundObjectPropertyPathField": { 76 "boundObjectPropertyPathField": {
58 "prototype": "js/components/hintable.reel", 77 "prototype": "js/components/hintable.reel",
59 "properties": { 78 "properties": {
79 "startOnEvent": "click",
60 "element": {"#": "bo-pp"}, 80 "element": {"#": "bo-pp"},
61 "identifier": "boundProperty" 81 "identifier": "boundProperty"
62 }, 82 },
@@ -69,6 +89,57 @@
69 "listener": {"@": "owner"} 89 "listener": {"@": "owner"}
70 } 90 }
71 ] 91 ]
92 },
93 "directionCheckbox": {
94 "prototype": "montage/ui/checkbox.reel",
95 "properties": {
96 "element": {"#": "direction-checkbox"}
97 },
98 "bindings": {
99 "checked": {"<-": "@owner.oneway"}
100 }
101 },
102