From a30d76ff641ce89686cf5fbd9f04ac9ab4e9c830 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Fri, 10 Feb 2012 17:21:28 -0800 Subject: initial color chip for the stage Signed-off-by: Valerio Virgillito --- .../properties/sections/custom.reel/custom.js | 46 +++++++++++++++++++--- 1 file changed, 41 insertions(+), 5 deletions(-) (limited to 'js/panels/properties/sections') diff --git a/js/panels/properties/sections/custom.reel/custom.js b/js/panels/properties/sections/custom.reel/custom.js index 992db8e6..5315defc 100644 --- a/js/panels/properties/sections/custom.reel/custom.js +++ b/js/panels/properties/sections/custom.reel/custom.js @@ -6,6 +6,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot var Montage = require("montage/core/core").Montage; var Component = require("montage/ui/component").Component; +var ElementsMediator = require("js/mediators/element-mediator").ElementMediator; //Custom Rows var SingleRow = require("js/panels/properties/sections/custom-rows/single-row.reel").SingleRow; @@ -18,7 +19,7 @@ var Dropdown = require("js/components/combobox.reel").Combobox; var TextField = require("js/components/textfield.reel").TextField; var FileInput = require("js/components/ui/file-input.reel").FileInput; var Checkbox = require("js/components/checkbox.reel").Checkbox; - +var ColorChip = require("js/components/ui/color-chip.reel").ColorChip; exports.CustomSection = Montage.create(Component, { @@ -88,10 +89,8 @@ exports.CustomSection = Montage.create(Component, { value:{} }, - handleChanging: - { - value:function(event) - { + handleChanging: { + value:function(event) { var obj = event.currentTarget; this._dispatchPropEvent({"type": "changing", "id": obj.id, "prop": obj.prop, "value": obj.value, "control": obj}); } @@ -106,6 +105,26 @@ exports.CustomSection = Montage.create(Component, { } }, + handleColorChange: { + value: function(event) { + // Change the stage color for now + console.log(this); + console.log(event); + console.log(event._event.color.css); + ElementsMediator.setProperty([this.application.ninja.currentDocument.documentRoot], "background", [event._event.color.css], "Change", "pi", 'foo'); + /* + var propEvent = document.createEvent("CustomEvent"); + propEvent.initEvent("propertyChange", true, true); + propEvent.type = "propertyChange"; + + propEvent.prop = "background";//event.prop; + propEvent.value = event._event.color.css; + + this.dispatchEvent(propEvent); + */ + } + }, + _dispatchPropEvent: { value: function(event) { // console.log(event); @@ -140,6 +159,7 @@ exports.CustomSection = Montage.create(Component, { case "textbox" : return this.createTextField(fields); case "file" : return this.createFileInput(fields); case "checkbox" : return this.createCheckbox(fields); + case "chip" : return this.createColorChip(fields); } } }, @@ -303,6 +323,22 @@ exports.CustomSection = Montage.create(Component, { boundObjectPropertyPath: "checked" }); + return obj; + } + }, + + createColorChip: { + value: function(aField) { + var obj = ColorChip.create(); + obj.chip = true; + obj.iconType = "fillIcon"; + obj.mode = "chip"; + obj.offset = 0; + + obj.changeDelegate = this.handleColorChange; + + this.controls[aField.id] = obj; + return obj; } } -- cgit v1.2.3 From 0d7d6d4d98437a93f31ededa14ca6eb5382c9e58 Mon Sep 17 00:00:00 2001 From: Valerio Virgillito Date: Mon, 13 Feb 2012 14:05:10 -0800 Subject: Cleaning up the stage background color chip. Signed-off-by: Valerio Virgillito --- js/panels/properties/sections/custom.reel/custom.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) (limited to 'js/panels/properties/sections') diff --git a/js/panels/properties/sections/custom.reel/custom.js b/js/panels/properties/sections/custom.reel/custom.js index 5315defc..a2b9b9fa 100644 --- a/js/panels/properties/sections/custom.reel/custom.js +++ b/js/panels/properties/sections/custom.reel/custom.js @@ -105,13 +105,14 @@ exports.CustomSection = Montage.create(Component, { } }, + /** + * Color change handler. Hard coding the stage for now since only the stage PI uses this color chip + */ handleColorChange: { value: function(event) { // Change the stage color for now - console.log(this); - console.log(event); - console.log(event._event.color.css); - ElementsMediator.setProperty([this.application.ninja.currentDocument.documentRoot], "background", [event._event.color.css], "Change", "pi", 'foo'); + //console.log(this, event); + ElementsMediator.setProperty([this.application.ninja.currentDocument.documentRoot], this.id, [event._event.color.css], "Change", "pi", ''); /* var propEvent = document.createEvent("CustomEvent"); propEvent.initEvent("propertyChange", true, true); @@ -330,11 +331,15 @@ exports.CustomSection = Montage.create(Component, { createColorChip: { value: function(aField) { var obj = ColorChip.create(); + obj.chip = true; obj.iconType = "fillIcon"; obj.mode = "chip"; obj.offset = 0; + if (aField.id) obj.id = aField.id; + if (aField.prop) obj.prop = aField.prop; + obj.changeDelegate = this.handleColorChange; this.controls[aField.id] = obj; -- cgit v1.2.3