From 04ef4ffcfde762a0aead4a7b702f3c019fdbeb69 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Thu, 31 May 2012 21:57:22 -0700 Subject: Binding Panel - Developed panel components. --- .../binding/binding-item.reel/binding-item.css | 13 ++++++++ .../binding/binding-item.reel/binding-item.html | 37 ++++++++++++++++++++++ .../binding/binding-item.reel/binding-item.js | 26 +++++++++++++++ 3 files changed, 76 insertions(+) create mode 100644 js/panels/binding/binding-item.reel/binding-item.css create mode 100644 js/panels/binding/binding-item.reel/binding-item.html create mode 100644 js/panels/binding/binding-item.reel/binding-item.js (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.css b/js/panels/binding/binding-item.reel/binding-item.css new file mode 100644 index 00000000..dc90f162 --- /dev/null +++ b/js/panels/binding/binding-item.reel/binding-item.css @@ -0,0 +1,13 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. + */ + +.binding-item { + color: #FFF; + margin: 0 8px; + padding: 3px; + border-bottom: 1px solid #FFF; + list-style-type: none; +} \ No newline at end of file diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html new file mode 100644 index 00000000..23182345 --- /dev/null +++ b/js/panels/binding/binding-item.reel/binding-item.html @@ -0,0 +1,37 @@ + + + + + + + + + +
  • + +
    • + + \ No newline at end of file diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js new file mode 100644 index 00000000..9365da65 --- /dev/null +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -0,0 +1,26 @@ +/* + This file contains proprietary software owned by Motorola Mobility, Inc.
    + No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
    + (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. +     */ + +var Montage = require("montage/core/core").Montage, + Component = require("montage/ui/component").Component; + + +exports.BindingItem = Montage.create(Component, { + + sourceObjectPropertyPath : { value: null }, + + templateDidLoad : { + value: function() { + console.log("loaded binding item"); + } + }, + + prepareForDraw: { + value: function() { + console.log("preparing to draw binding item"); + } + } +}); \ No newline at end of file -- cgit v1.2.3 From 0f59ef2a4b78fbcee402255857e8355a67fa7e66 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 1 Jun 2012 12:53:24 -0700 Subject: Bindings Panel - Update binding panel components --- .../binding/binding-item.reel/binding-item.css | 34 +++++++++++- .../binding/binding-item.reel/binding-item.html | 54 +++++++++++++++++- .../binding/binding-item.reel/binding-item.js | 64 +++++++++++++++++++++- 3 files changed, 147 insertions(+), 5 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.css b/js/panels/binding/binding-item.reel/binding-item.css index dc90f162..0f4416b9 100644 --- a/js/panels/binding/binding-item.reel/binding-item.css +++ b/js/panels/binding/binding-item.reel/binding-item.css @@ -8,6 +8,38 @@ color: #FFF; margin: 0 8px; padding: 3px; - border-bottom: 1px solid #FFF; + border-bottom: 1px solid #505050; list-style-type: none; + display: -webkit-box; + -webkit-box-orient: horizontal; +} +.binding-item > * { + -webkit-box-flex: 1; +} +.source-object, .bound-object { + padding: 5px 0 3px; +} +.source-object { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowREQ2NEVFRkE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowREQ2NEVGMEE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjBERDY0RUVEQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBERDY0RUVFQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2Ii8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2B50zlPwAAAttJREFUeNqMls9rE0EUx2fz24RKsoluUAkIHhWFXtVCJRAhFBRB8D8I1GMF%2FwJFjwr9DzwVipKDUBvQg4KgeJOe1OSS2PxYMUnzO77vsm%2BcSbJpB76dLvve5719M%2FMmxnQ6FV4jn89fo%2BkBaY2UJmVIZVKV9J70ivTNy99YBCdolqZCv9%2B%2F0%2Bl0BM0CdqPRSAQCAWEYhgiHwyIWi2HeJdtt0t6xcAI%2FGw6HW61Wy4H6fD4pHpPJRApBEomECAaDz%2BnVI084gV90u93NRqPhwJCl3%2B%2BXYGTM9gCPx2Pna%2FB%2FMpkU0Wj0Jb16yLyAAn4CcL1eRxYSrMLVASB%2FEQLAL5VKbVKANr1%2BLDMn8AaV4nWtVnNggGNGADgjY4gHfCAEABhfQP7ObFkW%2FO%2BS2S5nXmg2mw6AM1ZLYlDi5u1fInLJlgHaX86K1gdLKxcEDgUoOHBsN1q43GAwEKFQSANDACdyPzVw56sl%2Fn48R%2B%2Bnc4sMDvGytNCrKOZ9qrWToVpjzngenBbtTxdkqdhW9QWPxj2UZX12yzmOnuDzshQ8q0GgXq%2BHV1lknsFCqDvCF5ivsQrW9vLMYoMDHo2LIJqolWo4HZOG%2BvbzhcYLwaofP7s8E4QmZ80rjmHvZ8TR96QEnbp8KE6vlTU427IfP7u8Jv6WsRCcvTSmxz%2BljOgd6AFWblbmAqinHBzwaPwAvIT%2BoPYLmQkFsN%2FpAaJXfouV6xUtWz5QrEgkAtM9wHfoyMpeAWlB3ABHB%2Bb%2FAFcpwI2KBlV9wQOXj%2F9%2BtVpdxwscfT7%2B8oQuOf4MxfGHYJ9Op0tkdou3xDa6GvcK7hezUmGq2Ie7o9vfhQMvFos7lO1T0zRlBiwOxAD1edYW%2FuCgJEv7OZfluH7OWtTPF95E1Hy2bNs%2B8U0Uj8fR9JbfREqAnHuHbvAdyjXnJqXcoW%2FcGr890QWtBFlF10Rzc2%2F%2BM6RD9xdAya3tZy%2F%2FfwIMAMwfSVrTb5e6AAAAAElFTkSuQmCC); + background-position: right center; + background-repeat: no-repeat; + padding-right: 30px; +} +.bound-object { + padding-left: 12px; +} +.so-object-identifier, .bo-object-identifier { + float: right; + color: #999; +} +.binding-item .binding-edit-button { + background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDQkI4QzVEMTc3ODcxMUUxQTlCOUNDQUJBMEUyMTIwMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDQkI4QzVEMjc3ODcxMUUxQTlCOUNDQUJBMEUyMTIwMSI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkNCQjhDNUNGNzc4NzExRTFBOUI5Q0NBQkEwRTIxMjAxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkNCQjhDNUQwNzc4NzExRTFBOUI5Q0NBQkEwRTIxMjAxIi8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2Bs3B0RQAAAd9JREFUeNockbGL2nAUx%2FNLorHaJXKjJ6YcDkVcHByUQwQDbl26FqEu3dykLjoIXXTwDygKFcrRP%2BC8Q0HwQDlwOaRCKFiuCmo0d0Jr1ZjY923ghZfv9%2FN%2B7%2F1eOJ%2FPx%2BEpl8uKZVk3p9PpRlXV81QqdY4cGjww%2F9l2u81Fo1EuFotdbrdbzbbtX%2FP5%2FAqBHBo8MGB5RVF8yWTSv9%2FvXYIgsNVq9XcwGLxCIBdFkcEDA5YZhnFNJwXcbjc3Go32mUzmlsaYYAQ6QGk0GmooFJKoE8fz%2FE9%2BsVjIHo%2FHpes6y2azX8PhsNbtdtMI5NDggQHL0wW%2FdDodfTqdPm02m4dqtfqmXq9LCOTQ4IEBy3u93gdq9YfCplHM2Wz2gsZ7ptggJ%2B0ADwxYRuI1zfqaLvY7l8t9mkwmcqVSeWeapl0oFJqBQOCpVqt9lCTpJWnfWb%2Ffv6fKM2xot9s9FovFz71ez6ST7UQiIZVKpffUzU%2Ffp%2FV6vWLBYPDD8Xi8oJ%2FkarVaKhVatLlHxhgny7KfPCGdTt%2FS945W%2FEPUNO2KNihGIpH44XBI0Tak8Xh8hoJ4PC7RGCZN0BkOh3fEHUV6Gdi50%2BnUqaWxXC6FfD7%2FDQXNZvMtXdZyOBw6IUtw%2FwQYACT6GJDDh744AAAAAElFTkSuQmCC); + background-repeat: no-repeat; + background-position: right center; + border: 0 none; + cursor: pointer; + padding-top: 6px; + width: 12px; + height: 100%; + margin-left: 10px; } \ No newline at end of file diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html index 23182345..a569b8b4 100644 --- a/js/panels/binding/binding-item.reel/binding-item.html +++ b/js/panels/binding/binding-item.reel/binding-item.html @@ -16,14 +16,54 @@ "element": {"#": "binding-item"} } }, - "label": { + "soProperty": { "prototype": "montage/ui/dynamic-text.reel", "properties": { - "element": {"#": "label"} + "element": {"#": "so-property"} }, "bindings": { "value": {"<-": "@owner.sourceObjectPropertyPath"} } + }, + "soObject": { + "prototype": "montage/ui/dynamic-text.reel", + "properties": { + "element": {"#": "so-object"} + }, + "bindings": { + "value": {"<-": "@owner.sourceObjectLabel"} + } + }, + "boProperty" : { + "prototype": "montage/ui/dynamic-text.reel", + "properties": { + "element": {"#": "bo-property"} + }, + "bindings": { + "value": {"<-": "@owner.boundObjectPropertyPath"} + } + }, + "boObject": { + "prototype": "montage/ui/dynamic-text.reel", + "properties": { + "element": {"#": "bo-object"} + }, + "bindings": { + "value": {"<-": "@owner.boundObjectLabel"} + } + }, + "editButton": { + "prototype": "montage/ui/button.reel", + "properties": { + "element": {"#": "edit-button"}, + "identifier": "editButton", + "label": " " + }, + "listeners": [{ + "type": "action", + "listener": {"@": "owner"} + }] + } } @@ -31,7 +71,15 @@
  • - +
    + + +
    +
    + + +
    +
    • \ No newline at end of file diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index 9365da65..bda62ef3 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -9,8 +9,70 @@ var Montage = require("montage/core/core").Montage, exports.BindingItem = Montage.create(Component, { + sourceObjectLabel : { value: null }, + boundObjectLabel : { value: null }, - sourceObjectPropertyPath : { value: null }, + _sourceObject : { value: null }, + sourceObject : { + get: function() { + return this._sourceObject; + }, + set: function(value) { + if(value === this._sourceObject) { return; } + + this.sourceObjectLabel = value.identifier; + + this._sourceObject = value; + } + }, + _boundObject : { value: null }, + boundObject : { + get: function() { + return this._boundObject; + }, + set: function(value) { + if(value === this._boundObject) { return; } + + this.boundObjectLabel = value.identifier; + + this._boundObject = value; + } + }, + + _sourceObjectPropertyPath : { value: null }, + sourceObjectPropertyPath : { + get: function() { + return this._sourceObjectPropertyPath; + }, + set: function(value) { + if(value === this._sourceObjectPropertyPath) { return; } + this._sourceObjectPropertyPath = value; + this.needsDraw = true; + } + }, + _boundObjectPropertyPath : { value: null }, + boundObjectPropertyPath : { + get: function() { + return this._boundObjectPropertyPath; + }, + set: function(value) { + if(value === this._boundObjectPropertyPath) { return; } + this._boundObjectPropertyPath = value; + this.needsDraw = true; + } + }, + + _oneway : { value: null }, + oneway : { + get: function() { + return this._oneway; + }, + set: function(value) { + if(value === this._oneway) { return; } + this._oneway = value; + this.needsDraw = true; + } + }, templateDidLoad : { value: function() { -- cgit v1.2.3 From 0f5bdc50d6167b23b694e52e735988f670e85b8b Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 1 Jun 2012 13:26:44 -0700 Subject: Binding Panel - Binding item component CSS change --- js/panels/binding/binding-item.reel/binding-item.css | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.css b/js/panels/binding/binding-item.reel/binding-item.css index 0f4416b9..eb4ecfe0 100644 --- a/js/panels/binding/binding-item.reel/binding-item.css +++ b/js/panels/binding/binding-item.reel/binding-item.css @@ -10,11 +10,12 @@ padding: 3px; border-bottom: 1px solid #505050; list-style-type: none; - display: -webkit-box; - -webkit-box-orient: horizontal; + /*display: -webkit-box;*/ + /*-webkit-box-orient: horizontal;*/ } .binding-item > * { - -webkit-box-flex: 1; + /*-webkit-box-flex: 1;*/ + display: inline-block; } .source-object, .bound-object { padding: 5px 0 3px; @@ -24,9 +25,11 @@ background-position: right center; background-repeat: no-repeat; padding-right: 30px; + width: 41%; } .bound-object { padding-left: 12px; + width: 41%; } .so-object-identifier, .bo-object-identifier { float: right; -- cgit v1.2.3 From 9b238646d7c9d8ed1fde010cde5597f8787a8806 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 1 Jun 2012 19:04:38 -0700 Subject: Binding Panel - Item css and toggle button action handler --- .../binding/binding-item.reel/binding-item.css | 56 +++++++++++++++------- .../binding/binding-item.reel/binding-item.html | 17 ++++++- .../binding/binding-item.reel/binding-item.js | 20 ++++++++ 3 files changed, 74 insertions(+), 19 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.css b/js/panels/binding/binding-item.reel/binding-item.css index eb4ecfe0..3dc1294c 100644 --- a/js/panels/binding/binding-item.reel/binding-item.css +++ b/js/panels/binding/binding-item.reel/binding-item.css @@ -10,39 +10,59 @@ padding: 3px; border-bottom: 1px solid #505050; list-style-type: none; - /*display: -webkit-box;*/ - /*-webkit-box-orient: horizontal;*/ -} -.binding-item > * { - /*-webkit-box-flex: 1;*/ - display: inline-block; + display: -webkit-box; + -webkit-box-orient: horizontal; } .source-object, .bound-object { padding: 5px 0 3px; + -webkit-box-flex: 1; + overflow: hidden; + position: relative; } -.source-object { - background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowREQ2NEVFRkE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowREQ2NEVGMEE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjBERDY0RUVEQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBERDY0RUVFQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2Ii8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2B50zlPwAAAttJREFUeNqMls9rE0EUx2fz24RKsoluUAkIHhWFXtVCJRAhFBRB8D8I1GMF%2FwJFjwr9DzwVipKDUBvQg4KgeJOe1OSS2PxYMUnzO77vsm%2BcSbJpB76dLvve5719M%2FMmxnQ6FV4jn89fo%2BkBaY2UJmVIZVKV9J70ivTNy99YBCdolqZCv9%2B%2F0%2Bl0BM0CdqPRSAQCAWEYhgiHwyIWi2HeJdtt0t6xcAI%2FGw6HW61Wy4H6fD4pHpPJRApBEomECAaDz%2BnVI084gV90u93NRqPhwJCl3%2B%2BXYGTM9gCPx2Pna%2FB%2FMpkU0Wj0Jb16yLyAAn4CcL1eRxYSrMLVASB%2FEQLAL5VKbVKANr1%2BLDMn8AaV4nWtVnNggGNGADgjY4gHfCAEABhfQP7ObFkW%2FO%2BS2S5nXmg2mw6AM1ZLYlDi5u1fInLJlgHaX86K1gdLKxcEDgUoOHBsN1q43GAwEKFQSANDACdyPzVw56sl%2Fn48R%2B%2Bnc4sMDvGytNCrKOZ9qrWToVpjzngenBbtTxdkqdhW9QWPxj2UZX12yzmOnuDzshQ8q0GgXq%2BHV1lknsFCqDvCF5ivsQrW9vLMYoMDHo2LIJqolWo4HZOG%2BvbzhcYLwaofP7s8E4QmZ80rjmHvZ8TR96QEnbp8KE6vlTU427IfP7u8Jv6WsRCcvTSmxz%2BljOgd6AFWblbmAqinHBzwaPwAvIT%2BoPYLmQkFsN%2FpAaJXfouV6xUtWz5QrEgkAtM9wHfoyMpeAWlB3ABHB%2Bb%2FAFcpwI2KBlV9wQOXj%2F9%2BtVpdxwscfT7%2B8oQuOf4MxfGHYJ9Op0tkdou3xDa6GvcK7hezUmGq2Ie7o9vfhQMvFos7lO1T0zRlBiwOxAD1edYW%2FuCgJEv7OZfluH7OWtTPF95E1Hy2bNs%2B8U0Uj8fR9JbfREqAnHuHbvAdyjXnJqXcoW%2FcGr890QWtBFlF10Rzc2%2F%2BM6RD9xdAya3tZy%2F%2FfwIMAMwfSVrTb5e6AAAAAElFTkSuQmCC); - background-position: right center; - background-repeat: no-repeat; - padding-right: 30px; - width: 41%; +.source-object > span, .bound-object > span { + position: absolute; } .bound-object { padding-left: 12px; - width: 41%; +} +.so-property { + left: 3px; +} +.bo-property { + left: 6px; } .so-object-identifier, .bo-object-identifier { - float: right; + right: 3px; color: #999; } -.binding-item .binding-edit-button { - background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDQkI4QzVEMTc3ODcxMUUxQTlCOUNDQUJBMEUyMTIwMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDQkI4QzVEMjc3ODcxMUUxQTlCOUNDQUJBMEUyMTIwMSI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkNCQjhDNUNGNzc4NzExRTFBOUI5Q0NBQkEwRTIxMjAxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkNCQjhDNUQwNzc4NzExRTFBOUI5Q0NBQkEwRTIxMjAxIi8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2Bs3B0RQAAAd9JREFUeNockbGL2nAUx%2FNLorHaJXKjJ6YcDkVcHByUQwQDbl26FqEu3dykLjoIXXTwDygKFcrRP%2BC8Q0HwQDlwOaRCKFiuCmo0d0Jr1ZjY923ghZfv9%2FN%2B7%2F1eOJ%2FPx%2BEpl8uKZVk3p9PpRlXV81QqdY4cGjww%2F9l2u81Fo1EuFotdbrdbzbbtX%2FP5%2FAqBHBo8MGB5RVF8yWTSv9%2FvXYIgsNVq9XcwGLxCIBdFkcEDA5YZhnFNJwXcbjc3Go32mUzmlsaYYAQ6QGk0GmooFJKoE8fz%2FE9%2BsVjIHo%2FHpes6y2azX8PhsNbtdtMI5NDggQHL0wW%2FdDodfTqdPm02m4dqtfqmXq9LCOTQ4IEBy3u93gdq9YfCplHM2Wz2gsZ7ptggJ%2B0ADwxYRuI1zfqaLvY7l8t9mkwmcqVSeWeapl0oFJqBQOCpVqt9lCTpJWnfWb%2Ffv6fKM2xot9s9FovFz71ez6ST7UQiIZVKpffUzU%2Ffp%2FV6vWLBYPDD8Xi8oJ%2FkarVaKhVatLlHxhgny7KfPCGdTt%2FS945W%2FEPUNO2KNihGIpH44XBI0Tak8Xh8hoJ4PC7RGCZN0BkOh3fEHUV6Gdi50%2BnUqaWxXC6FfD7%2FDQXNZvMtXdZyOBw6IUtw%2FwQYACT6GJDDh744AAAAAElFTkSuQmCC); - background-repeat: no-repeat; + +/* ------------- + Buttons + ---------------- */ + +.direction-toggle-button, .binding-edit-button { + background-color: transparent; background-position: right center; + background-repeat: no-repeat; border: 0 none; cursor: pointer; + width: 23px; + height: 100%; + -webkit-box-flex: 0; +} +.direction-toggle-button { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowREQ2NEVFRkE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowREQ2NEVGMEE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjBERDY0RUVEQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBERDY0RUVFQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2Ii8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2B50zlPwAAAttJREFUeNqMls9rE0EUx2fz24RKsoluUAkIHhWFXtVCJRAhFBRB8D8I1GMF%2FwJFjwr9DzwVipKDUBvQg4KgeJOe1OSS2PxYMUnzO77vsm%2BcSbJpB76dLvve5719M%2FMmxnQ6FV4jn89fo%2BkBaY2UJmVIZVKV9J70ivTNy99YBCdolqZCv9%2B%2F0%2Bl0BM0CdqPRSAQCAWEYhgiHwyIWi2HeJdtt0t6xcAI%2FGw6HW61Wy4H6fD4pHpPJRApBEomECAaDz%2BnVI084gV90u93NRqPhwJCl3%2B%2BXYGTM9gCPx2Pna%2FB%2FMpkU0Wj0Jb16yLyAAn4CcL1eRxYSrMLVASB%2FEQLAL5VKbVKANr1%2BLDMn8AaV4nWtVnNggGNGADgjY4gHfCAEABhfQP7ObFkW%2FO%2BS2S5nXmg2mw6AM1ZLYlDi5u1fInLJlgHaX86K1gdLKxcEDgUoOHBsN1q43GAwEKFQSANDACdyPzVw56sl%2Fn48R%2B%2Bnc4sMDvGytNCrKOZ9qrWToVpjzngenBbtTxdkqdhW9QWPxj2UZX12yzmOnuDzshQ8q0GgXq%2BHV1lknsFCqDvCF5ivsQrW9vLMYoMDHo2LIJqolWo4HZOG%2BvbzhcYLwaofP7s8E4QmZ80rjmHvZ8TR96QEnbp8KE6vlTU427IfP7u8Jv6WsRCcvTSmxz%2BljOgd6AFWblbmAqinHBzwaPwAvIT%2BoPYLmQkFsN%2FpAaJXfouV6xUtWz5QrEgkAtM9wHfoyMpeAWlB3ABHB%2Bb%2FAFcpwI2KBlV9wQOXj%2F9%2BtVpdxwscfT7%2B8oQuOf4MxfGHYJ9Op0tkdou3xDa6GvcK7hezUmGq2Ie7o9vfhQMvFos7lO1T0zRlBiwOxAD1edYW%2FuCgJEv7OZfluH7OWtTPF95E1Hy2bNs%2B8U0Uj8fR9JbfREqAnHuHbvAdyjXnJqXcoW%2FcGr890QWtBFlF10Rzc2%2F%2BM6RD9xdAya3tZy%2F%2FfwIMAMwfSVrTb5e6AAAAAElFTkSuQmCC); + border-radius: 50%; + height: 23px; + width: 23px; +} +.direction-toggle-button.two-way { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowREQ2NEVGM0E0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowREQ2NEVGNEE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjBERDY0RUYxQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBERDY0RUYyQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2Ii8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2BbFXFCAAAA8FJREFUeNqMlt9rHFUUx78zszO7mxWz6a62KUlsSBrwwboixRfR0ppWMAZKadX%2BAdKC4ouV%2BhdU1DeFPiSoT%2BJDQZA8CIUWX0sCbSEVTUGaNr%2Fo7uxmZ3azu7M%2FPN%2FbvZNZmrS58N27O%2Becz71z7r3nrtHpdLBbm5qaykl3XvSu6IBoRLQsWhf9JfpVdHu3eGMnuEAnpbtYr9dPVyoVSA%2F6NZtNxGIxGIaBeDyOVCrF%2FnfxvSq6%2Fly4gL8NguBSsVhUUNM0Q%2BnWbrdDcZCBgQHYtv2dmL7aFS7gH6rV6meFQkHBOEvLskIwZ6z9CW61Wupt%2BD2TyaCvr%2B9HMX2ueWYEfIXgfD6voI7jcDbbcuKovpzrfSaiH%2F0Zx3hBXemBC3haUnHZdd0wiAG6N2M2Vg9%2FgpXx83CH31NvE7XrGMaTI8jT0ZlfpIGvrVMRpkTAa%2BMfYyv7OuJ2DMXhk3CHTiib9tNi%2Bsghjx%2FW%2FPx8Thbu%2B3K53DMTDV4fO4fG%2FpwCp737MFJZ1NLj6LRbSFWWw%2FXiWlCNRgOJRGJMOHPWxMTEF57nvc2F0fBe8BtIxh30%2B%2FeRXfwZic4WOv3D8NOvyoI20ec%2F6BmAi8uWTCZdpuX4U1vOtLA6ehY1WcCEY6PfW0L67uyToLVb6C%2FcUc83XzmF%2FOAxlc5ofK1Wo%2Bsk4SPcUuE%2BNkysHDoDL3MEljxL1tbxwu2Z7c3baSHx4CYy%2F%2F6m7PmhSRngndBMDnnSRkncp1%2BFM2jG0%2FBfHJPv4igfyY2Fp491UIHtPVJ2%2BpUGjsjqOSpenwFyCXf1rJmzWM3F6NIvMAXQlt9bg28hGD0OOKntE7pvHO7RL5XdqW4of7Qa4QHr8lTOl7mAevZs8eo6Rv75Cah72HKy8Mc%2BlAFOSFRMgTdzF9AQd8tfU35W4PeUBvKk%2FUf4DdaHaL3gDDjA4L1ZBJUSqvUAm5kcaoNHUXjtU1QD8Ss9xEGxE6x3iZZsRcKvE35NakJYKyjt5MgA%2BxdnUPeLKLcT2Bj%2BAF69iWbxIQ4szkrq%2FNA3Gkseuebc3NyCzPwG97h2iMqurD0ZQN7Ab8iz0iMBz8BoeDv7C4c8gS%2Fo43%2BVVY2j8jBRPQH%2BKob%2BnoXtLqneqJd77DpGV8dufd8uud2qeJnVLXpSn1dyNVwKFrLZLFPyjZi%2FfmY91%2BC9wKmd6vmON5EUn0ulUmnPN1E6nWZdf%2FZNFBng%2Fe4dOq3vUL0TOAjfJnKH%2FtHN8Z97uqAjg7wp3Ucsbt2b%2FyXR4%2B4%2FAO6Ia6Jbu8X%2FL8AAPIZc5jSqbNgAAAAASUVORK5CYII%3D); +} +.binding-item .binding-edit-button { + background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpDQkI4QzVEMTc3ODcxMUUxQTlCOUNDQUJBMEUyMTIwMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpDQkI4QzVEMjc3ODcxMUUxQTlCOUNDQUJBMEUyMTIwMSI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkNCQjhDNUNGNzc4NzExRTFBOUI5Q0NBQkEwRTIxMjAxIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkNCQjhDNUQwNzc4NzExRTFBOUI5Q0NBQkEwRTIxMjAxIi8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2Bs3B0RQAAAd9JREFUeNockbGL2nAUx%2FNLorHaJXKjJ6YcDkVcHByUQwQDbl26FqEu3dykLjoIXXTwDygKFcrRP%2BC8Q0HwQDlwOaRCKFiuCmo0d0Jr1ZjY923ghZfv9%2FN%2B7%2F1eOJ%2FPx%2BEpl8uKZVk3p9PpRlXV81QqdY4cGjww%2F9l2u81Fo1EuFotdbrdbzbbtX%2FP5%2FAqBHBo8MGB5RVF8yWTSv9%2FvXYIgsNVq9XcwGLxCIBdFkcEDA5YZhnFNJwXcbjc3Go32mUzmlsaYYAQ6QGk0GmooFJKoE8fz%2FE9%2BsVjIHo%2FHpes6y2azX8PhsNbtdtMI5NDggQHL0wW%2FdDodfTqdPm02m4dqtfqmXq9LCOTQ4IEBy3u93gdq9YfCplHM2Wz2gsZ7ptggJ%2B0ADwxYRuI1zfqaLvY7l8t9mkwmcqVSeWeapl0oFJqBQOCpVqt9lCTpJWnfWb%2Ffv6fKM2xot9s9FovFz71ez6ST7UQiIZVKpffUzU%2Ffp%2FV6vWLBYPDD8Xi8oJ%2FkarVaKhVatLlHxhgny7KfPCGdTt%2FS945W%2FEPUNO2KNihGIpH44XBI0Tak8Xh8hoJ4PC7RGCZN0BkOh3fEHUV6Gdi50%2BnUqaWxXC6FfD7%2FDQXNZvMtXdZyOBw6IUtw%2FwQYACT6GJDDh744AAAAAElFTkSuQmCC); padding-top: 6px; width: 12px; - height: 100%; margin-left: 10px; + } \ No newline at end of file diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html index a569b8b4..79644a7a 100644 --- a/js/panels/binding/binding-item.reel/binding-item.html +++ b/js/panels/binding/binding-item.reel/binding-item.html @@ -13,7 +13,8 @@ "owner": { "prototype": "js/panels/binding/binding-item.reel", "properties": { - "element": {"#": "binding-item"} + "element": {"#": "binding-item"}, + "directionToggleButton": {"@": "directionToggleButton" } } }, "soProperty": { @@ -64,6 +65,19 @@ "listener": {"@": "owner"} }] + }, + "directionToggleButton": { + "prototype": "montage/ui/button.reel", + "properties": { + "element": {"#": "direction-toggle-button"}, + "identifier": "directionToggleButton", + "label": " " + }, + "listeners": [{ + "type": "action", + "listener": {"@": "owner"} + }] + } } @@ -75,6 +89,7 @@ +
    diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index bda62ef3..0fc06ea8 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -74,6 +74,16 @@ exports.BindingItem = Montage.create(Component, { } }, + /* -------------- Events -------------- */ + + handleDirectionToggleButtonAction : { + value: function(e) { + this.oneway = !this.oneway; + } + }, + + /* -------------- Component Draw Cycle -------------- */ + templateDidLoad : { value: function() { console.log("loaded binding item"); @@ -84,5 +94,15 @@ exports.BindingItem = Montage.create(Component, { value: function() { console.log("preparing to draw binding item"); } + }, + + draw : { + value: function() { + if(this.oneway) { + this.directionToggleButton.element.classList.remove('two-way'); + } else { + this.directionToggleButton.element.classList.add('two-way'); + } + } } }); \ No newline at end of file -- cgit v1.2.3 From ee8c759d9ecae02e4d0bbeb6cf52ee2745666d99 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Sat, 2 Jun 2012 20:54:11 -0700 Subject: Binding Panel - Button CSS --- js/panels/binding/binding-item.reel/binding-item.css | 12 ++++++++++++ 1 file changed, 12 insertions(+) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.css b/js/panels/binding/binding-item.reel/binding-item.css index 3dc1294c..63fd3605 100644 --- a/js/panels/binding/binding-item.reel/binding-item.css +++ b/js/panels/binding/binding-item.reel/binding-item.css @@ -56,6 +56,18 @@ height: 23px; width: 23px; } +.direction-toggle-button:hover { + box-shadow: inset 0 0 6px rgba(255,255,255, 0.15); + -webkit-transform: scale(1); + opacity: 1; +} +.direction-toggle-button:focus { + box-shadow: inset 0 0 6px rgba(255,255,255, 0.15); +} +.direction-toggle-button:active { + -webkit-transform: scale(.85); + box-shadow: inset 0 0 6px rgba(0,0,0, 0.15); +} .direction-toggle-button.two-way { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAAXCAYAAADgKtSgAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowREQ2NEVGM0E0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowREQ2NEVGNEE0M0IxMUUxQTkwQ0M2Qzc0NjQ4NTRBNiI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjBERDY0RUYxQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjBERDY0RUYyQTQzQjExRTFBOTBDQzZDNzQ2NDg1NEE2Ii8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2BbFXFCAAAA8FJREFUeNqMlt9rHFUUx78zszO7mxWz6a62KUlsSBrwwboixRfR0ppWMAZKadX%2BAdKC4ouV%2BhdU1DeFPiSoT%2BJDQZA8CIUWX0sCbSEVTUGaNr%2Fo7uxmZ3azu7M%2FPN%2FbvZNZmrS58N27O%2Becz71z7r3nrtHpdLBbm5qaykl3XvSu6IBoRLQsWhf9JfpVdHu3eGMnuEAnpbtYr9dPVyoVSA%2F6NZtNxGIxGIaBeDyOVCrF%2FnfxvSq6%2Fly4gL8NguBSsVhUUNM0Q%2BnWbrdDcZCBgQHYtv2dmL7aFS7gH6rV6meFQkHBOEvLskIwZ6z9CW61Wupt%2BD2TyaCvr%2B9HMX2ueWYEfIXgfD6voI7jcDbbcuKovpzrfSaiH%2F0Zx3hBXemBC3haUnHZdd0wiAG6N2M2Vg9%2FgpXx83CH31NvE7XrGMaTI8jT0ZlfpIGvrVMRpkTAa%2BMfYyv7OuJ2DMXhk3CHTiib9tNi%2Bsghjx%2FW%2FPx8Thbu%2B3K53DMTDV4fO4fG%2FpwCp737MFJZ1NLj6LRbSFWWw%2FXiWlCNRgOJRGJMOHPWxMTEF57nvc2F0fBe8BtIxh30%2B%2FeRXfwZic4WOv3D8NOvyoI20ec%2F6BmAi8uWTCZdpuX4U1vOtLA6ehY1WcCEY6PfW0L67uyToLVb6C%2FcUc83XzmF%2FOAxlc5ofK1Wo%2Bsk4SPcUuE%2BNkysHDoDL3MEljxL1tbxwu2Z7c3baSHx4CYy%2F%2F6m7PmhSRngndBMDnnSRkncp1%2BFM2jG0%2FBfHJPv4igfyY2Fp491UIHtPVJ2%2BpUGjsjqOSpenwFyCXf1rJmzWM3F6NIvMAXQlt9bg28hGD0OOKntE7pvHO7RL5XdqW4of7Qa4QHr8lTOl7mAevZs8eo6Rv75Cah72HKy8Mc%2BlAFOSFRMgTdzF9AQd8tfU35W4PeUBvKk%2FUf4DdaHaL3gDDjA4L1ZBJUSqvUAm5kcaoNHUXjtU1QD8Ss9xEGxE6x3iZZsRcKvE35NakJYKyjt5MgA%2BxdnUPeLKLcT2Bj%2BAF69iWbxIQ4szkrq%2FNA3Gkseuebc3NyCzPwG97h2iMqurD0ZQN7Ab8iz0iMBz8BoeDv7C4c8gS%2Fo43%2BVVY2j8jBRPQH%2BKob%2BnoXtLqneqJd77DpGV8dufd8uud2qeJnVLXpSn1dyNVwKFrLZLFPyjZi%2FfmY91%2BC9wKmd6vmON5EUn0ulUmnPN1E6nWZdf%2FZNFBng%2Fe4dOq3vUL0TOAjfJnKH%2FtHN8Z97uqAjg7wp3Ucsbt2b%2FyXR4%2B4%2FAO6Ia6Jbu8X%2FL8AAPIZc5jSqbNgAAAAASUVORK5CYII%3D); } -- cgit v1.2.3 From a5387d3cc74350dd06ecab2c8524d63d7540e57f Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 4 Jun 2012 16:37:09 -0700 Subject: Binding Panel - Add edit view --- js/panels/binding/binding-item.reel/binding-item.html | 1 + js/panels/binding/binding-item.reel/binding-item.js | 6 ++++++ 2 files changed, 7 insertions(+) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html index 79644a7a..95a349f8 100644 --- a/js/panels/binding/binding-item.reel/binding-item.html +++ b/js/panels/binding/binding-item.reel/binding-item.html @@ -14,6 +14,7 @@ "prototype": "js/panels/binding/binding-item.reel", "properties": { "element": {"#": "binding-item"}, + "editButton": {"@": "editButton" }, "directionToggleButton": {"@": "directionToggleButton" } } }, diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index 0fc06ea8..294e8d35 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -82,6 +82,12 @@ exports.BindingItem = Montage.create(Component, { } }, + handleEditButtonAction : { + value: function(e) { + this.parentComponent.parentComponent.displayEditView(); + } + }, + /* -------------- Component Draw Cycle -------------- */ templateDidLoad : { -- cgit v1.2.3 From 9274b3959384d21809c992f6f2e7860eb1682e06 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 5 Jun 2012 12:08:32 -0700 Subject: Binding Panel - Add getPropertyList and fix null currentObject --- js/panels/binding/binding-item.reel/binding-item.js | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index 294e8d35..55230fc3 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -20,8 +20,10 @@ exports.BindingItem = Montage.create(Component, { set: function(value) { if(value === this._sourceObject) { return; } - this.sourceObjectLabel = value.identifier; - + if(value && value.identifier) { + this.sourceObjectLabel = value.identifier; + } + this._sourceObject = value; } }, @@ -33,7 +35,9 @@ exports.BindingItem = Montage.create(Component, { set: function(value) { if(value === this._boundObject) { return; } - this.boundObjectLabel = value.identifier; + if(value && value.identifier) { + this.boundObjectLabel = value.identifier; + } this._boundObject = value; } -- cgit v1.2.3 From af1c0007fffa3e9db6d11949a9ddec4bd697ee69 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 8 Jun 2012 15:57:57 -0700 Subject: Binding Panel - supply binding args to edit view --- js/panels/binding/binding-item.reel/binding-item.js | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index 55230fc3..a2b66008 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, { sourceObjectLabel : { value: null }, boundObjectLabel : { value: null }, + bindingArgs : { + value: null + }, + _sourceObject : { value: null }, sourceObject : { get: function() { @@ -88,7 +92,7 @@ exports.BindingItem = Montage.create(Component, { handleEditButtonAction : { value: function(e) { - this.parentComponent.parentComponent.displayEditView(); + this.parentComponent.parentComponent.displayEditView(this.bindingArgs); } }, -- cgit v1.2.3 From 9fe73eaccdd7e3d82bb4cd5326f126ee683a2d25 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Sun, 10 Jun 2012 17:22:01 -0700 Subject: Binding Panel - Direction toggle changes are savable. --- js/panels/binding/binding-item.reel/binding-item.js | 6 ++++++ 1 file changed, 6 insertions(+) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index a2b66008..2dad2aaf 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -77,7 +77,9 @@ exports.BindingItem = Montage.create(Component, { }, set: function(value) { if(value === this._oneway) { return; } + this._oneway = value; + this.needsDraw = true; } }, @@ -87,6 +89,10 @@ exports.BindingItem = Montage.create(Component, { handleDirectionToggleButtonAction : { value: function(e) { this.oneway = !this.oneway; + this.application.ninja.objectsController.editBinding(this.bindingArgs, { + oneway: !this.bindingArgs.oneway + }); + this.application.ninja.objectsController. } }, -- cgit v1.2.3 From 7b5b65fc9183026633d97c310cbe6500082be8dd Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 11 Jun 2012 07:17:11 -0700 Subject: Binding Item - Direction Toggle button calls controller --- js/panels/binding/binding-item.reel/binding-item.js | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index 2dad2aaf..a1017020 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -88,11 +88,13 @@ exports.BindingItem = Montage.create(Component, { handleDirectionToggleButtonAction : { value: function(e) { + var controller = this.application.ninja.objectsController; + this.oneway = !this.oneway; - this.application.ninja.objectsController.editBinding(this.bindingArgs, { + controller.editBinding(this.bindingArgs, { oneway: !this.bindingArgs.oneway }); - this.application.ninja.objectsController. + controller.currentItem = controller.currentItem; } }, -- cgit v1.2.3 From 18768295f0612b304ddc386752adcbf89be65ced Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Wed, 20 Jun 2012 20:13:18 -0700 Subject: Binding Panel - Fixed Panel Button Signed-off-by: Armen Kesablyan --- js/panels/binding/binding-item.reel/binding-item.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.html b/js/panels/binding/binding-item.reel/binding-item.html index 95a349f8..26901f85 100644 --- a/js/panels/binding/binding-item.reel/binding-item.html +++ b/js/panels/binding/binding-item.reel/binding-item.html @@ -55,7 +55,7 @@ } }, "editButton": { - "prototype": "montage/ui/button.reel", + "prototype": "montage/ui/native/button.reel", "properties": { "element": {"#": "edit-button"}, "identifier": "editButton", @@ -68,7 +68,7 @@ }, "directionToggleButton": { - "prototype": "montage/ui/button.reel", + "prototype": "montage/ui/native/button.reel", "properties": { "element": {"#": "direction-toggle-button"}, "identifier": "directionToggleButton", -- cgit v1.2.3 From 24c6741d594b9d4167cd4de407a625eb43ebe7cc Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Sat, 23 Jun 2012 13:58:16 -0700 Subject: Binding View: Fixed If Selected Div Erroring Out Signed-off-by: Armen Kesablyan --- js/panels/binding/binding-item.reel/binding-item.js | 12 ------------ 1 file changed, 12 deletions(-) (limited to 'js/panels/binding/binding-item.reel') diff --git a/js/panels/binding/binding-item.reel/binding-item.js b/js/panels/binding/binding-item.reel/binding-item.js index a1017020..adc6320c 100644 --- a/js/panels/binding/binding-item.reel/binding-item.js +++ b/js/panels/binding/binding-item.reel/binding-item.js @@ -106,18 +106,6 @@ exports.BindingItem = Montage.create(Component, { /* -------------- Component Draw Cycle -------------- */ - templateDidLoad : { - value: function() { - console.log("loaded binding item"); - } - }, - - prepareForDraw: { - value: function() { - console.log("preparing to draw binding item"); - } - }, - draw : { value: function() { if(this.oneway) { -- cgit v1.2.3