From f277cbad9bbfc077fc37546758b85408419951f2 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Sun, 27 May 2012 17:19:07 -0700 Subject: CSS Panel - Prevent Animation on New Style --- .../css-panel/style-declaration.reel/style-declaration.css | 3 +++ .../css-panel/style-declaration.reel/style-declaration.js | 10 +++++++++- js/panels/css-panel/styles-view-delegate.js | 2 +- 3 files changed, 13 insertions(+), 2 deletions(-) (limited to 'js') diff --git a/js/panels/css-panel/style-declaration.reel/style-declaration.css b/js/panels/css-panel/style-declaration.reel/style-declaration.css index 6be8d33c..d4755b04 100644 --- a/js/panels/css-panel/style-declaration.reel/style-declaration.css +++ b/js/panels/css-panel/style-declaration.reel/style-declaration.css @@ -10,4 +10,7 @@ } .drag-over { /*background-color: red;*/ +} +.css-animation-prevent * { + -webkit-transition-duration: 0 !important; } \ No newline at end of file diff --git a/js/panels/css-panel/style-declaration.reel/style-declaration.js b/js/panels/css-panel/style-declaration.reel/style-declaration.js index 57cbdb63..6187989b 100644 --- a/js/panels/css-panel/style-declaration.reel/style-declaration.js +++ b/js/panels/css-panel/style-declaration.reel/style-declaration.js @@ -216,7 +216,15 @@ exports.StyleDeclaration = Montage.create(Component, { }, addNewStyle : { - value: function() { + value: function(preventAnimation) { + if(preventAnimation) { + this.element.classList.add('css-animation-prevent'); + + setTimeout(function() { + this.element.classList.remove('css-animation-prevent'); + }.bind(this), 1000); + } + this.addStyle('property', 'value', { isEmpty : true }); diff --git a/js/panels/css-panel/styles-view-delegate.js b/js/panels/css-panel/styles-view-delegate.js index 5229b92e..d607a0ba 100644 --- a/js/panels/css-panel/styles-view-delegate.js +++ b/js/panels/css-panel/styles-view-delegate.js @@ -145,7 +145,7 @@ exports.StylesViewDelegate = Montage.create(Component, { if(nextFocus) { nextFocus.propertyField.start(); } else if(style.dirty) { - style.parentComponent.parentComponent.addNewStyle(); + style.parentComponent.parentComponent.addNewStyle(true); style.editingNewStyle = false; setTimeout(function() { style.getSiblingStyle('next').propertyField.start(); -- cgit v1.2.3 From 17acb39a717e5fb965dd494c10c77586ef71b827 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 29 May 2012 15:06:54 -0700 Subject: CSS Panel - Find correct previously-rendered rule list after selection. --- .../css-panel/rule-list-container.reel/rule-list-container.js | 8 +------- 1 file changed, 1 insertion(+), 7 deletions(-) (limited to 'js') diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js index e2e269ba..c7766d08 100644 --- a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js +++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js @@ -45,7 +45,7 @@ exports.RuleListContainer = Montage.create(Component, { for(i = 0; i 1) { + if(selection.length === list.selection.length) { matchesAll = selection.every(function(element, index, array) { return list.selection.indexOf(element) !== -1; }); @@ -53,12 +53,6 @@ exports.RuleListContainer = Montage.create(Component, { if(matchesAll) { break; } - } else { - ///// Selection (single element or stylesheet) is the same, - ///// Use the existing rule list - if(list.selection[0] === selection[0]) { - break; - } } list = null; -- cgit v1.2.3 From 1fda3cea5f8dced1e14533969722e30b8ea1e6fa Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Tue, 29 May 2012 15:28:39 -0700 Subject: CSS Panel - Handle focus after editing selector --- .../rule-components/css-style-rule.reel/css-style-rule.js | 9 +++++++++ js/panels/css-panel/styles-view-delegate.js | 7 +++++++ 2 files changed, 16 insertions(+) (limited to 'js') diff --git a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js index e0ffb1a8..54181bf3 100644 --- a/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js +++ b/js/panels/css-panel/rule-components/css-style-rule.reel/css-style-rule.js @@ -88,6 +88,14 @@ exports.CssStyleRule = Montage.create(Component, { } } }, + handleStop : { + value: function(e) { + if(this.focusDelegate) { + e._event.detail.preventDefault(); + this.focusDelegate.handleSelectorStop(this.rule, this.selectorField.value, this); + } + } + }, handleMouseover: { value: function(e) { if(this.focusDelegate) { @@ -125,6 +133,7 @@ exports.CssStyleRule = Montage.create(Component, { this.declarationComponent.type = 'inline'; } else { this.selectorField.addEventListener('change', this, false); + this.selectorField.addEventListener('stop', this, false); this.selectorField.element.addEventListener('mouseover', this, false); this.selectorField.element.addEventListener('mouseout', this, false); } diff --git a/js/panels/css-panel/styles-view-delegate.js b/js/panels/css-panel/styles-view-delegate.js index d607a0ba..68497747 100644 --- a/js/panels/css-panel/styles-view-delegate.js +++ b/js/panels/css-panel/styles-view-delegate.js @@ -75,6 +75,13 @@ exports.StylesViewDelegate = Montage.create(Component, { this._dispatchChange(); } }, + + handleSelectorStop : { + value: function(rule, newSelector, ruleComponent) { + ruleComponent.declarationComponent.repetition.childComponents[0].propertyField.start() + } + }, + _getClassNameFromSelector : { value: function(selectorText) { var results = /.*\.([A-Za-z0-9_-]+)\:?[A-Za-z0-9_"=-]*$/.exec(selectorText); -- cgit v1.2.3 From 26683016ea28aac61e7c563df769dfafe40dce12 Mon Sep 17 00:00:00 2001 From: Eric Guzman Date: Wed, 30 May 2012 09:19:25 -0700 Subject: CSS Panel Toolbar - Prevent warning regarding undefined sourceObject --- js/components/toolbar.reel/toolbar-button.js | 28 ++++++++++++++++++++++++++++ js/components/toolbar.reel/toolbar.html | 2 +- 2 files changed, 29 insertions(+), 1 deletion(-) create mode 100644 js/components/toolbar.reel/toolbar-button.js (limited to 'js') diff --git a/js/components/toolbar.reel/toolbar-button.js b/js/components/toolbar.reel/toolbar-button.js new file mode 100644 index 00000000..9ada9b29 --- /dev/null +++ b/js/components/toolbar.reel/toolbar-button.js @@ -0,0 +1,28 @@ +/* + 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").Montage, + Component = require("montage/ui/component").Component, + Button = require("montage/ui/button.reel/button").Button; + +var ToolbarButton = exports.ToolbarButton = Montage.create(Button, { + hasTemplate : { + value: false + }, + _sourceObject : { + value: null + }, + sourceObject : { + get: function() { + return this._sourceObject; + }, + set: function(value) { + if(value === this._sourceObject) { return; } + + this._sourceObject = value; + } + } +}); \ No newline at end of file diff --git a/js/components/toolbar.reel/toolbar.html b/js/components/toolbar.reel/toolbar.html index d2c5972a..51e7ebec 100644 --- a/js/components/toolbar.reel/toolbar.html +++ b/js/components/toolbar.reel/toolbar.html @@ -30,7 +30,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot }, "button": { - "prototype": "montage/ui/button.reel", + "prototype": "js/components/toolbar.reel/toolbar-button", "properties": { "element": {"#": "button" }, "label": " " -- cgit v1.2.3