From c143d3a330aac85b648a6702a7b0d8bd61ecd2c9 Mon Sep 17 00:00:00 2001
From: Andreas Fernandez <a.fernandez@scripting-base.de>
Date: Tue, 20 Oct 2015 18:25:25 +0200
Subject: [PATCH] [TASK] Drop faulty getIcons() method from "Icons" module
The getIcons() implementation of the Icons RequireJS module is faulty and
leads to issues when fetching cached and uncached icons in the same
request. The method is dropped and all calls against that API are
adjusted.
As the API was introduced a week ago, this change is considered being
not breaking.
Resolves: #70881
Releases: master
Change-Id: I62932c48b1482767b3920afe8d320de3ab8623c7
Reviewed-on: https://review.typo3.org/44186
Reviewed-by: Benjamin Kott <info@bk2k.info>
Tested-by: Benjamin Kott <info@bk2k.info>
Reviewed-by: Stefan Neufeind <typo3.neufeind@speedpartner.de>
Tested-by: Stefan Neufeind <typo3.neufeind@speedpartner.de>
---
.../Resources/Public/JavaScript/Icons.js | 102 ++++++------------
.../JavaScript/Toolbar/ClearCacheMenu.js | 4 +-
.../Public/JavaScript/Toolbar/ShortcutMenu.js | 4 +-
.../Toolbar/SystemInformationMenu.js | 4 +-
.../core/Classes/Imaging/IconFactory.php | 23 ++--
...re-70583-IntroducedIconAPIInJavaScript.rst | 18 +---
.../Public/JavaScript/LanguageModule.js | 8 +-
.../Public/JavaScript/Toolbar/OpendocsMenu.js | 4 +-
.../Resources/Public/JavaScript/Recordlist.js | 7 +-
9 files changed, 57 insertions(+), 117 deletions(-)
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js b/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js
index 8490d973fd9b..4867fdf50610 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Icons.js
@@ -41,88 +41,48 @@ define(['jquery'], function($) {
* @return {Promise<Array>}
*/
Icons.getIcon = function(identifier, size, overlayIdentifier, state) {
- return $.when.apply($, Icons.fetch([[identifier, size, overlayIdentifier, state]]));
- };
-
- /**
- * Fetches multiple icons by passing the parameters of getIcon() for each requested
- * icon as array.
- *
- * @param {Array} icons
- * @return {Promise<Array>}
- */
- Icons.getIcons = function(icons) {
- if (!icons instanceof Array) {
- throw 'Icons must be an array of multiple definitions.';
- }
- return $.when.apply($, Icons.fetch(icons));
+ return $.when(Icons.fetch(identifier, size, overlayIdentifier, state));
};
/**
* Performs the AJAX request to fetch the icon.
*
- * @param {Array} icons
- * @return {Array}
+ * @param {string} identifier
+ * @param {string} size
+ * @param {string} overlayIdentifier
+ * @param {string} state
+ * @return {String|Promise}
* @private
*/
- Icons.fetch = function(icons) {
- var promises = [],
- requestedIcons = {},
- cachedRequestedIcons = {};
-
- for (var i = 0; i < icons.length; ++i) {
- /**
- * Icon keys:
- *
- * 0: identifier
- * 1: size
- * 2: overlayIdentifier
- * 3: state
- */
- var icon = icons[i];
- icon[1] = icon[1] || Icons.sizes.default;
- icon[3] = icon[3] || Icons.states.default;
+ Icons.fetch = function(identifier, size, overlayIdentifier, state) {
+ /**
+ * Icon keys:
+ *
+ * 0: identifier
+ * 1: size
+ * 2: overlayIdentifier
+ * 3: state
+ */
+ size = size || Icons.sizes.default;
+ state = state || Icons.states.default;
- var cacheIdentifier = icon.join('_');
- if (Icons.isCached(cacheIdentifier)) {
- $.extend(cachedRequestedIcons, Icons.getFromCache(cacheIdentifier));
- } else {
- requestedIcons[icon[0]] = {
- cacheIdentifier: cacheIdentifier,
- icon: icon
- };
- }
- }
+ var icon = [identifier, size, overlayIdentifier, state],
+ cacheIdentifier = icon.join('_');
- if (Object.keys(cachedRequestedIcons).length > 0) {
- promises.push(cachedRequestedIcons);
+ if (Icons.isCached(cacheIdentifier)) {
+ return Icons.getFromCache(cacheIdentifier);
}
- if (Object.keys(requestedIcons).length > 0) {
- promises.push(
- $.ajax({
- url: TYPO3.settings.ajaxUrls['icons'],
- data: {
- requestedIcons: JSON.stringify(
- $.map(requestedIcons, function(o) {
- return [o['icon']];
- })
- )
- },
- success: function(data) {
- $.each(data, function(identifier, markup) {
- var cacheIdentifier = requestedIcons[identifier].cacheIdentifier,
- cacheEntry = {};
-
- cacheEntry[identifier] = markup;
- Icons.putInCache(cacheIdentifier, cacheEntry);
- });
- }
- })
- );
- }
-
- return promises;
+ return $.ajax({
+ url: TYPO3.settings.ajaxUrls['icons'],
+ dataType: 'html',
+ data: {
+ icon: JSON.stringify(icon)
+ },
+ success: function(markup) {
+ Icons.putInCache(cacheIdentifier, markup);
+ }
+ });
};
/**
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ClearCacheMenu.js b/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ClearCacheMenu.js
index cc9d47da2736..ad1a3bd75ceb 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ClearCacheMenu.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ClearCacheMenu.js
@@ -53,8 +53,8 @@ define(['jquery', 'TYPO3/CMS/Backend/Icons'], function($, Icons) {
var $toolbarItemIcon = $(ClearCacheMenu.options.toolbarIconSelector, ClearCacheMenu.options.containerSelector),
$existingIcon = $toolbarItemIcon.clone();
- Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(icons) {
- $toolbarItemIcon.replaceWith(icons['spinner-circle-light']);
+ Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
+ $toolbarItemIcon.replaceWith(spinner);
});
$.ajax({
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ShortcutMenu.js b/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ShortcutMenu.js
index 4c4bffc1fcc0..688b0d70f8b2 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ShortcutMenu.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ShortcutMenu.js
@@ -108,8 +108,8 @@ define(['jquery', 'TYPO3/CMS/Backend/Modal', 'TYPO3/CMS/Backend/Icons'], functio
var $toolbarItemIcon = $(ShortcutMenu.options.toolbarIconSelector, ShortcutMenu.options.containerSelector),
$existingIcon = $toolbarItemIcon.clone();
- Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(icons) {
- $toolbarItemIcon.replaceWith(icons['spinner-circle-light']);
+ Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
+ $toolbarItemIcon.replaceWith(spinner);
});
$.ajax({
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/SystemInformationMenu.js b/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/SystemInformationMenu.js
index 8461cc55d87e..c4e2b0c98b92 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/SystemInformationMenu.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/SystemInformationMenu.js
@@ -49,8 +49,8 @@ define(['jquery', 'TYPO3/CMS/Backend/Icons', 'TYPO3/CMS/Backend/Storage'], funct
$menuContainer.click();
}
- Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(icons) {
- $toolbarItemIcon.replaceWith(icons['spinner-circle-light']);
+ Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
+ $toolbarItemIcon.replaceWith(spinner);
});
$.ajax({
diff --git a/typo3/sysext/core/Classes/Imaging/IconFactory.php b/typo3/sysext/core/Classes/Imaging/IconFactory.php
index 2349bc319dfc..49a13851aac6 100644
--- a/typo3/sysext/core/Classes/Imaging/IconFactory.php
+++ b/typo3/sysext/core/Classes/Imaging/IconFactory.php
@@ -86,25 +86,22 @@ class IconFactory
{
$parsedBody = $request->getParsedBody();
$queryParams = $request->getQueryParams();
- $requestedIcons = json_decode(
- isset($parsedBody['requestedIcons'])
- ? $parsedBody['requestedIcons']
- : $queryParams['requestedIcons'],
+ $requestedIcon = json_decode(
+ isset($parsedBody['icon'])
+ ? $parsedBody['icon']
+ : $queryParams['icon'],
true
);
- $icons = [];
- for ($i = 0, $count = count($requestedIcons); $i < $count; ++$i) {
- list($identifier, $size, $overlayIdentifier, $iconState) = $requestedIcons[$i];
- if (empty($overlayIdentifier)) {
- $overlayIdentifier = null;
- }
- $iconState = IconState::cast($iconState);
- $icons[$identifier] = $this->getIcon($identifier, $size, $overlayIdentifier, $iconState)->render();
+ list($identifier, $size, $overlayIdentifier, $iconState) = $requestedIcon;
+ if (empty($overlayIdentifier)) {
+ $overlayIdentifier = null;
}
+ $iconState = IconState::cast($iconState);
$response->getBody()->write(
- json_encode($icons)
+ $this->getIcon($identifier, $size, $overlayIdentifier, $iconState)->render()
);
+ $response = $response->withHeader('Content-Type', 'text/html; charset=utf-8');
return $response;
}
diff --git a/typo3/sysext/core/Documentation/Changelog/master/Feature-70583-IntroducedIconAPIInJavaScript.rst b/typo3/sysext/core/Documentation/Changelog/master/Feature-70583-IntroducedIconAPIInJavaScript.rst
index 8f725621adec..4cafd5792e01 100644
--- a/typo3/sysext/core/Documentation/Changelog/master/Feature-70583-IntroducedIconAPIInJavaScript.rst
+++ b/typo3/sysext/core/Documentation/Changelog/master/Feature-70583-IntroducedIconAPIInJavaScript.rst
@@ -40,9 +40,6 @@ A single icon can be fetched by ``getIcon()`` which takes four parameters:
The state of the icon. Please use the properties of the ``Icons.states`` object.
-Multiple icons can be fetched by ``getIcons()``. This function takes a multidimensional array as parameter,
-holding the parameters used by ``getIcon()`` for each icon.
-
To use the fetched icons, chain the ``done()`` method to the promise.
Examples
@@ -51,17 +48,6 @@ Examples
.. code-block:: javascript
// Get a single icon
- Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(icons) {
- $toolbarItemIcon.replaceWith(icons['spinner-circle-light']);
- });
-
- // Get multiple icons
- Icons.getIcons([
- ['apps-filetree-folder-default', Icons.sizes.large],
- ['actions-edit-delete', Icons.sizes.small, null, Icons.states.disabled],
- ['actions-system-cache-clear-impact-medium']
- ]).done(function(icons) {
- // icons['apps-filetree-folder-default']
- // icons['actions-edit-delete']
- // icons['actions-system-cache-clear-impact-medium']
+ Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
+ $toolbarItemIcon.replaceWith(spinner);
});
diff --git a/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js b/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
index 4842af37d62c..12ef8f9115e4 100644
--- a/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
+++ b/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
@@ -375,15 +375,15 @@ define(['jquery', 'moment', 'TYPO3/CMS/Backend/Icons', 'datatables', 'TYPO3/CMS/
case 'update':
LanguageModule.buttons.update.data('action', 'cancelLanguageUpdate');
LanguageModule.buttons.cancel.removeClass('disabled');
- Icons.getIcon('spinner-circle-dark', Icons.sizes.small).done(function(icons) {
- LanguageModule.buttons.update.find('span.icon').replaceWith(icons['spinner-circle-dark']);
+ Icons.getIcon('spinner-circle-dark', Icons.sizes.small).done(function(spinner) {
+ LanguageModule.buttons.update.find('span.icon').replaceWith(spinner);
});
break;
case 'cancel':
LanguageModule.buttons.update.data('action', 'updateActiveLanguages');
LanguageModule.buttons.cancel.addClass('disabled');
- Icons.getIcon('actions-system-extension-download', Icons.sizes.small).done(function(icons) {
- LanguageModule.buttons.update.find('span.icon').replaceWith(icons['actions-system-extension-download']);
+ Icons.getIcon('actions-system-extension-download', Icons.sizes.small).done(function(download) {
+ LanguageModule.buttons.update.find('span.icon').replaceWith(download);
});
break;
}
diff --git a/typo3/sysext/opendocs/Resources/Public/JavaScript/Toolbar/OpendocsMenu.js b/typo3/sysext/opendocs/Resources/Public/JavaScript/Toolbar/OpendocsMenu.js
index dc033a4952e0..1cdcf4175288 100644
--- a/typo3/sysext/opendocs/Resources/Public/JavaScript/Toolbar/OpendocsMenu.js
+++ b/typo3/sysext/opendocs/Resources/Public/JavaScript/Toolbar/OpendocsMenu.js
@@ -53,8 +53,8 @@ define(['jquery', 'TYPO3/CMS/Backend/Icons'], function($, Icons) {
var $toolbarItemIcon = $(OpendocsMenu.options.toolbarIconSelector, OpendocsMenu.options.containerSelector),
$existingIcon = $toolbarItemIcon.clone();
- Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(icons) {
- $toolbarItemIcon.replaceWith(icons['spinner-circle-light']);
+ Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
+ $toolbarItemIcon.replaceWith(spinner);
});
$.ajax({
diff --git a/typo3/sysext/recordlist/Resources/Public/JavaScript/Recordlist.js b/typo3/sysext/recordlist/Resources/Public/JavaScript/Recordlist.js
index c169ebe8f2f9..a58438dee730 100644
--- a/typo3/sysext/recordlist/Resources/Public/JavaScript/Recordlist.js
+++ b/typo3/sysext/recordlist/Resources/Public/JavaScript/Recordlist.js
@@ -37,11 +37,8 @@ define(['jquery', 'TYPO3/CMS/Backend/Storage', 'TYPO3/CMS/Backend/Icons'], funct
$collapseIcon = $me.find('.collapseIcon'),
toggleIcon = isExpanded ? Recordlist.identifier.icons.expand : Recordlist.identifier.icons.collapse;
- Icons.getIcons([
- [Recordlist.identifier.icons.expand, Icons.sizes.small],
- [Recordlist.identifier.icons.collapse, Icons.sizes.small]
- ]).done(function(icons) {
- $collapseIcon.html(icons[toggleIcon]);
+ Icons.getIcon(toggleIcon, Icons.sizes.small).done(function(toggleIcon) {
+ $collapseIcon.html(toggleIcon);
});
// Store collapse state in UC
--
GitLab