[FEATURE] Introduce JavaScript Notification API 70/38270/5
authorFrank Nägler <typo3@naegler.net>
Thu, 26 Mar 2015 19:52:20 +0000 (20:52 +0100)
committerBenjamin Mack <benni@typo3.org>
Fri, 27 Mar 2015 00:42:47 +0000 (01:42 +0100)
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>
15 files changed:
typo3/sysext/backend/Classes/Controller/BackendController.php
typo3/sysext/backend/Resources/Public/JavaScript/AjaxDataHandler.js
typo3/sysext/backend/Resources/Public/JavaScript/FlashMessages.js [deleted file]
typo3/sysext/backend/Resources/Public/JavaScript/LoginRefresh.js
typo3/sysext/backend/Resources/Public/JavaScript/Modal.js
typo3/sysext/backend/Resources/Public/JavaScript/Notification.js [new file with mode: 0644]
typo3/sysext/backend/Resources/Public/JavaScript/extjs/components/pagetree/javascript/actions.js
typo3/sysext/backend/Resources/Public/JavaScript/flashmessage_compatibility.js
typo3/sysext/backend/Resources/Public/JavaScript/jsfunc.inline.js
typo3/sysext/core/Classes/Page/PageRenderer.php
typo3/sysext/core/Documentation/Changelog/master/Feature-66047-IntroduceJavascriptNotificationApi.rst [new file with mode: 0644]
typo3/sysext/extensionmanager/Resources/Public/JavaScript/Main.js
typo3/sysext/lang/Resources/Public/JavaScript/LanguageModule.js
typo3/sysext/recycler/Resources/Public/JavaScript/Recycler.js
typo3/sysext/t3editor/res/jslib/t3editor.js

index f31c84d..658825a 100644 (file)
@@ -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');
index c01d994..31dbb6f 100644 (file)
@@ -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 (file)
index 2e8a261..0000000
+++ /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;
-       }();
-});
index 86dbd7f..ef6805a 100644 (file)
@@ -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();
                                }
                        }
index 0a8f3d9..aabac5a 100644 (file)
@@ -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 (file)
index 0000000..f49d250
--- /dev/null
@@ -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;
+       }();
+});
index 743acaa..c7ec3e4 100644 (file)
@@ -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;
                }
 
index 5f23310..b5dd6ab 100644 (file)
  * @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;
-}
index 6b61c3f..0277094 100644 (file)
@@ -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);
                }
        },
 
index 939a218..2fdfcf3 100644 (file)
@@ -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 (file)
index 0000000..3f308dd
--- /dev/null
@@ -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)
index 9c2ab3c..dc7fc09 100644 (file)
@@ -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
index c389d55..6d02ad1 100644 (file)
@@ -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
+});
index da207c5..80a1965 100644 (file)
@@ -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;
index 01edecb..373e785 100644 (file)
@@ -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
+}