@qooxdoo/framework 7.0.0-beta → 7.0.0-beta.4

package/source/class/qx/bom/Font.js

@@ -53,7 +53,8 @@ qx.Class.define("qx.bom.Font",
       textDecoration: null,
       lineHeight: null,
       color: null,
-      textShadow: null
+      textShadow: null,
+      letterSpacing: null
     };
 
     if (size !== undefined) {
@@ -152,7 +153,8 @@ qx.Class.define("qx.bom.Font",
       textDecoration: "",
       lineHeight: 1.2,
       color: "",
-      textShadow: ""
+      textShadow: "",
+      letterSpacing: "",
     },
 
 
@@ -279,12 +281,20 @@ qx.Class.define("qx.bom.Font",
       check : "String",
       apply : "_applyTextShadow"
     },
+
     /** The weight property of the font as opposed to just setting it to 'bold' by setting the bold property to true */
     weight :
     {
       nullable : true,
       check : "String",
       apply : "_applyWeight"
+    },
+    
+    /** The Letter Spacing (Unit: pixel) */
+    letterSpacing: {
+      check: "Integer",
+      nullable: true,
+      apply: "_applyLetterSpacing"
     }
   },
 
@@ -375,6 +385,11 @@ qx.Class.define("qx.bom.Font",
       this.__lookupMap.textShadow = value == null ? null : value;
     },
 
+    // property apply
+    _applyLetterSpacing: function (value, old) {
+      this.__lookupMap.letterSpacing = value === null ? null : value + "px";
+    },
+
 
     /**
      * Get a map of all CSS styles, which will be applied to the widget. Only

package/source/class/qx/bom/Iframe.js

@@ -39,7 +39,6 @@ qx.Class.define("qx.bom.Iframe",
      */
     DEFAULT_ATTRIBUTES :
     {
-      onload : "qx.event.handler.Iframe.onevent(this)",
       frameBorder: 0,
       frameSpacing: 0,
       marginWidth: 0,
@@ -66,14 +65,20 @@ qx.Class.define("qx.bom.Iframe",
       var attributes = attributes ? qx.lang.Object.clone(attributes) : {};
       var initValues = qx.bom.Iframe.DEFAULT_ATTRIBUTES;
 
-      for (var key in initValues)
-      {
-        if (attributes[key] == null) {
+      for (var key in initValues) {
+        if (!(key in attributes)) {
           attributes[key] = initValues[key];
         }
       }
 
-      return qx.dom.Element.create("iframe", attributes, win);
+      var elem = qx.dom.Element.create("iframe", attributes, win);
+      if (!("onload" in attributes)) {
+        elem.onload = function() {
+          qx.event.handler.Iframe.onevent(elem);
+        };
+      }
+      return elem;
+
     },
 
 

package/source/class/qx/bom/Label.js

@@ -38,7 +38,8 @@ qx.Bootstrap.define("qx.bom.Label",
       fontWeight : 1,
       fontStyle : 1,
       lineHeight : 1,
-      wordBreak : 1
+      wordBreak: 1,
+      letterSpacing : 1,
     },
 
 

package/source/class/qx/bom/Template.js

@@ -155,6 +155,8 @@ qx.Bootstrap.define("qx.bom.Template", {
   }
 });
 
+/*eslint curly: "off"*/
+
 (function() {
 // prevent using CommonJS exports object,
 // by shadowing global exports object

package/source/class/qx/bom/client/Browser.js

@@ -53,8 +53,17 @@ qx.Bootstrap.define("qx.bom.client.Browser",
      * @return {String} The name of the current browser.
      * @internal
      */
-    getName : function() {
-      var agent = navigator.userAgent;
+    getName() {
+      return qx.bom.client.Browser.detectName(navigator.userAgent);
+    },
+
+    /**
+     * Examines the user agent of the browser to determine the browser name
+     * 
+     * @param agent {String} the user agent string
+     * @return {String} The name of the current browser.
+     */
+    detectName(agent) {
       var reg = new RegExp("(" + qx.bom.client.Browser.__agents + ")(/|)?([0-9]+\.[0-9])?");
       var match = agent.match(reg);
       if (!match) {

package/source/class/qx/bom/client/OperatingSystem.js

@@ -23,6 +23,7 @@
  * directly. Please check its class comment for details how to use it.
  *
  * @internal
+ * @ignore(process.*)
  */
 qx.Bootstrap.define("qx.bom.client.OperatingSystem",
 {
@@ -32,8 +33,23 @@ qx.Bootstrap.define("qx.bom.client.OperatingSystem",
      * Checks for the name of the operating system.
      * @return {String} The name of the operating system.
      * @internal
+     * @ignore(process.*)
+     * 
      */
     getName : function() {
+      if (typeof process != "undefined" && process.platform) {
+        const MAP = {
+          "win32": "win",
+          "darwin": "osx",
+          "linux": "linux",
+          "aix": "unix",
+          "freebsd": "unix",
+          "openbsd": "unix",
+          "sunos": "unix",
+          "android": "android"
+        }
+        return MAP[process.platform]||"";
+      }
       if (!navigator) {
         return "";
       }

package/source/class/qx/bom/element/Decoration.js

@@ -83,7 +83,14 @@ qx.Class.define("qx.bom.element.Decoration",
     {
       var tag = this.getTagName(repeat, source);
       if (tag != element.tagName.toLowerCase()) {
-        throw new Error("Image modification not possible because elements could not be replaced at runtime anymore!");
+
+        // The "no-repeat" means that `getTagName` will suggest a `div` as opposed to an `img` tag, preferring to use
+        //  `img` only for things that need scaling.  The Desktop `qx.ui.*` will always follow this rule, but it
+        //  is valid for virtual DOM (`qx.html.*`) to be used to create a no-repeat `img` tag.  Ignore the validation
+        //  for `no-repeat` `img`.
+        if (repeat != "no-repeat" || element.tagName.toLowerCase() != "img") {
+          throw new Error("Image modification not possible because elements could not be replaced at runtime anymore!");
+        }
       }
 
       var ret = this.getAttributes(source, repeat, style);
@@ -203,10 +210,6 @@ qx.Class.define("qx.bom.element.Decoration",
         style = {};
       }
 
-      if (!style.position) {
-        style.position = "absolute";
-      }
-
       if ((qx.core.Environment.get("engine.name") == "mshtml"))
       {
         // Add a fix for small blocks where IE has a minHeight

package/source/class/qx/bom/element/Dimension.js

@@ -83,6 +83,52 @@ qx.Bootstrap.define("qx.bom.element.Dimension",
       };
     },
 
+    /**
+     * Returns the outer height of the given element, including height, vertical padding, and vertical borders
+     *
+     * @param element {Element} element to query
+     * @param includeMargins {Boolean?} whether to include margins in teh
+     * @return {Integer} the height of the element
+     */
+     getOuterHeight(element, includeMargins) {
+      if (includeMargins) {
+        let marginTop = parseInt(document.defaultView.getComputedStyle(element, '').getPropertyValue('margin-top'), 10);
+        let marginBottom = parseInt(document.defaultView.getComputedStyle(element, '').getPropertyValue('margin-bottom'), 10);
+        return element.offsetHeight + marginTop + marginBottom;
+      }
+      return element.offsetHeight;
+    },
+
+    /**
+     * Returns the outer width of the given element, including height, vertical padding, and vertical borders
+     *
+     * @param element {Element} element to query
+     * @param includeMargins {Boolean?} whether to include margins in teh
+     * @return {Integer} the width of the element
+     */
+     getOuterWidth(element, includeMargins) {
+      if (includeMargins) {
+        let marginLeft = parseInt(document.defaultView.getComputedStyle(element, '').getPropertyValue('margin-left'), 10);
+        let marginRight = parseInt(document.defaultView.getComputedStyle(element, '').getPropertyValue('margin-right'), 10);
+        return element.offsetWidth + marginLeft + marginRight;
+      }
+      return element.offsetWidth;
+    },
+
+    /**
+     * Returns the outer size of the given element, including height, vertical padding, and vertical borders
+     *
+     * @param element {Element} element to query
+     * @param includeMargins {Boolean?} whether to include margins in teh
+     * @return {Map} map containing the width and height of the element
+     */
+     getOuterSize(element, includeMargins) {
+      return {
+        width: this.getOuterWidth(element, includeMargins),
+        height: this.getOuterHeight(element, includeMargins)
+      };
+    },
+
 
     /** @type {Map} Contains all overflow values where scrollbars are invisible */
     __hiddenScrollbars :

package/source/class/qx/bom/webfonts/WebFont.js

@@ -54,6 +54,15 @@ qx.Class.define("qx.bom.webfonts.WebFont", {
     {
       nullable : true,
       apply : "_applySources"
+    },
+
+    /**
+     * Indicates that the font has loaded successfully
+     */
+    valid: {
+      init: false,
+      check: "Boolean",
+      event: "changeValid"
     }
   },
 
@@ -93,6 +102,7 @@ qx.Class.define("qx.bom.webfonts.WebFont", {
     _onWebFontChangeStatus : function(ev)
     {
       var result = ev.getData();
+      this.setValid(!!result.valid);
       this.fireDataEvent("changeStatus", result);
       if (qx.core.Environment.get("qx.debug")) {
         if (result.valid === false) {

package/source/class/qx/core/BaseInit.js

@@ -65,7 +65,9 @@ qx.Class.define("qx.core.BaseInit",
         qx.log.Logger.warn("Could not detect operating system!");
       }
 
-      qx.log.Logger.debug(this, "Load runtime: " + (new Date - qx.Bootstrap.LOADSTART) + "ms");
+      if (qx.core.Environment.get("qx.debug.startupTimings")) {
+        qx.log.Logger.debug(this, "Load runtime: " + (new Date - qx.Bootstrap.LOADSTART) + "ms");
+      }
 
       var app = qx.core.Environment.get("qx.application");
       var clazz = qx.Class.getByName(app);
@@ -76,11 +78,15 @@ qx.Class.define("qx.core.BaseInit",
 
         var start = new Date;
         this.__application.main();
-        qx.log.Logger.debug(this, "Main runtime: " + (new Date - start) + "ms");
+        if (qx.core.Environment.get("qx.debug.startupTimings")) {
+          qx.log.Logger.debug(this, "Main runtime: " + (new Date - start) + "ms");
+        }
 
         var start = new Date;
         this.__application.finalize();
-        qx.log.Logger.debug(this, "Finalize runtime: " + (new Date - start) + "ms");
+        if (qx.core.Environment.get("qx.debug.startupTimings")) {
+          qx.log.Logger.debug(this, "Finalize runtime: " + (new Date - start) + "ms");
+        }
         
         qx.event.handler.Application.onAppInstanceInitialized();
       }

package/source/class/qx/core/Environment.js

@@ -904,6 +904,7 @@ qx.Bootstrap.define("qx.core.Environment",
       "qx.blankpage": "qx/static/blank.html",
       "qx.debug.databinding": false,
       "qx.debug.dispose": false,
+      "qx.debug.startupTimings": false,
       // generator optimization vectors
       "qx.optimization.basecalls": false,
       "qx.optimization.comments": false,

package/source/class/qx/core/Property.js

@@ -1102,7 +1102,7 @@ qx.Bootstrap.define("qx.core.Property",
         if (qx.core.Environment.get("qx.promise") && (!config.check || config.check != "qx.Promise")) {
           code.push(
               'var promise;',
-              'if (value instanceof qx.Promise || value instanceof Promise) ',
+              'if (qx.Promise.isPromise(value)) ',
                 'promise = value.then(set.bind(this));',
               'else ',
                 'promise = set.apply(this, arguments);');
@@ -1894,7 +1894,7 @@ qx.Bootstrap.define("qx.core.Property",
 
       if (qx.core.Environment.get("qx.promise")) {
         code.push(
-            "if(promise instanceof qx.Promise || promise instanceof Promise) " +
+            "if(qx.Promise.isPromise(promise)) " +
               "return promise.then(fire); "
           );
       }

package/source/class/qx/data/SingleValueBinding.js

@@ -1344,12 +1344,15 @@ qx.Class.define("qx.data.SingleValueBinding",
       // get all bindings of object as target
       var targetBindings = this.__bindingsByTarget[hash];
 
-      if (!sourceBindings && !targetBindings)
+      if (!sourceBindings && !targetBindings) {
         return [];
-      if (!sourceBindings)
+      }
+      if (!sourceBindings) {
         return qx.lang.Array.clone(targetBindings);
-      if (!targetBindings)
+      }
+      if (!targetBindings) {
         return qx.lang.Array.clone(sourceBindings);
+      }
 
       return qx.lang.Array.unique(sourceBindings.concat(targetBindings));
     },

package/source/class/qx/data/controller/CheckedList.js

@@ -40,8 +40,9 @@ qx.Class.define("qx.data.controller.CheckedList", {
   construct(model, widget, path) {
     this.base(arguments, null, widget, path);
     this.setChecked(new qx.data.Array());
-    if (model)
+    if (model) {
       this.setModel(model);
+    }
   },
   
   properties: {
@@ -101,10 +102,12 @@ qx.Class.define("qx.data.controller.CheckedList", {
   
   members: {
     _applyChecked(value, oldValue) {
-      if (oldValue)
+      if (oldValue) {
         oldValue.removeListener("change", this.__onCheckedChange, this);
-      if (value)
+      }
+      if (value) {
         value.addListener("change", this.__onCheckedChange, this);
+      }
       this._updateChecked();
     },
     
@@ -137,8 +140,9 @@ qx.Class.define("qx.data.controller.CheckedList", {
      */
     __onCheckedChange(evt) {
       let data = evt.getData();
-      if (data.type == "order")
+      if (data.type == "order") {
         return;
+      }
       this._updateChecked();
     },
 
@@ -176,8 +180,9 @@ qx.Class.define("qx.data.controller.CheckedList", {
     _applyModel(value, oldValue) {
       if (!value || !value.getLength()) {
         let checked = this.getChecked();
-        if (checked)
+        if (checked) {
           checked.removeAll();
+        }
       }
       this.base(arguments, value, oldValue);
       this._updateChecked();
@@ -208,18 +213,21 @@ qx.Class.define("qx.data.controller.CheckedList", {
      * Event handler for changes in the target widget's `checked` property
      */
     __onTargetCheckedChange(evt) {
-      if (this.__inUpdateChecked)
+      if (this.__inUpdateChecked) {
         return;
+      }
       let target = this.getTarget();
       let replacement = [];
       target.getChecked().forEach(item => {
         let itemModel = item.getModel();
-        if (itemModel)
+        if (itemModel) {
           replacement.push(itemModel);
+        }
       });
       let checked = this.getChecked();
-      if (checked)
+      if (checked) {
         checked.replace(replacement);
+      }
     },
     
     /**
@@ -316,8 +324,9 @@ qx.Class.define("qx.data.controller.CheckedList", {
           if (itemModel) {
             let hash = itemModel.toHashCode();
             children[hash] = item;
-            if (item.getValue())
+            if (item.getValue()) {
               toUncheck[hash] = item;
+            }
           }
         });
         

package/source/class/qx/data/controller/List.js

@@ -294,6 +294,10 @@ qx.Class.define("qx.data.controller.List",
      * @param old {Map|null} The old icon options.
      */
     _applyIconOptions: function(value, old) {
+      if (qx.core.Environment.get("qx.debug")) {
+        this.assertFalse(value && !qx.lang.Type.isObject(value), "expecting an object");
+        this.assertTrue(!!value.converter || !!value.onUpdate || !!value.onSetFail || !!value.ignoreConverter);
+      }
       this.__renewBindings();
     },
 
@@ -306,6 +310,10 @@ qx.Class.define("qx.data.controller.List",
      * @param old {Map|null} The old label options.
      */
     _applyLabelOptions: function(value, old) {
+      if (qx.core.Environment.get("qx.debug")) {
+        this.assertFalse(value && !qx.lang.Type.isObject(value), "expecting an object");
+        this.assertTrue(!!value.converter || !!value.onUpdate || !!value.onSetFail || !!value.ignoreConverter);
+      }
       this.__renewBindings();
     },
 

package/source/class/qx/dev/unit/Sinon.js

@@ -68,7 +68,7 @@ qx.Bootstrap.define("qx.dev.unit.Sinon",
   }
 });
 
-
+/*eslint curly: "off"*/
 /**
  * @ignore(module, require, global, process.*, setImmediate)
  * @ignore(msSetImmediate)

package/source/class/qx/event/Utils.js

@@ -303,7 +303,7 @@ qx.Class.define("qx.event.Utils", {
         var tracker = {};
         for (var index = 0; index < arr.length; index++) {
           var result = fn(arr[index], index);
-          if (result instanceof qx.Promise) {
+          if (qx.Promise.isPromise(result)) {
             for (++index; index < arr.length; index++) {
               (function(item, index) {
                 result = result.then(function() {

package/source/class/qx/event/handler/DragDrop.js

@@ -494,7 +494,7 @@ qx.Class.define("qx.event.handler.DragDrop",
             });
         } else {
           if (qx.core.Environment.get("qx.debug")) {
-            if (result instanceof qx.Promise) {
+            if (qx.Promise.isPromise(result)) {
               this.error("DragDrop event \"" + type + "\" returned a promise but a synchronous event was required, drag and drop may not work as expected (consider using getDataAsync)");
             }
           }

package/source/class/qx/event/handler/Gesture.js

@@ -229,6 +229,8 @@ qx.Class.define("qx.event.handler.Gesture",
 
   defer : function(statics) {
     qx.event.Registration.addHandler(statics);
-    qx.event.Registration.getManager(document).getHandler(statics);
+    qx.event.Registration.addListener(window, "appinitialized", () => { 
+      qx.event.Registration.getManager(document).getHandler(statics);
+    });
   }
 });

package/source/class/qx/event/handler/Mouse.js

@@ -56,6 +56,7 @@ qx.Class.define("qx.event.handler.Mouse",
     this.__manager = manager;
     this.__window = manager.getWindow();
     this.__root = this.__window.document;
+    this.__onNativeListener = qx.lang.Function.listener(this._onNative, this);
 
     // Initialize observers
     this._initButtonObserver();
@@ -80,18 +81,27 @@ qx.Class.define("qx.event.handler.Mouse",
     /** @type {Map} Supported event types */
     SUPPORTED_TYPES :
     {
+      auxclick : 1,
+      click : 1,
+      contextmenu : 1,
+      dblclick : 1,
+      mousedown : 1,
+      mouseenter : 1,
+      mouseleave : 1,
       mousemove : 1,
-      mouseover : 1,
       mouseout : 1,
-      mousedown : 1,
+      mouseover : 1,
       mouseup : 1,
-      click : 1,
-      auxclick : 1,
-      dblclick : 1,
-      contextmenu : 1,
       mousewheel : 1
     },
 
+    /** @type{Map} these event types cannot be attached to the root (the document), they must be attached to the element itself */
+    NON_BUBBLING_EVENTS: 
+    {
+      mouseenter: true,
+      mouseleave: true
+    },
+
     /** @type {Integer} Which target check to use */
     TARGET_CHECK : qx.event.IEventHandler.TARGET_DOMNODE + qx.event.IEventHandler.TARGET_DOCUMENT + qx.event.IEventHandler.TARGET_WINDOW,
 
@@ -121,6 +131,9 @@ qx.Class.define("qx.event.handler.Mouse",
     __root : null,
     __preventNextClick: null,
 
+    /** @type{Function} wrapper for `_onNative`, bound as a native listener */
+    __onNativeListener: null,
+
 
 
     /*
@@ -133,24 +146,51 @@ qx.Class.define("qx.event.handler.Mouse",
     canHandleEvent : function(target, type) {},
 
 
-    // interface implementation
-    // The iPhone requires for attaching mouse events natively to every element which
-    // should react on mouse events. As of version 3.0 it also requires to keep the
-    // listeners as long as the event should work. In 2.0 it was enough to attach the
-    // listener once.
-    registerEvent : qx.core.Environment.get("os.name") === "ios" ?
-      function(target, type, capture) {
+    /**
+     * @Override
+     */
+    registerEvent(target, type, capture) {
+      if (qx.event.handler.Mouse.NON_BUBBLING_EVENTS[type]) {
+        qx.bom.Event.addNativeListener(target, type, this.__onNativeListener);
+  
+      } else if (qx.core.Environment.get("os.name") === "ios") {
+        // The iPhone requires for attaching mouse events natively to every element which
+        // should react on mouse events. As of version 3.0 it also requires to keep the
+        // listeners as long as the event should work. In 2.0 it was enough to attach the
+        // listener once.
         target["on" + type] = (function() {return null;});
-      } : (function() {return null;}),
-
+      }
+    },
 
-    // interface implementation
-    unregisterEvent : qx.core.Environment.get("os.name") === "ios" ?
-      function(target, type, capture) {
+    /**
+     * @Override
+     */
+    unregisterEvent(target, type, capture) {
+      if (qx.event.handler.Mouse.NON_BUBBLING_EVENTS[type]) {
+        qx.bom.Event.removeNativeListener(target, type, this.__onNativeListener);
+  
+      } else if (qx.core.Environment.get("os.name") === "ios") {
         target["on" + type] = undefined;
-      } : (function() {return null;}),
-
+      }
+    },
 
+    /**
+     * Default event handler for events that do not bubble
+     *
+     * @signature function(domEvent, eventId)
+     * @param domEvent {Event} Native event
+     */
+    _onNative: qx.event.GlobalError.observeMethod(function(domEvent) {
+      let target = qx.bom.Event.getTarget(domEvent);
+ 
+      qx.event.Registration.fireNonBubblingEvent(
+        target, 
+        domEvent.type,
+        qx.event.type.Mouse, 
+        [domEvent, target, undefined, undefined, domEvent.cancelable]
+      );
+    }),
+ 
 
 
     /*
@@ -237,10 +277,9 @@ qx.Class.define("qx.event.handler.Mouse",
       this.__onMoveEventWrapper = qx.lang.Function.listener(this._onMoveEvent, this);
 
       var Event = qx.bom.Event;
-
       Event.addNativeListener(this.__root, "mousemove", this.__onMoveEventWrapper);
-      Event.addNativeListener(this.__root, "mouseover", this.__onMoveEventWrapper);
       Event.addNativeListener(this.__root, "mouseout", this.__onMoveEventWrapper);
+      Event.addNativeListener(this.__root, "mouseover", this.__onMoveEventWrapper);
     },