From d2f4d5e5f6742d53b6324d585a700566f73c992a Mon Sep 17 00:00:00 2001 From: mqg734 Date: Tue, 21 Feb 2012 16:49:11 -0800 Subject: Updated Materials Library and Materials Editor Popup to work with latest version of Montage. We had to change our css to not use id's. Also, updated the popup to use Montage's Popup component. It looks like bump material has a bug. So loading that material results in a runtime error. --- js/components/textfield.reel/textfield.html | 2 +- .../rect-properties.reel/rect-properties.css | 12 ++++------ .../rect-properties.reel/rect-properties.html | 2 +- js/components/ui/color-chip.reel/color-chip.js | 20 +++++++++++----- js/components/ui/file-input.reel/file-input.html | 6 ++--- js/components/ui/file-input.reel/file-input.js | 2 +- js/components/ui/input-group.reel/input-group.html | 10 ++++---- .../ui/property-control.reel/property-control.html | 6 ++--- .../ui/property-control.reel/property-control.js | 27 +++++++++++----------- 9 files changed, 47 insertions(+), 40 deletions(-) (limited to 'js/components') diff --git a/js/components/textfield.reel/textfield.html b/js/components/textfield.reel/textfield.html index 89adf776..73defabd 100755 --- a/js/components/textfield.reel/textfield.html +++ b/js/components/textfield.reel/textfield.html @@ -19,6 +19,6 @@ - + \ No newline at end of file diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.css b/js/components/tools-properties/rect-properties.reel/rect-properties.css index f50a9873..6541f641 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.css +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.css @@ -4,7 +4,7 @@ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ -.button { +.rectProperties .button { border:none; cursor:default; text-align:center; @@ -12,28 +12,26 @@ opacity:0.8; display:table-cell; vertical-align:middle; - width:100%; - height:100%; background-color:#333333; color:white; } -.button:hover +.rectProperties .button:hover { opacity:1; } -.button:active +.rectProperties .button:active { outline:solid 1px black; } -.button.on +.rectProperties .button.on { background-color: #333333; } -.button.off +.rectProperties .button.off { background-color: #cccccc; color:black; diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html index e5c52466..214ff1d5 100755 --- a/js/components/tools-properties/rect-properties.reel/rect-properties.html +++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html @@ -68,7 +68,7 @@ -
+
diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js index e51bdd8a..ed1ac27a 100755 --- a/js/components/ui/color-chip.reel/color-chip.js +++ b/js/components/ui/color-chip.reel/color-chip.js @@ -29,12 +29,20 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { value: 20 }, - initialColor: { - value: false + color: { + value: {r:0, g:0, b:0, a:1, css:'rgb(0,0,0)', mode:'rgb'} }, changeDelegate: { - value: null + value: function(event) { + this.color = event._event.color; + + var evt = document.createEvent("CustomEvent"); + evt.initEvent("change", true, true); + evt.type = "change"; + + this.dispatchEvent(evt); + } }, prepareForDraw: { @@ -60,10 +68,10 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { value: function(evt) { if(this.chip) { // This is a single chip - Not related to the color panel -- Set the initial color if found - var mode = "rgb", r = 0, g = 0, b = 0, a = 1, css = "rgb(255,0,0)"; + var mode = "rgb", r = 0, g = 0, b = 0, a = 1, css = "rgb(0,0,0)"; - if(this.initialColor) { - var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.initialColor); + if(this.color) { + var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.color.css); mode = colorObj.mode; r = colorObj.value.r; g = colorObj.value.g; diff --git a/js/components/ui/file-input.reel/file-input.html b/js/components/ui/file-input.reel/file-input.html index 5cdd8f9e..2a8546a5 100755 --- a/js/components/ui/file-input.reel/file-input.html +++ b/js/components/ui/file-input.reel/file-input.html @@ -11,7 +11,7 @@ -
- +
+
diff --git a/js/components/ui/file-input.reel/file-input.js b/js/components/ui/file-input.reel/file-input.js index 2ea38162..b57f7c21 100755 --- a/js/components/ui/file-input.reel/file-input.js +++ b/js/components/ui/file-input.reel/file-input.js @@ -5,7 +5,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; + Component = require("montage/ui/component").Component; var FileInput = exports.FileInput = Montage.create(Component, { diff --git a/js/components/ui/input-group.reel/input-group.html b/js/components/ui/input-group.reel/input-group.html index c99e29d6..0050b8cb 100755 --- a/js/components/ui/input-group.reel/input-group.html +++ b/js/components/ui/input-group.reel/input-group.html @@ -11,7 +11,7 @@ -
+
diff --git a/js/components/ui/property-control.reel/property-control.html b/js/components/ui/property-control.reel/property-control.html index 2e7c7b53..43e8e67f 100755 --- a/js/components/ui/property-control.reel/property-control.html +++ b/js/components/ui/property-control.reel/property-control.html @@ -11,14 +11,14 @@ -
+
diff --git a/js/components/ui/property-control.reel/property-control.js b/js/components/ui/property-control.reel/property-control.js index 586d2e9a..58b1be9f 100755 --- a/js/components/ui/property-control.reel/property-control.js +++ b/js/components/ui/property-control.reel/property-control.js @@ -6,16 +6,16 @@ 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, - HotText = require("js/components/hottext").HotText, - HotTextUnit = require("js/components/hottextunit").HotTextUnit, - Slider = require("js/components/slider").Slider, - Button = require("js/components/button").Button, - Checkbox = require("js/components/checkbox").Checkbox, - Combobox = require("js/components/combobox").Combobox, - TextField = require("js/components/TextField").TextField, - ColorChip = require("js/components/ui/color-chip").ColorChip, - FileInput = require("js/components/ui/file-input").FileInput, - InputGroup = require("js/components/ui/input-group").InputGroup; + HotText = require("js/components/hottext.reel").HotText, + HotTextUnit = require("js/components/hottextunit.reel").HotTextUnit, + Slider = require("js/components/slider.reel").Slider, + Button = require("js/components/button.reel").Button, + Checkbox = require("js/components/checkbox.reel").Checkbox, + Combobox = require("js/components/combobox.reel").Combobox, + TextField = require("js/components/TextField.reel").TextField, + ColorChip = require("js/components/ui/color-chip.reel").ColorChip, + FileInput = require("js/components/ui/file-input.reel").FileInput, + InputGroup = require("js/components/ui/input-group.reel").InputGroup; var PropertyControl = exports.PropertyControl = Montage.create(Component, { @@ -134,7 +134,7 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, { { this._control[n] = defaults[n]; } - + this._labelField.innerHTML = this._label; this._control.needsDraw = true; } }, @@ -170,8 +170,6 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, { prepareForDraw: { value: function() { - this._labelField.innerHTML = this._label; - switch(this._controlType) { case "HotText": @@ -199,6 +197,9 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, { break; case "ColorChip": this._control = ColorChip.create(); + this._control.chip = true; + this._control.hasIcon = false; + this._control.mode = "chip"; this._control.addEventListener("change", this, false); this._prop = "color"; break; -- cgit v1.2.3