@qooxdoo/framework 7.0.0-beta.6 → 7.0.0

package/source/class/qx/ui/core/scroll/AbstractScrollArea.js

@@ -26,16 +26,15 @@
  * @childControl scrollbar-y {qx.ui.core.scroll.ScrollBar?qx.ui.core.scroll.NativeScrollBar} vertical scrollbar
  * @childControl corner {qx.ui.core.Widget} corner where no scrollbar is shown
  */
-qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
-{
-  extend : qx.ui.core.Widget,
-  include : [
+qx.Class.define("qx.ui.core.scroll.AbstractScrollArea", {
+  extend: qx.ui.core.Widget,
+  include: [
     qx.ui.core.scroll.MScrollBarFactory,
     qx.ui.core.scroll.MRoll,
     qx.ui.core.MDragDropScrolling
   ],
-  type : "abstract",
 
+  type: "abstract",
 
   /*
   *****************************************************************************
@@ -43,26 +42,22 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
   *****************************************************************************
   */
 
-  statics :
-  {
+  statics: {
     /**
      * The default width which is used for the width of the scroll bar if
      * overlaid.
      */
-    DEFAULT_SCROLLBAR_WIDTH : 14
+    DEFAULT_SCROLLBAR_WIDTH: 14
   },
 
-
-
   /*
   *****************************************************************************
      CONSTRUCTOR
   *****************************************************************************
   */
 
-  construct : function()
-  {
-    this.base(arguments);
+  construct() {
+    super();
 
     if (qx.core.Environment.get("os.scrollBarOverlayed")) {
       // use a plain canvas to overlay the scroll bars
@@ -78,51 +73,45 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
     // since the scroll container disregards the min size of the scrollbars
     // we have to set the min size of the scroll area to ensure that the
     // scrollbars always have an usable size.
-    var size = qx.ui.core.scroll.AbstractScrollArea.DEFAULT_SCROLLBAR_WIDTH * 2 + 14;
-    this.set({minHeight: size, minWidth: size});
+    var size =
+      qx.ui.core.scroll.AbstractScrollArea.DEFAULT_SCROLLBAR_WIDTH * 2 + 14;
+    this.set({ minHeight: size, minWidth: size });
 
     // Roll listener for scrolling
     this._addRollHandling();
   },
 
-
-  events : {
+  events: {
     /** Fired as soon as the scroll animation in X direction ends. */
-    scrollAnimationXEnd: 'qx.event.type.Event',
+    scrollAnimationXEnd: "qx.event.type.Event",
 
     /** Fired as soon as the scroll animation in Y direction ends. */
-    scrollAnimationYEnd: 'qx.event.type.Event'
+    scrollAnimationYEnd: "qx.event.type.Event"
   },
 
-
-
   /*
   *****************************************************************************
      PROPERTIES
   *****************************************************************************
   */
 
-  properties :
-  {
+  properties: {
     // overridden
-    appearance :
-    {
-      refine : true,
-      init : "scrollarea"
+    appearance: {
+      refine: true,
+      init: "scrollarea"
     },
 
     // overridden
-    width :
-    {
-      refine : true,
-      init : 0
+    width: {
+      refine: true,
+      init: 0
     },
 
     // overridden
-    height :
-    {
-      refine : true,
-      init : 0
+    height: {
+      refine: true,
+      init: 0
     },
 
     /**
@@ -133,15 +122,13 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      *   <li><b>off</b>: Never show the scrollbar</li>
      * </ul>
      */
-    scrollbarX :
-    {
-      check : ["auto", "on", "off"],
-      init : "auto",
-      themeable : true,
-      apply : "_computeScrollbars"
+    scrollbarX: {
+      check: ["auto", "on", "off"],
+      init: "auto",
+      themeable: true,
+      apply: "_computeScrollbars"
     },
 
-
     /**
      * The policy, when the horizontal scrollbar should be shown.
      * <ul>
@@ -150,36 +137,28 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      *   <li><b>off</b>: Never show the scrollbar</li>
      * </ul>
      */
-    scrollbarY :
-    {
-      check : ["auto", "on", "off"],
-      init : "auto",
-      themeable : true,
-      apply : "_computeScrollbars"
+    scrollbarY: {
+      check: ["auto", "on", "off"],
+      init: "auto",
+      themeable: true,
+      apply: "_computeScrollbars"
     },
 
-
     /**
      * Group property, to set the overflow of both scroll bars.
      */
-    scrollbar : {
-      group : [ "scrollbarX", "scrollbarY" ]
+    scrollbar: {
+      group: ["scrollbarX", "scrollbarY"]
     }
   },
 
-
-
-
-
-
   /*
   *****************************************************************************
      MEMBERS
   *****************************************************************************
   */
 
-  members :
-  {
+  members: {
     /*
     ---------------------------------------------------------------------------
       CHILD CONTROL SUPPORT
@@ -187,12 +166,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
     */
 
     // overridden
-    _createChildControlImpl : function(id, hash)
-    {
+    _createChildControlImpl(id, hash) {
       var control;
 
-      switch(id)
-      {
+      switch (id) {
         case "pane":
           control = new qx.ui.core.scroll.ScrollPane();
 
@@ -201,49 +178,68 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
           control.addListener("scrollY", this._onScrollPaneY, this);
 
           if (qx.core.Environment.get("os.scrollBarOverlayed")) {
-            this._add(control, {edge: 0});
+            this._add(control, { edge: 0 });
           } else {
-            this._add(control, {row: 0, column: 0});
+            this._add(control, { row: 0, column: 0 });
           }
           break;
 
-
         case "scrollbar-x":
           control = this._createScrollBar("horizontal");
           control.setMinWidth(0);
 
           control.exclude();
           control.addListener("scroll", this._onScrollBarX, this);
-          control.addListener("changeVisibility", this._onChangeScrollbarXVisibility, this);
-          control.addListener("scrollAnimationEnd", this._onScrollAnimationEnd.bind(this, "X"));
+          control.addListener(
+            "changeVisibility",
+            this._onChangeScrollbarXVisibility,
+            this
+          );
+
+          control.addListener(
+            "scrollAnimationEnd",
+            this._onScrollAnimationEnd.bind(this, "X")
+          );
 
           if (qx.core.Environment.get("os.scrollBarOverlayed")) {
-            control.setMinHeight(qx.ui.core.scroll.AbstractScrollArea.DEFAULT_SCROLLBAR_WIDTH);
-            this._add(control, {bottom: 0, right: 0, left: 0});
+            control.setMinHeight(
+              qx.ui.core.scroll.AbstractScrollArea.DEFAULT_SCROLLBAR_WIDTH
+            );
+
+            this._add(control, { bottom: 0, right: 0, left: 0 });
           } else {
-            this._add(control, {row: 1, column: 0});
+            this._add(control, { row: 1, column: 0 });
           }
           break;
 
-
         case "scrollbar-y":
           control = this._createScrollBar("vertical");
           control.setMinHeight(0);
 
           control.exclude();
           control.addListener("scroll", this._onScrollBarY, this);
-          control.addListener("changeVisibility", this._onChangeScrollbarYVisibility, this);
-          control.addListener("scrollAnimationEnd", this._onScrollAnimationEnd.bind(this, "Y"));
+          control.addListener(
+            "changeVisibility",
+            this._onChangeScrollbarYVisibility,
+            this
+          );
+
+          control.addListener(
+            "scrollAnimationEnd",
+            this._onScrollAnimationEnd.bind(this, "Y")
+          );
 
           if (qx.core.Environment.get("os.scrollBarOverlayed")) {
-            control.setMinWidth(qx.ui.core.scroll.AbstractScrollArea.DEFAULT_SCROLLBAR_WIDTH);
-            this._add(control, {right: 0, bottom: 0, top: 0});
+            control.setMinWidth(
+              qx.ui.core.scroll.AbstractScrollArea.DEFAULT_SCROLLBAR_WIDTH
+            );
+
+            this._add(control, { right: 0, bottom: 0, top: 0 });
           } else {
-            this._add(control, {row: 0, column: 1});
+            this._add(control, { row: 0, column: 1 });
           }
           break;
 
-
         case "corner":
           control = new qx.ui.core.Widget();
           control.setWidth(0);
@@ -252,17 +248,14 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
 
           if (!qx.core.Environment.get("os.scrollBarOverlayed")) {
             // only add for non overlayed scroll bars
-            this._add(control, {row: 1, column: 1});
+            this._add(control, { row: 1, column: 1 });
           }
           break;
       }
 
-      return control || this.base(arguments, id);
+      return control || super._createChildControlImpl(id);
     },
 
-
-
-
     /*
     ---------------------------------------------------------------------------
       PANE SIZE
@@ -275,15 +268,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * @return {Map|null} The pane dimension in pixel. Contains
      *    the keys <code>width</code> and <code>height</code>.
      */
-    getPaneSize : function() {
+    getPaneSize() {
       return this.getChildControl("pane").getInnerSize();
     },
 
-
-
-
-
-
     /*
     ---------------------------------------------------------------------------
       ITEM LOCATION SUPPORT
@@ -297,11 +285,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * @param item {qx.ui.core.Widget} Item to query
      * @return {Integer} Top offset
      */
-    getItemTop : function(item) {
+    getItemTop(item) {
       return this.getChildControl("pane").getItemTop(item);
     },
 
-
     /**
      * Returns the top offset of the end of the given item in relation to the
      * inner height of this widget.
@@ -309,11 +296,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * @param item {qx.ui.core.Widget} Item to query
      * @return {Integer} Top offset
      */
-    getItemBottom : function(item) {
+    getItemBottom(item) {
       return this.getChildControl("pane").getItemBottom(item);
     },
 
-
     /**
      * Returns the left offset of the given item in relation to the
      * inner width of this widget.
@@ -321,11 +307,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * @param item {qx.ui.core.Widget} Item to query
      * @return {Integer} Top offset
      */
-    getItemLeft : function(item) {
+    getItemLeft(item) {
       return this.getChildControl("pane").getItemLeft(item);
     },
 
-
     /**
      * Returns the left offset of the end of the given item in relation to the
      * inner width of this widget.
@@ -333,14 +318,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * @param item {qx.ui.core.Widget} Item to query
      * @return {Integer} Right offset
      */
-    getItemRight : function(item) {
+    getItemRight(item) {
       return this.getChildControl("pane").getItemRight(item);
     },
 
-
-
-
-
     /*
     ---------------------------------------------------------------------------
       SCROLL SUPPORT
@@ -353,105 +334,94 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * @param value {Integer} The vertical position to scroll to.
      * @param duration {Number?} The time in milliseconds the scroll to should take.
      */
-    scrollToX : function(value, duration) {
+    scrollToX(value, duration) {
       // First flush queue before scroll
       qx.ui.core.queue.Manager.flush();
 
       this.getChildControl("scrollbar-x").scrollTo(value, duration);
     },
 
-
     /**
      * Scrolls the element's content by the given left offset
      *
      * @param value {Integer} The vertical position to scroll to.
      * @param duration {Number?} The time in milliseconds the scroll to should take.
      */
-    scrollByX : function(value, duration) {
+    scrollByX(value, duration) {
       // First flush queue before scroll
       qx.ui.core.queue.Manager.flush();
 
       this.getChildControl("scrollbar-x").scrollBy(value, duration);
     },
 
-
     /**
      * Returns the scroll left position of the content
      *
      * @return {Integer} Horizontal scroll position
      */
-    getScrollX : function()
-    {
+    getScrollX() {
       var scrollbar = this.getChildControl("scrollbar-x", true);
       return scrollbar ? scrollbar.getPosition() : 0;
     },
 
-
     /**
      * Scrolls the element's content to the given top coordinate
      *
      * @param value {Integer} The horizontal position to scroll to.
      * @param duration {Number?} The time in milliseconds the scroll to should take.
      */
-    scrollToY : function(value, duration) {
+    scrollToY(value, duration) {
       // First flush queue before scroll
       qx.ui.core.queue.Manager.flush();
 
       this.getChildControl("scrollbar-y").scrollTo(value, duration);
     },
 
-
     /**
      * Scrolls the element's content by the given top offset
      *
      * @param value {Integer} The horizontal position to scroll to.
      * @param duration {Number?} The time in milliseconds the scroll to should take.
      */
-    scrollByY : function(value, duration) {
+    scrollByY(value, duration) {
       // First flush queue before scroll
       qx.ui.core.queue.Manager.flush();
 
       this.getChildControl("scrollbar-y").scrollBy(value, duration);
     },
 
-
     /**
      * Returns the scroll top position of the content
      *
      * @return {Integer} Vertical scroll position
      */
-    getScrollY : function()
-    {
+    getScrollY() {
       var scrollbar = this.getChildControl("scrollbar-y", true);
       return scrollbar ? scrollbar.getPosition() : 0;
     },
 
-
     /**
      * In case a scroll animation is currently running in X direction,
      * it will be stopped. If not, the method does nothing.
      */
-    stopScrollAnimationX : function() {
+    stopScrollAnimationX() {
       var scrollbar = this.getChildControl("scrollbar-x", true);
       if (scrollbar) {
         scrollbar.stopScrollAnimation();
       }
     },
 
-
     /**
      * In case a scroll animation is currently running in X direction,
      * it will be stopped. If not, the method does nothing.
      */
-    stopScrollAnimationY : function() {
+    stopScrollAnimationY() {
       var scrollbar = this.getChildControl("scrollbar-y", true);
       if (scrollbar) {
         scrollbar.stopScrollAnimation();
       }
     },
 
-
-
     /*
     ---------------------------------------------------------------------------
       EVENT LISTENERS
@@ -462,7 +432,7 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      *
      * @param direction {String} Either "X" or "Y".
      */
-    _onScrollAnimationEnd : function(direction) {
+    _onScrollAnimationEnd(direction) {
       this.fireEvent("scrollAnimation" + direction + "End");
     },
 
@@ -471,54 +441,49 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      *
      * @param e {qx.event.type.Data} The scroll event object
      */
-    _onScrollBarX : function(e) {
+    _onScrollBarX(e) {
       this.getChildControl("pane").scrollToX(e.getData());
     },
 
-
     /**
      * Event handler for the scroll event of the vertical scrollbar
      *
      * @param e {qx.event.type.Data} The scroll event object
      */
-    _onScrollBarY : function(e) {
+    _onScrollBarY(e) {
       this.getChildControl("pane").scrollToY(e.getData());
     },
 
-
     /**
      * Event handler for the horizontal scroll event of the pane
      *
      * @param e {qx.event.type.Data} The scroll event object
      */
-    _onScrollPaneX : function(e) {
+    _onScrollPaneX(e) {
       var scrollbar = this.getChildControl("scrollbar-x");
       if (scrollbar) {
         scrollbar.updatePosition(e.getData());
       }
     },
 
-
     /**
      * Event handler for the vertical scroll event of the pane
      *
      * @param e {qx.event.type.Data} The scroll event object
      */
-    _onScrollPaneY : function(e) {
+    _onScrollPaneY(e) {
       var scrollbar = this.getChildControl("scrollbar-y");
       if (scrollbar) {
         scrollbar.updatePosition(e.getData());
       }
     },
 
-
     /**
      * Event handler for visibility changes of horizontal scrollbar.
      *
      * @param e {qx.event.type.Event} Property change event
      */
-    _onChangeScrollbarXVisibility : function(e)
-    {
+    _onChangeScrollbarXVisibility(e) {
       var showX = this._isChildControlVisible("scrollbar-x");
       var showY = this._isChildControlVisible("scrollbar-y");
 
@@ -526,17 +491,17 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
         this.scrollToX(0);
       }
 
-      showX && showY ? this._showChildControl("corner") : this._excludeChildControl("corner");
+      showX && showY
+        ? this._showChildControl("corner")
+        : this._excludeChildControl("corner");
     },
 
-
     /**
      * Event handler for visibility changes of horizontal scrollbar.
      *
      * @param e {qx.event.type.Event} Property change event
      */
-    _onChangeScrollbarYVisibility : function(e)
-    {
+    _onChangeScrollbarYVisibility(e) {
       var showX = this._isChildControlVisible("scrollbar-x");
       var showY = this._isChildControlVisible("scrollbar-y");
 
@@ -544,12 +509,11 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
         this.scrollToY(0);
       }
 
-      showX && showY ? this._showChildControl("corner") : this._excludeChildControl("corner");
+      showX && showY
+        ? this._showChildControl("corner")
+        : this._excludeChildControl("corner");
     },
 
-
-
-
     /*
     ---------------------------------------------------------------------------
       HELPER METHODS
@@ -560,12 +524,10 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
      * Computes the visibility state for scrollbars.
      *
      */
-    _computeScrollbars : function()
-    {
+    _computeScrollbars() {
       var pane = this.getChildControl("pane");
       var content = pane.getChildren()[0];
-      if (!content)
-      {
+      if (!content) {
         this._excludeChildControl("scrollbar-x");
         this._excludeChildControl("scrollbar-y");
         return;
@@ -584,8 +546,7 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
       var scrollbarX = this.getScrollbarX();
       var scrollbarY = this.getScrollbarY();
 
-      if (scrollbarX === "auto" && scrollbarY === "auto")
-      {
+      if (scrollbarX === "auto" && scrollbarY === "auto") {
         // Check if the container is big enough to show
         // the full content.
         var showX = scrollSize.width > innerSize.width;
@@ -596,55 +557,56 @@ qx.Class.define("qx.ui.core.scroll.AbstractScrollArea",
         // of the autosized axis requires a scrollbar
         // This scrollbar may then influence the need
         // for the other one as well.
-        if ((showX || showY) && !(showX && showY))
-        {
+        if ((showX || showY) && !(showX && showY)) {
           if (showX) {
             showY = scrollSize.height > paneSize.height;
           } else if (showY) {
             showX = scrollSize.width > paneSize.width;
           }
         }
-      }
-      else
-      {
+      } else {
         var showX = scrollbarX === "on";
         var showY = scrollbarY === "on";
 
         // Check auto values afterwards with already
         // corrected client dimensions
-        if (scrollSize.width > (showX ? paneSize.width : innerSize.width) && scrollbarX === "auto") {
+        if (
+          scrollSize.width > (showX ? paneSize.width : innerSize.width) &&
+          scrollbarX === "auto"
+        ) {
           showX = true;
         }
 
-        if (scrollSize.height > (showX ? paneSize.height : innerSize.height) && scrollbarY === "auto") {
+        if (
+          scrollSize.height > (showX ? paneSize.height : innerSize.height) &&
+          scrollbarY === "auto"
+        ) {
           showY = true;
         }
       }
 
       // Update scrollbars
-      if (showX)
-      {
+      if (showX) {
         var barX = this.getChildControl("scrollbar-x");
 
         barX.show();
         barX.setMaximum(Math.max(0, scrollSize.width - paneSize.width));
-        barX.setKnobFactor((scrollSize.width === 0) ? 0 : paneSize.width / scrollSize.width);
-      }
-      else
-      {
+        barX.setKnobFactor(
+          scrollSize.width === 0 ? 0 : paneSize.width / scrollSize.width
+        );
+      } else {
         this._excludeChildControl("scrollbar-x");
       }
 
-      if (showY)
-      {
+      if (showY) {
         var barY = this.getChildControl("scrollbar-y");
 
         barY.show();
         barY.setMaximum(Math.max(0, scrollSize.height - paneSize.height));
-        barY.setKnobFactor((scrollSize.height === 0) ? 0 : paneSize.height / scrollSize.height);
-      }
-      else
-      {
+        barY.setKnobFactor(
+          scrollSize.height === 0 ? 0 : paneSize.height / scrollSize.height
+        );
+      } else {
         this._excludeChildControl("scrollbar-y");
       }
     }