From 47d45e16bee15fd9f1f793a0bad3b93ad1b985fc Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 11 Jun 2012 07:19:19 -0700 Subject: Edit View - Add buttons and calls controller (saves bindings) --- js/document/templates/app/main.js | 2 +- .../edit-binding-view.reel/edit-binding-view.html | 44 ++++++++++-- .../edit-binding-view.reel/edit-binding-view.js | 81 ++++++++++++++++++++-- 3 files changed, 116 insertions(+), 11 deletions(-) (limited to 'js') diff --git a/js/document/templates/app/main.js b/js/document/templates/app/main.js index 91c46fda..e2bdc1a0 100644 --- a/js/document/templates/app/main.js +++ b/js/document/templates/app/main.js @@ -29,7 +29,7 @@ exports.Main = Montage.create(Component, { var componentRequire = component[data.name]; var componentInstance = componentRequire.create(); - componentInstance._montage_metadata.label = data.name; + componentInstance._montage_metadata.label = componentInstance.identifier = data.name; componentInstance.element = element; componentInstance.needsDraw = true; diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html index d07f4445..604d4871 100644 --- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.html +++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.html @@ -18,7 +18,10 @@ "boundObjectField" : {"@": "boundObjectField" }, "sourceObjectPropertyPathField" : {"@": "sourceObjectPropertyPathField" }, "boundObjectPropertyPathField" : {"@": "boundObjectPropertyPathField" }, - "directionCheckbox" : {"@": "directionCheckbox" } + "directionCheckbox" : {"@": "directionCheckbox" }, + "saveButton":{ "@": "saveButton" }, + "cancelButton":{ "@": "cancelButton" }, + "deleteButton":{ "@": "deleteButton" } } }, "sourceObjectField": { @@ -96,11 +99,40 @@ "checked": {"<-": "@owner.oneway"} } }, - "closeButton" : { + "cancelButton" : { "prototype": "montage/ui/button.reel", "properties": { - "element": {"#": "close-button" }, - "identifier": "closeButton" + "element": {"#": "cancel-button" }, + "identifier": "cancelButton" + }, + "listeners": [ + { + "type": "action", + "listener": {"@": "owner" } + } + ] + }, + "deleteButton" : { + "prototype": "montage/ui/button.reel", + "properties": { + "element": {"#": "delete-button" }, + "identifier": "deleteButton" + }, + "listeners": [ + { + "type": "action", + "listener": {"@": "owner" } + } + ] + }, + "saveButton" : { + "prototype": "montage/ui/button.reel", + "properties": { + "element": {"#": "save-button" }, + "identifier": "saveButton" + }, + "bindings" : { + "enabled": {"<<->": "@owner.dirty"} }, "listeners": [ { @@ -139,7 +171,9 @@ - + + + diff --git a/js/panels/binding/edit-binding-view.reel/edit-binding-view.js b/js/panels/binding/edit-binding-view.reel/edit-binding-view.js index c3ef7384..c9f946f5 100644 --- a/js/panels/binding/edit-binding-view.reel/edit-binding-view.js +++ b/js/panels/binding/edit-binding-view.reel/edit-binding-view.js @@ -83,13 +83,16 @@ exports.EditBindingView = Montage.create(Component, { this.sourceObjectField.hints = this.objectIdentifiers; if(value.sourceObject) { - this.sourceObjectIdentifier = value.sourceObject.identifier || ''; + this.sourceObjectIdentifier = value.sourceObject.identifier || value.sourceObject._montage_metadata.label; this.sourceObjectPropertyPath = value.sourceObjectPropertyPath || ''; } if(value.boundObject) { this.boundObjectIdentifier = value.boundObject.identifier || ''; this.boundObjectPropertyPath = value.boundObjectPropertyPath || ''; + this.isNewBinding = false; + } else { + this.isNewBinding = true; } this.oneway = value.oneway; @@ -99,14 +102,20 @@ exports.EditBindingView = Montage.create(Component, { }, /* ------------------- - Save/Close button handlers + Form properties ------------------- */ + dirty: { value: null }, + isNewBinding : { value: null }, + "sourceObjectField" : {value: null, enumerable: true }, "boundObjectField" : {value: null, enumerable: true }, "sourceObjectPropertyPathField" : {value: null, enumerable: true }, "boundObjectPropertyPathField" : {value: null, enumerable: true }, "directionCheckbox" : {value: null, enumerable: true }, + "deleteButton" : {value: null }, + "saveButton" : {value: null }, + "cancelButton" : {value: null }, clearForm : { value: function() { @@ -115,24 +124,86 @@ exports.EditBindingView = Montage.create(Component, { field.value = ''; } } + this.dirty = false; + } + }, + + saveForm : { + value: function() { + var controller = this.application.ninja.objectsController, + newBindingArgs = { + sourceObject : this.getObjectFromIdentifierValue(this.sourceObjectField.value), + sourceObjectPropertyPath : this.sourceObjectPropertyPathField.value, + boundObject : this.getObjectFromIdentifierValue(this.boundObjectField.value), + boundObjectPropertyPath : this.boundObjectPropertyPathField.value, + oneway: this.oneway + }; + + if(this.isNewBinding) { + controller.addBinding(newBindingArgs); + } else { + controller.editBinding(this.bindingArgs, newBindingArgs); + } + + controller.currentObject = controller.currentObject; + } + }, + + getObjectFromIdentifierValue : { + value: function(id) { + var identifiers = this.getObjectIdentifiers(), + objects = this.application.ninja.objectsController.objects; + + return objects[identifiers.indexOf(id)]; } }, /* ------------------- - Save/Close button handlers + Save/Cancel/Delete button handlers ------------------- */ - handleCloseButtonAction : { + handleCancelButtonAction : { + value: function(e) { + this.clearForm(); + this.parentComponent.editing = false; + } + }, + + handleDeleteButtonAction : { + value: function(e) { + var controller = this.application.ninja.objectsController; + + controller.removeBinding(this.bindingArgs); + controller.currentObject = controller.currentObject; + + this.parentComponent.editing = false; + } + }, + handleSaveButtonAction : { value: function(e) { + this.saveForm(); this.parentComponent.editing = false; } }, + + /* ------------------- + Dirty handler + ------------------- */ + + handleEvent : { + value: function(e) { + if(e._event.type === 'change') { + this.dirty = true; + } + } + }, + /* ------------------- Draw Cycle ------------------- */ - willDraw : { + prepareForDraw : { value: function() { } -- cgit v1.2.3