From f022828e8ec7c102ca07d18f9ffb68499e91f3ad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Frank=20N=C3=A4gler?= <typo3@naegler.net>
Date: Thu, 26 Mar 2015 20:52:20 +0100
Subject: [PATCH] [FEATURE] Introduce JavaScript Notification API
This patch introduces the new JavaScript Notification API and removes
the refactoring of the FlashMessage API which was made for TYPO3 CMS 7.0
The compatibility layer for TYPO3.FlashMessage has changed to use
the new Notification API and will be removed with TYPO3 CMS 9.
Resolves: #66047
Releses: master
Change-Id: I025fea5ba735bec42658420917e73daa54d97553
Reviewed-on: http://review.typo3.org/38270
Reviewed-by: Benjamin Kott <info@bk2k.info>
Tested-by: Benjamin Kott <info@bk2k.info>
Reviewed-by: Jan Helke <typo3@helke.de>
Tested-by: Jan Helke <typo3@helke.de>
Reviewed-by: Benjamin Mack <benni@typo3.org>
Tested-by: Benjamin Mack <benni@typo3.org>
---
.../Classes/Controller/BackendController.php | 4 +-
.../Public/JavaScript/AjaxDataHandler.js | 6 +-
.../Public/JavaScript/FlashMessages.js | 130 ----------
.../Public/JavaScript/LoginRefresh.js | 5 +-
.../Resources/Public/JavaScript/Modal.js | 22 +-
.../Public/JavaScript/Notification.js | 227 ++++++++++++++++++
.../components/pagetree/javascript/actions.js | 2 +-
.../JavaScript/flashmessage_compatibility.js | 28 ++-
.../Public/JavaScript/jsfunc.inline.js | 4 +-
.../sysext/core/Classes/Page/PageRenderer.php | 12 +-
...047-IntroduceJavascriptNotificationApi.rst | 74 ++++++
.../Resources/Public/JavaScript/Main.js | 9 +-
.../Public/JavaScript/LanguageModule.js | 8 +-
.../Resources/Public/JavaScript/Recycler.js | 7 +-
typo3/sysext/t3editor/res/jslib/t3editor.js | 6 +-
15 files changed, 363 insertions(+), 181 deletions(-)
delete mode 100644 typo3/sysext/backend/Resources/Public/JavaScript/FlashMessages.js
create mode 100644 typo3/sysext/backend/Resources/Public/JavaScript/Notification.js
create mode 100644 typo3/sysext/core/Documentation/Changelog/master/Feature-66047-IntroduceJavascriptNotificationApi.rst
diff --git a/typo3/sysext/backend/Classes/Controller/BackendController.php b/typo3/sysext/backend/Classes/Controller/BackendController.php
index f31c84d76ca0..658825a9f573 100644
--- a/typo3/sysext/backend/Classes/Controller/BackendController.php
+++ b/typo3/sysext/backend/Classes/Controller/BackendController.php
@@ -133,8 +133,8 @@ class BackendController {
}');
}
- // load FlashMessages functionality
- $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/FlashMessages');
+ // load Notification functionality
+ $this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/Notification');
// load Modals
$this->pageRenderer->loadRequireJsModule('TYPO3/CMS/Backend/Modal');
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/AjaxDataHandler.js b/typo3/sysext/backend/Resources/Public/JavaScript/AjaxDataHandler.js
index c01d994c5c69..31dbb6fafc59 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/AjaxDataHandler.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/AjaxDataHandler.js
@@ -14,7 +14,7 @@
/**
* AjaxDataHandler - Javascript functions to work with AJAX and interacting with tce_db.php
*/
-define('TYPO3/CMS/Backend/AjaxDataHandler', ['jquery', 'TYPO3/CMS/Backend/FlashMessages', 'TYPO3/CMS/Backend/Modal'], function ($) {
+define('TYPO3/CMS/Backend/AjaxDataHandler', ['jquery', 'TYPO3/CMS/Backend/Notification', 'TYPO3/CMS/Backend/Modal'], function ($) {
var AjaxDataHandler = {};
/**
@@ -84,7 +84,7 @@ define('TYPO3/CMS/Backend/AjaxDataHandler', ['jquery', 'TYPO3/CMS/Backend/FlashM
$(document).on('click', '.t3js-record-delete', function(evt) {
evt.preventDefault();
var $anchorElement = $(this);
- TYPO3.Modal.confirm($anchorElement.data('title'), $anchorElement.data('message'), TYPO3.Severity.error, [
+ TYPO3.Modal.confirm($anchorElement.data('title'), $anchorElement.data('message'), top.TYPO3.Severity.error, [
{
text: $(this).data('button-close-text') || TYPO3.lang['button.cancel'] || 'Close',
active: true,
@@ -166,7 +166,7 @@ define('TYPO3/CMS/Backend/AjaxDataHandler', ['jquery', 'TYPO3/CMS/Backend/FlashM
*/
AjaxDataHandler.handleErrors = function(result) {
$.each(result.messages, function(position, message) {
- top.TYPO3.Flashmessage.display(message.severity, message.title, message.message);
+ top.TYPO3.Notification.error(message.title, message.message);
});
};
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/FlashMessages.js b/typo3/sysext/backend/Resources/Public/JavaScript/FlashMessages.js
deleted file mode 100644
index 2e8a2616b67f..000000000000
--- a/typo3/sysext/backend/Resources/Public/JavaScript/FlashMessages.js
+++ /dev/null
@@ -1,130 +0,0 @@
-/*
- * 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!
- */
-
-/**
- * FlashMessage rendered by jQuery
- *
- * @author Steffen Kamper <info@sk-typo3.de> (ExtJS)
- * @author Frank Nägler <typo3@naegler.net> (jQuery)
- */
-
-define('TYPO3/CMS/Backend/FlashMessages', ['jquery'], function ($) {
- var Severity = {
- notice: -2,
- // @deprecated since TYPO3 CMS 7, will be removed in TYPO3 CMS 9, use info instead of information
- information: -1,
- info: -1,
- ok: 0,
- warning: 1,
- error: 2
- };
-
- var Flashmessage = {
- messageContainer: null
- };
-
- /**
- * Shows popup
- * @member TYPO3.Flashmessage
- * @param int severity (TYPO3.Severity.*)
- * @param string title
- * @param string message
- * @param float duration in sec (default 5)
- */
- Flashmessage.display = function (severity, title, message, duration) {
- var className = '';
- var icon = '';
- switch (severity) {
- case TYPO3.Severity.notice:
- className = 'notice';
- icon = 'lightbulb-o';
- break;
- case TYPO3.Severity.info:
- className = 'info';
- icon = 'info';
- break;
- case TYPO3.Severity.ok:
- className = 'success';
- icon = 'check';
- break;
- case TYPO3.Severity.warning:
- className = 'warning';
- icon = 'exclamation';
- break;
- case TYPO3.Severity.error:
- className = 'danger';
- icon = 'times';
- break;
- default:
- className = 'info';
- icon = 'info';
- }
- duration = duration || 5;
- if (!this.messageContainer) {
- this.messageContainer = $('<div id="alert-container"></div>').appendTo('body');
- }
- $box = $(
- '<div class="alert alert-' + className + ' alert-dismissible fade" role="alert">' +
- '<button type="button" class="close" data-dismiss="alert">' +
- '<span aria-hidden="true"><i class="fa fa-times-circle"></i></span>' +
- '<span class="sr-only">Close</span>' +
- '</button>' +
- '<div class="media">' +
- '<div class="media-left">' +
- '<span class="fa-stack fa-lg">' +
- '<i class="fa fa-circle fa-stack-2x"></i>' +
- '<i class="fa fa-' + icon + ' fa-stack-1x"></i>' +
- '</span>' +
- '</div>' +
- '<div class="media-body">' +
- '<h4 class="alert-title">' + title + '</h4>' +
- '<p class="alert-message">' + message + '</p>' +
- '</div>' +
- '</div>' +
- '</div>' +
- '</div>'
- );
- $box.on('close.bs.alert', function(e) {
- e.preventDefault();
- $(this)
- .clearQueue()
- .queue(function(next) {
- $(this).removeClass('in');
- next();
- })
- .slideUp(function () {
- $(this).remove();
- });
- });
- $box.appendTo(this.messageContainer);
- $box.delay('fast')
- .queue(function(next) {
- $(this).addClass('in');
- next();
- })
- .delay(duration * 1000)
- .queue(function(next) {
- $(this).alert('close');
- next();
- });
- };
-
- /**
- * return the Flashmessage object
- */
- return function () {
- TYPO3.Severity = Severity;
- TYPO3.Flashmessage = Flashmessage;
- return Flashmessage;
- }();
-});
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/LoginRefresh.js b/typo3/sysext/backend/Resources/Public/JavaScript/LoginRefresh.js
index 86dbd7fbbc74..ef6805a1f3bc 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/LoginRefresh.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/LoginRefresh.js
@@ -348,7 +348,7 @@ define('TYPO3/CMS/Backend/LoginRefresh', ['jquery'], function($) {
passwordFieldValue = $passwordField.val();
if (passwordFieldValue === '') {
- top.TYPO3.Flashmessage.display(TYPO3.Severity.error, TYPO3.LLL.core.refresh_login_failed, TYPO3.LLL.core.refresh_login_emptyPassword);
+ top.TYPO3.Notification.error(TYPO3.LLL.core.refresh_login_failed, TYPO3.LLL.core.refresh_login_emptyPassword);
$passwordField.focus();
return;
}
@@ -386,8 +386,7 @@ define('TYPO3/CMS/Backend/LoginRefresh', ['jquery'], function($) {
// User is logged in
LoginRefresh.hideLoginForm();
} else {
- // TODO: add failure to notification system instead of alert
- top.TYPO3.Flashmessage.display(TYPO3.Severity.error, TYPO3.LLL.core.refresh_login_failed, TYPO3.LLL.core.refresh_login_failed_message);
+ top.TYPO3.Notification.error(TYPO3.LLL.core.refresh_login_failed, TYPO3.LLL.core.refresh_login_failed_message);
$passwordField.focus();
}
}
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Modal.js b/typo3/sysext/backend/Resources/Public/JavaScript/Modal.js
index 0a8f3d961c41..aabac5aaef24 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/Modal.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Modal.js
@@ -13,9 +13,9 @@
/**
* API for modal windows powered by Twitter Bootstrap.
- * This module depends on TYPO3/CMS/Backend/FlashMessages due to TYPO3.Severity.
+ * This module depends on TYPO3/CMS/Backend/Notification due to top.TYPO3.Severity.
*/
-define('TYPO3/CMS/Backend/Modal', ['jquery', 'TYPO3/CMS/Backend/FlashMessages'], function($) {
+define('TYPO3/CMS/Backend/Modal', ['jquery', 'TYPO3/CMS/Backend/Notification'], function($) {
/**
* The main object of the modal API
@@ -44,26 +44,26 @@ define('TYPO3/CMS/Backend/Modal', ['jquery', 'TYPO3/CMS/Backend/FlashMessages'],
/**
* Get the correct css class for given severity
*
- * @param {int} severity use constants from TYPO3.Severity.*
+ * @param {int} severity use constants from top.TYPO3.Severity.*
* @returns {string}
* @private
*/
Modal.getSeverityClass = function(severity) {
var severityClass;
switch (severity) {
- case TYPO3.Severity.notice:
+ case top.TYPO3.Severity.notice:
severityClass = 'notice';
break;
- case TYPO3.Severity.ok:
+ case top.TYPO3.Severity.ok:
severityClass = 'success';
break;
- case TYPO3.Severity.warning:
+ case top.TYPO3.Severity.warning:
severityClass = 'warning';
break;
- case TYPO3.Severity.error:
+ case top.TYPO3.Severity.error:
severityClass = 'danger';
break;
- case TYPO3.Severity.info:
+ case top.TYPO3.Severity.info:
default:
severityClass = 'info';
break;
@@ -76,11 +76,11 @@ define('TYPO3/CMS/Backend/Modal', ['jquery', 'TYPO3/CMS/Backend/FlashMessages'],
*
* @param {string} title the title for the confirm modal
* @param {string} content the content for the conform modal, e.g. the main question
- * @param {int} severity default TYPO3.Severity.info
+ * @param {int} severity default top.TYPO3.Severity.info
* @param {array} buttons an array with buttons, default no buttons
*/
Modal.confirm = function(title, content, severity, buttons) {
- severity = (typeof severity !== 'undefined' ? severity : TYPO3.Severity.info);
+ severity = (typeof severity !== 'undefined' ? severity : top.TYPO3.Severity.info);
buttons = buttons || [];
Modal.currentModal = Modal.template.clone();
Modal.currentModal.attr('tabindex', '-1');
@@ -182,7 +182,7 @@ define('TYPO3/CMS/Backend/Modal', ['jquery', 'TYPO3/CMS/Backend/FlashMessages'],
var $element = $(this);
var title = $element.data('title') || 'Alert';
var content = $element.data('content') || 'Are you sure?';
- var severity = (typeof TYPO3.Severity[$element.data('severity')] !== 'undefined') ? TYPO3.Severity[$element.data('severity')] : TYPO3.Severity.info;
+ var severity = (typeof top.TYPO3.Severity[$element.data('severity')] !== 'undefined') ? top.TYPO3.Severity[$element.data('severity')] : top.TYPO3.Severity.info;
var buttons = [
{
text: $element.data('button-close-text') || 'Close',
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/Notification.js b/typo3/sysext/backend/Resources/Public/JavaScript/Notification.js
new file mode 100644
index 000000000000..f49d250307c5
--- /dev/null
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/Notification.js
@@ -0,0 +1,227 @@
+/*
+ * 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!
+ */
+
+/**
+ * Notification API for the TYPO3 backend
+ *
+ * @author Frank Nägler <typo3@naegler.net>
+ */
+
+define('TYPO3/CMS/Backend/Notification', ['jquery'], function ($) {
+
+ /**
+ * Severity object
+ *
+ * @type {{notice: number, information: number, info: number, ok: number, warning: number, error: number}}
+ */
+ var Severity = {
+ notice: -2,
+ // @deprecated since TYPO3 CMS 7, will be removed in TYPO3 CMS 9, use info instead of information
+ information: -1,
+ info: -1,
+ ok: 0,
+ warning: 1,
+ error: 2
+ };
+
+ /**
+ * The main Notification object
+ *
+ * @type {{NOTICE: number, INFO: number, OK: number, WARNING: number, ERROR: number, messageContainer: null}}
+ */
+ var Notification = {
+ NOTICE: -2,
+ INFO: -1,
+ OK: 0,
+ WARNING: 1,
+ ERROR: 2,
+ messageContainer: null
+ };
+
+ /**
+ * Show a notice notification
+ *
+ * @param {string} title The title for the notification
+ * @param {string} message The message for the notification
+ * @param {float} duration Time in seconds to show notification before it disappears, default 5, 0 = sticky
+ *
+ * @public
+ */
+ Notification.notice = function(title, message, duration) {
+ Notification.showMessage(title, message, Notification.NOTICE, duration);
+ };
+
+ /**
+ * Show an info notification
+ *
+ * @param {string} title The title for the notification
+ * @param {string} message The message for the notification
+ * @param {float} duration Time in seconds to show notification before it disappears, default 5, 0 = sticky
+ *
+ * @public
+ */
+ Notification.info = function(title, message, duration) {
+ Notification.showMessage(title, message, Notification.INFO, duration);
+ };
+
+ /**
+ * Show an ok notification
+ *
+ * @param {string} title The title for the notification
+ * @param {string} message The message for the notification
+ * @param {float} duration Time in seconds to show notification before it disappears, default 5, 0 = sticky
+ *
+ * @public
+ */
+ Notification.success = function(title, message, duration) {
+ Notification.showMessage(title, message, Notification.OK, duration);
+ };
+
+ /**
+ * Show a warning notification
+ *
+ * @param {string} title The title for the notification
+ * @param {string} message The message for the notification
+ * @param {float} duration Time in seconds to show notification before it disappears, default 5, 0 = sticky
+ *
+ * @public
+ */
+ Notification.warning = function(title, message, duration) {
+ Notification.showMessage(title, message, Notification.WARNING, duration);
+ };
+
+ /**
+ * Show an error notification
+ *, duration
+ * @param {string} title The title for the notification
+ * @param {string} message The message for the notification
+ * @param {float} duration Time in seconds to show notification before it disappears, default 0, 0 = sticky
+ *
+ * @public
+ */
+ Notification.error = function(title, message, duration) {
+ duration = duration || 0;
+ Notification.showMessage(title, message, Notification.ERROR, duration);
+ };
+
+ /**
+ * Show message
+ *
+ * @param {string} title The title for the notification
+ * @param {string} message The message for the notification
+ * @param {int} severity See constants in this object
+ * @param {float} duration Time in seconds to show notification before it disappears, default 5, 0 = sticky
+ *
+ * @private
+ */
+ Notification.showMessage = function(title, message, severity, duration) {
+ var className = '';
+ var icon = '';
+ switch (severity) {
+ case Notification.NOTICE:
+ className = 'notice';
+ icon = 'lightbulb-o';
+ break;
+ case Notification.INFO:
+ className = 'info';
+ icon = 'info';
+ break;
+ case Notification.OK:
+ className = 'success';
+ icon = 'check';
+ break;
+ case Notification.WARNING:
+ className = 'warning';
+ icon = 'exclamation';
+ break;
+ case Notification.ERROR:
+ className = 'danger';
+ icon = 'times';
+ break;
+ default:
+ className = 'info';
+ icon = 'info';
+ }
+
+ duration = (typeof duration === 'undefined') ? 5 : parseFloat(duration);
+
+ if (Notification.messageContainer === null) {
+ Notification.messageContainer = $('<div id="alert-container"></div>').appendTo('body');
+ }
+ $box = $(
+ '<div class="alert alert-' + className + ' alert-dismissible fade" role="alert">' +
+ '<button type="button" class="close" data-dismiss="alert">' +
+ '<span aria-hidden="true"><i class="fa fa-times-circle"></i></span>' +
+ '<span class="sr-only">Close</span>' +
+ '</button>' +
+ '<div class="media">' +
+ '<div class="media-left">' +
+ '<span class="fa-stack fa-lg">' +
+ '<i class="fa fa-circle fa-stack-2x"></i>' +
+ '<i class="fa fa-' + icon + ' fa-stack-1x"></i>' +
+ '</span>' +
+ '</div>' +
+ '<div class="media-body">' +
+ '<h4 class="alert-title">' + title + '</h4>' +
+ '<p class="alert-message">' + message + '</p>' +
+ '</div>' +
+ '</div>' +
+ '</div>'
+ );
+ $box.on('close.bs.alert', function(e) {
+ e.preventDefault();
+ $(this)
+ .clearQueue()
+ .queue(function(next) {
+ $(this).removeClass('in');
+ next();
+ })
+ .slideUp(function () {
+ $(this).remove();
+ });
+ });
+ $box.appendTo(Notification.messageContainer);
+ $box.delay('fast')
+ .queue(function(next) {
+ $(this).addClass('in');
+ next();
+ });
+ // if duration > 0 dismiss alert
+ if (duration > 0) {
+ $box.delay(duration * 1000)
+ .queue(function(next) {
+ $(this).alert('close');
+ next();
+ });
+ }
+ };
+
+ /**
+ * return the Notification object
+ */
+ return function () {
+ if (typeof TYPO3.Severity === 'undefined') {
+ TYPO3.Severity = Severity;
+ }
+ if (typeof top.TYPO3.Severity === 'undefined') {
+ top.TYPO3.Severity = Severity;
+ }
+ if (typeof TYPO3.Notification === 'undefined') {
+ TYPO3.Notification = Notification;
+ }
+ if (typeof top.TYPO3.Notification === 'undefined') {
+ top.TYPO3.Notification = Notification;
+ }
+ return Notification;
+ }();
+});
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/actions.js b/typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/actions.js
index 743acaaad107..c7ec3e4e4a4e 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/actions.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/actions.js
@@ -31,7 +31,7 @@ TYPO3.Components.PageTree.Actions = {
*/
evaluateResponse: function(response) {
if (response.success === false) {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, 'Exception', response.message);
+ top.TYPO3.Notification.error('Exception', response.message);
return false;
}
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/flashmessage_compatibility.js b/typo3/sysext/backend/Resources/Public/JavaScript/flashmessage_compatibility.js
index 5f23310bcfad..b5dd6ab93863 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/flashmessage_compatibility.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/flashmessage_compatibility.js
@@ -17,18 +17,32 @@
* @deprecated since TYPO3 CMS 7, this file will be removed in TYPO3 CMS 9
*/
+// map old Severity object to the new one
+var Severity = {
+ notice: -2,
+ // @deprecated since TYPO3 CMS 7, will be removed in TYPO3 CMS 9, use info instead of information
+ information: -1,
+ info: -1,
+ ok: 0,
+ warning: 1,
+ error: 2
+};
+if (!TYPO3.Severity) {
+ TYPO3.Severity = Severity;
+}
+if (!top.TYPO3.Severity) {
+ top.TYPO3.Severity = Severity;
+}
+
// map old Flashmessage API to the new one
if (!TYPO3.Flashmessage) {
TYPO3.Flashmessage = {};
TYPO3.Flashmessage.display = function(severity, title, message, duration) {
if (console !== undefined) {
- console.log('TYPO3.Flashmessage.display is deprecated and will be removed with CMS 9, please use top.TYPO3.Flashmessage.display');
+ console.log('TYPO3.Flashmessage.display is deprecated and will be removed with CMS 9, please use top.TYPO3.Notification.*');
}
- top.TYPO3.Flashmessage.display(severity, title, message, duration);
+ // never use showMessage, this only allowed at this place for
+ // compatibility to the old flashMessage api! showMessage is declared as private!
+ top.TYPO3.Notification.showMessage(title, message, severity, duration);
}
}
-
-// map old Severity object to the new one
-if (!TYPO3.Severity) {
- TYPO3.Severity = top.TYPO3.Severity;
-}
diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.inline.js b/typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.inline.js
index 6b61c3f80add..02770945099c 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.inline.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.inline.js
@@ -173,7 +173,7 @@ var inline = {
if (matches) {
title = TYPO3.jQuery('#' + matches[1] + '_records').data('title');
}
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, title, message, 5);
+ top.TYPO3.Notification.error(title, message, 5);
}
return false;
},
@@ -520,7 +520,7 @@ var inline = {
} else {
var message = TBE_EDITOR.labels.maxItemsAllowed.replace('{0}', this.data.config[objectPrefix].max);
var title = $insertObject.data('title');
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, title, message, 500);
+ top.TYPO3.Notification.error(title, message);
}
},
diff --git a/typo3/sysext/core/Classes/Page/PageRenderer.php b/typo3/sysext/core/Classes/Page/PageRenderer.php
index 939a2181c28e..2fdfcf3a3235 100644
--- a/typo3/sysext/core/Classes/Page/PageRenderer.php
+++ b/typo3/sysext/core/Classes/Page/PageRenderer.php
@@ -1421,11 +1421,9 @@ class PageRenderer implements \TYPO3\CMS\Core\SingletonInterface {
Ext.Direct.on("exception", function(event) {
if (event.code === Ext.Direct.exceptions.TRANSPORT && !event.where) {
- top.TYPO3.Flashmessage.display(
- top.TYPO3.Severity.error,
+ top.TYPO3.Notification.error(
TYPO3.l10n.localize("extDirect_timeoutHeader"),
- TYPO3.l10n.localize("extDirect_timeoutMessage"),
- 30
+ TYPO3.l10n.localize("extDirect_timeoutMessage")
);
} else {
var backtrace = "";
@@ -1436,11 +1434,9 @@ class PageRenderer implements \TYPO3\CMS\Core\SingletonInterface {
"ExtDirect - Exception"
);
} else if (event.code === "router") {
- top.TYPO3.Flashmessage.display(
- top.TYPO3.Severity.error,
+ top.TYPO3.Notification.error(
event.code,
- event.message,
- 30
+ event.message
);
} else if (event.where) {
backtrace = "<p style=\\"margin-top: 20px;\\">" +
diff --git a/typo3/sysext/core/Documentation/Changelog/master/Feature-66047-IntroduceJavascriptNotificationApi.rst b/typo3/sysext/core/Documentation/Changelog/master/Feature-66047-IntroduceJavascriptNotificationApi.rst
new file mode 100644
index 000000000000..3f308ddfc8e3
--- /dev/null
+++ b/typo3/sysext/core/Documentation/Changelog/master/Feature-66047-IntroduceJavascriptNotificationApi.rst
@@ -0,0 +1,74 @@
+=======================================================
+Feature - #66047: Introduce JavaScript notification API
+=======================================================
+
+Description
+===========
+
+The Flashmessages API has been moved from ``TYPO3.Flashmessages`` to ``top.TYPO3.Flashmessages`` in TYPO3 CMS 7.0.
+
+Now we introduce the new JavaScript Notification API and remove the refactoring of the FlashMessage API which was made for TYPO3 CMS 7.0.
+
+The compatibility layer for TYPO3.FlashMessage has changed to use the new Notification API and will be removed with TYPO3 CMS 9 as before.
+
+The new Notification API works similar to old Flashmessages, you can use it from the Top-Frame, where is it loaded one time for the complete backend.
+
+Please look at the examples section in this document for more details.
+
+
+Migration
+=========
+
+The affected 3rd party extensions must be modified to use ``top.TYPO3.Notification`` instead of ``top.TYPO3.Flashmessages``.
+
+Examples:
+
+1) Old and new syntax in general
+
+.. code-block:: javascript
+
+ // Old and deprecated:
+ top.TYPO3.Flashmessages.display(TYPO3.Severity.notice)
+
+ // New and the only correct way:
+ top.TYPO3.Notification.notice(title, message)
+
+
+2) Notice notification
+
+.. code-block:: javascript
+
+ // duration is optional, default is 5 seconds
+ top.TYPO3.Notification.notice(title, message, duration)
+
+
+3) Info notification
+
+.. code-block:: javascript
+
+ // duration is optional, default is 5 seconds
+ top.TYPO3.Notification.info(title, message, duration)
+
+
+4) Success notification
+
+.. code-block:: javascript
+
+ // duration is optional, default is 5 seconds
+ top.TYPO3.Notification.success(title, message, duration)
+
+
+5) Warning notification
+
+.. code-block:: javascript
+
+ // duration is optional, default is 5 seconds
+ top.TYPO3.Notification.warning(title, message, duration)
+
+
+6) Error notification
+
+.. code-block:: javascript
+
+ // duration is optional, default is 0 seconds which means sticky!
+ top.TYPO3.Notification.error(title, message, duration)
diff --git a/typo3/sysext/extensionmanager/Resources/Public/JavaScript/Main.js b/typo3/sysext/extensionmanager/Resources/Public/JavaScript/Main.js
index 9c2ab3cffb7e..dc7fc099f040 100644
--- a/typo3/sysext/extensionmanager/Resources/Public/JavaScript/Main.js
+++ b/typo3/sysext/extensionmanager/Resources/Public/JavaScript/Main.js
@@ -388,7 +388,7 @@ define(['jquery', 'datatables', 'jquery/jquery.clearable'], function($) {
]);
} else {
if(data.hasErrors) {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, data.title, data.message, 15);
+ top.TYPO3.Notification.error(data.title, data.message, 15);
} else {
Repository.getResolveDependenciesAndInstallResult(data.url + '&tx_extensionmanager_tools_extensionmanagerextensionmanager[downloadPath]=' + Repository.downloadPath);
}
@@ -433,7 +433,7 @@ define(['jquery', 'datatables', 'jquery/jquery.clearable'], function($) {
});
successMessage += '</ul>';
});
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.info, TYPO3.lang['extensionList.dependenciesResolveFlashMessage.title' + data.installationTypeLanguageKey].replace(/\{0\}/g, data.extension), successMessage, 15);
+ top.TYPO3.Notification.info(TYPO3.lang['extensionList.dependenciesResolveFlashMessage.title' + data.installationTypeLanguageKey].replace(/\{0\}/g, data.extension), successMessage, 15);
top.TYPO3.ModuleMenu.App.refreshMenu();
}
}
@@ -509,7 +509,7 @@ define(['jquery', 'datatables', 'jquery/jquery.clearable'], function($) {
success: function(data) {
// Something went wrong, show message
if (data.errorMessage.length) {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.warning, TYPO3.lang['extensionList.updateFromTerFlashMessage.title'], data.errorMessage, 10);
+ top.TYPO3.Notification.error(TYPO3.lang['extensionList.updateFromTerFlashMessage.title'], data.errorMessage, 10);
}
// Message with latest updates
@@ -535,8 +535,7 @@ define(['jquery', 'datatables', 'jquery/jquery.clearable'], function($) {
// Create an error message with diagnosis info.
var errorMessage = textStatus + '(' + errorThrown + '): ' + jqXHR.responseText;
- top.TYPO3.Flashmessage.display(
- top.TYPO3.Severity.warning,
+ top.TYPO3.Notification.warning(
TYPO3.lang['extensionList.updateFromTerFlashMessage.title'],
errorMessage,
10
diff --git a/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js b/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
index c389d55fab52..6d02ad164936 100644
--- a/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
+++ b/typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
@@ -449,7 +449,7 @@ define('TYPO3/CMS/Lang/LanguageModule', ['jquery', 'datatables', 'jquery/jquery.
*/
LanguageModule.displayError = function(label) {
if (typeof label === 'string' && label !== '') {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, LanguageModule.labels.errorHeader, label, 5);
+ top.TYPO3.Notification.error(LanguageModule.labels.errorHeader, label);
}
};
@@ -458,7 +458,7 @@ define('TYPO3/CMS/Lang/LanguageModule', ['jquery', 'datatables', 'jquery/jquery.
*/
LanguageModule.displayInformation = function(label) {
if (typeof label === 'string' && label !== '') {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.info, LanguageModule.labels.infoHeader, label, 3);
+ top.TYPO3.Notification.info(LanguageModule.labels.infoHeader, label);
}
};
@@ -467,7 +467,7 @@ define('TYPO3/CMS/Lang/LanguageModule', ['jquery', 'datatables', 'jquery/jquery.
*/
LanguageModule.displaySuccess = function(label) {
if (typeof label === 'string' && label !== '') {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.ok, LanguageModule.labels.successHeader, label, 3);
+ top.TYPO3.Notification.success(LanguageModule.labels.successHeader, label);
}
};
@@ -563,4 +563,4 @@ define('TYPO3/CMS/Lang/LanguageModule', ['jquery', 'datatables', 'jquery/jquery.
TYPO3.LanguageModule = LanguageModule;
return LanguageModule;
}();
-});
\ No newline at end of file
+});
diff --git a/typo3/sysext/recycler/Resources/Public/JavaScript/Recycler.js b/typo3/sysext/recycler/Resources/Public/JavaScript/Recycler.js
index da207c5f1da2..80a1965644f5 100644
--- a/typo3/sysext/recycler/Resources/Public/JavaScript/Recycler.js
+++ b/typo3/sysext/recycler/Resources/Public/JavaScript/Recycler.js
@@ -427,8 +427,11 @@ define(['jquery', 'nprogress', 'jquery/jquery.clearable'], function($, NProgress
NProgress.start();
},
success: function(data) {
- var severity = data.success ? top.TYPO3.Severity.ok : top.TYPO3.Severity.error;
- top.TYPO3.Flashmessage.display(severity, '', data.message);
+ if (data.success) {
+ top.TYPO3.Notification.success('', data.message);
+ } else {
+ top.TYPO3.Notification.error('', data.message);
+ }
// reload recycler data
Recycler.paging.currentPage = 1;
diff --git a/typo3/sysext/t3editor/res/jslib/t3editor.js b/typo3/sysext/t3editor/res/jslib/t3editor.js
index 01edecb409e2..373e785ebc7c 100644
--- a/typo3/sysext/t3editor/res/jslib/t3editor.js
+++ b/typo3/sysext/t3editor/res/jslib/t3editor.js
@@ -173,9 +173,9 @@ T3editor.prototype = {
this.textModified = false;
} else {
if (typeof returnedData.exceptionMessage != 'undefined') {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, T3editor.lang.errorWhileSaving[0]['target'], returnedData.exceptionMessage);
+ top.TYPO3.Notification.error(T3editor.lang.errorWhileSaving[0]['target'], returnedData.exceptionMessage);
} else {
- top.TYPO3.Flashmessage.display(top.TYPO3.Severity.error, T3editor.lang.errorWhileSaving[0]['target']);
+ top.TYPO3.Notification.error(T3editor.lang.errorWhileSaving[0]['target'], '');
}
}
this.modalOverlay.hide();
@@ -334,4 +334,4 @@ if (!Prototype.Browser.MobileSafari) {
}
}
);
-}
\ No newline at end of file
+}
--
GitLab