From 72efb92273d20757097b18326fb31d070a6d693d Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 19 Jun 2012 15:55:17 -0700 Subject: Objects Tray - Show only "off stage" objects --- js/stage/objects-tray.reel/objects-tray.html | 3 ++- js/stage/objects-tray.reel/objects-tray.js | 32 +++++++++++++++++++++++++++- 2 files changed, 33 insertions(+), 2 deletions(-) (limited to 'js/stage') diff --git a/js/stage/objects-tray.reel/objects-tray.html b/js/stage/objects-tray.reel/objects-tray.html index 0fece3fe..710e3edf 100644 --- a/js/stage/objects-tray.reel/objects-tray.html +++ b/js/stage/objects-tray.reel/objects-tray.html @@ -14,7 +14,8 @@ "owner": { "prototype": "js/stage/objects-tray.reel", "properties": { - "element": {"#": "objects-tray"} + "element": {"#": "objects-tray"}, + "offStageObjectsController": {"@": "arrayController"} } }, "repetition" : { diff --git a/js/stage/objects-tray.reel/objects-tray.js b/js/stage/objects-tray.reel/objects-tray.js index 190abf57..3872c8b6 100644 --- a/js/stage/objects-tray.reel/objects-tray.js +++ b/js/stage/objects-tray.reel/objects-tray.js @@ -15,6 +15,23 @@ exports.ObjectsTray = Montage.create(Component, { hideClass : { value: 'hide-objects-tray'}, _empty : { value: null }, _workspaceMode : { value: null }, + + offStageObjectsController : { + value: null + }, + + _showAllObjects : { value: null }, + showAllObjects : { + get : function() { return this._showAllObjects; }, + set : function(value) { + if(value === this._showAllObjects) { return; } + + this._showAllObjects = value; + + this.needsDraw = true; + } + }, + workspaceMode : { get : function() { return this._workspaceMode; }, set : function(value) { @@ -43,6 +60,19 @@ exports.ObjectsTray = Montage.create(Component, { } }, + offStageObjectFilter : { + value: function(obj) { + if(this.showAllObjects) { + return true; + } + + var isComponent = this.application.ninja.objectsController._hasPrototype(obj, "Component"), + hasValidElement = obj.element && obj.element.parentNode; + + return !isComponent || !hasValidElement; + } + }, + _hide : { value: null }, hide : { get : function() { return this._hide; }, @@ -58,7 +88,7 @@ exports.ObjectsTray = Montage.create(Component, { templateDidLoad: { value: function() { - console.log('objects panel loaded'); + this.offStageObjectsController.filterFunction = this.offStageObjectFilter.bind(this); } }, -- cgit v1.2.3 From 5b303f858ab78877f26f61e87230b010460ee03b Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 20 Jun 2012 11:28:32 -0700 Subject: Objects Tray - Filter list of components for those without visual representation --- js/stage/objects-tray.reel/objects-tray.html | 8 +++++++- js/stage/objects-tray.reel/objects-tray.js | 23 ++++++++++++++++------- 2 files changed, 23 insertions(+), 8 deletions(-) (limited to 'js/stage') diff --git a/js/stage/objects-tray.reel/objects-tray.html b/js/stage/objects-tray.reel/objects-tray.html index 710e3edf..5a0db85e 100644 --- a/js/stage/objects-tray.reel/objects-tray.html +++ b/js/stage/objects-tray.reel/objects-tray.html @@ -39,7 +39,13 @@ "bindings": { "sourceObject" : {"<-": "@repetition.objectAtCurrentIteration"}, "identifier" : {"<-": "@repetition.objectAtCurrentIteration.identifier"} - } + }, + "listeners": [ + { + "type": "click", + "listener": {"@": "owner"} + } + ] } } diff --git a/js/stage/objects-tray.reel/objects-tray.js b/js/stage/objects-tray.reel/objects-tray.js index 3872c8b6..360d6037 100644 --- a/js/stage/objects-tray.reel/objects-tray.js +++ b/js/stage/objects-tray.reel/objects-tray.js @@ -66,10 +66,7 @@ exports.ObjectsTray = Montage.create(Component, { return true; } - var isComponent = this.application.ninja.objectsController._hasPrototype(obj, "Component"), - hasValidElement = obj.element && obj.element.parentNode; - - return !isComponent || !hasValidElement; + return this.application.ninja.objectsController.isOffStageObject(obj); } }, @@ -85,6 +82,15 @@ exports.ObjectsTray = Montage.create(Component, { } }, + displayHUDForObject : { + value: function(object) { + this.parentComponent.boundComponents.push(object); + } + }, + + /* --------------------- + Draw Cycle + --------------------- */ templateDidLoad: { value: function() { @@ -107,12 +113,15 @@ exports.ObjectsTray = Montage.create(Component, { "oneway": true }); + } + }, + willDraw : { + value: function() { if(this.objects) { - this.empty = !this.objects.length; + this._empty = !this.offStageObjectsController.organizedObjects.length; } else { - this.empty = true; + this._empty = true; } - } }, draw : { -- cgit v1.2.3 From 8ac2ce1566995c91fe4721df2b121ed6437b9e1c Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 20 Jun 2012 12:40:49 -0700 Subject: Binding HUD - Show hud for "off stage" objects in tray --- .../binding-hud.reel/binding-hud.js | 44 ++++++++++++++++++---- js/stage/binding-view.reel/binding-view.js | 8 ++++ js/stage/objects-tray.reel/objects-tray.html | 1 + js/stage/objects-tray.reel/objects-tray.js | 3 ++ 4 files changed, 49 insertions(+), 7 deletions(-) (limited to 'js/stage') 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 4b40d4da..cc94e844 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 @@ -52,17 +52,35 @@ exports.BindingHud = Montage.create(Component, { return this._userComponent; }, set: function(val) { - if (typeof(val) !== "undefined") { - this._userComponent = val; + if(!val) { return; } + + var controller = this.application.ninja.objectsController, + bindingView = this.parentComponent.parentComponent, + isOffStage, icon, iconOffsets; + + this._userComponent = val; + this.properties = controller.getPropertiesFromObject(val, true); + + controller.getObjectBindings(this.userComponent).forEach(function(obj) { + this.boundProperties.push(obj.sourceObjectPropertyPath); + }, this); + + isOffStage = controller.isOffStageObject(val); + + if(isOffStage) { + icon = bindingView.getOffStageIcon(val); + iconOffsets = this.getElementOffsetToParent(icon.element, bindingView.element); + 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.properties = this.application.ninja.objectsController.getPropertiesFromObject(val, true); - this.application.ninja.objectsController.getObjectBindings(this.userComponent).forEach(function(obj) { - this.boundProperties.push(obj.sourceObjectPropertyPath); - }.bind(this)); - this.needsDraw = true; } + + this.needsDraw = true; + } }, @@ -111,6 +129,18 @@ exports.BindingHud = Montage.create(Component, { } }, + getElementOffsetToParent : { + value: function(element, parent) { + var nodeToPage = webkitConvertPointFromNodeToPage(element, new WebKitPoint(0, 0)), + parentToPage = webkitConvertPointFromNodeToPage(parent, new WebKitPoint(0, 0)); + + return { + x : nodeToPage.x - parentToPage.x, + y : nodeToPage.y - parentToPage.y + } + } + }, + _x: { value: 20 }, diff --git a/js/stage/binding-view.reel/binding-view.js b/js/stage/binding-view.reel/binding-view.js index 9bd99176..e2bbb60b 100755 --- a/js/stage/binding-view.reel/binding-view.js +++ b/js/stage/binding-view.reel/binding-view.js @@ -255,6 +255,14 @@ exports.BindingView = Montage.create(Component, { value:null }, + getOffStageIcon : { + value: function(object) { + var index = this.objectsTray.offStageObjectsController.organizedObjects.indexOf(object); + + return this.objectsTray.iconsRepetition.childComponents[index]; + } + }, + // When mouse pointer is on a hud this value will be set to true _mouseOverHud: { value: false }, diff --git a/js/stage/objects-tray.reel/objects-tray.html b/js/stage/objects-tray.reel/objects-tray.html index 5a0db85e..901f3e58 100644 --- a/js/stage/objects-tray.reel/objects-tray.html +++ b/js/stage/objects-tray.reel/objects-tray.html @@ -15,6 +15,7 @@ "prototype": "js/stage/objects-tray.reel", "properties": { "element": {"#": "objects-tray"}, + "iconsRepetition": {"@": "repetition" }, "offStageObjectsController": {"@": "arrayController"} } }, diff --git a/js/stage/objects-tray.reel/objects-tray.js b/js/stage/objects-tray.reel/objects-tray.js index 360d6037..75ece4c3 100644 --- a/js/stage/objects-tray.reel/objects-tray.js +++ b/js/stage/objects-tray.reel/objects-tray.js @@ -16,6 +16,9 @@ exports.ObjectsTray = Montage.create(Component, { _empty : { value: null }, _workspaceMode : { value: null }, + iconsRepetition : { + value: null + }, offStageObjectsController : { value: null }, -- cgit v1.2.3