[TASK] Deprecate TYPO3.Popover 56/50356/7
authorStefan Bürk <stefan.buerk@impactmedia.de>
Mon, 24 Oct 2016 23:24:04 +0000 (01:24 +0200)
committerBenni Mack <benni@typo3.org>
Thu, 11 May 2017 05:59:23 +0000 (07:59 +0200)
Depcrecate member instance TYPO3.Popover and replace usage
in the core.

Resolves: #78410
Releases: master
Change-Id: Ib8fda8bc1101c502e7d0289e9ed5fd83998c9d67
Reviewed-on: https://review.typo3.org/50356
Reviewed-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Benni Mack <benni@typo3.org>
Tested-by: Benni Mack <benni@typo3.org>
Build/tsconfig.json
typo3/sysext/backend/Resources/Private/TypeScript/Popover.ts [new file with mode: 0644]
typo3/sysext/backend/Resources/Public/JavaScript/ContextHelp.js
typo3/sysext/backend/Resources/Public/JavaScript/Popover.js
typo3/sysext/core/Documentation/Changelog/master/Deprecation-78410-DeprecatePopoverMemberInstanceInTYPO3GlobalObject.rst [new file with mode: 0644]

index 15ea759..70da760 100644 (file)
         "../typo3/sysext/backend/Resources/Private/TypeScript/ColorPicker.ts",
         "../typo3/sysext/backend/Resources/Private/TypeScript/FormEngineReview.ts",
         "../typo3/sysext/backend/Resources/Private/TypeScript/ImageManipulation.ts",
+        "../typo3/sysext/backend/Resources/Private/TypeScript/Popover.ts",
         "../typo3/sysext/backend/Resources/Private/TypeScript/RenameFile.ts"
     ]
-}
+}
\ No newline at end of file
diff --git a/typo3/sysext/backend/Resources/Private/TypeScript/Popover.ts b/typo3/sysext/backend/Resources/Private/TypeScript/Popover.ts
new file mode 100644 (file)
index 0000000..0c5fe54
--- /dev/null
@@ -0,0 +1,128 @@
+/*
+ * 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!
+ */
+
+/// <amd-dependency path="bootstrap">
+import $ = require('jquery');
+
+/**
+ * Module: TYPO3/CMS/Backend/Popover
+ * API for popover windows powered by Twitter Bootstrap.
+ * @exports TYPO3/CMS/Backend/Popover
+ */
+class Popover {
+
+  /**
+   * Default selector string.
+   *
+   * @return {string}
+   */
+  private readonly DEFAULT_SELECTOR: string = '[data-toggle="popover"]';
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Initialize
+   */
+  public initialize(selector?: string): void {
+    selector = selector || this.DEFAULT_SELECTOR;
+    $(selector).popover();
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Popover wrapper function
+   *
+   * @param {JQuery} $element
+   */
+  public popover($element: JQuery): void {
+    $element.popover();
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Set popover options on $element
+   *
+   * @param {JQuery} $element
+   * @param {PopoverOptions} options
+   */
+  public setOptions($element: JQuery, options?: PopoverOptions): void {
+    options = options || {};
+    let title: string|Function = options.title || $element.data('title') || '';
+    let content: string|Function = options.content || $element.data('content') || '';
+    $element
+      .attr('data-original-title', (<string> title))
+      .attr('data-content', (<string> content))
+      .attr('data-placement', 'auto')
+      .popover(options);
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Set popover option on $element
+   *
+   * @param {JQuery} $element
+   * @param {String} key
+   * @param {String} value
+   */
+  public setOption($element: JQuery, key: string, value: string): void {
+    $element.data('bs.popover').options[key] = value;
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Show popover with title and content on $element
+   *
+   * @param {JQuery} $element
+   */
+  public show($element: JQuery): void {
+    $element.popover('show');
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Hide popover on $element
+   *
+   * @param {JQuery} $element
+   */
+  public hide($element: JQuery): void {
+    $element.popover('hide');
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Destroy popover on $element
+   *
+   * @param {Object} $element
+   */
+  public destroy($element: JQuery): void {
+    $element.popover('destroy');
+  }
+
+  // noinspection JSMethodCanBeStatic
+  /**
+   * Toggle popover on $element
+   *
+   * @param {Object} $element
+   */
+  public toggle($element: JQuery): void {
+    $element.popover('toggle');
+  }
+}
+
+// Create an instance, initialize and return it
+let popover: Popover = new Popover();
+popover.initialize();
+
+// @deprecated since TYPO3 v9, will be removed in TYPO3 v10 prevent global object usage
+declare var TYPO3: any;
+TYPO3.Popover = popover;
+export = popover;
index c2730df..109fbaa 100644 (file)
@@ -15,7 +15,7 @@
  * Module: TYPO3/CMS/Backend/ContextHelp
  * API for context help.
  */
-define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($) {
+define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($, Popover) {
 
        /**
         * The main ContextHelp object
@@ -55,13 +55,13 @@ define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($) {
                        .attr('data-original-title', title)
                        .attr('data-placement', this.placement)
                        .attr('data-trigger', this.trigger);
-               TYPO3.Popover.popover($element);
+               Popover.popover($element);
 
                $(document).on('show.bs.popover', ContextHelp.selector, function(evt) {
                        var $me = $(this),
                                description = $me.data('description');
                        if (typeof description !== 'undefined' && description !== '') {
-                               TYPO3.Popover.setOptions($me, {
+                               Popover.setOptions($me, {
                                        title: $me.data('title'),
                                        content: description
                                });
@@ -71,7 +71,7 @@ define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($) {
 
                        // if help icon is in DocHeader, force open to bottom
                        if ($me.closest('.t3js-module-docheader').length) {
-                               TYPO3.Popover.setOption($me, 'placement', 'bottom');
+                               Popover.setOption($me, 'placement', 'bottom');
                        }
                });
                $(document).on('shown.bs.popover', ContextHelp.selector, function(evt) {
@@ -94,7 +94,7 @@ define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($) {
                                // the 'is' for buttons that trigger popups
                                // the 'has' for icons within a button that triggers a popup
                                if (!$triggerElement.is(e.target) && $triggerElement.has(e.target).length === 0 && $('.popover').has(e.target).length === 0) {
-                                       TYPO3.Popover.hide($triggerElement);
+                                       Popover.hide($triggerElement);
                                }
                        });
                });
@@ -115,7 +115,7 @@ define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($) {
                                'height=400,width=600,status=0,menubar=0,scrollbars=1'
                        );
                        cshWindow.focus();
-                       TYPO3.Popover.hide($trigger);
+                       Popover.hide($trigger);
                        return cshWindow;
                } catch(e) {
                        // do nothing
@@ -142,16 +142,16 @@ define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($) {
                        }).done(function(data) {
                                var title = data.title || '';
                                var content = data.content || '<p></p>';
-                               TYPO3.Popover.setOptions($trigger, {
+                               Popover.setOptions($trigger, {
                                        title: title,
                                        content: content
                                });
                                $trigger
                                        .attr('data-loaded', 'true')
                                        .one('hidden.bs.popover', function() {
-                                               TYPO3.Popover.show($trigger);
+                                               Popover.show($trigger);
                                        });
-                               TYPO3.Popover.hide($trigger);
+                               Popover.hide($trigger);
                        });
                }
        };
index f7904e6..9274b45 100644 (file)
  *
  * The TYPO3 project - inspiring people to share!
  */
-
-/**
- * Module: TYPO3/CMS/Backend/Popover
- * API for popover windows powered by Twitter Bootstrap.
- */
-define(['jquery', 'bootstrap'], function($) {
-
-       /**
-        * the main popover object
-        *
-        * @type {{}}
-        * @exports TYPO3/CMS/Backend/Popover
-        */
-       var Popover = {
-       };
-
-       /**
-        * Initialize
-        */
-       Popover.initialize = function(selector) {
-               selector = selector || '[data-toggle="popover"]';
-               $(selector).popover();
-       };
-
-       /**
-        * Popover wrapper function
-        *
-        * @param {Object} $element
-        */
-       Popover.popover = function($element) {
-               $element.popover();
-       };
-
-       /**
-        * Set popover options on $element
-        *
-        * @param {Object} $element
-        * @param {Object} options
-        */
-       Popover.setOptions = function($element, options) {
-               options = options || {};
-               var title = options.title || $element.data('title') || '';
-               var content = options.content || $element.data('content') || '';
-               $element
-                       .attr('data-original-title', title)
-                       .attr('data-content', content)
-                       .attr('data-placement', 'auto')
-                       .popover(options);
-       };
-
-       /**
-        * Set popover option on $element
-        *
-        * @param {Object} $element
-        * @param {String} key
-        * @param {String} value
+define(["require", "exports", "jquery", "bootstrap"], function (require, exports, $) {
+    "use strict";
+    /**
+     * Module: TYPO3/CMS/Backend/Popover
+     * API for popover windows powered by Twitter Bootstrap.
+     * @exports TYPO3/CMS/Backend/Popover
      */
-       Popover.setOption = function($element, key, value) {
-               $element.data('bs.popover').options[key] = value;
-       };
-
-       /**
-        * Show popover with title and content on $element
-        *
-        * @param {Object} $element
-        */
-       Popover.show = function($element) {
-               $element.popover('show');
-       };
-
-       /**
-        * Hide popover on $element
-        *
-        * @param {Object} $element
-        */
-       Popover.hide = function($element) {
-               $element.popover('hide');
-       };
-
-       /**
-        * Destroy popover on $element
-        *
-        * @param {Object} $element
-        */
-       Popover.destroy = function($element) {
-               $element.popover('destroy');
-       };
-
-       /**
-        * Toggle popover on $element
-        *
-        * @param {Object} $element
-        */
-       Popover.toggle = function($element) {
-               $element.popover('toggle');
-       };
-
-       Popover.initialize();
-       TYPO3.Popover = Popover;
-       return Popover;
+    var Popover = (function () {
+        function Popover() {
+            /**
+             * Default selector string.
+             *
+             * @return {string}
+             */
+            this.DEFAULT_SELECTOR = '[data-toggle="popover"]';
+        }
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Initialize
+         */
+        Popover.prototype.initialize = function (selector) {
+            selector = selector || this.DEFAULT_SELECTOR;
+            $(selector).popover();
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Popover wrapper function
+         *
+         * @param {JQuery} $element
+         */
+        Popover.prototype.popover = function ($element) {
+            $element.popover();
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Set popover options on $element
+         *
+         * @param {JQuery} $element
+         * @param {PopoverOptions} options
+         */
+        Popover.prototype.setOptions = function ($element, options) {
+            options = options || {};
+            var title = options.title || $element.data('title') || '';
+            var content = options.content || $element.data('content') || '';
+            $element
+                .attr('data-original-title', title)
+                .attr('data-content', content)
+                .attr('data-placement', 'auto')
+                .popover(options);
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Set popover option on $element
+         *
+         * @param {JQuery} $element
+         * @param {String} key
+         * @param {String} value
+         */
+        Popover.prototype.setOption = function ($element, key, value) {
+            $element.data('bs.popover').options[key] = value;
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Show popover with title and content on $element
+         *
+         * @param {JQuery} $element
+         */
+        Popover.prototype.show = function ($element) {
+            $element.popover('show');
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Hide popover on $element
+         *
+         * @param {JQuery} $element
+         */
+        Popover.prototype.hide = function ($element) {
+            $element.popover('hide');
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Destroy popover on $element
+         *
+         * @param {Object} $element
+         */
+        Popover.prototype.destroy = function ($element) {
+            $element.popover('destroy');
+        };
+        // noinspection JSMethodCanBeStatic
+        /**
+         * Toggle popover on $element
+         *
+         * @param {Object} $element
+         */
+        Popover.prototype.toggle = function ($element) {
+            $element.popover('toggle');
+        };
+        return Popover;
+    }());
+    // Create an instance, initialize and return it
+    var popover = new Popover();
+    popover.initialize();
+    TYPO3.Popover = popover;
+    return popover;
 });
diff --git a/typo3/sysext/core/Documentation/Changelog/master/Deprecation-78410-DeprecatePopoverMemberInstanceInTYPO3GlobalObject.rst b/typo3/sysext/core/Documentation/Changelog/master/Deprecation-78410-DeprecatePopoverMemberInstanceInTYPO3GlobalObject.rst
new file mode 100644 (file)
index 0000000..63888b3
--- /dev/null
@@ -0,0 +1,42 @@
+.. include:: ../../Includes.txt
+
+===============================================================================
+Deprecation: #78410 - Deprecate popover member instance in TYPO3 global object.
+===============================================================================
+
+See :issue:`78410`
+
+Description
+===========
+
+The member instance :js:`TYPO3.Popover` has been marked as deprecated.
+
+
+Impact
+======
+
+Using the global instance will not throw any deprecation message.
+
+
+Affected Installations
+======================
+
+Any backend JavaScript or TypeScript using :js:`TYPO3.Popover`.
+
+
+Migration
+=========
+
+Usage in TypeScript:
+
+.. code-block:: typescript
+
+       import Popover = require('TYPO3/CMS/Backend/Popover');
+
+To use popovers in a amd module, add it as a dependency and a corresponding argument to the anonymous function:
+
+.. code-block:: javascript
+
+       define('TYPO3\CMS\Extension\Module', ['jquery', 'TYPO3\CMS\Backend\Popover', 'bootstrap'], function($, Popover) {});
+
+.. index:: Backend, JavaScript