@qooxdoo/framework 7.0.0-beta.6 → 7.0.0

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

@@ -19,31 +19,25 @@
 /**
  * All widget used as scrollbars must implement this interface.
  */
-qx.Interface.define("qx.ui.core.scroll.IScrollBar",
-{
-  events :
-  {
+qx.Interface.define("qx.ui.core.scroll.IScrollBar", {
+  events: {
     /** Fired if the user scroll */
-    "scroll" : "qx.event.type.Data",
+    scroll: "qx.event.type.Data",
     /** Fired as soon as the scroll animation ended. */
-    "scrollAnimationEnd": 'qx.event.type.Event'
+    scrollAnimationEnd: "qx.event.type.Event"
   },
 
-
-  properties :
-  {
+  properties: {
     /**
      * The scroll bar orientation
      */
-    orientation : {},
-
+    orientation: {},
 
     /**
      * The maximum value (difference between available size and
      * content size).
      */
-    maximum : {},
-
+    maximum: {},
 
     /**
      * Position of the scrollbar (which means the scroll left/top of the
@@ -53,19 +47,16 @@ qx.Interface.define("qx.ui.core.scroll.IScrollBar",
      * Does not apply any correction to the incoming value. If you depend
      * on this, please use {@link #scrollTo} instead.
      */
-    position : {},
-
+    position: {},
 
     /**
      * Factor to apply to the width/height of the knob in relation
      * to the dimension of the underlying area.
      */
-    knobFactor : {}
+    knobFactor: {}
   },
 
-
-  members :
-  {
+  members: {
     /**
      * Scrolls to the given position.
      *
@@ -75,11 +66,10 @@ qx.Interface.define("qx.ui.core.scroll.IScrollBar",
      * @param position {Integer} Scroll to this position. Must be greater zero.
      * @param duration {Number} The time in milliseconds the slide to should take.
      */
-    scrollTo : function(position, duration) {
+    scrollTo(position, duration) {
       this.assertNumber(position);
     },
 
-
     /**
      * Scrolls by the given offset.
      *
@@ -89,11 +79,10 @@ qx.Interface.define("qx.ui.core.scroll.IScrollBar",
      * @param offset {Integer} Scroll by this offset
      * @param duration {Number} The time in milliseconds the slide to should take.
      */
-    scrollBy : function(offset, duration) {
+    scrollBy(offset, duration) {
       this.assertNumber(offset);
     },
 
-
     /**
      * Scrolls by the given number of steps.
      *
@@ -103,7 +92,7 @@ qx.Interface.define("qx.ui.core.scroll.IScrollBar",
      * @param steps {Integer} Number of steps
      * @param duration {Number} The time in milliseconds the slide to should take.
      */
-    scrollBySteps : function(steps, duration) {
+    scrollBySteps(steps, duration) {
       this.assertNumber(steps);
     }
   }

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

@@ -23,48 +23,41 @@
  * <code>scrollbar-y</code> to get the handler working. Also, you have to
  * attach the listener yourself.
  */
-qx.Mixin.define("qx.ui.core.scroll.MRoll",
-{
-  members :
-  {
-    _cancelRoll : null,
-
+qx.Mixin.define("qx.ui.core.scroll.MRoll", {
+  members: {
+    _cancelRoll: null,
 
     /**
      * Responsible for adding the event listener needed for scroll handling.
      */
-    _addRollHandling : function() {
+    _addRollHandling() {
       this.addListener("roll", this._onRoll, this);
       this.addListener("pointerdown", this._onPointerDownForRoll, this);
     },
 
-
     /**
      * Responsible for removing the event listener needed for scroll handling.
      */
-    _removeRollHandling : function() {
+    _removeRollHandling() {
       this.removeListener("roll", this._onRoll, this);
       this.removeListener("pointerdown", this._onPointerDownForRoll, this);
     },
 
-
     /**
      * Handler for the pointerdown event which simply stops the momentum scrolling.
      *
      * @param e {qx.event.type.Pointer} pointerdown event
      */
-    _onPointerDownForRoll : function(e) {
+    _onPointerDownForRoll(e) {
       this._cancelRoll = e.getPointerId();
     },
 
-
     /**
      * Roll event handler
      *
      * @param e {qx.event.type.Roll} Roll event
      */
-    _onRoll : function(e)
-    {
+    _onRoll(e) {
       // only wheel and touch
       if (e.getPointerType() == "mouse") {
         return;
@@ -99,7 +92,7 @@ qx.Mixin.define("qx.ui.core.scroll.MRoll",
         var max = scrollbarY.getMaximum();
 
         // pass the event to the parent if the scrollbar is at an edge
-        if (deltaY < 0 && position <= 0 || deltaY > 0 && position >= max) {
+        if ((deltaY < 0 && position <= 0) || (deltaY > 0 && position >= max)) {
           endY = true;
         }
       }
@@ -113,7 +106,7 @@ qx.Mixin.define("qx.ui.core.scroll.MRoll",
         var position = scrollbarX.getPosition();
         var max = scrollbarX.getMaximum();
         // pass the event to the parent if the scrollbar is at an edge
-        if (deltaX < 0 && position <= 0 || deltaX > 0 && position >= max) {
+        if ((deltaX < 0 && position <= 0) || (deltaX > 0 && position >= max)) {
           endX = true;
         }
       }
@@ -123,9 +116,11 @@ qx.Mixin.define("qx.ui.core.scroll.MRoll",
       }
 
       // pass the event to the parent if both scrollbars are at the end
-      if ((!endY && deltaX === 0) ||
-          (!endX && deltaY === 0) ||
-          ((!endX || !endY ) && deltaX !== 0 && deltaY !== 0)) {
+      if (
+        (!endY && deltaX === 0) ||
+        (!endX && deltaY === 0) ||
+        ((!endX || !endY) && deltaX !== 0 && deltaY !== 0)
+      ) {
         // Stop bubbling and native event only if a scrollbar is visible
         e.stop();
       }

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

@@ -22,10 +22,8 @@ qx.core.Environment.add("qx.nativeScrollBars", false);
  * Include this widget if you want to create scrollbars depending on the global
  * "qx.nativeScrollBars" setting.
  */
-qx.Mixin.define("qx.ui.core.scroll.MScrollBarFactory",
-{
-  members :
-  {
+qx.Mixin.define("qx.ui.core.scroll.MScrollBarFactory", {
+  members: {
     /**
      * Creates a new scrollbar. This can either be a styled qooxdoo scrollbar
      * or a native browser scrollbar.
@@ -33,8 +31,7 @@ qx.Mixin.define("qx.ui.core.scroll.MScrollBarFactory",
      * @param orientation {String?"horizontal"} The initial scroll bar orientation
      * @return {qx.ui.core.scroll.IScrollBar} The scrollbar instance
      */
-    _createScrollBar : function(orientation)
-    {
+    _createScrollBar(orientation) {
       if (qx.core.Environment.get("qx.nativeScrollBars")) {
         return new qx.ui.core.scroll.NativeScrollBar(orientation);
       } else {

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

@@ -23,17 +23,14 @@
  * <code>scrollbar-y</code> to get the handler working. Also, you have to
  * attach the listener yourself.
  */
-qx.Mixin.define("qx.ui.core.scroll.MWheelHandling",
-{
-  members :
-  {
+qx.Mixin.define("qx.ui.core.scroll.MWheelHandling", {
+  members: {
     /**
      * Mouse wheel event handler
      *
      * @param e {qx.event.type.Mouse} Mouse event
      */
-    _onMouseWheel : function(e)
-    {
+    _onMouseWheel(e) {
       var showX = this._isChildControlVisible("scrollbar-x");
       var showY = this._isChildControlVisible("scrollbar-y");
 
@@ -48,7 +45,6 @@ qx.Mixin.define("qx.ui.core.scroll.MWheelHandling",
 
       // y case
       if (scrollbarY) {
-
         var steps = parseInt(deltaY);
         if (steps !== 0) {
           scrollbarY.scrollBySteps(steps);
@@ -58,7 +54,7 @@ qx.Mixin.define("qx.ui.core.scroll.MWheelHandling",
         var max = scrollbarY.getMaximum();
 
         // pass the event to the parent if the scrollbar is at an edge
-        if (steps < 0 && position <= 0 || steps > 0 && position >= max) {
+        if ((steps < 0 && position <= 0) || (steps > 0 && position >= max)) {
           endY = true;
         }
       }
@@ -73,15 +69,17 @@ qx.Mixin.define("qx.ui.core.scroll.MWheelHandling",
         var position = scrollbarX.getPosition();
         var max = scrollbarX.getMaximum();
         // pass the event to the parent if the scrollbar is at an edge
-        if (steps < 0 && position <= 0 || steps > 0 && position >= max) {
+        if ((steps < 0 && position <= 0) || (steps > 0 && position >= max)) {
           endX = true;
         }
       }
 
       // pass the event to the parent if both scrollbars are at the end
-      if ((!endY && deltaX === 0) ||
-          (!endX && deltaY === 0) ||
-          ((!endX || !endY ) && deltaX !== 0 && deltaY !== 0)) {
+      if (
+        (!endY && deltaX === 0) ||
+        (!endX && deltaY === 0) ||
+        ((!endX || !endY) && deltaX !== 0 && deltaY !== 0)
+      ) {
         // Stop bubbling and native event only if a scrollbar is visible
         e.stop();
       }

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

@@ -42,18 +42,15 @@
  * <a href='http://qooxdoo.org/docs/#desktop/widget/scrollbar.md' target='_blank'>
  * Documentation of this widget in the qooxdoo manual.</a>
  */
-qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
-{
-  extend : qx.ui.core.Widget,
-  implement : qx.ui.core.scroll.IScrollBar,
-
+qx.Class.define("qx.ui.core.scroll.NativeScrollBar", {
+  extend: qx.ui.core.Widget,
+  implement: qx.ui.core.scroll.IScrollBar,
 
   /**
    * @param orientation {String?"horizontal"} The initial scroll bar orientation
    */
-  construct : function(orientation)
-  {
-    this.base(arguments);
+  construct(orientation) {
+    super();
 
     this.addState("native");
 
@@ -74,93 +71,79 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
     }
 
     // prevent drag & drop on scrolling
-    this.addListener("track", function(e) {
-      e.stopPropagation();
-    }, this);
+    this.addListener(
+      "track",
+      function (e) {
+        e.stopPropagation();
+      },
+      this
+    );
   },
 
-
-  events : {
+  events: {
     /**
      * Fired as soon as the scroll animation ended.
      */
-    scrollAnimationEnd: 'qx.event.type.Event'
+    scrollAnimationEnd: "qx.event.type.Event"
   },
 
-
-  properties :
-  {
+  properties: {
     // overridden
-    appearance :
-    {
-      refine : true,
-      init : "scrollbar"
+    appearance: {
+      refine: true,
+      init: "scrollbar"
     },
 
-
     // interface implementation
-    orientation :
-    {
-      check : [ "horizontal", "vertical" ],
-      init : "horizontal",
-      apply : "_applyOrientation"
+    orientation: {
+      check: ["horizontal", "vertical"],
+      init: "horizontal",
+      apply: "_applyOrientation"
     },
 
-
     // interface implementation
-    maximum :
-    {
-      check : "PositiveInteger",
-      apply : "_applyMaximum",
-      init : 100
+    maximum: {
+      check: "PositiveInteger",
+      apply: "_applyMaximum",
+      init: 100
     },
 
-
     // interface implementation
-    position :
-    {
-      check : "Number",
-      init : 0,
-      apply : "_applyPosition",
-      event : "scroll"
+    position: {
+      check: "Number",
+      init: 0,
+      apply: "_applyPosition",
+      event: "scroll"
     },
 
-
     /**
      * Step size for each tap on the up/down or left/right buttons.
      */
-    singleStep :
-    {
-      check : "Integer",
-      init : 20
+    singleStep: {
+      check: "Integer",
+      init: 20
     },
 
-
     // interface implementation
-    knobFactor :
-    {
-      check : "PositiveNumber",
-      nullable : true
+    knobFactor: {
+      check: "PositiveNumber",
+      nullable: true
     }
   },
 
+  members: {
+    __isHorizontal: null,
+    __scrollPaneElement: null,
+    __requestId: null,
 
-  members :
-  {
-    __isHorizontal : null,
-    __scrollPaneElement : null,
-    __requestId : null,
-
-    __scrollAnimationframe : null,
-
+    __scrollAnimationframe: null,
 
     /**
      * Get the scroll pane html element.
      *
      * @return {qx.html.Element} The element
      */
-    _getScrollPaneElement : function()
-    {
+    _getScrollPaneElement() {
       if (!this.__scrollPaneElement) {
         this.__scrollPaneElement = new qx.html.Element();
       }
@@ -174,18 +157,15 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
     */
 
     // overridden
-    renderLayout : function(left, top, width, height)
-    {
-      var changes = this.base(arguments, left, top, width, height);
+    renderLayout(left, top, width, height) {
+      var changes = super.renderLayout(left, top, width, height);
 
       this._updateScrollBar();
       return changes;
     },
 
-
     // overridden
-    _getContentHint : function()
-    {
+    _getContentHint() {
       var scrollbarWidth = qx.bom.element.Scroll.getScrollbarWidth();
       return {
         width: this.__isHorizontal ? 100 : scrollbarWidth,
@@ -197,15 +177,12 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
       };
     },
 
-
     // overridden
-    _applyEnabled : function(value, old)
-    {
-      this.base(arguments, value, old);
+    _applyEnabled(value, old) {
+      super._applyEnabled(value, old);
       this._updateScrollBar();
     },
 
-
     /*
     ---------------------------------------------------------------------------
       PROPERTY APPLY ROUTINES
@@ -213,14 +190,12 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
     */
 
     // property apply
-    _applyMaximum : function(value) {
+    _applyMaximum(value) {
       this._updateScrollBar();
     },
 
-
     // property apply
-    _applyPosition : function(value)
-    {
+    _applyPosition(value) {
       var content = this.getContentElement();
 
       if (this.__isHorizontal) {
@@ -230,20 +205,18 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
       }
     },
 
-
     // property apply
-    _applyOrientation : function(value, old)
-    {
+    _applyOrientation(value, old) {
       // ARIA attrs
       this.getContentElement().setAttribute("aria-orientation", value);
-      
-      var isHorizontal = this.__isHorizontal = value === "horizontal";
+
+      var isHorizontal = (this.__isHorizontal = value === "horizontal");
 
       this.set({
-        allowGrowX : isHorizontal,
-        allowShrinkX : isHorizontal,
-        allowGrowY : !isHorizontal,
-        allowShrinkY : !isHorizontal
+        allowGrowX: isHorizontal,
+        allowShrinkX: isHorizontal,
+        allowGrowY: !isHorizontal,
+        allowShrinkY: !isHorizontal
       });
 
       if (isHorizontal) {
@@ -261,13 +234,11 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
       qx.ui.core.queue.Layout.add(this);
     },
 
-
     /**
      * Update the scroll bar according to its current size, max value and
      * enabled state.
      */
-    _updateScrollBar : function()
-    {
+    _updateScrollBar() {
       var isHorizontal = this.__isHorizontal;
 
       var bounds = this.getBounds();
@@ -275,8 +246,7 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
         return;
       }
 
-      if (this.isEnabled())
-      {
+      if (this.isEnabled()) {
         var containerSize = isHorizontal ? bounds.width : bounds.height;
         var innerSize = this.getMaximum() + containerSize;
       } else {
@@ -286,13 +256,14 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
       // Scrollbars don't work properly in IE/Edge if the element with overflow has
       // exactly the size of the scrollbar. Thus we move the element one pixel
       // out of the view and increase the size by one.
-      if (qx.core.Environment.get("engine.name") == "mshtml" ||
-        qx.core.Environment.get("browser.name") == "edge")
-      {
+      if (
+        qx.core.Environment.get("engine.name") == "mshtml" ||
+        qx.core.Environment.get("browser.name") == "edge"
+      ) {
         var bounds = this.getBounds();
         this.getContentElement().setStyles({
-          left: (isHorizontal ? bounds.left : (bounds.left -1)) + "px",
-          top: (isHorizontal ? (bounds.top - 1) : bounds.top) + "px",
+          left: (isHorizontal ? bounds.left : bounds.left - 1) + "px",
+          top: (isHorizontal ? bounds.top - 1 : bounds.top) + "px",
           width: (isHorizontal ? bounds.width : bounds.width + 1) + "px",
           height: (isHorizontal ? bounds.height + 1 : bounds.height) + "px"
         });
@@ -308,9 +279,8 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
       this.updatePosition(this.getPosition());
     },
 
-
     // interface implementation
-    scrollTo : function(position, duration) {
+    scrollTo(position, duration) {
       // if a user sets a new position, stop any animation
       this.stopScrollAnimation();
 
@@ -319,16 +289,30 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
 
         this.__scrollAnimationframe = new qx.bom.AnimationFrame();
 
-        this.__scrollAnimationframe.on("frame", function(timePassed) {
-          var newPos = parseInt(timePassed/duration * (position - from) + from);
-          this.updatePosition(newPos);
-        }, this);
-
-        this.__scrollAnimationframe.on("end", function() {
-          this.setPosition(Math.max(0, Math.min(this.getMaximum(), position)));
-          this.__scrollAnimationframe = null;
-          this.fireEvent("scrollAnimationEnd");
-        }, this);
+        this.__scrollAnimationframe.on(
+          "frame",
+          function (timePassed) {
+            var newPos = parseInt(
+              (timePassed / duration) * (position - from) + from
+            );
+
+            this.updatePosition(newPos);
+          },
+          this
+        );
+
+        this.__scrollAnimationframe.on(
+          "end",
+          function () {
+            this.setPosition(
+              Math.max(0, Math.min(this.getMaximum(), position))
+            );
+
+            this.__scrollAnimationframe = null;
+            this.fireEvent("scrollAnimationEnd");
+          },
+          this
+        );
 
         this.__scrollAnimationframe.startSequence(duration);
       } else {
@@ -336,77 +320,69 @@ qx.Class.define("qx.ui.core.scroll.NativeScrollBar",
       }
     },
 
-
     /**
      * Helper to set the new position taking care of min and max values.
      * @param position {Number} The new position.
      */
-    updatePosition : function(position) {
+    updatePosition(position) {
       this.setPosition(Math.max(0, Math.min(this.getMaximum(), position)));
     },
 
-
     // interface implementation
-    scrollBy : function(offset, duration) {
+    scrollBy(offset, duration) {
       this.scrollTo(this.getPosition() + offset, duration);
     },
 
-
     // interface implementation
-    scrollBySteps : function(steps, duration)
-    {
+    scrollBySteps(steps, duration) {
       var size = this.getSingleStep();
       this.scrollBy(steps * size, duration);
     },
 
-
     /**
      * If a scroll animation is running, it will be stopped.
      */
-    stopScrollAnimation : function() {
+    stopScrollAnimation() {
       if (this.__scrollAnimationframe) {
         this.__scrollAnimationframe.cancelSequence();
         this.__scrollAnimationframe = null;
       }
     },
 
-
     /**
      * Scroll event handler
      *
      * @param e {qx.event.type.Event} the scroll event
      */
-    _onScroll : function(e)
-    {
+    _onScroll(e) {
       var container = this.getContentElement();
-      var position = this.__isHorizontal ? container.getScrollX() : container.getScrollY();
+      var position = this.__isHorizontal
+        ? container.getScrollX()
+        : container.getScrollY();
       this.setPosition(position);
     },
 
-
     /**
      * Listener for appear which ensured the scroll bar is positioned right
      * on appear.
      *
      * @param e {qx.event.type.Data} Incoming event object
      */
-    _onAppear : function(e) {
+    _onAppear(e) {
       this._applyPosition(this.getPosition());
     },
 
-
     /**
      * Stops propagation on the given even
      *
      * @param e {qx.event.type.Event} the event
      */
-    _stopPropagation : function(e) {
+    _stopPropagation(e) {
       e.stopPropagation();
     }
   },
 
-
-  destruct : function() {
+  destruct() {
     this._disposeObjects("__scrollPaneElement");
   }
 });