From 40622aa97d31837254996b718b0a6feca2bcd0ce Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 8 Feb 2012 14:41:10 -0800 Subject: Styles Controller - added methods to get keyframe animation rules --- js/controllers/styles-controller.js | 44 +++++++++++++++++++++++++++++++++++-- 1 file changed, 42 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index 011caec5..ff59c8f8 100644 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -179,10 +179,14 @@ var stylesController = exports.StylesController = Montage.create(Component, { this.styleSheetModified(stylesheet); rule = stylesheet.rules[index]; - + ///// attach specificity to rule object + ///// if rule is css keyframes, return rule and don't attach specificity + if (rule instanceof WebKitCSSKeyframesRule) { + return rule; + } rule[this.CONST.SPECIFICITY_KEY] = this.getSpecificity(rule.selectorText); - + ///// return the rule we just inserted return rule; } @@ -840,6 +844,27 @@ var stylesController = exports.StylesController = Montage.create(Component, { } }, + ///// Get Animation Rule With Name + ///// Returns the CSSKeyframesRule with given name + + getAnimationRuleWithName : { + value: function(name) { + var sheets = this._activeDocument._document.styleSheets, + rules, i, j, rule; + + for(i = 0; i < sheets.length; i++) { + rules = sheets[i].rules; + for(j = 0; j < rules.length; j++) { + rule = rules[j]; + if(rule instanceof WebKitCSSKeyframesRule && rule.name === name) { + return rule; + } + } + } + + return; + } + }, ///// Delete style ///// Removes the property from the style declaration/rule @@ -1045,6 +1070,21 @@ var stylesController = exports.StylesController = Montage.create(Component, { } }, + ///// Get Element Animation Rule + ///// Returns the CSSKeyframesRule applied to an element + + getElementAnimationRule : { + value: function(element) { + var animationName = this.getElementStyle(element, '-webkit-animation-name'); + + if(!animationName) { + return null; + } + + return this.getAnimationRuleWithName(animationName); + } + }, + ///// Create Rule From Inline Style ///// Creates a rule for an inline style with a specified, or partially random selector. -- cgit v1.2.3 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 --- js/components/ui/color-chip.reel/color-chip.js | 80 +++++++++++++++++++--- js/controllers/elements/stage-controller.js | 5 +- js/data/pi/pi-data.js | 16 ++++- js/io/document/html-document.js | 3 + js/panels/properties/content.reel/content.js | 37 ++++++++++ .../properties/sections/custom.reel/custom.js | 46 +++++++++++-- 6 files changed, 172 insertions(+), 15 deletions(-) (limited to 'js') diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js index 5bef7020..4c288084 100644 --- a/js/components/ui/color-chip.reel/color-chip.js +++ b/js/components/ui/color-chip.reel/color-chip.js @@ -9,32 +9,96 @@ var Montage = require("montage/core/core").Montage, var ColorChip = exports.ColorChip = Montage.create(Component, { + chip: { + value: false + }, + hasIcon: { value: true }, + iconType: { + value: null + }, + mode: { value: "stroke" }, - prepareForDraw: { - value: function() { -// this.colorButton.props = {side: 'right', align: 'bottom', wheel: true, palette: true, gradient: true, image: true, offset: 20}; -// this.application.ninja.colorController.addButton('chip', this.colorButton); + offset: { + value: 20 + }, + initialColor: { + value: false + }, + + changeDelegate: { + value: null + }, + prepareForDraw: { + value: function() { this.addEventListener("firstDraw", this, false); } }, draw: { value: function() { + if(this.hasIcon) { + var icon = this.iconType || this.mode + "Icon"; + this.application.ninja.colorController.addButton(icon, this.icon); + } - if(this.hasIcon) this.application.ninja.colorController.addButton(this.mode + 'Icon', this.icon); - -// this.application.ninja.colorController.addButton(this.mode, this.chipBtn); - this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: 20}; + this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset}; this.application.ninja.colorController.addButton(this.mode, this.chipBtn); + + /* + if(this.chip) { + //this.application.ninja.colorController.addButton('fillIcon', this.icon); + this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: 0}; + this.application.ninja.colorController.addButton(this.mode, this.chipBtn); + } else { + //if(this.hasIcon) this.application.ninja.colorController.addButton(this.mode + 'Icon', this.icon); + this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: 20}; + this.application.ninja.colorController.addButton(this.mode, this.chipBtn); + } + */ + + + } + }, + + handleFirstDraw: { + 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)"; + + if(this.initialColor) { + console.log(this.initialColor); + var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.initialColor); + mode = colorObj.mode; + r = colorObj.value.r; + g = colorObj.value.g; + b = colorObj.value.b; + a = colorObj.value.a; + css = colorObj.css; + } + + this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css}); + //this.chipBtn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 0, b: 0}, css: 'rgb(255,0,0)'}); + + this.chipBtn.addEventListener("change", this, false); + } + } + }, + + handleChange: { + value: function(evt) { + if(this.changeDelegate && typeof(this.changeDelegate === "function")) { + this.changeDelegate(evt); + } } } diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js index b8170826..e9fc6bce 100644 --- a/js/controllers/elements/stage-controller.js +++ b/js/controllers/elements/stage-controller.js @@ -75,6 +75,8 @@ exports.StageController = Montage.create(ElementController, { getProperty: { value: function(el, p) { switch(p) { + case "background" : + return el.elementModel.stageBackground.style.getProperty(p); case "border": return el.elementModel.stageView.style.getProperty(p); case "height": @@ -92,7 +94,8 @@ exports.StageController = Montage.create(ElementController, { value: function(el, p, value) { switch(p) { case "background": - el.elementModel.body.style.setProperty(p, value); + console.log(value); + el.elementModel.stageBackground.style.setProperty(p, value); break; case "overflow": el.elementModel.viewPort.style.setProperty(p, value); diff --git a/js/data/pi/pi-data.js b/js/data/pi/pi-data.js index 10b33a0e..a6811a20 100644 --- a/js/data/pi/pi-data.js +++ b/js/data/pi/pi-data.js @@ -10,7 +10,21 @@ var Montage = require("montage/core/core").Montage, exports.PiData = Montage.create( Montage, { stagePi: { - value: [] + value: [ + { + label: "Style", + + Section: [ + [ + { + type : "chip", + id : "background", + prop: "background" + } + ] + ] + } + ] }, blockPi: { diff --git a/js/io/document/html-document.js b/js/io/document/html-document.js index c44dfe75..dd3507c2 100644 --- a/js/io/document/html-document.js +++ b/js/io/document/html-document.js @@ -398,6 +398,9 @@ var HTMLDocument = exports.HTMLDocument = Montage.create(baseDocumentModule.Base this.documentRoot.elementModel.stageView = this.documentRoot.elementModel.defaultRule.cssRules[j]; + } else if(this.documentRoot.elementModel.defaultRule.cssRules[j].selectorText === "#stageBG") { + + this.documentRoot.elementModel.stageBackground = this.documentRoot.elementModel.defaultRule.cssRules[j]; } } diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js index 0088447a..b15f2d71 100644 --- a/js/panels/properties/content.reel/content.js +++ b/js/panels/properties/content.reel/content.js @@ -150,6 +150,43 @@ exports.Content = Montage.create(Component, { this.customPi = stage.elementModel.pi; this.displayCustomProperties(stage, stage.elementModel.pi); } + + // For now hardcode the background since it is the only custom property + // No need to loop through all the properties. + var backgroundChip = this.customSections[0].content.controls["background"]; + backgroundChip.initialColor = ElementsMediator.getProperty(stage, "background"); + + // Get stage color + //var backgroundColor = + //console.log(backgroundColor); + + /* + var customPI = PiData[this.customPi]; + // Get all the custom section for the custom PI + for(var i = 0, customSec; customSec = customPI[i]; i++) { + + // Now set the Fields for the custom PI + for(var j = 0, fields; fields = customSec.Section[j]; j++) { + for(var k = 0, control; control = fields[k]; k++) { + + var colorChipEl = this.customSections[i].content.controls[control.id]; + this.foo = colorChipEl; + colorChipEl.addEventListener("firstDraw", this, false); + + } + } + } + */ + } + }, + + foo: { + value: null + }, + + handleFirstDraw: { + value: function() { + this.foo.chipBtn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 0, b: 0}, css: 'rgb(255,0,0)'}); } }, 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 ef032412216d437ce1c7dfc9050ab41adf0594c0 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 13 Feb 2012 10:28:44 -0800 Subject: Tree Components - Change the way delegate methods are called --- .../treeview/ninja-branch.reel/ninja-branch.html | 3 +- .../treeview/ninja-branch.reel/ninja-branch.js | 1 - .../treeview/ninja-leaf.reel/ninja-leaf.html | 2 +- .../treeview/ninja-leaf.reel/ninja-leaf.js | 43 ++++++++++++++++++---- 4 files changed, 39 insertions(+), 10 deletions(-) (limited to 'js') diff --git a/js/components/treeview/ninja-branch.reel/ninja-branch.html b/js/components/treeview/ninja-branch.reel/ninja-branch.html index 4d557a94..13f1c575 100644 --- a/js/components/treeview/ninja-branch.reel/ninja-branch.html +++ b/js/components/treeview/ninja-branch.reel/ninja-branch.html @@ -110,7 +110,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot "name": "Repetition", "properties": { "element": { "#": "branchList" }, - "contentController": {"@": "arrayController" } + "contentController": {"@": "arrayController" }, + "selectionEnabled": true } }, diff --git a/js/components/treeview/ninja-branch.reel/ninja-branch.js b/js/components/treeview/ninja-branch.reel/ninja-branch.js index 6b9ebb10..0d1a1d0e 100644 --- a/js/components/treeview/ninja-branch.reel/ninja-branch.js +++ b/js/components/treeview/ninja-branch.reel/ninja-branch.js @@ -5,7 +5,6 @@ */ var Montage = require("montage").Montage, - Component = require("montage/ui/component").Component, TreeNode = require("js/components/treeview/tree-node").TreeNode; var Branch = exports.Branch = Montage.create(TreeNode, { diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.html b/js/components/treeview/ninja-leaf.reel/ninja-leaf.html index bd8e8acd..310274bc 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.html +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.html @@ -37,7 +37,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
-
+
\ No newline at end of file diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.js b/js/components/treeview/ninja-leaf.reel/ninja-leaf.js index bd566b26..749df3cd 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.js +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.js @@ -5,7 +5,6 @@ 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; TreeNode = require("js/components/treeview/tree-node").TreeNode; exports.Leaf = Montage.create(TreeNode, { @@ -14,19 +13,39 @@ exports.Leaf = Montage.create(TreeNode, { }, templateDidLoad : { value: function() { - this.needsDraw = true; + var event = this.treeView.activationEvent; + + ///// Re-set the activation event + if(event && event !== this.activationEvent) { + this.delegateEventMap[event] = this.delegateEventMap[this.activationEvent]; + delete this.delegateEventMap[this.activationEvent]; + this.activationEvent = this.treeView.activationEvent; + } } }, prepareForDraw: { value : function() { - this.activationEvent = this.activationEvent || 'click'; - this.label._element.addEventListener(this.activationEvent, this.handleNodeActivation.bind(this), false); + var el = this.label._element; + + Object.keys(this.delegateEventMap).forEach(function(event) { + el.addEventListener(event, this, false); + }, this); + } }, - handleNodeActivation: { + handleEvent : { value: function(e) { - console.log(this.sourceObject); - this.treeView.contentController.delegate.applyPresetSelection(this.sourceObject); + var delegateMethod = this.delegateEventMap[e._event.type]; + this.callDelegateMethod(delegateMethod); + } + }, + callDelegateMethod : { + value: function(methodName) { + console.log("Delegate method name: ", methodName); + var delegate = this.treeView.contentController.delegate; + if(delegate && typeof delegate[methodName] === 'function') { + delegate[methodName](this.sourceObject); + } } }, draw : { @@ -35,6 +54,16 @@ exports.Leaf = Montage.create(TreeNode, { this._labelText = this.sourceObject[this.labelKey]; } } + }, + activationEvent : { + value : 'click' + }, + delegateEventMap : { + value: { + 'click' : 'handleNodeActivation', + 'dragstart' : 'handleDragStart', + 'dragend' : 'handleDragEnd' + } } -- cgit v1.2.3 From 85afed8ed707ce20cd28c3139680dfef6fd4b23d Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 13 Feb 2012 11:42:09 -0800 Subject: Ninja leaf - remove console lot --- js/components/treeview/ninja-leaf.reel/ninja-leaf.js | 1 - 1 file changed, 1 deletion(-) (limited to 'js') diff --git a/js/components/treeview/ninja-leaf.reel/ninja-leaf.js b/js/components/treeview/ninja-leaf.reel/ninja-leaf.js index 749df3cd..0b7a171e 100644 --- a/js/components/treeview/ninja-leaf.reel/ninja-leaf.js +++ b/js/components/treeview/ninja-leaf.reel/ninja-leaf.js @@ -41,7 +41,6 @@ exports.Leaf = Montage.create(TreeNode, { }, callDelegateMethod : { value: function(methodName) { - console.log("Delegate method name: ", methodName); var delegate = this.treeView.contentController.delegate; if(delegate && typeof delegate[methodName] === 'function') { delegate[methodName](this.sourceObject); -- 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/components/ui/color-chip.reel/color-chip.js | 16 ---------------- js/controllers/elements/stage-controller.js | 1 - js/panels/properties/content.reel/content.js | 8 -------- js/panels/properties/sections/custom.reel/custom.js | 13 +++++++++---- 4 files changed, 9 insertions(+), 29 deletions(-) (limited to 'js') diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js index 4c288084..e51bdd8a 100644 --- a/js/components/ui/color-chip.reel/color-chip.js +++ b/js/components/ui/color-chip.reel/color-chip.js @@ -53,19 +53,6 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset}; this.application.ninja.colorController.addButton(this.mode, this.chipBtn); - /* - if(this.chip) { - //this.application.ninja.colorController.addButton('fillIcon', this.icon); - this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: 0}; - this.application.ninja.colorController.addButton(this.mode, this.chipBtn); - } else { - //if(this.hasIcon) this.application.ninja.colorController.addButton(this.mode + 'Icon', this.icon); - this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: 20}; - this.application.ninja.colorController.addButton(this.mode, this.chipBtn); - } - */ - - } }, @@ -76,7 +63,6 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { var mode = "rgb", r = 0, g = 0, b = 0, a = 1, css = "rgb(255,0,0)"; if(this.initialColor) { - console.log(this.initialColor); var colorObj = this.application.ninja.colorController.getColorObjFromCss(this.initialColor); mode = colorObj.mode; r = colorObj.value.r; @@ -87,8 +73,6 @@ var ColorChip = exports.ColorChip = Montage.create(Component, { } this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css}); - //this.chipBtn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 0, b: 0}, css: 'rgb(255,0,0)'}); - this.chipBtn.addEventListener("change", this, false); } } diff --git a/js/controllers/elements/stage-controller.js b/js/controllers/elements/stage-controller.js index e9fc6bce..af7c4858 100644 --- a/js/controllers/elements/stage-controller.js +++ b/js/controllers/elements/stage-controller.js @@ -94,7 +94,6 @@ exports.StageController = Montage.create(ElementController, { value: function(el, p, value) { switch(p) { case "background": - console.log(value); el.elementModel.stageBackground.style.setProperty(p, value); break; case "overflow": diff --git a/js/panels/properties/content.reel/content.js b/js/panels/properties/content.reel/content.js index b15f2d71..1ec6d769 100644 --- a/js/panels/properties/content.reel/content.js +++ b/js/panels/properties/content.reel/content.js @@ -156,10 +156,6 @@ exports.Content = Montage.create(Component, { var backgroundChip = this.customSections[0].content.controls["background"]; backgroundChip.initialColor = ElementsMediator.getProperty(stage, "background"); - // Get stage color - //var backgroundColor = - //console.log(backgroundColor); - /* var customPI = PiData[this.customPi]; // Get all the custom section for the custom PI @@ -180,10 +176,6 @@ exports.Content = Montage.create(Component, { } }, - foo: { - value: null - }, - handleFirstDraw: { value: function() { this.foo.chipBtn.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 255, g: 0, b: 0}, css: 'rgb(255,0,0)'}); 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 From 7b0910720a6979bf41c216c5072d5c7a91e6d0b7 Mon Sep 17 00:00:00 2001 From: Jose Antonio Marquez Date: Sat, 11 Feb 2012 23:04:36 -0800 Subject: Bug Fixes IKNINJA-1101 IKNINJA-1079 IKNINJA-1144 --- js/components/colorwheel.reel/compass_app_log.txt | 3 -- js/components/popup.reel/compass_app_log.txt | 48 ---------------------- .../Color/colorpanelbase.reel/colorpanelbase.js | 8 ++-- .../colorpanelpopup.reel/css/colorpanelpopup.css | 4 +- .../colorpanelpopup.reel/css/colorpanelpopup.scss | 4 +- 5 files changed, 8 insertions(+), 59 deletions(-) delete mode 100644 js/components/colorwheel.reel/compass_app_log.txt delete mode 100644 js/components/popup.reel/compass_app_log.txt (limited to 'js') diff --git a/js/components/colorwheel.reel/compass_app_log.txt b/js/components/colorwheel.reel/compass_app_log.txt deleted file mode 100644 index 815feb02..00000000 --- a/js/components/colorwheel.reel/compass_app_log.txt +++ /dev/null @@ -1,3 +0,0 @@ -2011-11-23 01:07:12 create css/colorwheel.css -2011-11-23 01:07:25 overwrite css/colorwheel.css -2011-12-20 17:04:05 overwrite css/colorwheel.css diff --git a/js/components/popup.reel/compass_app_log.txt b/js/components/popup.reel/compass_app_log.txt deleted file mode 100644 index 8a3fb984..00000000 --- a/js/components/popup.reel/compass_app_log.txt +++ /dev/null @@ -1,48 +0,0 @@ -2011-06-28 18:13:06 create css/popup.css -2011-06-28 18:13:12 identical css/popup.css -2011-06-28 18:14:08 overwrite css/popup.css -2011-06-28 18:14:20 overwrite css/popup.css -2011-06-28 18:14:29 overwrite css/popup.css -2011-06-28 18:17:23 overwrite css/popup.css -2011-06-28 18:17:27 overwrite css/popup.css -2011-06-28 18:17:56 overwrite css/popup.css -2011-06-28 18:18:09 overwrite css/popup.css -2011-06-28 18:20:30 overwrite css/popup.css -2011-06-28 18:22:35 overwrite css/popup.css -2011-06-28 18:24:12 overwrite css/popup.css -2011-06-28 18:24:23 overwrite css/popup.css -2011-06-28 18:24:33 overwrite css/popup.css -2011-06-28 18:25:17 overwrite css/popup.css -2011-06-28 18:26:21 overwrite css/popup.css -2011-06-28 18:26:33 overwrite css/popup.css -2011-06-28 18:26:42 overwrite css/popup.css -2011-06-28 18:26:57 overwrite css/popup.css -2011-06-28 18:29:57 overwrite css/popup.css -2011-06-28 18:30:14 overwrite css/popup.css -2011-06-28 18:30:23 overwrite css/popup.css -2011-06-28 18:30:48 overwrite css/popup.css -2011-06-28 18:31:03 overwrite css/popup.css -2011-06-29 10:18:31 overwrite css/popup.css -2011-06-29 10:18:47 overwrite css/popup.css -2011-06-29 10:37:19 overwrite css/popup.css -2011-06-29 10:40:29 overwrite css/popup.css -2011-06-29 10:45:37 overwrite css/popup.css -2011-06-29 10:45:53 identical css/popup.css -2011-06-29 10:46:52 overwrite css/popup.css -2011-06-29 10:47:02 identical css/popup.css -2011-06-29 13:30:47 overwrite css/popup.css -2011-06-29 13:31:14 overwrite css/popup.css -2011-12-20 17:06:48 overwrite css/popup.css -2011-12-22 11:29:15 overwrite css/popup.css -2011-12-22 11:29:24 identical css/popup.css -2011-12-22 11:30:05 overwrite css/popup.css -2011-12-22 11:30:33 overwrite css/popup.css -2011-12-22 11:30:51 overwrite css/popup.css -2011-12-22 11:32:30 overwrite css/popup.css -2011-12-22 11:33:06 overwrite css/popup.css -2011-12-22 11:33:12 overwrite css/popup.css -2011-12-22 11:33:32 identical css/popup.css -2011-12-22 11:33:36 overwrite css/popup.css -2011-12-22 11:34:48 overwrite css/popup.css -2012-01-26 11:42:18 overwrite css/popup.css -2012-01-26 11:42:20 overwrite css/popup.css diff --git a/js/panels/Color/colorpanelbase.reel/colorpanelbase.js b/js/panels/Color/colorpanelbase.reel/colorpanelbase.js index 9a27689a..ff738bbe 100644 --- a/js/panels/Color/colorpanelbase.reel/colorpanelbase.js +++ b/js/panels/Color/colorpanelbase.reel/colorpanelbase.js @@ -1499,13 +1499,13 @@ exports.ColorPanelBase = Montage.create(Component, { // if (type._event.clientX && type._event.clientY) { // - if (type._event.clientX > (parseInt(document.width)/2)) { + //if (type._event.clientX > (parseInt(document.width)/2)) { //TODO: Fix offset hack this.application.ninja.colorController.colorPopupManager.showColorPopup((type._event.clientX - type._event.offsetX) +'px', (type._event.target.clientHeight/2+type._event.clientY - type._event.offsetY)+'px', 'right', 'top'); - } else { + //} else { // - this.application.ninja.colorController.colorPopupManager.showColorPopup((type._event.clientX - type._event.offsetX)+parseInt(type._event.target.offsetWidth)+'px', (type._event.target.offsetHeight/2+type._event.clientY - type._event.offsetY)+'px', 'left', 'top'); - } + // this.application.ninja.colorController.colorPopupManager.showColorPopup((type._event.clientX - type._event.offsetX)+parseInt(type._event.target.offsetWidth)+'px', (type._event.target.offsetHeight/2+type._event.clientY - type._event.offsetY)+'px', 'left', 'top'); + //} } } } else { diff --git a/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.css b/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.css index 6a418279..4db0abff 100644 --- a/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.css +++ b/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.css @@ -6,7 +6,7 @@ */ /* line 12, colorpanelpopup.scss */ .cpp_popup { - overflow: none; + overflow: hidden; font-size: 12px; text-shadow: 1px 1px 1px #000; font-family: 'Droid Sans', sans-serif; @@ -28,7 +28,7 @@ text-indent: -9999px; overflow: hidden; float: right; - padding: none; + padding: 0; cursor: pointer; border: 1px solid transparent; } diff --git a/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.scss b/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.scss index 20481fb6..1f63658a 100644 --- a/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.scss +++ b/js/panels/Color/colorpanelpopup.reel/css/colorpanelpopup.scss @@ -10,7 +10,7 @@ $grey_light: #494949; .cpp_popup { - overflow: none; + overflow: hidden; font-size: 12px; text-shadow: 1px 1px 1px #000; font-family: 'Droid Sans', sans-serif; @@ -32,7 +32,7 @@ $grey_light: #494949; text-indent: -9999px; overflow: hidden; float: right; - padding: none; + padding: 0; cursor: pointer; border: 1px solid transparent; } -- cgit v1.2.3 From a738121a921e4c721b280434952b415b9ab3b1a8 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Mon, 13 Feb 2012 15:18:55 -0800 Subject: Styles Controller - Separate css animation rule getters To add document- and sheet-specific getters. --- js/controllers/styles-controller.js | 58 +++++++++++++++++++++++++++++-------- 1 file changed, 46 insertions(+), 12 deletions(-) (limited to 'js') diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js index ff59c8f8..44ca50e1 100644 --- a/js/controllers/styles-controller.js +++ b/js/controllers/styles-controller.js @@ -128,7 +128,7 @@ var stylesController = exports.StylesController = Montage.create(Component, { } else { this._defaultStylesheet = sheets[lastIndex]; } - + } } }, @@ -848,17 +848,15 @@ var stylesController = exports.StylesController = Montage.create(Component, { ///// Returns the CSSKeyframesRule with given name getAnimationRuleWithName : { - value: function(name) { - var sheets = this._activeDocument._document.styleSheets, - rules, i, j, rule; - - for(i = 0; i < sheets.length; i++) { - rules = sheets[i].rules; - for(j = 0; j < rules.length; j++) { - rule = rules[j]; - if(rule instanceof WebKitCSSKeyframesRule && rule.name === name) { - return rule; - } + value: function(name, document) { + var doc = document || this._activeDocument._document, + animRules = this.getDocumentAnimationRules(doc), + rule, i; + + for(i = 0; i < animRules.length; i++) { + rule = animRules[i]; + if(rule.name === name) { + return rule; } } @@ -866,6 +864,42 @@ var stylesController = exports.StylesController = Montage.create(Component, { } }, + ///// Get Document Animation Rules + ///// Returns all CSSKeyframesRules in active document, or in + ///// optionally passed-in document + ///// If none are found, returns an empty array + + getDocumentAnimationRules : { + value: function(document) { + var sheets = (document) ? document.styleSheets : this._activeDocument._document.styleSheets, + rules = []; + + nj.toArray(sheets).forEach(function(sheet) { + rules = rules.concat(this.getStyleSheetAnimationRules(sheet)); + }, this); + + return rules; + } + }, + + ///// Get Style Sheet Animation Rules + ///// Returns all CSSKeyframesRules from the given stylesheet + ///// If none are found, returns an empty array + + getStyleSheetAnimationRules : { + value: function(sheet) { + var rules = []; + + if(sheet.rules) { + rules = rules.concat(nj.toArray(sheet.rules).filter(function(rule) { + return rule instanceof WebKitCSSKeyframesRule; + })); + } + + return rules; + } + }, + ///// Delete style ///// Removes the property from the style declaration/rule ///// Returns the rule -- cgit v1.2.3