From 67a47e519fcf5d6ebd701aee09efd5e32c0aa208 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Tue, 26 Jun 2012 15:15:59 -0700 Subject: Binding Hud Not rendering at correct x and y Signed-off-by: Armen Kesablyan --- .../binding-view.reel/binding-hud.reel/binding-hud.js | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) (limited to 'js/stage/binding-view.reel/binding-hud.reel/binding-hud.js') diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js index 9918b06d..85e4b87b 100755 --- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js @@ -73,12 +73,7 @@ exports.BindingHud = Montage.create(Component, { this.title = icon.name; this.x = iconOffsets.x; this.y = iconOffsets.y - 80; - } else { - this.title = val.identifier; - this.x = val.element.offsetLeft; - this.y = val.element.offsetTop; } - this.needsDraw = true; } @@ -202,6 +197,12 @@ exports.BindingHud = Montage.create(Component, { this.scrollUp.style.display = "block"; this.scrollDown.style.display = "block"; } + var isOffStage = this.application.ninja.objectsController.isOffStageObject(this.userComponent); + if(!isOffStage) { + this.title = this.userComponent.identifier; + this.x = this.userComponent.element.offsetLeft; + this.y = this.userComponent.element.offsetTop; + } } }, @@ -289,6 +290,12 @@ exports.BindingHud = Montage.create(Component, { } }, + willDraw: { + value: function() { + + } + }, + draw: { value: function() { this.titleElement.innerHTML = this.title; -- cgit v1.2.3 From 8cd463b321d082770a4300756b6664bb7a519c93 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 27 Jun 2012 10:30:12 -0700 Subject: Binding HUD - Show promoted PI properties at top of list --- .../binding-hud.reel/binding-hud.js | 46 +++++++++++++++++++--- 1 file changed, 40 insertions(+), 6 deletions(-) (limited to 'js/stage/binding-view.reel/binding-hud.reel/binding-hud.js') diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js index 9918b06d..0f1b99c9 100755 --- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js @@ -45,7 +45,10 @@ exports.BindingHud = Montage.create(Component, { optionsRepeater: { value: null }, - + panelData : { + value: null, + serializable: true + }, _userComponent: { value: null }, userComponent: { get: function() { @@ -59,7 +62,7 @@ exports.BindingHud = Montage.create(Component, { isOffStage, icon, iconOffsets; this._userComponent = val; - this.properties = controller.getPropertiesFromObject(val, true); + this.properties = this.getPropertyList(val); //controller.getPropertiesFromObject(val, true); controller.getObjectBindings(this.userComponent).forEach(function(obj) { this.boundProperties.push(obj.sourceObjectPropertyPath); @@ -84,6 +87,37 @@ exports.BindingHud = Montage.create(Component, { } }, + getPropertyList : { + value: function(component) { + var props = this.application.ninja.objectsController.getPropertiesFromObject(component, true); + + var objectName, promotedProperties; + + if(this.userComponent._montage_metadata) { + objectName = this.userComponent._montage_metadata.objectName; + + if(this.panelData && this.panelData[objectName + 'Pi']) { + + promotedProperties = this.panelData[objectName + 'Pi'][0].Section.map(function(item) { + return item[0].prop; + }); + + //// Remove promoted properties from current position in array + props = props.filter(function(prop) { + return promotedProperties.indexOf(prop) === -1; + }); + + //// Add them at the top + + props = promotedProperties.concat(props); + + } + } + + return props; + } + }, + properties: { value: [] }, _isResizing: { @@ -248,11 +282,11 @@ exports.BindingHud = Montage.create(Component, { if(direction === "down") { this.scrollInterval = setInterval(function() { this.optionsRepeater.element.scrollTop += 3; - }.bind(this), 50); + }.bind(this), 20); } else { this.scrollInterval = setInterval(function() { this.optionsRepeater.element.scrollTop -= 3; - }.bind(this), 50); + }.bind(this), 20); } } } @@ -267,11 +301,11 @@ exports.BindingHud = Montage.create(Component, { //e._event.target.parentElement.controller.currentScrollDirection = "down"; this.scrollInterval = setInterval(function() { self.optionsRepeater.element.scrollTop += 3; - }, 50); + }, 20); } else { this.scrollInterval = setInterval(function() { self.optionsRepeater.element.scrollTop -= 3; - }, 50); + }, 20); } } } -- cgit v1.2.3 From e1f83a2c603bf9ddb74889f7ba5b697bb474edaa Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Thu, 28 Jun 2012 11:00:18 -0700 Subject: Binding HUD - Updated CSS for hud and promoted/bound properties. --- .../binding-view.reel/binding-hud.reel/binding-hud.js | 16 ++++++++++++---- 1 file changed, 12 insertions(+), 4 deletions(-) (limited to 'js/stage/binding-view.reel/binding-hud.reel/binding-hud.js') diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js index 0f1b99c9..a62fe78d 100755 --- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js @@ -89,9 +89,17 @@ exports.BindingHud = Montage.create(Component, { getPropertyList : { value: function(component) { - var props = this.application.ninja.objectsController.getPropertiesFromObject(component, true); - - var objectName, promotedProperties; + var props = this.application.ninja.objectsController.getPropertiesFromObject(component, true), + promotedProperties = [], + objectName; + + ///// Mapper - property to property object + function propertyMapper(property) { + return { + property: property, + promoted: promotedProperties.indexOf(property) !== -1 + } + } if(this.userComponent._montage_metadata) { objectName = this.userComponent._montage_metadata.objectName; @@ -114,7 +122,7 @@ exports.BindingHud = Montage.create(Component, { } } - return props; + return props.map(propertyMapper); } }, -- cgit v1.2.3 From 9add37d85a9d90541daae8ad5316388c4d9a9da4 Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Thu, 28 Jun 2012 13:21:11 -0700 Subject: Binding View - Bug fix After save corrupts doom and breaks binding view Signed-off-by: Armen Kesablyan --- .../binding-hud.reel/binding-hud.js | 70 ++++++++++------------ 1 file changed, 32 insertions(+), 38 deletions(-) (limited to 'js/stage/binding-view.reel/binding-hud.reel/binding-hud.js') diff --git a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js index 6b802cb0..58cf197f 100755 --- a/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js +++ b/js/stage/binding-view.reel/binding-hud.reel/binding-hud.js @@ -10,6 +10,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot */ var Montage = require("montage/core/core").Montage, Component = require("montage/ui/component").Component; +var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; exports.BindingHud = Montage.create(Component, { scrollUp: { @@ -49,10 +50,10 @@ exports.BindingHud = Montage.create(Component, { value: null, serializable: true }, - _userComponent: { value: null }, - userComponent: { + _userElement: { value: null }, + userElement: { get: function() { - return this._userComponent; + return this._userElement; }, set: function(val) { if(!val) { return; } @@ -61,14 +62,14 @@ exports.BindingHud = Montage.create(Component, { bindingView = this.parentComponent.parentComponent, isOffStage, icon, iconOffsets; - this._userComponent = val; - this.properties = this.getPropertyList(val); //controller.getPropertiesFromObject(val, true); + this._userElement = val; + this.properties = this.getPropertyList(val.controller); //controller.getPropertiesFromObject(val, true); - controller.getObjectBindings(this.userComponent).forEach(function(obj) { + controller.getObjectBindings(this._userElement.controller).forEach(function(obj) { this.boundProperties.push(obj.sourceObjectPropertyPath); }, this); - isOffStage = controller.isOffStageObject(val); + isOffStage = controller.isOffStageObject(val.controller); if(isOffStage) { icon = bindingView.getOffStageIcon(val); @@ -76,9 +77,14 @@ exports.BindingHud = Montage.create(Component, { this.title = icon.name; this.x = iconOffsets.x; this.y = iconOffsets.y - 80; + } else { + this.title = this._userElement.controller.identifier; + this.x = this._userElement.offsetLeft; + this.y = this._userElement.offsetTop; +// this.x = parseInt(ElementsMediator.getProperty(val, "left")); +// this.y = parseInt(ElementsMediator.getProperty(val, "top")); } this.needsDraw = true; - } }, @@ -88,8 +94,8 @@ exports.BindingHud = Montage.create(Component, { var objectName, promotedProperties; - if(this.userComponent._montage_metadata) { - objectName = this.userComponent._montage_metadata.objectName; + if(this.userElement.controller._montage_metadata) { + objectName = this.userElement.controller._montage_metadata.objectName; if(this.panelData && this.panelData[objectName + 'Pi']) { @@ -231,12 +237,6 @@ exports.BindingHud = Montage.create(Component, { this.scrollUp.style.display = "block"; this.scrollDown.style.display = "block"; } - var isOffStage = this.application.ninja.objectsController.isOffStageObject(this.userComponent); - if(!isOffStage) { - this.title = this.userComponent.identifier; - this.x = this.userComponent.element.offsetLeft; - this.y = this.userComponent.element.offsetTop; - } } }, @@ -295,22 +295,17 @@ exports.BindingHud = Montage.create(Component, { handleMouseover: { value: function(e) { + if(this.scrollSpace < this.properties.length) { if (this.scrollInterval === null) { if (e._event.target.classList.contains("scrollAreaBottom")) { - self = e._event.target.parentElement.controller; - //e._event.target.parentElement.controller.currentScrollDirection = "down"; - this.scrollInterval = setInterval(function() { - self.optionsRepeater.element.scrollTop += 3; - }, 20); + this.currentScrollDirection = "down"; } else { - this.scrollInterval = setInterval(function() { - self.optionsRepeater.element.scrollTop -= 3; - }, 20); + this.currentScrollDirection = "up"; } } } - //this.needsDraw = true; + this.needsDraw = true; } }, @@ -324,25 +319,24 @@ exports.BindingHud = Montage.create(Component, { } }, - willDraw: { + draw: { value: function() { - } - }, + if(this.currentScrollDirection !== null) { + this.scrollInterval = setInterval(function() { + if(this.currentScrollDirection === "down") { + this.optionsRepeater.element.scrollTop += 3; + } else { + this.optionsRepeater.element.scrollTop -= 3; + } + }.bind(this), 20); + } else { + clearInterval(this.scrollInterval); + } - draw: { - value: function() { this.titleElement.innerHTML = this.title; this.element.style.top = (this.y + this._resizedY) + "px"; this.element.style.left = (this.x + this._resizedX) + "px"; - -// if(this.currentScrollDirection !== null) { -// if(this.currentScrollDirection === "up") { -// this.optionsRepeater.element.scrollTop -= 18; -// } else { -// this.optionsRepeater.element.scrollTop += 18; -// } -// } } }, didDraw: { -- cgit v1.2.3