diff options
author | Ananya Sen | 2012-02-23 17:57:06 -0800 |
---|---|---|
committer | Ananya Sen | 2012-02-23 17:57:06 -0800 |
commit | a23455a887982d306d794b6afca497259cfa7f4a (patch) | |
tree | 7396eb7b5e0759035f666a7eee9d325979887d4a /js/panels/Timeline/Layer.reel | |
parent | 6e66f411ba02eaaeb33471115345ecf3c7ce4ce9 (diff) | |
parent | 97d6314f96f309332a655d49b95ec651c378bcf2 (diff) | |
download | ninja-a23455a887982d306d794b6afca497259cfa7f4a.tar.gz |
Merge branch 'refs/heads/FileIO-jose' into FileIO
Diffstat (limited to 'js/panels/Timeline/Layer.reel')
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.html | 2 | ||||
-rw-r--r-- | js/panels/Timeline/Layer.reel/Layer.js | 27 | ||||
-rw-r--r-- | js/panels/Timeline/Layer.reel/css/Layer.css | 117 | ||||
-rw-r--r-- | js/panels/Timeline/Layer.reel/scss/Layer.scss | 17 |
4 files changed, 60 insertions, 103 deletions
diff --git a/js/panels/Timeline/Layer.reel/Layer.html b/js/panels/Timeline/Layer.reel/Layer.html index dd819b2b..e262afe2 100644 --- a/js/panels/Timeline/Layer.reel/Layer.html +++ b/js/panels/Timeline/Layer.reel/Layer.html | |||
@@ -153,7 +153,7 @@ | |||
153 | <div class="label-style"> | 153 | <div class="label-style"> |
154 | <span class="collapsible-label">Style</span> | 154 | <span class="collapsible-label">Style</span> |
155 | <span class="clicker-style collapsible-clicker"></span> | 155 | <span class="clicker-style collapsible-clicker"></span> |
156 | <div class="cssbutton button-delete"></div> | 156 | <div class="cssbutton button-delete disabled"></div> |
157 | <div class="cssbutton button-add"></div> | 157 | <div class="cssbutton button-add"></div> |
158 | </div> | 158 | </div> |
159 | <div class="content-style collapsible-content"> | 159 | <div class="content-style collapsible-content"> |
diff --git a/js/panels/Timeline/Layer.reel/Layer.js b/js/panels/Timeline/Layer.reel/Layer.js index 71a1f01f..2e9a8f1a 100644 --- a/js/panels/Timeline/Layer.reel/Layer.js +++ b/js/panels/Timeline/Layer.reel/Layer.js | |||
@@ -80,7 +80,6 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
80 | this._layerName = newVal; | 80 | this._layerName = newVal; |
81 | this._layerEditable.needsDraw = true; | 81 | this._layerEditable.needsDraw = true; |
82 | this.needsDraw = true; | 82 | this.needsDraw = true; |
83 | |||
84 | } | 83 | } |
85 | 84 | ||
86 | } | 85 | } |
@@ -323,6 +322,7 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
323 | this.styleCollapser.myContent = this.contentStyle; | 322 | this.styleCollapser.myContent = this.contentStyle; |
324 | this.styleCollapser.element = this.element; | 323 | this.styleCollapser.element = this.element; |
325 | this.styleCollapser.isCollapsed = this.isStyleCollapsed; | 324 | this.styleCollapser.isCollapsed = this.isStyleCollapsed; |
325 | this.styleCollapser.contentHeight = 20; | ||
326 | this.styleCollapser.isAnimated = true; | 326 | this.styleCollapser.isAnimated = true; |
327 | this.styleCollapser.labelClickEvent = function(boolBypass) { | 327 | this.styleCollapser.labelClickEvent = function(boolBypass) { |
328 | var newEvent = document.createEvent("CustomEvent"); | 328 | var newEvent = document.createEvent("CustomEvent"); |
@@ -483,8 +483,11 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
483 | // Delete the style from the view | 483 | // Delete the style from the view |
484 | this.arrLayerStyles.splice(selectedIndex, 1); | 484 | this.arrLayerStyles.splice(selectedIndex, 1); |
485 | 485 | ||
486 | } else { | 486 | // Was that the last style? |
487 | alert('TODO: what should happen when no rule is selected and the user clicks the delete button?') | 487 | if (this.arrLayerStyles.length === 0) { |
488 | this.buttonDeleteStyle.classList.add("disabled"); | ||
489 | } | ||
490 | |||
488 | } | 491 | } |
489 | } | 492 | } |
490 | } | 493 | } |
@@ -509,8 +512,12 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
509 | // Next, update this.styleRepetition.selectedIndexes. | 512 | // Next, update this.styleRepetition.selectedIndexes. |
510 | if (styleIndex !== false) { | 513 | if (styleIndex !== false) { |
511 | this.styleRepetition.selectedIndexes = [styleIndex]; | 514 | this.styleRepetition.selectedIndexes = [styleIndex]; |
515 | this.buttonDeleteStyle.classList.remove("disabled"); | ||
512 | } else { | 516 | } else { |
513 | this.styleRepetition.selectedIndexes = null; | 517 | this.styleRepetition.selectedIndexes = null; |
518 | if (typeof(this.buttonDeleteStyle) !== "undefined") { | ||
519 | this.buttonDeleteStyle.classList.add("disabled"); | ||
520 | } | ||
514 | } | 521 | } |
515 | 522 | ||
516 | } | 523 | } |
@@ -537,14 +544,11 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
537 | /* Begin: Event handlers */ | 544 | /* Begin: Event handlers */ |
538 | handleAddStyleClick: { | 545 | handleAddStyleClick: { |
539 | value: function(event) { | 546 | value: function(event) { |
540 | // Stop the event propagation | ||
541 | //event.stopPropagation(); | ||
542 | this.addStyle(); | 547 | this.addStyle(); |
543 | } | 548 | } |
544 | }, | 549 | }, |
545 | handleDeleteStyleClick: { | 550 | handleDeleteStyleClick: { |
546 | value: function(event) { | 551 | value: function(event) { |
547 | //event.stopPropagation(); | ||
548 | this.deleteStyle(); | 552 | this.deleteStyle(); |
549 | } | 553 | } |
550 | }, | 554 | }, |
@@ -566,25 +570,16 @@ var Layer = exports.Layer = Montage.create(Component, { | |||
566 | handleMousedown: { | 570 | handleMousedown: { |
567 | value: function(event) { | 571 | value: function(event) { |
568 | this.isActive = true; | 572 | this.isActive = true; |
569 | // Check ALL THE CLICKS | ||
570 | // Are they in a particular style? If so, we need to select that style and | ||
571 | // deselect the others. | ||
572 | var ptrParent = nj.queryParentSelector(event.target, ".content-style"); | 573 | var ptrParent = nj.queryParentSelector(event.target, ".content-style"); |
573 | if (ptrParent !== false) { | 574 | if (ptrParent !== false) { |
574 | // Why yes, the click was within a layer. But which one? | 575 | this.selectStyle(this.getActiveStyleIndex()); |
575 | var myIndex = this.getActiveStyleIndex(); | ||
576 | this.selectStyle(myIndex); | ||
577 | } | 576 | } |
578 | } | 577 | } |
579 | }, | 578 | }, |
580 | handleLayerClick : { | 579 | handleLayerClick : { |
581 | value: function(event) { | 580 | value: function(event) { |
582 | // Check ALL THE CLICKS | ||
583 | // Are they in a particular style? If so, we need to select that style and | ||
584 | // deselect the others. | ||
585 | var ptrParent = nj.queryParentSelector(event.target, ".content-style"); | 581 | var ptrParent = nj.queryParentSelector(event.target, ".content-style"); |
586 | if (ptrParent !== false) { | 582 | if (ptrParent !== false) { |
587 | // Why yes, the click was within a layer. But which one? | ||
588 | var myIndex = this.getActiveStyleIndex(); | 583 | var myIndex = this.getActiveStyleIndex(); |
589 | this.selectStyle(myIndex); | 584 | this.selectStyle(myIndex); |
590 | } | 585 | } |
diff --git a/js/panels/Timeline/Layer.reel/css/Layer.css b/js/panels/Timeline/Layer.reel/css/Layer.css index 39869c92..3547a15e 100644 --- a/js/panels/Timeline/Layer.reel/css/Layer.css +++ b/js/panels/Timeline/Layer.reel/css/Layer.css | |||
@@ -2,63 +2,6 @@ | |||
2 | /* Layer.scss | 2 | /* Layer.scss |
3 | * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css. | 3 | * Main SCSS file for Layer component, compiled by SASS into the file css/Layer.css. |
4 | */ | 4 | */ |
5 | /* <copyright> | ||
6 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
7 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
8 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
9 | </copyright> */ | ||
10 | /* | ||
11 | * _colors.scss | ||
12 | * Defines the colors for the UI of the application. | ||
13 | * To create a new theme, copy this file and change the values as desired. | ||
14 | * Note: Some colors are defined as both rgb and rgba; some of the rgba versions have multiple a values. | ||
15 | */ | ||
16 | /* Colors for radio buttons and other form elements */ | ||
17 | /* Base colors for dividers | ||
18 | * | ||
19 | * Dividers consist of a div with a background color and either | ||
20 | * a top & bottom border (in the case of horizontal dividers) | ||
21 | * or a left & right border (in the case of vertical dividers), | ||
22 | * for a total of three different colors. | ||
23 | * | ||
24 | */ | ||
25 | /* top and left */ | ||
26 | /* Middle */ | ||
27 | /* Bottom and right */ | ||
28 | /* Main background color of entire app */ | ||
29 | /* Main app background color. */ | ||
30 | /* rgba version */ | ||
31 | /* Main app border color */ | ||
32 | /* color of drop shadows */ | ||
33 | /* Stage color */ | ||
34 | /* body border color */ | ||
35 | /* Body background color */ | ||
36 | /* Colors for main dropdown menus: background & text for both regular and highlighted states, dividers */ | ||
37 | /* Colors for tools: background, text, how they interact with the UI */ | ||
38 | /* Colors for panels: background & text, both regular and highlighted states, dividers, borders, shadows, etc. */ | ||
39 | /* used for editable items in their non-edit state, etc. */ | ||
40 | /* Border for panel and for block elements */ | ||
41 | /* Shadow for text and block elements */ | ||
42 | /* Colors for scroll bars */ | ||
43 | /* <copyright> | ||
44 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
45 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
46 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
47 | </copyright> */ | ||
48 | /* | ||
49 | * themes/themename/mixins.scss | ||
50 | * Mixins that are theme-dependent (e.g. sprite mixins, etc) | ||
51 | */ | ||
52 | /* <copyright> | ||
53 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
54 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
55 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
56 | </copyright> */ | ||
57 | /* | ||
58 | * mixins.scss | ||
59 | * Generic mixins. Theme-specific mixins (e.g. for sprites) | ||
60 | * should go in the theme/themename/mixins.scss file. | ||
61 | */ | ||
62 | /* line 16, ../scss/Layer.scss */ | 5 | /* line 16, ../scss/Layer.scss */ |
63 | .layerLabel { | 6 | .layerLabel { |
64 | width: 100%; | 7 | width: 100%; |
@@ -174,23 +117,24 @@ | |||
174 | border-width: 0px; | 117 | border-width: 0px; |
175 | } | 118 | } |
176 | 119 | ||
177 | /* line 112, ../scss/Layer.scss */ | 120 | /* line 113, ../scss/Layer.scss */ |
178 | .label-layer, | 121 | .label-layer, |
179 | .label-position, | 122 | .label-position, |
180 | .label-transform, | 123 | .label-transform, |
181 | .label-style { | 124 | .label-style, |
125 | .label-styles { | ||
182 | position: relative; | 126 | position: relative; |
183 | border-bottom: 1px solid #505050;< |