[TASK] Migrate Icons to TypeScript 91/55791/5
authorAndreas Fernandez <a.fernandez@scripting-base.de>
Sun, 18 Feb 2018 18:19:34 +0000 (19:19 +0100)
committerTymoteusz Motylewski <t.motylewski@gmail.com>
Tue, 20 Feb 2018 11:41:41 +0000 (12:41 +0100)
Change-Id: I4fa87602661e631adfe29d16e0f5bf31bb0f1104
Resolves: #82591
Releases: master
Reviewed-on: https://review.typo3.org/55791
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Joerg Boesche <typo3@joergboesche.de>
Reviewed-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Naegler <frank.naegler@typo3.org>
Reviewed-by: Tymoteusz Motylewski <t.motylewski@gmail.com>
Tested-by: Tymoteusz Motylewski <t.motylewski@gmail.com>
Build/types/TYPO3/index.d.ts
typo3/sysext/backend/Resources/Private/TypeScript/Icons.ts [new file with mode: 0644]
typo3/sysext/backend/Resources/Public/JavaScript/Icons.js

index fa9e06a..bbf3a49 100644 (file)
@@ -6,6 +6,7 @@
  */
 declare namespace TYPO3 {
   export let DebugConsole: any;
+  export let Icons: any;
   export let InfoWindow: any;
   export let Popover: any;
   export let ShortcutMenu: any;
diff --git a/typo3/sysext/backend/Resources/Private/TypeScript/Icons.ts b/typo3/sysext/backend/Resources/Private/TypeScript/Icons.ts
new file mode 100644 (file)
index 0000000..675772c
--- /dev/null
@@ -0,0 +1,170 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import * as $ from 'jquery';
+
+enum Sizes {
+  small = 'small',
+  default = 'default',
+  large = 'large',
+  overlay = 'overlay'
+}
+
+enum States {
+  default = 'default',
+  disabled = 'disabled'
+}
+
+enum MarkupIdentifiers {
+  default = 'default',
+  inline = 'inline'
+}
+
+interface Cache {
+  [key: string]: JQueryPromise<any>;
+}
+
+/**
+ * Module: TYPO3/CMS/Backend/Icons
+ * Uses the icon API of the core to fetch icons via AJAX.
+ */
+class Icons {
+  public readonly sizes: any = Sizes;
+  public readonly states: any = States;
+  public readonly markupIdentifiers: any = MarkupIdentifiers;
+  private readonly cache: Cache = {};
+
+  /**
+   * Get the icon by its identifier
+   *
+   * @param {string} identifier
+   * @param {Sizes} size
+   * @param {string} overlayIdentifier
+   * @param {string} state
+   * @param {MarkupIdentifiers} markupIdentifier
+   * @returns {JQueryPromise<any>}
+   */
+  public getIcon(identifier: string,
+                 size: Sizes,
+                 overlayIdentifier: string,
+                 state: string,
+                 markupIdentifier: MarkupIdentifiers): JQueryPromise<any> {
+    return $.when(this.fetch(identifier, size, overlayIdentifier, state, markupIdentifier));
+  }
+
+  /**
+   * Performs the AJAX request to fetch the icon
+   *
+   * @param {string} identifier
+   * @param {Sizes} size
+   * @param {string} overlayIdentifier
+   * @param {string} state
+   * @param {MarkupIdentifiers} markupIdentifier
+   * @returns {JQueryPromise<any>}
+   */
+  public fetch(identifier: string,
+               size: Sizes,
+               overlayIdentifier: string,
+               state: string,
+               markupIdentifier: MarkupIdentifiers): JQueryPromise<any> {
+    /**
+     * Icon keys:
+     *
+     * 0: identifier
+     * 1: size
+     * 2: overlayIdentifier
+     * 3: state
+     * 4: markupIdentifier
+     */
+    size = size || Sizes.default;
+    state = state || States.default;
+    markupIdentifier = markupIdentifier || MarkupIdentifiers.default;
+
+    const icon = [identifier, size, overlayIdentifier, state, markupIdentifier];
+    const cacheIdentifier = icon.join('_');
+
+    if (!this.isCached(cacheIdentifier)) {
+      this.putInCache(cacheIdentifier, $.ajax({
+        url: TYPO3.settings.ajaxUrls.icons,
+        dataType: 'html',
+        data: {
+          icon: JSON.stringify(icon)
+        },
+        success: (markup: string) => {
+          return markup;
+        }
+      }).promise());
+    }
+    return this.getFromCache(cacheIdentifier).done();
+  }
+
+  /**
+   * Check whether icon was fetched already
+   *
+   * @param {string} cacheIdentifier
+   * @returns {boolean}
+   */
+  private isCached(cacheIdentifier: string): boolean {
+    return typeof this.cache[cacheIdentifier] !== 'undefined';
+  }
+
+  /**
+   * Get icon from cache
+   *
+   * @param {string} cacheIdentifier
+   * @returns {JQueryPromise<any>}
+   */
+  private getFromCache(cacheIdentifier: string): JQueryPromise<any> {
+    return this.cache[cacheIdentifier];
+  }
+
+  /**
+   * Put icon into cache
+   *
+   * @param {string} cacheIdentifier
+   * @param {JQueryPromise<any>} markup
+   */
+  private putInCache(cacheIdentifier: string, markup: JQueryPromise<any>): void {
+    this.cache[cacheIdentifier] = markup;
+  }
+}
+
+let iconsObject: Icons;
+try {
+  // fetch from opening window
+  if (window.opener && window.opener.TYPO3 && window.opener.TYPO3.Icons) {
+    iconsObject = window.opener.TYPO3.Icons;
+  }
+
+  // fetch from parent
+  if (parent && parent.window.TYPO3 && parent.window.TYPO3.Icons) {
+    iconsObject = parent.window.TYPO3.Icons;
+  }
+
+  // fetch object from outer frame
+  if (top && top.TYPO3.Icons) {
+    iconsObject = top.TYPO3.Icons;
+  }
+} catch (e) {
+  // This only happens if the opener, parent or top is some other url (eg a local file)
+  // which loaded the current window. Then the browser's cross domain policy jumps in
+  // and raises an exception.
+  // For this case we are safe and we can create our global object below.
+}
+
+if (!iconsObject) {
+  iconsObject = new Icons();
+  TYPO3.Icons = iconsObject;
+}
+
+export = iconsObject;
index 5df4ef5..83f131b 100644 (file)
@@ -6,155 +6,8 @@
  * of the License, or any later version.
  *
  * For the full copyright and license information, please read the
- * LICENSE.txt file that was distributed with DocumentHeader source code.
+ * LICENSE.txt file that was distributed with this source code.
  *
  * The TYPO3 project - inspiring people to share!
  */
-
-/**
- * Module: TYPO3/CMS/Backend/Icons
- * Uses the icon API of the core to fetch icons via AJAX.
- */
-define(['jquery'], function($) {
-  'use strict';
-
-  try {
-    // fetch from opening window
-    if (window.opener && window.opener.TYPO3 && window.opener.TYPO3.Icons) {
-      return window.opener.TYPO3.Icons;
-    }
-
-    // fetch from parent
-    if (parent && parent.window.TYPO3 && parent.window.TYPO3.Icons) {
-      return parent.window.TYPO3.Icons;
-    }
-
-    // fetch object from outer frame
-    if (top && top.TYPO3.Icons) {
-      return top.TYPO3.Icons;
-    }
-  } catch (e) {
-    // This only happens if the opener, parent or top is some other url (eg a local file)
-    // which loaded the current window. Then the browser's cross domain policy jumps in
-    // and raises an exception.
-    // For this case we are safe and we can create our global object below.
-  }
-
-  /**
-   *
-   * @type {{cache: {}, sizes: {small: string, default: string, large: string, overlay: string}, states: {default: string, disabled: string}}}
-   * @exports TYPO3/CMS/Backend/Icons
-   */
-  var Icons = {
-    cache: {},
-    sizes: {
-      small: 'small',
-      default: 'default',
-      large: 'large',
-      overlay: 'overlay'
-    },
-    states: {
-      default: 'default',
-      disabled: 'disabled'
-    },
-    markupIdentifiers: {
-      default: 'default',
-      inline: 'inline'
-    }
-  };
-
-  /**
-   * Get the icon by its identifier.
-   *
-   * @param {String} identifier
-   * @param {String} size
-   * @param {String} overlayIdentifier
-   * @param {String} state
-   * @param {String} markupIdentifier
-   * @return {Promise<Array>}
-   */
-  Icons.getIcon = function(identifier, size, overlayIdentifier, state, markupIdentifier) {
-    return $.when(Icons.fetch(identifier, size, overlayIdentifier, state, markupIdentifier));
-  };
-
-  /**
-   * Performs the AJAX request to fetch the icon.
-   *
-   * @param {string} identifier
-   * @param {string} size
-   * @param {string} overlayIdentifier
-   * @param {string} state
-   * @param {string} markupIdentifier
-   * @return {String|Promise}
-   * @private
-   */
-  Icons.fetch = function(identifier, size, overlayIdentifier, state, markupIdentifier) {
-    /**
-     * Icon keys:
-     *
-     * 0: identifier
-     * 1: size
-     * 2: overlayIdentifier
-     * 3: state
-     * 4: markupIdentifier
-     */
-    size = size || Icons.sizes.default;
-    state = state || Icons.states.default;
-    markupIdentifier = markupIdentifier || Icons.markupIdentifiers.default;
-
-    var icon = [identifier, size, overlayIdentifier, state, markupIdentifier],
-      cacheIdentifier = icon.join('_');
-
-    if (!Icons.isCached(cacheIdentifier)) {
-      Icons.putInCache(cacheIdentifier, $.ajax({
-        url: TYPO3.settings.ajaxUrls['icons'],
-        dataType: 'html',
-        data: {
-          icon: JSON.stringify(icon)
-        },
-        success: function(markup) {
-          return markup;
-        }
-      }).promise());
-    }
-    return Icons.getFromCache(cacheIdentifier).done();
-  };
-
-  /**
-   * Check whether icon was fetched already
-   *
-   * @param {String} cacheIdentifier
-   * @returns {Boolean}
-   * @private
-   */
-  Icons.isCached = function(cacheIdentifier) {
-    return typeof Icons.cache[cacheIdentifier] !== 'undefined';
-  };
-
-  /**
-   * Get icon from cache
-   *
-   * @param {String} cacheIdentifier
-   * @returns {String}
-   * @private
-   */
-  Icons.getFromCache = function(cacheIdentifier) {
-    return Icons.cache[cacheIdentifier];
-  };
-
-  /**
-   * Put icon into cache
-   *
-   * @param {String} cacheIdentifier
-   * @param {Object} markup
-   * @private
-   */
-  Icons.putInCache = function(cacheIdentifier, markup) {
-    Icons.cache[cacheIdentifier] = markup;
-  };
-
-  // attach to global frame
-  TYPO3.Icons = Icons;
-
-  return Icons;
-});
+define(["require","exports","jquery"],function(a,b,c){"use strict";var d;!function(a){a.small="small",a.default="default",a.large="large",a.overlay="overlay"}(d||(d={}));var e;!function(a){a.default="default",a.disabled="disabled"}(e||(e={}));var f;!function(a){a.default="default",a.inline="inline"}(f||(f={}));var g,h=function(){function a(){this.sizes=d,this.states=e,this.markupIdentifiers=f,this.cache={}}return a.prototype.getIcon=function(a,b,d,e,f){return c.when(this.fetch(a,b,d,e,f))},a.prototype.fetch=function(a,b,g,h,i){b=b||d.default,h=h||e.default,i=i||f.default;var j=[a,b,g,h,i],k=j.join("_");return this.isCached(k)||this.putInCache(k,c.ajax({url:TYPO3.settings.ajaxUrls.icons,dataType:"html",data:{icon:JSON.stringify(j)},success:function(a){return a}}).promise()),this.getFromCache(k).done()},a.prototype.isCached=function(a){return"undefined"!=typeof this.cache[a]},a.prototype.getFromCache=function(a){return this.cache[a]},a.prototype.putInCache=function(a,b){this.cache[a]=b},a}();try{window.opener&&window.opener.TYPO3&&window.opener.TYPO3.Icons&&(g=window.opener.TYPO3.Icons),parent&&parent.window.TYPO3&&parent.window.TYPO3.Icons&&(g=parent.window.TYPO3.Icons),top&&top.TYPO3.Icons&&(g=top.TYPO3.Icons)}catch(a){}return g||(g=new h,TYPO3.Icons=g),g});
\ No newline at end of file