From 336e0e0ef242f5c472757fe3bbcdd54c04a00f1f Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Mon, 14 May 2012 10:32:59 -0700 Subject: Workspace: has customized Signed-off-by: Armen Kesablyan --- js/panels/binding-panel.reel/binding-panel.css | 0 js/panels/binding-panel.reel/binding-panel.html | 28 +++++++++++++++++++++++++ js/panels/binding-panel.reel/binding-panel.js | 12 +++++++++++ 3 files changed, 40 insertions(+) create mode 100644 js/panels/binding-panel.reel/binding-panel.css create mode 100644 js/panels/binding-panel.reel/binding-panel.html create mode 100644 js/panels/binding-panel.reel/binding-panel.js (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css new file mode 100644 index 00000000..e69de29b diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html new file mode 100644 index 00000000..0db7b95f --- /dev/null +++ b/js/panels/binding-panel.reel/binding-panel.html @@ -0,0 +1,28 @@ + + + + + + + + + +
+ this is a test +
+ + \ No newline at end of file diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js new file mode 100644 index 00000000..03fe5723 --- /dev/null +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -0,0 +1,12 @@ +var Montage = require("montage/core/core").Montage, + Component = require("montage/ui/component").Component; + + +exports.BindingPanel = Montage.create(Component, { + + prepareForDraw: { + value: function() { + console.log("test- objects"); + } + } +}); \ No newline at end of file -- cgit v1.2.3 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. --- js/panels/binding-panel.reel/binding-panel.css | 11 +++++++++++ js/panels/binding-panel.reel/binding-panel.html | 26 ++++++++++++++++++++++++- js/panels/binding-panel.reel/binding-panel.js | 14 +++++++++++++ 3 files changed, 50 insertions(+), 1 deletion(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index e69de29b..8597a926 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css @@ -0,0 +1,11 @@ +/* + 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. + */ + + +.bindings-list { + padding: 0; + margin: 0; +} \ No newline at end of file diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index 0db7b95f..d2e18e99 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html @@ -15,6 +15,28 @@ "properties": { "element": {"#": "binding"} } + }, + "arrayController": { + "prototype": "montage/ui/controller/array-controller", + "bindings": { + "content" : {"<-": "@owner.bindings" } + } + }, + "repetition": { + "prototype": "montage/ui/repetition.reel", + "properties": { + "element": {"#": "bindings-list"}, + "contentController": {"@": "arrayController"} + } + }, + "bindingItem": { + "prototype": "js/panels/binding/binding-item.reel", + "properties": { + "element": {"#": "binding-item"} + }, + "bindings": { + "sourceObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.sourceObjectPropertyPath"} + } } } @@ -22,7 +44,9 @@
- this is a test +
\ No newline at end of file diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index 03fe5723..9fdec416 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -4,6 +4,20 @@ var Montage = require("montage/core/core").Montage, exports.BindingPanel = Montage.create(Component, { + bindings : { + value: null + }, + + templateDidLoad : { + value: function() { + Object.defineBinding(this, 'bindings', { + boundObject: this.application.ninja.objectsController, + boundObjectPropertyPath: "currentObjectBindings", + oneway: true + }); + } + }, + prepareForDraw: { value: function() { console.log("test- objects"); -- 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 --- js/panels/binding-panel.reel/binding-panel.css | 2 +- js/panels/binding-panel.reel/binding-panel.html | 6 +++++- 2 files changed, 6 insertions(+), 2 deletions(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index 8597a926..f29b66c1 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css @@ -8,4 +8,4 @@ .bindings-list { padding: 0; margin: 0; -} \ No newline at end of file +} diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index d2e18e99..2850b67c 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html @@ -35,7 +35,11 @@ "element": {"#": "binding-item"} }, "bindings": { - "sourceObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.sourceObjectPropertyPath"} + "sourceObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.sourceObjectPropertyPath"}, + "sourceObject": {"<-": "@repetition.objectAtCurrentIteration.sourceObject"}, + "boundObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.boundObjectPropertyPath"}, + "boundObject": {"<-": "@repetition.objectAtCurrentIteration.boundObject"}, + "oneway": {"<-": "@repetition.objectAtCurrentIteration.oneway"} } } -- 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-panel.reel/binding-panel.css | 4 +++ js/panels/binding-panel.reel/binding-panel.html | 12 +++++-- js/panels/binding-panel.reel/binding-panel.js | 44 +++++++++++++++++++++++-- 3 files changed, 55 insertions(+), 5 deletions(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index f29b66c1..e3dcf140 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css @@ -4,6 +4,10 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ +.binding-panel { + position: relative; + height: 100%; +} .bindings-list { padding: 0; diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index 2850b67c..a926da8d 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html @@ -13,7 +13,8 @@ "owner": { "prototype": "js/panels/binding-panel.reel", "properties": { - "element": {"#": "binding"} + "element": {"#": "binding"}, + "editView": {"@": "editBinding"} } }, "arrayController": { @@ -41,16 +42,23 @@ "boundObject": {"<-": "@repetition.objectAtCurrentIteration.boundObject"}, "oneway": {"<-": "@repetition.objectAtCurrentIteration.oneway"} } + }, + "editBinding": { + "prototype": "js/panels/binding/edit-binding-view.reel", + "properties": { + "element": {"#": "edit-binding-view" } + } } } -
+
+
\ No newline at end of file diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index 9fdec416..c2ce556c 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -4,10 +4,34 @@ var Montage = require("montage/core/core").Montage, exports.BindingPanel = Montage.create(Component, { - bindings : { + bindings : { value: null }, + editView : { value: null }, + editingClass : { value: 'editing-binding' }, + _editing: { value: null }, + editing: { + get: function() { + return this._editing; + }, + set: function(value) { + if(value === this._editing) { return; } + this._editing = value; + this.needsDraw = true; + } + }, + _translateDistance : { value: null }, + displayEditView : { + value: function(bindingArgs) { + this.editing = true; + } + }, + + /* ------------------------- + Draw Cycle + ------------------------- */ + templateDidLoad : { value: function() { Object.defineBinding(this, 'bindings', { @@ -18,9 +42,23 @@ exports.BindingPanel = Montage.create(Component, { } }, - prepareForDraw: { + willDraw: { value: function() { - console.log("test- objects"); + if(this.editing) { + this._translateDistance = this.element.offsetWidth; + } + } + }, + + draw : { + value: function() { + var transStr = '-webkit-transform'; + + if(this.editing) { + this.editView.element.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)'); + } else { + this.editView.element.style.removeProperty(transStr); + } } } }); \ No newline at end of file -- cgit v1.2.3 From 99f14c2998760a0d871745d41c6e3419c8137d91 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Fri, 8 Jun 2012 15:57:37 -0700 Subject: Binding Panel - Add toolbar --- js/panels/binding-panel.reel/binding-panel.css | 6 ++++++ js/panels/binding-panel.reel/binding-panel.html | 18 +++++++++++++++++- js/panels/binding-panel.reel/binding-panel.js | 1 + 3 files changed, 24 insertions(+), 1 deletion(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index e3dcf140..97b6ac91 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css @@ -7,9 +7,15 @@ .binding-panel { position: relative; height: 100%; + display: -webkit-box; + -webkit-box-orient: vertical; } .bindings-list { + -webkit-box-flex: 1; padding: 0; margin: 0; } +.binding-panel-toolbar-container { + -webkit-box-flex: 0; +} diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index a926da8d..9a2834c7 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html @@ -36,6 +36,7 @@ "element": {"#": "binding-item"} }, "bindings": { + "bindingArgs": {"<-": "@repetition.objectAtCurrentIteration"}, "sourceObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.sourceObjectPropertyPath"}, "sourceObject": {"<-": "@repetition.objectAtCurrentIteration.sourceObject"}, "boundObjectPropertyPath": {"<-": "@repetition.objectAtCurrentIteration.boundObjectPropertyPath"}, @@ -48,8 +49,20 @@ "properties": { "element": {"#": "edit-binding-view" } } + }, + "toolbar": { + "prototype": "js/components/toolbar.reel", + "properties": { + "element": {"#": "binding-panel-toolbar"}, + "delegate": {"@": "owner" }, + "buttons": [ + { + "title": "Add", + "identifier": "add" + } + ] + } } - } @@ -58,6 +71,9 @@ +
+
+
diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index c2ce556c..3b20a88f 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -24,6 +24,7 @@ exports.BindingPanel = Montage.create(Component, { displayEditView : { value: function(bindingArgs) { + this.editView.bindingArgs = bindingArgs; this.editing = true; } }, -- cgit v1.2.3 From 307a55d74e1ecd448ec1c5f8073dd7cd81be961f Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Sun, 10 Jun 2012 16:34:14 -0700 Subject: Binding Panel Toolbar - Add action handler --- js/panels/binding-panel.reel/binding-panel.js | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index 3b20a88f..0641ecf5 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -6,7 +6,6 @@ exports.BindingPanel = Montage.create(Component, { bindings : { value: null }, editView : { value: null }, - editingClass : { value: 'editing-binding' }, _editing: { value: null }, editing: { get: function() { @@ -30,9 +29,21 @@ exports.BindingPanel = Montage.create(Component, { }, /* ------------------------- - Draw Cycle + Toolbar Button Actions ------------------------- */ + handleAddAction : { + value: function(e) { + var newBindingArgs = { + sourceObject : this.application.ninja.objectsController.currentObject + }; + + this.displayEditView(newBindingArgs); + } + }, + + + templateDidLoad : { value: function() { Object.defineBinding(this, 'bindings', { @@ -57,8 +68,10 @@ exports.BindingPanel = Montage.create(Component, { if(this.editing) { this.editView.element.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)'); + this.editView.element.style.setProperty('box-shadow', '0 0 10px rgba(0,0,0,0.2)') } else { this.editView.element.style.removeProperty(transStr); + this.editView.element.style.removeProperty('box-shadow'); } } } -- cgit v1.2.3 From dbb36888eda1f25387852ea79aef89d22dfd7799 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 11 Jun 2012 07:20:04 -0700 Subject: Binding Panel - fix scrollbar issue with abs positioned edit view. --- js/panels/binding-panel.reel/binding-panel.css | 1 + 1 file changed, 1 insertion(+) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index 97b6ac91..a1d5be0f 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css @@ -8,6 +8,7 @@ position: relative; height: 100%; display: -webkit-box; + overflow: hidden; -webkit-box-orient: vertical; } -- cgit v1.2.3 From d57ab6509805ba4e97d6c74be913a2c1b324af3a Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 13 Jun 2012 11:30:37 -0700 Subject: Binding Panel - Dock the edit view when transition ends so horizontal resizing works --- js/panels/binding-panel.reel/binding-panel.css | 5 +++ js/panels/binding-panel.reel/binding-panel.js | 56 +++++++++++++++++++++++--- 2 files changed, 55 insertions(+), 6 deletions(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.css b/js/panels/binding-panel.reel/binding-panel.css index a1d5be0f..787cf114 100644 --- a/js/panels/binding-panel.reel/binding-panel.css +++ b/js/panels/binding-panel.reel/binding-panel.css @@ -20,3 +20,8 @@ .binding-panel-toolbar-container { -webkit-box-flex: 0; } + +.binding-panel .edit-view-docked { + left: 0; + -webkit-transition-duration: 0; +} \ No newline at end of file diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index 0641ecf5..45fa4005 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -6,6 +6,19 @@ exports.BindingPanel = Montage.create(Component, { bindings : { value: null }, editView : { value: null }, + + _dockEditView : { value: null }, + dockEditView : { + get : function() { return this._dockEditView; }, + set : function(value) { + if(value === this._dockEditView) { return; } + + this._dockEditView = value; + + this.needsDraw = true; + } + }, + _editing: { value: null }, editing: { get: function() { @@ -14,6 +27,11 @@ exports.BindingPanel = Montage.create(Component, { set: function(value) { if(value === this._editing) { return; } this._editing = value; + + if(!value) { + this.dockEditView = false; + } + this.needsDraw = true; } }, @@ -28,6 +46,18 @@ exports.BindingPanel = Montage.create(Component, { } }, + /* ------------------------- + Event handlers + ------------------------- */ + + handleWebkitTransitionEnd : { + value: function(e) { + console.log("trans end"); + + this.dockEditView = this.editing; + } + }, + /* ------------------------- Toolbar Button Actions ------------------------- */ @@ -54,8 +84,16 @@ exports.BindingPanel = Montage.create(Component, { } }, + prepareForDraw : { + value: function() { + + } + }, + willDraw: { value: function() { + this.editView.element.addEventListener('webkitTransitionEnd', this, false); + if(this.editing) { this._translateDistance = this.element.offsetWidth; } @@ -64,15 +102,21 @@ exports.BindingPanel = Montage.create(Component, { draw : { value: function() { - var transStr = '-webkit-transform'; + var transStr = '-webkit-transform', + editViewEl = this.editView.element; - if(this.editing) { - this.editView.element.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)'); - this.editView.element.style.setProperty('box-shadow', '0 0 10px rgba(0,0,0,0.2)') + if(this.dockEditView) { + editViewEl.classList.add('edit-view-docked'); + editViewEl.style.removeProperty(transStr); } else { - this.editView.element.style.removeProperty(transStr); - this.editView.element.style.removeProperty('box-shadow'); + editViewEl.classList.remove('edit-view-docked'); + if(this.editing) { + editViewEl.style.setProperty(transStr, 'translate3d(-'+ this._translateDistance + 'px,0,0)'); + } else { + editViewEl.style.removeProperty(transStr); + } } + } } }); \ No newline at end of file -- cgit v1.2.3 From 054d08a26e91c3ac0d15d3506002a50b30d345ce Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 18 Jun 2012 18:57:15 -0700 Subject: Binding panel - Minor change on add button handler --- js/panels/binding-panel.reel/binding-panel.html | 2 +- js/panels/binding-panel.reel/binding-panel.js | 12 ++++++++---- 2 files changed, 9 insertions(+), 5 deletions(-) (limited to 'js/panels/binding-panel.reel') diff --git a/js/panels/binding-panel.reel/binding-panel.html b/js/panels/binding-panel.reel/binding-panel.html index 9a2834c7..fc80cd6e 100644 --- a/js/panels/binding-panel.reel/binding-panel.html +++ b/js/panels/binding-panel.reel/binding-panel.html @@ -74,7 +74,7 @@
-
+
\ No newline at end of file diff --git a/js/panels/binding-panel.reel/binding-panel.js b/js/panels/binding-panel.reel/binding-panel.js index 45fa4005..c040c009 100644 --- a/js/panels/binding-panel.reel/binding-panel.js +++ b/js/panels/binding-panel.reel/binding-panel.js @@ -64,11 +64,15 @@ exports.BindingPanel = Montage.create(Component, { handleAddAction : { value: function(e) { - var newBindingArgs = { - sourceObject : this.application.ninja.objectsController.currentObject - }; + var sourceObject = this.application.ninja.objectsController.currentObject; - this.displayEditView(newBindingArgs); + if(sourceObject) { + this.displayEditView({ + sourceObject: sourceObject + }); + } else { + this.displayEditView(); + } } }, -- cgit v1.2.3