From 3a7ffec2cbd1c75b3073a4236a0961b9e7613d62 Mon Sep 17 00:00:00 2001
From: Andreas Fernandez <a.fernandez@scripting-base.de>
Date: Sun, 18 Feb 2018 19:19:34 +0100
Subject: [PATCH] [TASK] Migrate Icons to TypeScript
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 | 1 +
.../Resources/Private/TypeScript/Icons.ts | 170 ++++++++++++++++++
.../Resources/Public/JavaScript/Icons.js | 151 +---------------
3 files changed, 173 insertions(+), 149 deletions(-)
create mode 100644 typo3/sysext/backend/Resources/Private/TypeScript/Icons.ts
diff --git a/Build/types/TYPO3/index.d.ts b/Build/types/TYPO3/index.d.ts
index fa9e06afdbe8..bbf3a4976161 100644
--- a/Build/types/TYPO3/index.d.ts
+++ b/Build/types/TYPO3/index.d.ts
@@ -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
index 000000000000..675772cdd8f1
--- /dev/null
+++ b/typo3/sysext/backend/Resources/Private/TypeScript/Icons.ts
@@ -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;
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js b/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js
index 5df4ef5b271c..83f131b11762 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js
@@ -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
--
GitLab