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