From 04343eda8c2f870b0da55cfdc8003c99fe1cc4de Mon Sep 17 00:00:00 2001 From: Kris Kowal Date: Fri, 6 Jul 2012 11:53:10 -0700 Subject: Remove trailing spaces --- js/panels/Timeline/Collapser.js | 94 ++++++++++++++++++++--------------------- 1 file changed, 47 insertions(+), 47 deletions(-) (limited to 'js/panels/Timeline/Collapser.js') diff --git a/js/panels/Timeline/Collapser.js b/js/panels/Timeline/Collapser.js index d793ac88..e3d425ad 100644 --- a/js/panels/Timeline/Collapser.js +++ b/js/panels/Timeline/Collapser.js @@ -38,16 +38,16 @@ POSSIBILITY OF SUCH DAMAGE. * Can be manually set as well. * collapsibleClass: The CSS class to apply to the content and the clicker when collapsed. Defaults to "collapsible-collapsed". * isAnimated: Set to true to apply a transition to expand/collapse (defaults to false). - * transitionClass: If isAnimated is set to true, the component will apply transitionClass to the content during the + * transitionClass: If isAnimated is set to true, the component will apply transitionClass to the content during the * collapse process. You can then define transitionClass in your style sheet with the desired CSS transitions. * Defaults to "collapsible-transition". - * contentHeight: If both isAnimated and isCollapsedAtStart are set to true, set contentHeight to the height of the content - * (in pixels, but without the "px") when not collapsed. If this value is not set, the first time the content is expanded + * contentHeight: If both isAnimated and isCollapsedAtStart are set to true, set contentHeight to the height of the content + * (in pixels, but without the "px") when not collapsed. If this value is not set, the first time the content is expanded * the transition will not work. Subsequent collapses (and expansions) will transition as expected. - * isLabelClickable: Boolean that indicates whether or not the clicker should have listener events. Defaults to true; set to + * isLabelClickable: Boolean that indicates whether or not the clicker should have listener events. Defaults to true; set to * false for collapsers that will only be operated remotely. * isToggling: Set this anually toggle the expand/collapse of the content. - * + * */ var Montage = require("montage/core/core").Montage, Component = require("montage/ui/component").Component, @@ -57,9 +57,9 @@ var Montage = require("montage/core/core").Montage, hasTemplate:{ value: false }, - + /* === BEGIN: Models === */ - + // contentHeight: Stores the height of the content just before collapse. _contentHeight: { value: 0 @@ -73,13 +73,13 @@ var Montage = require("montage/core/core").Montage, this._contentHeight = newVal; } }, - + // isCollapsing: true if the collapser is collapsing (or expanding); used in the draw cycle. _isCollapsing: { value: false }, - - // isAnimated: boolean to apply transition to expand/collapse + + // isAnimated: boolean to apply transition to expand/collapse _isAnimated : { value: false }, @@ -92,7 +92,7 @@ var Montage = require("montage/core/core").Montage, this._isAnimated = newVal; } }, - + _bypassAnimation : { value: true }, @@ -109,7 +109,7 @@ var Montage = require("montage/core/core").Montage, _oldAnimated : { value: false }, - + // transitionClass: The CSS class to apply to the content during collapse to provide CSS transition. // Note that this CSS class must be defined in your style sheet with the desired transitions. _transitionClass : { @@ -123,7 +123,7 @@ var Montage = require("montage/core/core").Montage, this._transitionClass = newVal; } }, - + // isCollapsed: is the content actually collapsed at this moment _isCollapsed: { value: "" @@ -140,7 +140,7 @@ var Montage = require("montage/core/core").Montage, } } }, - + // collapsedClass: the class to apply to the clicker and content when the content is collapsed. _collapsedClass : { value: "collapsible-collapsed" @@ -153,14 +153,14 @@ var Montage = require("montage/core/core").Montage, this._collapsedClass = newVal; } }, - + // _origOverflowValue: Stores the original overflow value of the collapsible element. // Why store the value? While the collapsible element is collapsed, obviously we will need overflow: hidden. // But when the collapsible element is open, we will need overflow to return to its original value. _origOverflowValue : { value: false }, - + // isLabelClickable: Boolean for whether or not the label is clickable. If set to false, // the label click listener is never applied. For collapsibles that will only be operated remotely. // Defaults to true. @@ -217,7 +217,7 @@ var Montage = require("montage/core/core").Montage, set: function(newVal) { if (newVal !== this._isToggling) { this._isToggling = newVal; - + if (this.bypassAnimation === true) { this._oldAnimated = this.isAnimated; this.isAnimated = false; @@ -227,11 +227,11 @@ var Montage = require("montage/core/core").Montage, } } }, - + /* === END: Models === */ - + /* === BEGIN: Draw cycle === */ - + prepareForDraw: { value: function() { // Get the original value of the overflow property: @@ -239,7 +239,7 @@ var Montage = require("montage/core/core").Montage, if (this.isCollapsed === false) { this.myContent.style.height = "auto"; } - + // If the content area is supposed to start out collapsed: if (this.isCollapsed) { @@ -259,19 +259,19 @@ var Montage = require("montage/core/core").Montage, }, draw: { value: function() { - // Is the content area expanding/collapsing? - this.myContent.classList.remove(this.transitionClass); + // Is the content area expanding/collapsing? + this.myContent.classList.remove(this.transitionClass); if (this._isCollapsing) { - + if (this.isAnimated) { // Apply the transition class to the content. this.myContent.classList.add(this.transitionClass); - + // Add a handler for the end of the transition, so we can tidy things up after // the transition completes this.myContent.identifier = "myContent"; - this.myContent.addEventListener("webkitTransitionEnd", this, false); - + this.myContent.addEventListener("webkitTransitionEnd", this, false); + this.myContent.style.overflow = "hidden"; } @@ -280,24 +280,24 @@ var Montage = require("montage/core/core").Montage, // It's already collapsed so we are expanding this.myContent.style.height = this.contentHeight + "px"; this.isCollapsed = false; - + } else { // It's expanded so we are collapsing this.myContent.style.height = "0px"; this.isCollapsed = true; - + // Set the overflow to hidden if it isn't already if (this._origOverflowValue !== "hidden") { this.myContent.style.overflow = "hidden"; } } - + // Toggle the CSS class and deactivate the collapsing flag because we are now done. this.myContent.classList.toggle(this.collapsedClass); this.clicker.classList.toggle(this.collapsedClass); this._isCollapsing = false; - - // Special cases: If transition does not happen (in the case of a contentHeight of 0 + + // Special cases: If transition does not happen (in the case of a contentHeight of 0 // or isAnimated = false) we need to manually fire it here to do the cleanup. if ((this.contentHeight < 3) || (!this.isAnimated)) { this.handleMyContentWebkitTransitionEnd(); @@ -305,11 +305,11 @@ var Montage = require("montage/core/core").Montage, } } }, - + /* === END: Draw cycle === */ - + /* === BEGIN: Event handlers === */ - + // Handle a click on the label handleCollapserLabelClick: { value: function() { @@ -322,40 +322,40 @@ var Montage = require("montage/core/core").Montage, this.contentHeight = this.myContent.offsetHeight; // Set the current height of the content to a pixel height instead of "auto" // so that the transition can happen. - // (This doesn't actually change the appearance of the element, + // (This doesn't actually change the appearance of the element, // so it's okay to do here, outside the draw cycle.) this.myContent.style.height = this.contentHeight + "px"; - + this.isCollapsed = true; } else { this.isCollapsed = false; } - - // Set the collapsing flag so when the draw cycle begins + + // Set the collapsing flag so when the draw cycle begins // it will know to expand/collapse. this._isCollapsing = true; - + // Set the component to run its draw cycle. this.needsDraw = true; } }, - + // This handler is bound to the transitionEnd event. If transitions // are disabled, it is called manually. handleMyContentWebkitTransitionEnd: { value: function(event) { - + // Are we animating the transitions? if (this.isAnimated) { // Yes, transitions are animated. // Remove the event listener so it won't fire again. this.myContent.removeEventListener("webkitTransitionEnd", this, false); - + // remove the CSS class that supplies the transition this.myContent.classList.remove(this.transitionClass); } - + // Set the height of the content area to auto; this way it can expand/collapse as interactions // happen within. if (!this.myContent.classList.contains(this.collapsedClass)) { @@ -364,9 +364,9 @@ var Montage = require("montage/core/core").Montage, if (this._origOverflowValue !== "hidden") { this.myContent.style.overflow = this._origOverflowValue; } - + } - + if (this.bypassAnimation === true) { this.isAnimated = this._oldAnimated; } else { @@ -374,6 +374,6 @@ var Montage = require("montage/core/core").Montage, } } } - + /* === END: Event handlers === */ }); -- cgit v1.2.3