From 9d885aae7a17b4fc731a41f6b1ac8840092b83ac Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 12 Mar 2012 17:06:05 -0700 Subject: Fixing snapping bugs in Selection, translate and rotate tools. We should show snap marker on mouse move for selection tool prior to mousing down as well. We should create drag plane parallel to the view and where the user moused down. Signed-off-by: Nivesh Rajbhandari --- js/helper-classes/3D/snap-manager.js | 12 ++++++++++-- js/tools/SelectionTool.js | 23 +++++++++++++---------- js/tools/Translate3DToolBase.js | 1 - js/tools/TranslateObject3DTool.js | 2 +- js/tools/modifier-tool-base.js | 12 ++++++------ 5 files changed, 30 insertions(+), 20 deletions(-) (limited to 'js') diff --git a/js/helper-classes/3D/snap-manager.js b/js/helper-classes/3D/snap-manager.js index cf8a91db..1caacd00 100755 --- a/js/helper-classes/3D/snap-manager.js +++ b/js/helper-classes/3D/snap-manager.js @@ -1978,12 +1978,20 @@ var SnapManager = exports.SnapManager = Montage.create(Component, { }, setupDragPlanes : { - value: function( hitRec ) { + value: function( hitRec, inGlobalMode ) { // get the location of the point in stage world space var elt = hitRec.getElt(); var localPt = hitRec.getLocalPoint(); var planeMat = hitRec.getPlaneMatrix(); - var stageWorldPt = viewUtils.postViewToStageWorld( MathUtils.transformPoint(localPt,planeMat), elt ); + var stageWorldPt; + if(inGlobalMode) + { + stageWorldPt = MathUtils.transformPoint(localPt,planeMat); + } + else + { + stageWorldPt = viewUtils.postViewToStageWorld( MathUtils.transformPoint(localPt,planeMat), elt ); + } /* // get a working plane parallel to the current working plane through the stage world point diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 6d8ff175..13a04944 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -16,6 +16,7 @@ var Montage = require("montage/core/core").Montage, var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { drawingFeedback: { value: { mode: "Draw2D", type: "" } }, + _inLocalMode: { value: false}, // This tool should always use global mode for translations _canOperateOnStage: { value: true}, _isSelecting: {value: false, writable:true}, _shiftMove: { value: 10}, @@ -34,14 +35,12 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { value: function () { if(this._targets && this._targets.length) { - // TODO - drawUtils's elementPlanes check in drawSelectionBounds doesn't seem to work, - // so temporary workaround to simply check if all elements have identity matrix - // TODO - Eventually, this should instead check if all the selected items are on the view plane var len = this._targets.length; + var plane = this.application.ninja.stage.stageDeps.snapManager.getDragPlane(); for(var i = 0; i < len; i++) { - var mat = this._targets[i].mat; - if(!MathUtils.isIdentityMatrix(mat)) + var elt = this._targets[i].elt; + if(!this.application.ninja.stage.stageDeps.snapManager.elementIsOnPlane(elt, plane)) { return false; } @@ -123,14 +122,14 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { this.doDraw(event); } else { this._showFeedbackOnMouseMove(event); - // if(this._canSnap) - // { - // this.doSnap(event); - // } + if(this._canSnap) + { + this.doSnap(event); + } } this.DrawHandles(this._delta); - if(this._canSnap && this._isDrawing) + if(this._canSnap) { this.application.ninja.stage.stageDeps.snapManager.drawLastHit(); } @@ -704,6 +703,10 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { */ _showFeedbackOnMouseMove : { value: function (event) { + if(!this._showTransformHandles) + { + return; + } if(this._target && this._handles) { var len = this._handles.length; diff --git a/js/tools/Translate3DToolBase.js b/js/tools/Translate3DToolBase.js index 3d9191da..24a68ad1 100755 --- a/js/tools/Translate3DToolBase.js +++ b/js/tools/Translate3DToolBase.js @@ -10,7 +10,6 @@ Subclass TranslateObject3DTool will translate the object that was clicked. var Montage = require("montage/core/core").Montage, ModifierToolBase = require("js/tools/modifier-tool-base").ModifierToolBase, toolHandleModule = require("js/stage/tool-handle"), - snapManager = require("js/helper-classes/3D/snap-manager").SnapManager, viewUtils = require("js/helper-classes/3D/view-utils").ViewUtils, vecUtils = require("js/helper-classes/3D/vec-utils").VecUtils, drawUtils = require("js/helper-classes/3D/draw-utils").DrawUtils, diff --git a/js/tools/TranslateObject3DTool.js b/js/tools/TranslateObject3DTool.js index 5157e39c..92b9b2f7 100755 --- a/js/tools/TranslateObject3DTool.js +++ b/js/tools/TranslateObject3DTool.js @@ -103,7 +103,7 @@ exports.TranslateObject3DTool = Object.create(Translate3DToolBase, { } else { - this._dragPlane = snapManager.setupDragPlanes( hitRec ); + this._dragPlane = snapManager.setupDragPlanes( hitRec, true ); } } diff --git a/js/tools/modifier-tool-base.js b/js/tools/modifier-tool-base.js index 7892d015..80f7d758 100755 --- a/js/tools/modifier-tool-base.js +++ b/js/tools/modifier-tool-base.js @@ -171,7 +171,7 @@ exports.ModifierToolBase = Montage.create(DrawingTool, { // } // else // { - this._dragPlane = snapManager.setupDragPlanes( hitRec ); + this._dragPlane = snapManager.setupDragPlanes( hitRec, true ); // } } @@ -828,14 +828,14 @@ exports.ModifierToolBase = Montage.create(DrawingTool, { this.doDraw(event); } else { this._showFeedbackOnMouseMove(event); -// if(this._canSnap) -// { -// this.doSnap(event); -// } + if(this._canSnap) + { + this.doSnap(event); + } } this.DrawHandles(this._delta); - if(this._canSnap && this._isDrawing) + if(this._canSnap) { snapManager.drawLastHit(); } -- cgit v1.2.3 From 90e2f71d730fb4f4ec07b40d2c2569e6c46e8a1c Mon Sep 17 00:00:00 2001 From: Nivesh Rajbhandari Date: Mon, 12 Mar 2012 17:10:19 -0700 Subject: Fixing selection tool when moving multiple selection in 3d mode. Signed-off-by: Nivesh Rajbhandari --- js/tools/SelectionTool.js | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) (limited to 'js') diff --git a/js/tools/SelectionTool.js b/js/tools/SelectionTool.js index 13a04944..5f48f74d 100755 --- a/js/tools/SelectionTool.js +++ b/js/tools/SelectionTool.js @@ -451,7 +451,10 @@ var SelectionTool = exports.SelectionTool = Montage.create(ModifierToolBase, { if(this._use3DMode) { curMat = item.mat; - glmat4.multiply(curMat, qMat, curMat); + + curMat[12] += transMat[12]; + curMat[13] += transMat[13]; + curMat[14] += transMat[14]; viewUtils.setMatrixForElement( elt, curMat, true); this._targets[i].mat = curMat; } -- cgit v1.2.3 From 138da4b52049285dead085ff8349d6664b390eec Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 13 Mar 2012 11:14:39 -0700 Subject: Presets Panel - Adding hover state to ninja-leaf --- js/components/treeview/ninja-leaf.reel/ninja-leaf.css | 14 ++++++++++++-- js/panels/presets/content.reel/content.css | 4 +--- 2 files changed, 13 insertions(+), 5 deletions(-) (limited to 'js') diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css index fedc1d9d..cc8108f6 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css @@ -3,7 +3,12 @@ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. */ - +.treeRoot .branch-label, .treeRoot .leaf-label { + margin: 0 8px; +} +.treeRoot .leaf-label:hover { + margin: 0; +} .treeRoot .leaf-label { background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAIAAAD9iXMrAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw%2FeHBhY2tldCBiZWdpbj0i77u%2FIiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8%2BIDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIE1hY2ludG9zaCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpEQzcwMEU1RjQxM0MxMUUxQUM0MERBNzM1MUVEMUQxMCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpEQzcwMEU2MDQxM0MxMUUxQUM0MERBNzM1MUVEMUQxMCI%2BIDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkRDNzAwRTVENDEzQzExRTFBQzQwREE3MzUxRUQxRDEwIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkRDNzAwRTVFNDEzQzExRTFBQzQwREE3MzUxRUQxRDEwIi8%2BIDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY%2BIDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8%2BUcaK3QAAANFJREFUeNqMULEOREAQdYjvuE%2FYWlSUQqKQ7A%2FsD6n0SoVCFHpRa0SllvgFlpvzZO9OcfGSnbx9M%2FNmMpp2Dw96VVX9L%2FJ93wRrmkZJIKrZcRyK%2Bs25p5%2BU8pK4KCakMAzxL4oCJIqivu8Nw0DDu25ZFtW3ritIkiS0tGVZtm1%2F6rZtu4yr67osSyJBEJx3ybKsbVukOecU4zh2XRfKMAzTNJmYpWxgPM%2BzEIIxRrzrOs%2FzdMyVvyAxTdPxAJFzv%2BeBbz8cfN93kDzPb55ZewkwAF0Ddf6ATSsHAAAAAElFTkSuQmCC); background-position: 3px center; @@ -12,6 +17,11 @@ cursor: pointer; padding: 3px 0 4px; } +.branch .branch .leaf-label:hover { + background-color: #333333; + background-position: 33px center; + padding-left: 53px; +} /* First level */ .branch .leaf-label { padding-left: 25px; @@ -26,4 +36,4 @@ .branch .branch .branch .leaf-label { background-position: 45px center; padding-left: 65px; -} \ No newline at end of file +} diff --git a/js/panels/presets/content.reel/content.css b/js/panels/presets/content.reel/content.css index c0ccbad4..409e1960 100644 --- a/js/panels/presets/content.reel/content.css +++ b/js/panels/presets/content.reel/content.css @@ -10,9 +10,7 @@ -webkit-box-orient: vertical; -webkit-box-flex: 1; } -.presetsPanel .treeRoot { - margin: 0 8px; -} + .tab-bar { -webkit-box-flex: 0; background-color: #282828; -- cgit v1.2.3 From 9e5e7159e7fb1b881de6c5d957645a4c845cde93 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 13 Mar 2012 11:15:02 -0700 Subject: Presets Panel - Adding single-click activation --- js/panels/presets/style-presets.reel/style-presets.html | 2 +- js/panels/presets/transitions-presets.reel/transitions-presets.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/panels/presets/style-presets.reel/style-presets.html b/js/panels/presets/style-presets.reel/style-presets.html index 0db4d3c0..784c9527 100644 --- a/js/panels/presets/style-presets.reel/style-presets.html +++ b/js/panels/presets/style-presets.reel/style-presets.html @@ -40,7 +40,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "element" : {"#": "libraryContainer"}, "branchComponent" : {"@": "branch" }, "contentController": {"@": "presetsController"}, - "activationEvent" : "dblclick", + "activationEvent" : "click", "showRoot" : false } }, diff --git a/js/panels/presets/transitions-presets.reel/transitions-presets.html b/js/panels/presets/transitions-presets.reel/transitions-presets.html index 5dc28edf..58f494d7 100644 --- a/js/panels/presets/transitions-presets.reel/transitions-presets.html +++ b/js/panels/presets/transitions-presets.reel/transitions-presets.html @@ -40,7 +40,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "element" : {"#": "libraryContainer"}, "branchComponent" : {"@": "branch" }, "contentController": {"@": "presetsController"}, - "activationEvent" : "dblclick", + "activationEvent" : "click", "showRoot": false } }, -- cgit v1.2.3 From 8ce3b7be494a703694acbf35e18e05c2fc91788b Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 13 Mar 2012 11:28:45 -0700 Subject: Presets Panel - Add :active pseudo class for ninja-tree --- js/components/treeview/ninja-leaf.reel/ninja-leaf.css | 3 +++ 1 file changed, 3 insertions(+) (limited to 'js') diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css index cc8108f6..4b21947f 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css @@ -22,6 +22,9 @@ background-position: 33px center; padding-left: 53px; } +.branch .branch .leaf-label:active { + background-color: #212121; +} /* First level */ .branch .leaf-label { padding-left: 25px; -- cgit v1.2.3 From e6637e3748911a64993c3f0caccee05b98f1eb0a Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 13 Mar 2012 12:02:06 -0700 Subject: Presets Panel - Remove :active pseudo class from ninja-leaf --- js/components/treeview/ninja-leaf.reel/ninja-leaf.css | 3 --- 1 file changed, 3 deletions(-) (limited to 'js') diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css index 4b21947f..cc8108f6 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.css +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.css @@ -22,9 +22,6 @@ background-position: 33px center; padding-left: 53px; } -.branch .branch .leaf-label:active { - background-color: #212121; -} /* First level */ .branch .leaf-label { padding-left: 25px; -- cgit v1.2.3 From 8844b46dec5f36de04c1fc3a1b1b4d00e726a067 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 13 Mar 2012 13:20:28 -0700 Subject: Gradient stop logic Made logic changes to allow for a minimum number of gradients to remain at 2 at all times and not apply default colors. --- .../gradientpicker.reel/gradientpicker.js | 22 +++++++--------------- 1 file changed, 7 insertions(+), 15 deletions(-) (limited to 'js') diff --git a/js/components/gradientpicker.reel/gradientpicker.js b/js/components/gradientpicker.reel/gradientpicker.js index da4e8c0f..b10f6624 100755 --- a/js/components/gradientpicker.reel/gradientpicker.js +++ b/js/components/gradientpicker.reel/gradientpicker.js @@ -213,21 +213,13 @@ exports.GradientPicker = Montage.create(Component, { removeStop: { enumerable: false, value: function(stop) { - //Removing stops - this.element._components.stopsContainer.removeChild(stop); - //Stopping events related to this current stop - this.removeStopMoving(); - //Resetting stops if less than 2 var i, buttons = this.element._components.stopsContainer.getElementsByTagName('button'); - if (buttons.length < 2) { - //Removing remaining stops prior to resetting - for (i=0; buttons[i]; i++) { - this.element._components.stopsContainer.removeChild(buttons[i].stop); - } - //Nulling then adding defaults - this.value = null; - this.addDefaultStops(); - this._dispatchEvent('change', false); + // + if (buttons.length > 2) { + //Removing stops + this.element._components.stopsContainer.removeChild(stop); + //Stopping events related to this current stop + this.removeStopMoving(); } } }, @@ -327,7 +319,7 @@ exports.GradientPicker = Montage.create(Component, { // this.application.ninja.colorController.colorPopupManager.hideColorChipPopup(); // - if ((e._event.y+this.hack.y) > this.element._trackY+50 || (e._event.y+this.hack.y) < this.element._trackY) { + if ((e._event.y+this.hack.y) > this.element._trackY+70 || (e._event.y+this.hack.y) < this.element._trackY) { this.removeStop(this.currentStop); } // -- cgit v1.2.3 From 0b8383232bc412d94ef234e49898d813436c63cc Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 13 Mar 2012 13:33:52 -0700 Subject: Presets Panel - Re-add dbl-click activation --- js/panels/presets/style-presets.reel/style-presets.html | 2 +- js/panels/presets/transitions-presets.reel/transitions-presets.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/panels/presets/style-presets.reel/style-presets.html b/js/panels/presets/style-presets.reel/style-presets.html index 784c9527..0db4d3c0 100644 --- a/js/panels/presets/style-presets.reel/style-presets.html +++ b/js/panels/presets/style-presets.reel/style-presets.html @@ -40,7 +40,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "element" : {"#": "libraryContainer"}, "branchComponent" : {"@": "branch" }, "contentController": {"@": "presetsController"}, - "activationEvent" : "click", + "activationEvent" : "dblclick", "showRoot" : false } }, diff --git a/js/panels/presets/transitions-presets.reel/transitions-presets.html b/js/panels/presets/transitions-presets.reel/transitions-presets.html index 58f494d7..5dc28edf 100644 --- a/js/panels/presets/transitions-presets.reel/transitions-presets.html +++ b/js/panels/presets/transitions-presets.reel/transitions-presets.html @@ -40,7 +40,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "element" : {"#": "libraryContainer"}, "branchComponent" : {"@": "branch" }, "contentController": {"@": "presetsController"}, - "activationEvent" : "click", + "activationEvent" : "dblclick", "showRoot": false } }, -- cgit v1.2.3 From 451cdd792046eca1d57dd205940e5b638f8a08ac Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Tue, 13 Mar 2012 15:19:35 -0700 Subject: Renaming folder --- js/panels/Color/colorbutton-manager.js | 44 - .../ColorPanelPopup.scssc | Bin 15335 -> 0 bytes .../ColorPanelPopup.scssc | Bin 17879 -> 0 bytes .../ColorPanelBase.scssc | Bin 23592 -> 0 bytes .../Color/colorchippopup.reel/colorchippopup.html | 63 - .../Color/colorchippopup.reel/colorchippopup.js | 590 ------- js/panels/Color/colorchippopup.reel/config.rb | 9 - .../colorchippopup.reel/css/colorchippopup.css | 239 --- .../colorchippopup.reel/css/colorchippopup.scss | 240 --- .../Color/colorchippopup.reel/img/icon_bitmap.png | Bin 3072 -> 0 bytes .../colorchippopup.reel/img/icon_colorwheel.png | Bin 3420 -> 0 bytes .../colorchippopup.reel/img/icon_gradient.png | Bin 2815 -> 0 bytes .../Color/colorchippopup.reel/img/icon_nofill.png | Bin 2951 -> 0 bytes js/panels/Color/colorchippopup.reel/img/knob.png | Bin 1036 -> 0 bytes js/panels/Color/colorpanel.js | 53 - .../Color/colorpanelbase.reel/colorpanelbase.html | 76 - .../Color/colorpanelbase.reel/colorpanelbase.js | 1654 -------------------- js/panels/Color/colorpanelbase.reel/config.rb | 9 - .../colorpanelbase.reel/css/colorpanelbase.css | 332 ---- .../colorpanelbase.reel/css/colorpanelbase.scss | 339 ---- .../Color/colorpanelbase.reel/img/icon_default.png | Bin 3011 -> 0 bytes .../Color/colorpanelbase.reel/img/icon_nocolor.png | Bin 3036 -> 0 bytes .../Color/colorpanelbase.reel/img/icon_swap.png | Bin 2961 -> 0 bytes js/panels/Color/colorpanelbase.reel/img/knob.png | Bin 1036 -> 0 bytes .../colorpanelpopup.reel/colorpanelpopup.html | 68 - .../Color/colorpanelpopup.reel/colorpanelpopup.js | 466 ------ js/panels/Color/colorpanelpopup.reel/config.rb | 9 - .../colorpanelpopup.reel/css/colorpanelpopup.css | 239 --- .../colorpanelpopup.reel/css/colorpanelpopup.scss | 240 --- .../Color/colorpanelpopup.reel/img/icon_bitmap.png | Bin 3072 -> 0 bytes .../colorpanelpopup.reel/img/icon_colorwheel.png | Bin 3420 -> 0 bytes .../colorpanelpopup.reel/img/icon_gradient.png | Bin 2815 -> 0 bytes .../Color/colorpanelpopup.reel/img/icon_nofill.png | Bin 2951 -> 0 bytes js/panels/Color/colorpanelpopup.reel/img/knob.png | Bin 1036 -> 0 bytes js/panels/Color/colorpopup-manager.js | 529 ------- .../Color/colortoolbar.reel/colortoolbar.html | 54 - js/panels/Color/colortoolbar.reel/colortoolbar.js | 138 -- js/panels/Color/colortoolbar.reel/config.rb | 9 - .../Color/colortoolbar.reel/css/colortoolbar.css | 45 - .../Color/colortoolbar.reel/css/colortoolbar.scss | 52 - js/panels/_color/colorbutton-manager.js | 44 + .../_color/colorchippopup.reel/colorchippopup.html | 63 + .../_color/colorchippopup.reel/colorchippopup.js | 590 +++++++ js/panels/_color/colorchippopup.reel/config.rb | 9 + .../colorchippopup.reel/css/colorchippopup.css | 239 +++ .../colorchippopup.reel/css/colorchippopup.scss | 240 +++ .../_color/colorchippopup.reel/img/icon_bitmap.png | Bin 0 -> 3072 bytes .../colorchippopup.reel/img/icon_colorwheel.png | Bin 0 -> 3420 bytes .../colorchippopup.reel/img/icon_gradient.png | Bin 0 -> 2815 bytes .../_color/colorchippopup.reel/img/icon_nofill.png | Bin 0 -> 2951 bytes js/panels/_color/colorchippopup.reel/img/knob.png | Bin 0 -> 1036 bytes js/panels/_color/colorpanel.js | 53 + .../_color/colorpanelbase.reel/colorpanelbase.html | 76 + .../_color/colorpanelbase.reel/colorpanelbase.js | 1654 ++++++++++++++++++++ js/panels/_color/colorpanelbase.reel/config.rb | 9 + .../colorpanelbase.reel/css/colorpanelbase.css | 332 ++++ .../colorpanelbase.reel/css/colorpanelbase.scss | 339 ++++ .../colorpanelbase.reel/img/icon_default.png | Bin 0 -> 3011 bytes .../colorpanelbase.reel/img/icon_nocolor.png | Bin 0 -> 3036 bytes .../_color/colorpanelbase.reel/img/icon_swap.png | Bin 0 -> 2961 bytes js/panels/_color/colorpanelbase.reel/img/knob.png | Bin 0 -> 1036 bytes .../colorpanelpopup.reel/colorpanelpopup.html | 68 + .../_color/colorpanelpopup.reel/colorpanelpopup.js | 466 ++++++ js/panels/_color/colorpanelpopup.reel/config.rb | 9 + .../colorpanelpopup.reel/css/colorpanelpopup.css | 239 +++ .../colorpanelpopup.reel/css/colorpanelpopup.scss | 240 +++ .../colorpanelpopup.reel/img/icon_bitmap.png | Bin 0 -> 3072 bytes .../colorpanelpopup.reel/img/icon_colorwheel.png | Bin 0 -> 3420 bytes .../colorpanelpopup.reel/img/icon_gradient.png | Bin 0 -> 2815 bytes .../colorpanelpopup.reel/img/icon_nofill.png | Bin 0 -> 2951 bytes js/panels/_color/colorpanelpopup.reel/img/knob.png | Bin 0 -> 1036 bytes js/panels/_color/colorpopup-manager.js | 529 +++++++ .../_color/colortoolbar.reel/colortoolbar.html | 54 + js/panels/_color/colortoolbar.reel/colortoolbar.js | 138 ++ js/panels/_color/colortoolbar.reel/config.rb | 9 + .../_color/colortoolbar.reel/css/colortoolbar.css | 45 + .../_color/colortoolbar.reel/css/colortoolbar.scss | 52 + js/panels/color/colorbutton-manager.js | 44 + .../color/colorchippopup.reel/colorchippopup.html | 63 + .../color/colorchippopup.reel/colorchippopup.js | 590 +++++++ js/panels/color/colorchippopup.reel/config.rb | 9 + .../colorchippopup.reel/css/colorchippopup.css | 239 +++ .../colorchippopup.reel/css/colorchippopup.scss | 240 +++ .../color/colorchippopup.reel/img/icon_bitmap.png | Bin 0 -> 3072 bytes .../colorchippopup.reel/img/icon_colorwheel.png | Bin 0 -> 3420 bytes .../colorchippopup.reel/img/icon_gradient.png | Bin 0 -> 2815 bytes .../color/colorchippopup.reel/img/icon_nofill.png | Bin 0 -> 2951 bytes js/panels/color/colorchippopup.reel/img/knob.png | Bin 0 -> 1036 bytes js/panels/color/colorpanel.js | 53 + .../color/colorpanelbase.reel/colorpanelbase.html | 76 + .../color/colorpanelbase.reel/colorpanelbase.js | 1654 ++++++++++++++++++++ js/panels/color/colorpanelbase.reel/config.rb | 9 + .../colorpanelbase.reel/css/colorpanelbase.css | 332 ++++ .../colorpanelbase.reel/css/colorpanelbase.scss | 339 ++++ .../color/colorpanelbase.reel/img/icon_default.png | Bin 0 -> 3011 bytes .../color/colorpanelbase.reel/img/icon_nocolor.png | Bin 0 -> 3036 bytes .../color/colorpanelbase.reel/img/icon_swap.png | Bin 0 -> 2961 bytes js/panels/color/colorpanelbase.reel/img/knob.png | Bin 0 -> 1036 bytes .../colorpanelpopup.reel/colorpanelpopup.html | 68 + .../color/colorpanelpopup.reel/colorpanelpopup.js | 466 ++++++ js/panels/color/colorpanelpopup.reel/config.rb | 9 + .../colorpanelpopup.reel/css/colorpanelpopup.css | 239 +++ .../colorpanelpopup.reel/css/colorpanelpopup.scss | 240 +++ .../color/colorpanelpopup.reel/img/icon_bitmap.png | Bin 0 -> 3072 bytes .../colorpanelpopup.reel/img/icon_colorwheel.png | Bin 0 -> 3420 bytes .../colorpanelpopup.reel/img/icon_gradient.png | Bin 0 -> 2815 bytes .../color/colorpanelpopup.reel/img/icon_nofill.png | Bin 0 -> 2951 bytes js/panels/color/colorpanelpopup.reel/img/knob.png | Bin 0 -> 1036 bytes js/panels/color/colorpopup-manager.js | 529 +++++++ .../color/colortoolbar.reel/colortoolbar.html | 54 + js/panels/color/colortoolbar.reel/colortoolbar.js | 138 ++ js/panels/color/colortoolbar.reel/config.rb | 9 + .../color/colortoolbar.reel/css/colortoolbar.css | 45 + .../color/colortoolbar.reel/css/colortoolbar.scss | 52 + 114 files changed, 10994 insertions(+), 5497 deletions(-) delete mode 100755 js/panels/Color/colorbutton-manager.js delete mode 100755 js/panels/Color/colorchippopup.reel/.sass-cache/2fbca323ccf38cf180e7675ba0d8d3e07adeffea/ColorPanelPopup.scssc delete mode 100755 js/panels/Color/colorchippopup.reel/.sass-cache/6f8390f69a31f1a976968b9c18d0824d78460db2/ColorPanelPopup.scssc delete mode 100755 js/panels/Color/colorchippopup.reel/.sass-cache/de22270a8ac487505e8876f1cd16286e094a5127/ColorPanelBase.scssc delete mode 100755 js/panels/Color/colorchippopup.reel/colorchippopup.html delete mode 100755 js/panels/Color/colorchippopup.reel/colorchippopup.js delete mode 100755 js/panels/Color/colorchippopup.reel/config.rb delete mode 100755 js/panels/Color/colorchippopup.reel/css/colorchippopup.css delete mode 100755 js/panels/Color/colorchippopup.reel/css/colorchippopup.scss delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_bitmap.png delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_colorwheel.png delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_gradient.png delete mode 100755 js/panels/Color/colorchippopup.reel/img/icon_nofill.png delete mode 100755 js/panels/Color/colorchippopup.reel/img/knob.png delete mode 100755 js/panels/Color/colorpanel.js delete mode 100755 js/panels/Color/colorpanelbase.reel/colorpanelbase.html delete mode 100755 js/panels/Color/colorpanelbase.reel/colorpanelbase.js delete mode 100755 js/panels/Color/colorpanelbase.reel/config.rb delete mode 100755 js/panels/Color/colorpanelbase.reel/css/colorpanelbase.css delete mode 100755 js/panels/Color/colorpanelbase.reel/css/colorpanelbase.scss delete mode 100755 js/panels/Color/colorpanelbase.reel/img/icon_default.png delete mode 100755 js/panels/Color/colorpanelbase.reel/img/icon_nocolor.png delete mode 100755 js/panels/Color/colorpanelbase.reel/img/icon_swap.png delete mode 100755 js/panels/Color/colorpanelbase.reel/img/knob.png delete mode 100755 js/panels/Color/colorpanelpopup.reel/colorpanelpopup.html delete mode 100755 js/panels/Color/colorpanelpopup.reel/colorpanelpopup.js delete mode 100755 js/panels/Color/colorpanelpopup.reel/config.rb delete mode 100755 js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.css delete mode 100755 js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.scss delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_bitmap.png delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_colorwheel.png delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_gradient.png delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/icon_nofill.png delete mode 100755 js/panels/Color/colorpanelpopup.reel/img/knob.png delete mode 100755 js/panels/Color/colorpopup-manager.js delete mode 100755 js/panels/Color/colortoolbar.reel/colortoolbar.html delete mode 100755 js/panels/Color/colortoolbar.reel/colortoolbar.js delete mode 100755 js/panels/Color/colortoolbar.reel/config.rb delete mode 100755 js/panels/Color/colortoolbar.reel/css/colortoolbar.css delete mode 100755 js/panels/Color/colortoolbar.reel/css/colortoolbar.scss create mode 100755 js/panels/_color/colorbutton-manager.js create mode 100755 js/panels/_color/colorchippopup.reel/colorchippopup.html create mode 100755 js/panels/_color/colorchippopup.reel/colorchippopup.js create mode 100755 js/panels/_color/colorchippopup.reel/config.rb create mode 100755 js/panels/_color/colorchippopup.reel/css/colorchippopup.css create mode 100755 js/panels/_color/colorchippopup.reel/css/colorchippopup.scss create mode 100755 js/panels/_color/colorchippopup.reel/img/icon_bitmap.png create mode 100755 js/panels/_color/colorchippopup.reel/img/icon_colorwheel.png create mode 100755 js/panels/_color/colorchippopup.reel/img/icon_gradient.png create mode 100755 js/panels/_color/colorchippopup.reel/img/icon_nofill.png create mode 100755 js/panels/_color/colorchippopup.reel/img/knob.png create mode 100755 js/panels/_color/colorpanel.js create mode 100755 js/panels/_color/colorpanelbase.reel/colorpanelbase.html create mode 100755 js/panels/_color/colorpanelbase.reel/colorpanelbase.js create mode 100755 js/panels/_color/colorpanelbase.reel/config.rb create mode 100755 js/panels/_color/colorpanelbase.reel/css/colorpanelbase.css create mode 100755 js/panels/_color/colorpanelbase.reel/css/colorpanelbase.scss create mode 100755 js/panels/_color/colorpanelbase.reel/img/icon_default.png create mode 100755 js/panels/_color/colorpanelbase.reel/img/icon_nocolor.png create mode 100755 js/panels/_color/colorpanelbase.reel/img/icon_swap.png create mode 100755 js/panels/_color/colorpanelbase.reel/img/knob.png create mode 100755 js/panels/_color/colorpanelpopup.reel/colorpanelpopup.html create mode 100755 js/panels/_color/colorpanelpopup.reel/colorpanelpopup.js create mode 100755 js/panels/_color/colorpanelpopup.reel/config.rb create mode 100755 js/panels/_color/colorpanelpopup.reel/css/colorpanelpopup.css create mode 100755 js/panels/_color/colorpanelpopup.reel/css/colorpanelpopup.scss create mode 100755 js/panels/_color/colorpanelpopup.reel/img/icon_bitmap.png create mode 100755 js/panels/_color/colorpanelpopup.reel/img/icon_colorwheel.png create mode 100755 js/panels/_color/colorpanelpopup.reel/img/icon_gradient.png create mode 100755 js/panels/_color/colorpanelpopup.reel/img/icon_nofill.png create mode 100755 js/panels/_color/colorpanelpopup.reel/img/knob.png create mode 100755 js/panels/_color/colorpopup-manager.js create mode 100755 js/panels/_color/colortoolbar.reel/colortoolbar.html create mode 100755 js/panels/_color/colortoolbar.reel/colortoolbar.js create mode 100755 js/panels/_color/colortoolbar.reel/config.rb create mode 100755 js/panels/_color/colortoolbar.reel/css/colortoolbar.css create mode 100755 js/panels/_color/colortoolbar.reel/css/colortoolbar.scss create mode 100755 js/panels/color/colorbutton-manager.js create mode 100755 js/panels/color/colorchippopup.reel/colorchippopup.html create mode 100755 js/panels/color/colorchippopup.reel/colorchippopup.js create mode 100755 js/panels/color/colorchippopup.reel/config.rb create mode 100755 js/panels/color/colorchippopup.reel/css/colorchippopup.css create mode 100755 js/panels/color/colorchippopup.reel/css/colorchippopup.scss create mode 100755 js/panels/color/colorchippopup.reel/img/icon_bitmap.png create mode 100755 js/panels/color/colorchippopup.reel/img/icon_colorwheel.png create mode 100755 js/panels/color/colorchippopup.reel/img/icon_gradient.png create mode 100755 js/panels/color/colorchippopup.reel/img/icon_nofill.png create mode 100755 js/panels/color/colorchippopup.reel/img/knob.png create mode 100755 js/panels/color/colorpanel.js create mode 100755 js/panels/color/colorpanelbase.reel/colorpanelbase.html create mode 100755 js/panels/color/colorpanelbase.reel/colorpanelbase.js create mode 100755 js/panels/color/colorpanelbase.reel/config.rb create mode 100755 js/panels/color/colorpanelbase.reel/css/colorpanelbase.css create mode 100755 js/panels/color/colorpanelbase.reel/css/colorpanelbase.scss create mode 100755 js/panels/color/colorpanelbase.reel/img/icon_default.png create mode 100755 js/panels/color/colorpanelbase.reel/img/icon_nocolor.png create mode 100755 js/panels/color/colorpanelbase.reel/img/icon_swap.png create mode 100755 js/panels/color/colorpanelbase.reel/img/knob.png create mode 100755 js/panels/color/colorpanelpopup.reel/colorpanelpopup.html create mode 100755 js/panels/color/colorpanelpopup.reel/colorpanelpopup.js create mode 100755 js/panels/color/colorpanelpopup.reel/config.rb create mode 100755 js/panels/color/colorpanelpopup.reel/css/colorpanelpopup.css create mode 100755 js/panels/color/colorpanelpopup.reel/css/colorpanelpopup.scss create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_bitmap.png create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_colorwheel.png create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_gradient.png create mode 100755 js/panels/color/colorpanelpopup.reel/img/icon_nofill.png create mode 100755 js/panels/color/colorpanelpopup.reel/img/knob.png create mode 100755 js/panels/color/colorpopup-manager.js create mode 100755 js/panels/color/colortoolbar.reel/colortoolbar.html create mode 100755 js/panels/color/colortoolbar.reel/colortoolbar.js create mode 100755 js/panels/color/colortoolbar.reel/config.rb create mode 100755 js/panels/color/colortoolbar.reel/css/colortoolbar.css create mode 100755 js/panels/color/colortoolbar.reel/css/colortoolbar.scss (limited to 'js') diff --git a/js/panels/Color/colorbutton-manager.js b/js/panels/Color/colorbutton-manager.js deleted file mode 100755 index a189d040..00000000 --- a/js/panels/Color/colorbutton-manager.js +++ /dev/null @@ -1,44 +0,0 @@ -/* -This file contains proprietary software owned by Motorola Mobility, Inc.
-No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
-(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. -
*/ - -//////////////////////////////////////////////////////////////////////// -// -var Montage = require("montage/core/core").Montage, - Component = require("montage/ui/component").Component; -//////////////////////////////////////////////////////////////////////// -//Exporting as ColorPopupManager -exports.ColorButtonManager = Montage.create(Component, { - //////////////////////////////////////////////////////////////////// - // - hasTemplate: { - value: false - }, - //////////////////////////////////////////////////////////////////// - //Storing color manager - _colorManager: { - enumerable: false, - value: null - }, - //////////////////////////////////////////////////////////////////// - // - colorManager: { - enumerable: true, - get: function() { - return this._colorManager; - }, - set: function(value) { - this._colorManager = value; - } - }, - //////////////////////////////////////////////////////////////////// - // - _buttons: { - enumerable: false, - value: {chip: [], fill: [], stroke: [], current: [], previous: [], rgbmode: [], hslmode: [], hexinput: [], nocolor: [], reset: [], swap: [], mlabel1: [], mlabel2: [], mlabel3: []} - } - //////////////////////////////////////////////////////////////////// - //////////////////////////////////////////////////////////////////// -}); \ No newline at end of file diff --git a/js/panels/Color/colorchippopup.reel/.sass-cache/2fbca323ccf38cf180e7675ba0d8d3e07adeffea/ColorPanelPopup.scssc b/js/panels/Color/colorchippopup.reel/.sass-cache/2fbca323ccf38cf180e7675ba0d8d3e07adeffea/ColorPanelPopup.scssc deleted file mode 100755 index aa8bf258..00000000 Binary files a/js/panels/Color/colorchippopup.reel/.sass-cache/2fbca323ccf38cf180e7675ba0d8d3e07adeffea/ColorPanelPopup.scssc and /dev/null differ diff --git a/js/panels/Color/colorchippopup.reel/.sass-cache/6f8390f69a31f1a976968b9c18d0824d78460db2/ColorPanelPopup.scssc b/js/panels/Color/colorchippopup.reel/.sass-cache/6f8390f69a31f1a976968b9c18d0824d78460db2/ColorPanelPopup.scssc deleted file mode 100755 index fca60390..00000000 Binary files a/js/panels/Color/colorchippopup.reel/.sass-cache/6f8390f69a31f1a976968b9c18d0824d78460db2/ColorPanelPopup.scssc and /dev/null differ diff --git a/js/panels/Color/colorchippopup.reel/.sass-cache/de22270a8ac487505e8876f1cd16286e094a5127/ColorPanelBase.scssc b/js/panels/Color/colorchippopup.reel/.sass-cache/de22270a8ac487505e8876f1cd16286e094a5127/ColorPanelBase.scssc deleted file mode 100755 index fd7938d8..00000000 Binary files a/js/panels/Color/colorchippopup.reel/.sass-cache/de22270a8ac487505e8876f1cd16286e094a5127/ColorPanelBase.scssc and /dev/null differ diff --git a/js/panels/Color/colorchippopup.reel/colorchippopup.html b/js/panels/Color/colorchippopup.reel/colorchippopup.html deleted file mode 100755 index 1ae40cc1..00000000 --- a/js/panels/Color/colorchippopup.reel/colorchippopup.html +++ /dev/null @@ -1,63 +0,0 @@ - - - - - - - - - - - - - - - -
-
- -
#
- - - - - - - -
- -
-
-
-
-
-
- -
-
Alpha
-
- -
%
-
- -
- - - - \ No newline at end of file diff --git a/js/panels/Color/colorchippopup.reel/colorchippopup.js b/js/panels/Color/colorchippopup.reel/colorchippopup.js deleted file mode 100755 index 05bcb447..00000000 --- a/js/panels/Color/colorchippopup.reel/colorchippopup.js +++ /dev/null @@ -1,590 +0,0 @@ -/* -This file contains proprietary software owned by Motorola Mobility, Inc.
-No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
-(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. -
*/ - -//////////////////////////////////////////////////////////////////////// -// -var Montage = require("montage/core/core").Montage, - Component = require("montage/ui/component").Component, - Slider = require("js/components/slider.reel").Slider, - Button = require("js/components/button.reel").Button, - HotText = require("js/components/hottext.reel").HotText, - ColorWheel = require("js/components/colorwheel.reel").ColorWheel, - GradientPicker = require("js/components/gradientpicker.reel").GradientPicker; -//////////////////////////////////////////////////////////////////////// -//Exporting as ColorPanelPopup -exports.ColorChipPopup = Montage.create(Component, { - //////////////////////////////////////////////////////////////////// - // - hasTemplate: { - value: true - }, - //////////////////////////////////////////////////////////////////// - //Storing color manager - _colorManager: { - enumerable: false, - value: false - }, - //////////////////////////////////////////////////////////////////// - //Color manager - colorManager: { - enumerable: true, - get: function() { - return this._colorManager; - }, - set: function(value) { - if (value !== this._colorManager) { - this._colorManager = value; - } - } - }, - //////////////////////////////////////////////////////////////////// - // - setNoColor: { - enumerable: true, - value: function (e) { - this.colorManager.applyNoColor(); - } - }, - //////////////////////////////////////////////////////////////////// - // - _colorChipWheel: { - enumerable: false, - value: null - }, - //////////////////////////////////////////////////////////////////// - // - popupContainers: { - enumerable: true, - value: {wheel: null, palette: null, gradient: null, image: null} - }, - //////////////////////////////////////////////////////////////////// - // - popupModes: { - enumerable: true, - value: {wheel: true, palette: true, gradient: true, image: true, nocolor: true} - }, - //////////////////////////////////////////////////////////////////// - // - hexInput: { - enumerable: true, - value: null - }, - //////////////////////////////////////////////////////////////////// - // - prepareForDraw: { - enumerable: false, - value: function () { - //Storing containers for reference - this.popupContainers.wheel = document.getElementById('cc_pu_wheel_container'); - this.popupContainers.palette = document.getElementById("cc_pu_palette_container"); - this.popupContainers.gradient = document.getElementById("cc_pu_gradient_container"); - this.popupContainers.image = document.getElementById("cc_pu_image_container"); - this.popupContainers.alpha = document.getElementById("cc_pu_alpha"); - // - - this.colorManager.addEventListener('change', function (e) { - // - }.bind(this)); - } - }, - //////////////////////////////////////////////////////////////////// - // - willDraw: { - enumerable: false, - value: function() { - // - this.element.style.opacity = 0; - // - this.combo = {}; - this.combo.slider = Slider.create(); - this.combo.hottext = HotText.create(); - this.combo.slider.element = document.getElementById('cc_pu_a_slider'); - this.combo.hottext.element = document.getElementById('cc_pu_a_hottext'); - // - this.cc_hexinput = HotText.create(); - this.cc_hexinput.element = document.getElementById('cc_pu_hottext_hex'); - this.cc_hexinput.labelFunction = this._hexLabel.bind(this); - this.cc_hexinput.inputFunction = this._hexInput.bind(this); - // - if (this.application.ninja.colorController.colorView.currentChip && this.application.ninja.colorController.colorView.currentChip.colorValue && this.application.ninja.colorController.colorView.currentChip.colorValue.a) { - this.combo.slider.value = Math.round(this.application.ninja.colorController.colorView.currentChip.colorValue.a*100); - } else { - this.combo.slider.value = 100; - } - this.application.ninja.colorController.colorModel._alpha = {value: this.combo.slider.value/100, wasSetByCode: true, type: 'change'}; - // - Object.defineBinding(this.combo.hottext, "value", { - boundObject: this.combo.slider, - boundObjectPropertyPath: "value", - oneway: false, - boundValueMutator: function(value) { - return Math.round(value); - } - }); - // - this.combo.slider.maxValue = this.combo.hottext.maxValue = 100; - this.combo.slider.customBackground = this.application.ninja.colorController.colorView._slider3Background.bind(this.application.ninja.colorController.colorView); - // - this.combo.slider.addEventListener('change', this.alphaChange.bind(this)); - this.combo.hottext.addEventListener('change', this.alphaChange.bind(this)); - // - this._colorChipWheel = ColorWheel.create(); - this._colorChipWheel.element = this.popupContainers.wheel; - this._colorChipWheel.element.style.display = 'block'; - this._colorChipWheel.rimWidth = 14; - this._colorChipWheel.strokeWidth = 2; - // - this._colorChipWheel.addEventListener('firstDraw', this, false); - this._colorChipWheel.addEventListener('change', this, false); - this._colorChipWheel.addEventListener('changing', this, false); - } - }, - //////////////////////////////////////////////////////////////////// - // - draw: { - enumerable: false, - value: function() { - // - this.drawPalette(this.defaultPalette); - // - //this.cc_hexinput = this.application.ninja.colorController.colorView.addButton('hexinput', document.getElementById('cc_pu_hottext_hex')); - // - this.combo.slider.needsDraw = true; - this.combo.hottext.needsDraw = true; - this.cc_hexinput.needsDraw = true; - // - var ncButton = document.getElementById('cc_pu_nocolor'), - plButton = document.getElementById('cc_pu_palettes'), - wlButton = document.getElementById('cc_pu_wheel'), - gdButton = document.getElementById('cc_pu_gradients'), - imButton = document.getElementById('cc_pu_images'); - // - if (this.popupModes.nocolor) { - ncButton.addEventListener('click', function () { - this.setNoColor(); - }.bind(this)); - } else { - ncButton.style.display = 'none'; - } - // - if (this.popupModes.palette) { - plButton.addEventListener('click', function () { - this.popupSwitchInputTo(this.popupContainers.palette); - }.bind(this)); - } else { - plButton.style.display = 'none'; - } - // - if (this.popupModes.wheel) { - wlButton.addEventListener('click', function () { - this.popupSwitchInputTo(this.popupContainers.wheel); - }.bind(this)); - } else { - wlButton.style.display = 'none'; - } - // - if (this.popupModes.gradient) { - gdButton.addEventListener('click', function () { - this.popupSwitchInputTo(this.popupContainers.gradient); - }.bind(this)); - } else { - gdButton.style.display = 'none'; - } - // - if (this.popupModes.image) { - imButton.style.opacity = .2;//TODO: Remove, visual feedback for disable button - imButton.addEventListener('click', function () { - //this.popupSwitchInputTo(this.popupContainers.image); - }.bind(this)); - } else { - imButton.style.display = 'none'; - } - // - this.element.style.opacity = 1; - // - this._colorChipWheel.needsDraw = true; - } - }, - //////////////////////////////////////////////////////////////////// - // - didDraw: { - enumerable: false, - value: function() { - // - } - }, - //////////////////////////////////////////////////////////////////// - // - popupSwitchInputTo: { - enumerable: true, - value: function (tab) { - // - if (tab !== this.popupContainers.palette) { - this.popupContainers.palette.style.display = 'none'; - } else { - this.popupContainers.palette.style.display = 'block'; - this.popupContainers.alpha.style.display = 'block'; - // - this.application.ninja.colorController.popupTab = 'palette'; - } - // - if (tab !== this.popupContainers.wheel && this._colorChipWheel.element) { - this._colorChipWheel.element.style.display = 'none'; - } else if (this._colorChipWheel.element && this._colorChipWheel.element.style.display !== 'block'){ - this._colorChipWheel.element.style.display = 'block'; - this.popupContainers.alpha.style.display = 'block'; - // - this.application.ninja.colorController.popupTab = 'wheel'; - } - // - if (tab !== this.popupContainers.image) { - this.popupContainers.image.style.display = 'none'; - } else { - this.popupContainers.image.style.display = 'block'; - this.popupContainers.alpha.style.display = 'block'; - // - this.application.ninja.colorController.popupTab = 'image'; - } - // - if (tab !== this.popupContainers.gradient) { - this.popupContainers.gradient.style.display = 'none'; - } else { - this.popupContainers.gradient.style.display = 'block'; - //TODO: Add fixed size to avoid jump - //this.popupContainers.alpha.style.display = 'none'; - // - this.application.ninja.colorController.popupTab = 'gradient'; - } - } - }, - //////////////////////////////////////////////////////////////////// - // - drawPalette: { - enumerable: true, - value: function (c) { - var i, button; - // - this.popupContainers.palette.style.display = 'block'; - // - for (i in c) { - button = document.createElement('button'); - button.style.background = c[i].css; - button.title = c[i].css.toUpperCase(); - button.colorMode = c[i].mode; - button.colorValue = c[i].value; - this.popupContainers.palette.appendChild(button); - button.addEventListener('click', function (b) { - var rgb, color, hex; - // - if (b._event.srcElement.colorMode !== 'hex') { - //TODO: Add logic to update hex input field for non-hex values - color = b._event.srcElement.colorValue; - color.wasSetByCode = false; - color.type = 'change'; - this.colorManager[b._event.srcElement.colorMode] = color; - } else { - if (this.colorManager.mode === 'hsl') { - rgb = this.colorManager.hexToRgb(b._event.srcElement.colorValue); - if (rgb) { - color = this.colorManager.rgbToHsl(rgb.r, rgb.g, rgb.b); - color.wasSetByCode = false; - color.type = 'change'; - // - hex = b._event.srcElement.colorValue; - if (this.popupModes.wheel) { - this._colorChipWheel.value = this.colorManager.rgbToHsv(color.r, color.g, color.b); - } else { - this.colorManager.hsl = color; - } - } else { - this.setNoColor(); - hex = '------'; - } - } else { - color = this.colorManager.hexToRgb(b._event.srcElement.colorValue); - if (color) { - color.wasSetByCode = false; - color.type = 'change'; - // - hex = b._event.srcElement.colorValue; - if (this.popupModes.wheel) { - this._colorChipWheel.value = this.colorManager.rgbToHsv(color.r, color.g, color.b); - } else { - this.colorManager.rgb = color; - } - } else { - this.setNoColor(); - hex = '------'; - } - } - } - if (hex) { - this._hexString = hex; - this.updateHex(); - } - }.bind(this)); - } - this.popupContainers.palette.style.display = 'none'; - } - }, - //////////////////////////////////////////////////////////////////// - // - _hexLabel: { - enumerable: false, - value: function (v) { - return this._hexString; - } - }, - //////////////////////////////////////////////////////////////////// - // - _hexString: { - enumerable: false, - value: '000000' - }, - //////////////////////////////////////////////////////////////////// - // - updateHex: { - value: function (e) { - // - this.cc_hexinput._valueSyncedWithInputField = false; - this.cc_hexinput.needsDraw = true; - } - }, - //////////////////////////////////////////////////////////////////// - // - _hexInput: { - enumerable: false, - value: function (color) { - //If invalid input, no color will be applied - var update, rgb, hex; - //Allowing multiple hex mode inputs (3 and 6 characters) - switch (color.length) { - case 3: - color = color[0]+color[0]+color[1]+color[1]+color[2]+color[2]; - break; - case 6: - //Nothing - break; - default: - //this._colorManager.applyNoColor(); - return; - break; - } - //Checking for panel mode and converting the color to the panel mode - if (this.colorManager.mode === 'hsl') { - rgb = this.colorManager.hexToRgb(color); - if (rgb) { - update = this.colorManager.rgbToHsl(rgb.r, rgb.g, rgb.b); - update.wasSetByCode = false; - update.type = 'change'; - // - hex = color; - // - if (this.popupModes.wheel) { - this._colorChipWheel.value = this.colorManager.rgbToHsv(update.r, update.g, update.b); - } else { - this.colorManager.hsl = update; - } - } else { - //this.colorManager.applyNoColor(); - hex = '------'; - } - } else { - update = this.colorManager.hexToRgb(color); - if (update) { - update.wasSetByCode = false; - update.type = 'change'; - // - hex = color; - // - if (this.popupModes.wheel) { - this._colorChipWheel.value = this.colorManager.rgbToHsv(update.r, update.g, update.b); - } else { - this.colorManager.rgb = update; - } - } else { - //this.colorManager.applyNoColor(); - hex = '------'; - } - } - // - if (hex) { - this._hexString = hex; - this.updateHex(); - } - } - }, - //////////////////////////////////////////////////////////////////// - // - defaultPalette: { - enumerable: true, - value: [{mode: 'hex', value: '000000', css: '#000000'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '000000', css: '#000000'}, {mode: 'hex', value: '003300', css: '#003300'}, {mode: 'hex', value: '006600', css: '#006600'}, {mode: 'hex', value: '009900', css: '#009900'}, {mode: 'hex', value: '00cc00', css: '#00cc00'}, {mode: 'hex', value: '00ff00', css: '#00ff00'}, {mode: 'hex', value: '330000', css: '#330000'}, {mode: 'hex', value: '333300', css: '#333300'}, {mode: 'hex', value: '336600', css: '#336600'}, {mode: 'hex', value: '339900', css: '#339900'}, {mode: 'hex', value: '33cc00', css: '#33cc00'}, {mode: 'hex', value: '33ff00', css: '#33ff00'}, {mode: 'hex', value: '660000', css: '#660000'}, {mode: 'hex', value: '663300', css: '#663300'}, {mode: 'hex', value: '666600', css: '#666600'}, {mode: 'hex', value: '669900', css: '#669900'}, {mode: 'hex', value: '66cc00', css: '#66cc00'}, {mode: 'hex', value: '66ff00', css: '#66ff00'}, - {mode: 'hex', value: '333333', css: '#333333'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '000033', css: '#000033'}, {mode: 'hex', value: '003333', css: '#003333'}, {mode: 'hex', value: '006633', css: '#006633'}, {mode: 'hex', value: '009933', css: '#009933'}, {mode: 'hex', value: '00cc33', css: '#00cc33'}, {mode: 'hex', value: '00ff33', css: '#00ff33'}, {mode: 'hex', value: '330033', css: '#330033'}, {mode: 'hex', value: '333333', css: '#333333'}, {mode: 'hex', value: '336633', css: '#336633'}, {mode: 'hex', value: '339933', css: '#339933'}, {mode: 'hex', value: '33cc33', css: '#33cc33'}, {mode: 'hex', value: '33ff33', css: '#33ff33'}, {mode: 'hex', value: '660033', css: '#660033'}, {mode: 'hex', value: '663333', css: '#663333'}, {mode: 'hex', value: '666633', css: '#666633'}, {mode: 'hex', value: '669933', css: '#669933'}, {mode: 'hex', value: '66cc33', css: '#66cc33'}, {mode: 'hex', value: '66ff33', css: '#66ff33'}, - {mode: 'hex', value: '666666', css: '#666666'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '000066', css: '#000066'}, {mode: 'hex', value: '003366', css: '#003366'}, {mode: 'hex', value: '006666', css: '#006666'}, {mode: 'hex', value: '009966', css: '#009966'}, {mode: 'hex', value: '00cc66', css: '#00cc66'}, {mode: 'hex', value: '00ff66', css: '#00ff66'}, {mode: 'hex', value: '330066', css: '#330066'}, {mode: 'hex', value: '333366', css: '#333366'}, {mode: 'hex', value: '336666', css: '#336666'}, {mode: 'hex', value: '339966', css: '#339966'}, {mode: 'hex', value: '33cc66', css: '#33cc66'}, {mode: 'hex', value: '33ff66', css: '#33ff66'}, {mode: 'hex', value: '660066', css: '#660066'}, {mode: 'hex', value: '663366', css: '#663366'}, {mode: 'hex', value: '666666', css: '#666666'}, {mode: 'hex', value: '669966', css: '#669966'}, {mode: 'hex', value: '66cc66', css: '#66cc66'}, {mode: 'hex', value: '66ff66', css: '#66ff66'}, - {mode: 'hex', value: '999999', css: '#999999'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '000099', css: '#000099'}, {mode: 'hex', value: '003399', css: '#003399'}, {mode: 'hex', value: '006699', css: '#006699'}, {mode: 'hex', value: '009999', css: '#009999'}, {mode: 'hex', value: '00cc99', css: '#00cc99'}, {mode: 'hex', value: '00ff99', css: '#00ff99'}, {mode: 'hex', value: '330099', css: '#330099'}, {mode: 'hex', value: '333399', css: '#333399'}, {mode: 'hex', value: '336699', css: '#336699'}, {mode: 'hex', value: '339999', css: '#339999'}, {mode: 'hex', value: '33cc99', css: '#33cc99'}, {mode: 'hex', value: '33ff99', css: '#33ff99'}, {mode: 'hex', value: '660099', css: '#660099'}, {mode: 'hex', value: '663399', css: '#663399'}, {mode: 'hex', value: '666699', css: '#666699'}, {mode: 'hex', value: '669999', css: '#669999'}, {mode: 'hex', value: '66cc99', css: '#66cc99'}, {mode: 'hex', value: '66ff99', css: '#66ff99'}, - {mode: 'hex', value: 'cccccc', css: '#cccccc'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '0000cc', css: '#0000cc'}, {mode: 'hex', value: '0033cc', css: '#0033cc'}, {mode: 'hex', value: '0066cc', css: '#0066cc'}, {mode: 'hex', value: '0099cc', css: '#0099cc'}, {mode: 'hex', value: '00cccc', css: '#00cccc'}, {mode: 'hex', value: '00ffcc', css: '#00ffcc'}, {mode: 'hex', value: '3300cc', css: '#3300cc'}, {mode: 'hex', value: '3333cc', css: '#3333cc'}, {mode: 'hex', value: '3366cc', css: '#3366cc'}, {mode: 'hex', value: '3399cc', css: '#3399cc'}, {mode: 'hex', value: '33cccc', css: '#33cccc'}, {mode: 'hex', value: '33ffcc', css: '#33ffcc'}, {mode: 'hex', value: '6600cc', css: '#6600cc'}, {mode: 'hex', value: '6633cc', css: '#6633cc'}, {mode: 'hex', value: '6666cc', css: '#6666cc'}, {mode: 'hex', value: '6699cc', css: '#6699cc'}, {mode: 'hex', value: '66cccc', css: '#66cccc'}, {mode: 'hex', value: '66ffcc', css: '#66ffcc'}, - {mode: 'hex', value: 'ffffff', css: '#ffffff'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '0000ff', css: '#0000ff'}, {mode: 'hex', value: '0033ff', css: '#0033ff'}, {mode: 'hex', value: '0066ff', css: '#0066ff'}, {mode: 'hex', value: '0099ff', css: '#0099ff'}, {mode: 'hex', value: '00ccff', css: '#00ccff'}, {mode: 'hex', value: '00ffff', css: '#00ffff'}, {mode: 'hex', value: '3300ff', css: '#3300ff'}, {mode: 'hex', value: '3333ff', css: '#3333ff'}, {mode: 'hex', value: '3366ff', css: '#3366ff'}, {mode: 'hex', value: '3399ff', css: '#3399ff'}, {mode: 'hex', value: '33ccff', css: '#33ccff'}, {mode: 'hex', value: '33ffff', css: '#33ffff'}, {mode: 'hex', value: '6600ff', css: '#6600ff'}, {mode: 'hex', value: '6633ff', css: '#6633ff'}, {mode: 'hex', value: '6666ff', css: '#6666ff'}, {mode: 'hex', value: '6699ff', css: '#6699ff'}, {mode: 'hex', value: '66ccff', css: '#66ccff'}, {mode: 'hex', value: '66ffff', css: '#66ffff'}, - {mode: 'hex', value: 'ff0000', css: '#ff0000'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '990000', css: '#990000'}, {mode: 'hex', value: '993300', css: '#993300'}, {mode: 'hex', value: '996600', css: '#996600'}, {mode: 'hex', value: '999900', css: '#999900'}, {mode: 'hex', value: '99cc00', css: '#99cc00'}, {mode: 'hex', value: '99ff00', css: '#99ff00'}, {mode: 'hex', value: 'cc0000', css: '#cc0000'}, {mode: 'hex', value: 'cc3300', css: '#cc3300'}, {mode: 'hex', value: 'cc6600', css: '#cc6600'}, {mode: 'hex', value: 'cc9900', css: '#cc9900'}, {mode: 'hex', value: 'cccc00', css: '#cccc00'}, {mode: 'hex', value: 'ccff00', css: '#ccff00'}, {mode: 'hex', value: 'ff0000', css: '#ff0000'}, {mode: 'hex', value: 'ff3300', css: '#ff3300'}, {mode: 'hex', value: 'ff6600', css: '#ff6600'}, {mode: 'hex', value: 'ff9900', css: '#ff9900'}, {mode: 'hex', value: 'ffcc00', css: '#ffcc00'}, {mode: 'hex', value: 'ffff00', css: '#ffff00'}, - {mode: 'hex', value: '00ff00', css: '#00ff00'}, {mode: 'hex', value: '808080', css: '#808080'}, {mode: 'hex', value: '990033', css: '#990033'}, {mode: 'hex', value: '993333', css: '#993333'}, {mode: 'hex', value: '996633', css: '#996633'}, {mode: 'hex', value: '999933', css: '#999933'}, {mode: 'hex', value: '99cc33', css: '#99cc33'}, {mode: 'hex', value: '99ff33', css: '#99ff33'}, {mode: 'hex', value: 'cc0033', css: '#cc0033'}, {mode: 'hex', value: 'cc3333', css: '#cc3333'}, {mode: 'hex', value: 'cc6633', css: '#cc6633'}, {mode: 'hex', value: 'cc9933', css: '#cc9933'}, {mode: 'hex', value: 'cccc33', css: '#cccc33'}, {mode: 'hex', value: 'ccff33', css: '#ccff33'}, {mode: 'hex', value: 'ff0033', css: '#ff0033'}, {mode: 'hex', value: 'ff3333', css: '#ff3333'}, {mode: 'hex', value: 'ff6633', css: '#ff6633'}, {mode: 'hex', v