@qooxdoo/framework 7.0.0-beta.5 → 7.0.0-beta.9

package/source/class/qx/theme/manager/Decoration.js

@@ -20,73 +20,61 @@
 
 /**
  * Manager for decoration themes
- * 
+ *
  * NOTE: Instances of this class must be disposed of after use
  *
  */
-qx.Class.define("qx.theme.manager.Decoration",
-{
-  type : "singleton",
-  extend : qx.core.Object,
-  implement : [ qx.core.IDisposable ],
-
+qx.Class.define("qx.theme.manager.Decoration", {
+  type: "singleton",
+  extend: qx.core.Object,
+  implement: [qx.core.IDisposable],
 
-  statics :
-  {
+  statics: {
     /** The prefix for all created CSS classes*/
-    CSS_CLASSNAME_PREFIX : "qx-"
+    CSS_CLASSNAME_PREFIX: "qx-"
   },
 
-
-
-  construct : function() {
-    this.base(arguments);
+  construct() {
+    super();
     this.__rules = [];
-    this.__legacyIe = (qx.core.Environment.get("engine.name") == "mshtml" &&
-      qx.core.Environment.get("browser.documentmode") < 9);
+    this.__legacyIe =
+      qx.core.Environment.get("engine.name") == "mshtml" &&
+      qx.core.Environment.get("browser.documentmode") < 9;
   },
 
-
   /*
   *****************************************************************************
      PROPERTIES
   *****************************************************************************
   */
 
-  properties :
-  {
+  properties: {
     /** Selected decoration theme */
-    theme :
-    {
-      check : "Theme",
-      nullable : true,
-      apply : "_applyTheme",
-      event : "changeTheme"
+    theme: {
+      check: "Theme",
+      nullable: true,
+      apply: "_applyTheme",
+      event: "changeTheme"
     }
   },
 
-
-
-
   /*
   *****************************************************************************
      MEMBERS
   *****************************************************************************
   */
 
-  members :
-  {
-    __dynamic : null,
-    __rules : null,
-    __legacyIe : false,
-
+  members: {
+    __dynamic: null,
+    __rules: null,
+    __legacyIe: false,
 
     /**
      * Returns the name which will be / is used as css class name.
      * @param value {String|qx.ui.decoration.IDecorator} The decorator string or instance.
      * @return {String} The css class name.
      */
-    getCssClassName : function(value) {
+    getCssClassName(value) {
       var prefix = qx.theme.manager.Decoration.CSS_CLASSNAME_PREFIX;
       if (qx.lang.Type.isString(value)) {
         return prefix + value;
@@ -95,14 +83,13 @@ qx.Class.define("qx.theme.manager.Decoration",
       }
     },
 
-
     /**
      * Adds a css class to the global stylesheet for the given decorator.
      * This includes resolving the decorator if it's a string.
      * @param value {String|qx.ui.decoration.IDecorator} The decorator string or instance.
      * @return {String} the css class name.
      */
-    addCssClass : function(value) {
+    addCssClass(value) {
       var sheet = qx.ui.style.Stylesheet.getInstance();
 
       var instance = value;
@@ -125,28 +112,31 @@ qx.Class.define("qx.theme.manager.Decoration",
       // create and add a CSS rule
       var css = "";
       var styles = instance.getStyles(true);
-      
-      // Sort the styles so that more specific styles come after the group styles, 
+
+      // Sort the styles so that more specific styles come after the group styles,
       // eg background-color comes after background. The sort order is alphabetical
       // so that short cut rules come before actual
-      Object.keys(styles).sort().forEach(function(key) {
-        // if we find a map value, use it as pseudo class
-        if (qx.Bootstrap.isObject(styles[key])) {
-          var innerCss = "";
-          var innerStyles = styles[key];
-          var inner = false;
-          for (var innerKey in innerStyles) {
-            inner = true;
-            innerCss += innerKey + ":" + innerStyles[innerKey] + ";";
+      Object.keys(styles)
+        .sort()
+        .forEach(function (key) {
+          // if we find a map value, use it as pseudo class
+          if (qx.Bootstrap.isObject(styles[key])) {
+            var innerCss = "";
+            var innerStyles = styles[key];
+            var inner = false;
+            for (var innerKey in innerStyles) {
+              inner = true;
+              innerCss += innerKey + ":" + innerStyles[innerKey] + ";";
+            }
+            var innerSelector = this.__legacyIe
+              ? selector
+              : selector + (inner ? ":" : "");
+            this.__rules.push(innerSelector + key);
+            sheet.addRule(innerSelector + key, innerCss);
+            return;
           }
-          var innerSelector = this.__legacyIe ? selector :
-            selector + (inner ? ":" : "");
-          this.__rules.push(innerSelector + key);
-          sheet.addRule(innerSelector + key, innerCss);
-          return;
-        }
-        css += key + ":" + styles[key] + ";";
-      }, this);
+          css += key + ":" + styles[key] + ";";
+        }, this);
 
       if (css) {
         sheet.addRule(selector, css);
@@ -156,30 +146,26 @@ qx.Class.define("qx.theme.manager.Decoration",
       return value;
     },
 
-
     /**
      * Removes all previously by {@link #addCssClass} created CSS rule from
      * the global stylesheet.
      */
-    removeAllCssClasses : function()
-    {
+    removeAllCssClasses() {
       // remove old rules
-      for (var i=0; i < this.__rules.length; i++) {
+      for (var i = 0; i < this.__rules.length; i++) {
         var selector = this.__rules[i];
         qx.ui.style.Stylesheet.getInstance().removeRule(selector);
       }
       this.__rules = [];
     },
 
-
     /**
      * Returns the dynamically interpreted result for the incoming value
      *
      * @param value {String} dynamically interpreted idenfier
      * @return {var} return the (translated) result of the incoming value
      */
-    resolve : function(value)
-    {
+    resolve(value) {
       if (!value) {
         return null;
       }
@@ -203,21 +189,24 @@ qx.Class.define("qx.theme.manager.Decoration",
         return null;
       }
 
-      if(!theme.decorations[value]) {
+      if (!theme.decorations[value]) {
         return null;
       }
-      
+
       // create an empty decorator
       var decorator = new qx.ui.decoration.Decorator();
 
       // handle recursive decorator includes
-      var recurseDecoratorInclude = function(currentEntry, name) {
+      var recurseDecoratorInclude = function (currentEntry, name) {
         // follow the include chain to the topmost decorator entry
-        if(currentEntry.include && theme.decorations[currentEntry.include]) {
-          recurseDecoratorInclude(theme.decorations[currentEntry.include], currentEntry.include);
+        if (currentEntry.include && theme.decorations[currentEntry.include]) {
+          recurseDecoratorInclude(
+            theme.decorations[currentEntry.include],
+            currentEntry.include
+          );
         }
 
-        // apply styles from the included decorator, 
+        // apply styles from the included decorator,
         // overwriting existing values.
         if (currentEntry.style) {
           decorator.set(currentEntry.style);
@@ -228,11 +217,10 @@ qx.Class.define("qx.theme.manager.Decoration",
       recurseDecoratorInclude(theme.decorations[value], value);
 
       cache[value] = decorator;
-      
+
       return cache[value];
     },
 
-
     /**
      * Whether the given value is valid for being used in a property
      * with the 'check' configured to 'Decorator'.
@@ -240,13 +228,10 @@ qx.Class.define("qx.theme.manager.Decoration",
      * @param value {var} Incoming value
      * @return {Boolean} Whether the value is valid for being used in a Decorator property
      */
-    isValidPropertyValue : function(value)
-    {
+    isValidPropertyValue(value) {
       if (typeof value === "string") {
         return this.isDynamic(value);
-      }
-      else if (typeof value === "object")
-      {
+      } else if (typeof value === "object") {
         var clazz = value.constructor;
         return qx.Class.hasInterface(clazz, qx.ui.decoration.IDecorator);
       }
@@ -254,15 +239,13 @@ qx.Class.define("qx.theme.manager.Decoration",
       return false;
     },
 
-
     /**
      * Whether a value is interpreted dynamically
      *
      * @param value {String} dynamically interpreted identifier
      * @return {Boolean} returns <code>true</code> if the value is interpreted dynamically
      */
-    isDynamic : function(value)
-    {
+    isDynamic(value) {
       if (!value) {
         return false;
       }
@@ -275,7 +258,6 @@ qx.Class.define("qx.theme.manager.Decoration",
       return !!theme.decorations[value];
     },
 
-
     /**
      * Whether the given decorator is cached
      *
@@ -283,30 +265,26 @@ qx.Class.define("qx.theme.manager.Decoration",
      * @return {Boolean} <code>true</code> if the decorator is cached
      * @internal
      */
-    isCached : function(decorator)
-    {
-      return !this.__dynamic ? false :
-        qx.lang.Object.contains(this.__dynamic, decorator);
+    isCached(decorator) {
+      return !this.__dynamic
+        ? false
+        : qx.lang.Object.contains(this.__dynamic, decorator);
     },
 
-
     // property apply
-    _applyTheme : function(value, old)
-    {
+    _applyTheme(value, old) {
       var aliasManager = qx.util.AliasManager.getInstance();
 
       // remove old rules
       this.removeAllCssClasses();
 
-      if (old)
-      {
+      if (old) {
         for (var alias in old.aliases) {
           aliasManager.remove(alias);
         }
       }
 
-      if (value)
-      {
+      if (value) {
         for (var alias in value.aliases) {
           aliasManager.add(alias, value.aliases[alias]);
         }
@@ -316,12 +294,10 @@ qx.Class.define("qx.theme.manager.Decoration",
       this.__dynamic = {};
     },
 
-
     /**
      * Clears internal caches and removes all previously created CSS classes.
      */
-    clear : function()
-    {
+    clear() {
       // remove aliases
       var aliasManager = qx.util.AliasManager.getInstance();
 
@@ -339,13 +315,11 @@ qx.Class.define("qx.theme.manager.Decoration",
       this.__dynamic = {};
     },
 
-
     /**
      * Refreshes all decorator by clearing internal caches and re applying
      * aliases.
      */
-    refresh : function()
-    {
+    refresh() {
       this.clear();
 
       var aliasManager = qx.util.AliasManager.getInstance();
@@ -358,15 +332,13 @@ qx.Class.define("qx.theme.manager.Decoration",
     }
   },
 
-
-
   /*
   *****************************************************************************
      DESTRUCTOR
   *****************************************************************************
   */
 
-  destruct : function() {
+  destruct() {
     this.clear();
   }
 });

package/source/class/qx/theme/manager/Font.js

@@ -24,11 +24,10 @@
  *
  * @ignore(qx.$$fontBootstrap)
  */
-qx.Class.define("qx.theme.manager.Font",
-{
-  type : "singleton",
-  extend : qx.util.ValueManager,
-  implement : [ qx.core.IDisposable ],
+qx.Class.define("qx.theme.manager.Font", {
+  type: "singleton",
+  extend: qx.util.ValueManager,
+  implement: [qx.core.IDisposable],
 
   /*
   *****************************************************************************
@@ -36,9 +35,8 @@ qx.Class.define("qx.theme.manager.Font",
   *****************************************************************************
   */
 
-  construct : function()
-  {
-    this.base(arguments);
+  construct() {
+    super();
 
     // Grab bootstrap info
     if (qx.$$fontBootstrap) {
@@ -47,38 +45,30 @@ qx.Class.define("qx.theme.manager.Font",
     }
   },
 
-
   /*
   *****************************************************************************
      PROPERTIES
   *****************************************************************************
   */
 
-  properties :
-  {
+  properties: {
     /** the currently selected font theme */
-    theme :
-    {
-      check : "Theme",
-      nullable : true,
-      apply : "_applyTheme",
-      event : "changeTheme"
+    theme: {
+      check: "Theme",
+      nullable: true,
+      apply: "_applyTheme",
+      event: "changeTheme"
     }
   },
 
-
-
-
-
   /*
   *****************************************************************************
      MEMBERS
   *****************************************************************************
   */
 
-  members :
-  {
-    _manifestFonts : null,
+  members: {
+    _manifestFonts: null,
 
     /**
      * Returns the dynamically interpreted result for the incoming value
@@ -86,13 +76,11 @@ qx.Class.define("qx.theme.manager.Font",
      * @param value {String} dynamically interpreted identifier
      * @return {var} return the (translated) result of the incoming value
      */
-    resolveDynamic : function(value)
-    {
+    resolveDynamic(value) {
       var dynamic = this._dynamic;
       return value instanceof qx.bom.Font ? value : dynamic[value];
     },
 
-
     /**
      * Returns the dynamically interpreted result for the incoming value,
      * (if available), otherwise returns the original value
@@ -100,8 +88,7 @@ qx.Class.define("qx.theme.manager.Font",
      * @return {var} either returns the (translated) result of the incoming
      * value or the value itself
      */
-    resolve : function(value)
-    {
+    resolve(value) {
       var cache = this._dynamic;
       var resolved = cache[value];
 
@@ -114,10 +101,9 @@ qx.Class.define("qx.theme.manager.Font",
       // or "qx.Theme.patch"), since these methods only merging the keys of
       // the theme and are not updating the cache
       var theme = this.getTheme();
-      if (theme !== null && theme.fonts[value])
-      {
+      if (theme !== null && theme.fonts[value]) {
         var font = this.__getFontClass(theme.fonts[value]);
-        var fo = (new font);
+        var fo = new font();
 
         // Inject information about custom charcter set tests before we apply the
         // complete blob in one.
@@ -125,7 +111,7 @@ qx.Class.define("qx.theme.manager.Font",
           fo.setComparisonString(theme.fonts[value].comparisonString);
         }
 
-        return cache[value] = fo.set(theme.fonts[value]);
+        return (cache[value] = fo.set(theme.fonts[value]));
       }
       if (qx.core.Environment.get("qx.debug")) {
         if (theme) {
@@ -134,7 +120,11 @@ qx.Class.define("qx.theme.manager.Font",
           }
           if (!this.__warnedMissingFonts[value]) {
             this.__warnedMissingFonts[value] = true;
-            this.debug(`Cannot resolve a font named ${value} - available fonts are ${Object.keys(theme.fonts).join(", ")}`);
+            this.debug(
+              `Cannot resolve a font named ${value} - available fonts are ${Object.keys(
+                theme.fonts
+              ).join(", ")}`
+            );
           }
         }
       }
@@ -142,19 +132,19 @@ qx.Class.define("qx.theme.manager.Font",
       return value;
     },
 
-
     /**
      * Whether a value is interpreted dynamically
      *
      * @param value {String} dynamically interpreted identifier
      * @return {Boolean} returns true if the value is interpreted dynamically
      */
-    isDynamic : function(value)
-    {
+    isDynamic(value) {
       var cache = this._dynamic;
 
-      if (value && (value instanceof qx.bom.Font || cache[value] !== undefined))
-      {
+      if (
+        value &&
+        (value instanceof qx.bom.Font || cache[value] !== undefined)
+      ) {
         return true;
       }
 
@@ -163,10 +153,9 @@ qx.Class.define("qx.theme.manager.Font",
       // or "qx.Theme.patch"), since these methods only merging the keys of
       // the theme and are not updating the cache
       var theme = this.getTheme();
-      if (theme !== null && value && theme.fonts[value])
-      {
+      if (theme !== null && value && theme.fonts[value]) {
         var font = this.__getFontClass(theme.fonts[value]);
-        var fo = (new font);
+        var fo = new font();
 
         // Inject information about custom charcter set tests before we apply the
         // complete blob in one.
@@ -181,17 +170,14 @@ qx.Class.define("qx.theme.manager.Font",
       return false;
     },
 
-
     /**
      * Checks for includes and resolves them recursively
      *
      * @param fonts {Map} all fonts of the theme
      * @param fontName {String} font name to include
      */
-    __resolveInclude : function(fonts, fontName)
-    {
-      if (fonts[fontName].include)
-      {
+    __resolveInclude(fonts, fontName) {
+      if (fonts[fontName].include) {
         // get font infos out of the font theme
         var fontToInclude = fonts[fonts[fontName].include];
 
@@ -199,39 +185,39 @@ qx.Class.define("qx.theme.manager.Font",
         fonts[fontName].include = null;
         delete fonts[fontName].include;
 
-        fonts[fontName] = qx.lang.Object.mergeWith(fonts[fontName], fontToInclude, false);
+        fonts[fontName] = qx.lang.Object.mergeWith(
+          fonts[fontName],
+          fontToInclude,
+          false
+        );
 
         this.__resolveInclude(fonts, fontName);
       }
     },
 
-
     // apply method
-    _applyTheme : function(value)
-    {
-      var dest = this._dynamic = {};
-
-      for (var key in dest)
-      {
-        if (dest[key].themed)
-        {
+    _applyTheme(value) {
+      var dest = (this._dynamic = {});
+
+      for (var key in dest) {
+        if (dest[key].themed) {
           dest[key].dispose();
           delete dest[key];
         }
       }
 
-      if (value)
-      {
-        var source = this._manifestFonts ? Object.assign(value.fonts, this._manifestFonts) : value.fonts;
+      if (value) {
+        var source = this._manifestFonts
+          ? Object.assign(value.fonts, this._manifestFonts)
+          : value.fonts;
 
-        for (var key in source)
-        {
+        for (var key in source) {
           if (source[key].include && source[source[key].include]) {
             this.__resolveInclude(source, key);
           }
 
           var font = this.__getFontClass(source[key]);
-          var fo = (new font);
+          var fo = new font();
 
           // Inject information about custom charcter set tests before we apply the
           // complete blob in one.
@@ -252,8 +238,7 @@ qx.Class.define("qx.theme.manager.Font",
      * @param config {Map} The font's configuration map
      * @return {Class}
      */
-    __getFontClass : function(config)
-    {
+    __getFontClass(config) {
       if (config.sources) {
         return qx.bom.webfonts.WebFont;
       }
@@ -261,14 +246,13 @@ qx.Class.define("qx.theme.manager.Font",
     }
   },
 
-
   /*
   *****************************************************************************
      DESTRUCTOR
   *****************************************************************************
   */
 
-  destruct : function() {
+  destruct() {
     this._disposeMap("_dynamic");
   }
 });