[TASK] Migrate ContextHelp to TypeScript 69/55169/4
authorAndreas Fernandez <a.fernandez@scripting-base.de>
Tue, 19 Dec 2017 19:46:29 +0000 (20:46 +0100)
committerFrank Naegler <frank.naegler@typo3.org>
Sat, 6 Jan 2018 11:13:21 +0000 (12:13 +0100)
Resolves: #82579
Releases: master
Change-Id: Ic2d44d8567c2b144f9250f9011b6106fe73358e9
Reviewed-on: https://review.typo3.org/55169
Tested-by: TYPO3com <no-reply@typo3.com>
Reviewed-by: Andreas Wolf <andreas.wolf@typo3.org>
Tested-by: Andreas Wolf <andreas.wolf@typo3.org>
Reviewed-by: Frank Naegler <frank.naegler@typo3.org>
Tested-by: Frank Naegler <frank.naegler@typo3.org>
Build/types/TYPO3/index.d.ts
typo3/sysext/backend/Resources/Private/TypeScript/ContextHelp.ts [new file with mode: 0644]
typo3/sysext/backend/Resources/Public/JavaScript/ContextHelp.js

index 49368c4..ba6c308 100644 (file)
@@ -7,6 +7,7 @@
 declare namespace TYPO3 {
   export let DebugConsole: any;
   export let Popover: any;
+  export let ShortcutMenu: any;
   export let Storage: any;
   export let Utility: any;
   export const lang: any;
diff --git a/typo3/sysext/backend/Resources/Private/TypeScript/ContextHelp.ts b/typo3/sysext/backend/Resources/Private/TypeScript/ContextHelp.ts
new file mode 100644 (file)
index 0000000..40fcfa7
--- /dev/null
@@ -0,0 +1,176 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+import 'bootstrap';
+import * as $ from 'jquery';
+import Popover = require('./Popover');
+
+interface HelpData {
+  title: string;
+  content: string;
+}
+
+/**
+ * Module: TYPO3/CMS/Backend/ContextHelp
+ * API for context help.
+ * @exports TYPO3/CMS/Backend/ContextHelp
+ */
+class ContextHelp {
+  private ajaxUrl: string = TYPO3.settings.ajaxUrls.context_help;
+  private helpModuleUrl: string;
+  private trigger: string = 'click';
+  private placement: string = 'auto';
+  private selector: string = '.t3-help-link';
+
+  /**
+   * @return {Window}
+   */
+  private static resolveBackend(): Window {
+    if (typeof window.opener !== 'undefined' && window.opener !== null) {
+      return window.opener.top;
+    } else {
+      return top;
+    }
+  }
+
+  constructor() {
+    this.initialize();
+  }
+
+  public initialize(): void {
+    const backendWindow = ContextHelp.resolveBackend();
+    if (typeof backendWindow.TYPO3.settings.ContextHelp !== 'undefined') {
+      this.helpModuleUrl = backendWindow.TYPO3.settings.ContextHelp.moduleUrl;
+    }
+
+    if (typeof TYPO3.ShortcutMenu === 'undefined' && typeof backendWindow.TYPO3.ShortcutMenu === 'undefined') {
+      // @FIXME: if we are in the popup... remove the bookmark / shortcut button
+      // @TODO: make it possible to use the bookmark button also in popup mode
+      $('.icon-actions-system-shortcut-new').closest('.btn').hide();
+    }
+
+    let title = '&nbsp;';
+    if (typeof backendWindow.TYPO3.lang !== 'undefined') {
+      title = backendWindow.TYPO3.lang.csh_tooltip_loading;
+    }
+    const $element = $(this.selector);
+    $element
+      .attr('data-loaded', 'false')
+      .attr('data-html', 'true')
+      .attr('data-original-title', title)
+      .attr('data-placement', this.placement)
+      .attr('data-trigger', this.trigger);
+    Popover.popover($element);
+
+    $(document).on('show.bs.popover', this.selector, (e: Event): void => {
+      const $me = $(e.currentTarget);
+      const description = $me.data('description');
+      if (typeof description !== 'undefined' && description !== '') {
+        Popover.setOptions($me, {
+          title: $me.data('title'),
+          content: description
+        });
+      } else if ($me.attr('data-loaded') === 'false' && $me.data('table')) {
+        this.loadHelp($me);
+      }
+
+      // if help icon is in DocHeader, force open to bottom
+      if ($me.closest('.t3js-module-docheader').length) {
+        Popover.setOption($me, 'placement', 'bottom');
+      }
+    }).on('shown.bs.popover', this.selector, (e: Event): void => {
+      const $popover = $(e.target).data('bs.popover').$tip;
+      if (!$popover.find('.popover-title').is(':visible')) {
+        $popover.addClass('no-title');
+      }
+    }).on('click', '.tipIsLinked', (e: any): void => {
+      $('.popover').each((index: number, popover: Element): void => {
+        const $popover = $(popover);
+        if ($popover.has(e.target).length) {
+          console.log($popover.data('bs.popover'));
+          this.showHelpPopup($popover.data('bs.popover').$element);
+        }
+      });
+    }).on('click', 'body', (e: any): void => {
+      $(this.selector).each((index: number, triggerElement: Element): void => {
+        const $triggerElement = $(triggerElement);
+        // 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
+        ) {
+          Popover.hide($triggerElement);
+        }
+      });
+    });
+  }
+
+  /**
+   * Open the help popup
+   *
+   * @param {JQuery} $trigger
+   */
+  private showHelpPopup($trigger: JQuery): any {
+    try {
+      const cshWindow = window.open(
+        this.helpModuleUrl +
+        '&tx_documentation_help_documentationcshmanual[table]=' + $trigger.data('table') +
+        '&tx_documentation_help_documentationcshmanual[field]=' + $trigger.data('field'),
+        'ContextHelpWindow',
+        'height=400,width=600,status=0,menubar=0,scrollbars=1'
+      );
+      cshWindow.focus();
+      Popover.hide($trigger);
+      return cshWindow;
+    } catch (e) {
+      // do nothing
+    }
+  }
+
+  /**
+   * Load help data
+   *
+   * @param {JQuery} $trigger
+   */
+  private loadHelp($trigger: JQuery): void {
+    const table = $trigger.data('table');
+    const field = $trigger.data('field');
+    // If a table is defined, use ajax call to get the tooltip's content
+    if (table) {
+      // Load content
+      $.getJSON(this.ajaxUrl, {
+        params: {
+          action: 'getContextHelp',
+          table: table,
+          field: field
+        }
+      }).done((data: HelpData): void => {
+        const title = data.title || '';
+        const content = data.content || '<p></p>';
+        Popover.setOptions($trigger, {
+          title: title,
+          content: content
+        });
+        $trigger
+          .attr('data-loaded', 'true')
+          .one('hidden.bs.popover', (): void => {
+            Popover.show($trigger);
+          });
+        Popover.hide($trigger);
+      });
+    }
+  }
+}
+
+export = new ContextHelp();
index cf24dee..c8b00f6 100644 (file)
  *
  * The TYPO3 project - inspiring people to share!
  */
-
-/**
- * Module: TYPO3/CMS/Backend/ContextHelp
- * API for context help.
- */
-define(['jquery', 'TYPO3/CMS/Backend/Popover', 'bootstrap'], function($, Popover) {
-
-       /**
-        * The main ContextHelp object
-        *
-        * @type {{ajaxUrl: *, localCache: {}, helpModuleUrl: string, trigger: string, placement: string, selector: string}}
-        * @exports TYPO3/CMS/Backend/ContextHelp
-        */
-       var ContextHelp = {
-               ajaxUrl: TYPO3.settings.ajaxUrls['context_help'],
-               localCache: {},
-               helpModuleUrl: '',
-               trigger: 'click',
-               placement: 'auto',
-               selector: '.t3-help-link'
-       };
-
-       /**
-        * Initialize context help trigger
-        */
-       ContextHelp.initialize = function() {
-               var backendWindow = ContextHelp.resolveBackend();
-               ContextHelp.helpModuleUrl = null;
-               if (typeof backendWindow.TYPO3.settings.ContextHelp !== 'undefined') {
-                       ContextHelp.helpModuleUrl = backendWindow.TYPO3.settings.ContextHelp.moduleUrl;
-               }
-
-               if (TYPO3.ShortcutMenu === undefined && backendWindow.TYPO3.ShortcutMenu === undefined) {
-                       // @FIXME: if we are in the popup... remove the bookmark / shortcut button
-                       // @TODO: make it possible to use the bookmark button also in popup mode
-                       $('.icon-actions-system-shortcut-new').closest('.btn').hide();
-               }
-               var title = '&nbsp;';
-               if (typeof backendWindow.TYPO3.lang !== 'undefined') {
-                       title = backendWindow.TYPO3.lang['csh_tooltip_loading'];
-               }
-               var $element = $(this.selector);
-               $element
-                       .attr('data-loaded', 'false')
-                       .attr('data-html', true)
-                       .attr('data-original-title', title)
-                       .attr('data-placement', this.placement)
-                       .attr('data-trigger', this.trigger);
-               Popover.popover($element);
-
-               $(document).on('show.bs.popover', ContextHelp.selector, function(evt) {
-                       var $me = $(this),
-                               description = $me.data('description');
-                       if (typeof description !== 'undefined' && description !== '') {
-                               Popover.setOptions($me, {
-                                       title: $me.data('title'),
-                                       content: description
-                               });
-                       } else if ($me.attr('data-loaded') === 'false' && $me.data('table')) {
-                               ContextHelp.loadHelp($me);
-                       }
-
-                       // if help icon is in DocHeader, force open to bottom
-                       if ($me.closest('.t3js-module-docheader').length) {
-                               Popover.setOption($me, 'placement', 'bottom');
-                       }
-               });
-               $(document).on('shown.bs.popover', ContextHelp.selector, function(evt) {
-                       var $popover = $(evt.target).data('bs.popover').$tip;
-                       if (!$popover.find('.popover-title').is(':visible')) {
-                               $popover.addClass('no-title');
-                       }
-               });
-               $(document).on('click', '.tipIsLinked', function(e) {
-                       $('.popover').each(function() {
-                               var $popover = $(this);
-                               if ($popover.has(e.target).length) {
-                                       ContextHelp.showHelpPopup($popover.data('bs.popover').$element);
-                               }
-                       });
-               });
-               $(document).on('click', 'body', function (e) {
-                       $(ContextHelp.selector).each(function () {
-                               var $triggerElement = $(this);
-                               // 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) {
-                                       Popover.hide($triggerElement);
-                               }
-                       });
-               });
-       };
-
-       /**
-        * Open the help popup
-        *
-        * @param {Object} $trigger
-        */
-       ContextHelp.showHelpPopup = function($trigger) {
-               try {
-                       var cshWindow = window.open(
-                               ContextHelp.helpModuleUrl +
-                                       '&tx_documentation_help_documentationcshmanual[table]=' + $trigger.data('table') +
-                                       '&tx_documentation_help_documentationcshmanual[field]=' + $trigger.data('field'),
-                               'ContextHelpWindow',
-                               'height=400,width=600,status=0,menubar=0,scrollbars=1'
-                       );
-                       cshWindow.focus();
-                       Popover.hide($trigger);
-                       return cshWindow;
-               } catch(e) {
-                       // do nothing
-               }
-       };
-
-       /**
-        * Load help data
-        *
-        * @param {Object} $trigger
-        */
-       ContextHelp.loadHelp = function($trigger) {
-               var table = $trigger.data('table');
-               var field = $trigger.data('field');
-               // If a table is defined, use ajax call to get the tooltip's content
-               if (table) {
-                       // Load content
-                       $.getJSON(ContextHelp.ajaxUrl, {
-                               params: {
-                                       action: 'getContextHelp',
-                                       table: table,
-                                       field: field
-                               }
-                       }).done(function(data) {
-                               var title = data.title || '';
-                               var content = data.content || '<p></p>';
-                               Popover.setOptions($trigger, {
-                                       title: title,
-                                       content: content
-                               });
-                               $trigger
-                                       .attr('data-loaded', 'true')
-                                       .one('hidden.bs.popover', function() {
-                                               Popover.show($trigger);
-                                       });
-                               Popover.hide($trigger);
-                       });
-               }
-       };
-
-       /**
-        * @return {Window}
-        */
-       ContextHelp.resolveBackend = function () {
-               var windowReference;
-               if (typeof window.opener !== 'undefined' && window.opener !== null) {
-                       windowReference = window.opener.top;
-               } else {
-                       windowReference = top;
-               }
-               return windowReference;
-       };
-
-       ContextHelp.initialize();
-       TYPO3.ContextHelp = ContextHelp;
-       return ContextHelp;
+define(["require", "exports", "jquery", "./Popover", "bootstrap"], function (require, exports, $, Popover) {
+    "use strict";
+    /**
+     * Module: TYPO3/CMS/Backend/ContextHelp
+     * API for context help.
+     * @exports TYPO3/CMS/Backend/ContextHelp
+     */
+    var ContextHelp = (function () {
+        function ContextHelp() {
+            this.ajaxUrl = TYPO3.settings.ajaxUrls.context_help;
+            this.trigger = 'click';
+            this.placement = 'auto';
+            this.selector = '.t3-help-link';
+            this.initialize();
+        }
+        /**
+         * @return {Window}
+         */
+        ContextHelp.resolveBackend = function () {
+            if (typeof window.opener !== 'undefined' && window.opener !== null) {
+                return window.opener.top;
+            }
+            else {
+                return top;
+            }
+        };
+        ContextHelp.prototype.initialize = function () {
+            var _this = this;
+            var backendWindow = ContextHelp.resolveBackend();
+            if (typeof backendWindow.TYPO3.settings.ContextHelp !== 'undefined') {
+                this.helpModuleUrl = backendWindow.TYPO3.settings.ContextHelp.moduleUrl;
+            }
+            if (typeof TYPO3.ShortcutMenu === 'undefined' && typeof backendWindow.TYPO3.ShortcutMenu === 'undefined') {
+                // @FIXME: if we are in the popup... remove the bookmark / shortcut button
+                // @TODO: make it possible to use the bookmark button also in popup mode
+                $('.icon-actions-system-shortcut-new').closest('.btn').hide();
+            }
+            var title = '&nbsp;';
+            if (typeof backendWindow.TYPO3.lang !== 'undefined') {
+                title = backendWindow.TYPO3.lang.csh_tooltip_loading;
+            }
+            var $element = $(this.selector);
+            $element
+                .attr('data-loaded', 'false')
+                .attr('data-html', 'true')
+                .attr('data-original-title', title)
+                .attr('data-placement', this.placement)
+                .attr('data-trigger', this.trigger);
+            Popover.popover($element);
+            $(document).on('show.bs.popover', this.selector, function (e) {
+                var $me = $(e.currentTarget);
+                var description = $me.data('description');
+                if (typeof description !== 'undefined' && description !== '') {
+                    Popover.setOptions($me, {
+                        title: $me.data('title'),
+                        content: description
+                    });
+                }
+                else if ($me.attr('data-loaded') === 'false' && $me.data('table')) {
+                    _this.loadHelp($me);
+                }
+                // if help icon is in DocHeader, force open to bottom
+                if ($me.closest('.t3js-module-docheader').length) {
+                    Popover.setOption($me, 'placement', 'bottom');
+                }
+            }).on('shown.bs.popover', this.selector, function (e) {
+                var $popover = $(e.target).data('bs.popover').$tip;
+                if (!$popover.find('.popover-title').is(':visible')) {
+                    $popover.addClass('no-title');
+                }
+            }).on('click', '.tipIsLinked', function (e) {
+                $('.popover').each(function (index, popover) {
+                    var $popover = $(popover);
+                    if ($popover.has(e.target).length) {
+                        console.log($popover.data('bs.popover'));
+                        _this.showHelpPopup($popover.data('bs.popover').$element);
+                    }
+                });
+            }).on('click', 'body', function (e) {
+                $(_this.selector).each(function (index, triggerElement) {
+                    var $triggerElement = $(triggerElement);
+                    // 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) {
+                        Popover.hide($triggerElement);
+                    }
+                });
+            });
+        };
+        /**
+         * Open the help popup
+         *
+         * @param {JQuery} $trigger
+         */
+        ContextHelp.prototype.showHelpPopup = function ($trigger) {
+            try {
+                var cshWindow = window.open(this.helpModuleUrl +
+                    '&tx_documentation_help_documentationcshmanual[table]=' + $trigger.data('table') +
+                    '&tx_documentation_help_documentationcshmanual[field]=' + $trigger.data('field'), 'ContextHelpWindow', 'height=400,width=600,status=0,menubar=0,scrollbars=1');
+                cshWindow.focus();
+                Popover.hide($trigger);
+                return cshWindow;
+            }
+            catch (e) {
+                // do nothing
+            }
+        };
+        /**
+         * Load help data
+         *
+         * @param {JQuery} $trigger
+         */
+        ContextHelp.prototype.loadHelp = function ($trigger) {
+            var table = $trigger.data('table');
+            var field = $trigger.data('field');
+            // If a table is defined, use ajax call to get the tooltip's content
+            if (table) {
+                // Load content
+                $.getJSON(this.ajaxUrl, {
+                    params: {
+                        action: 'getContextHelp',
+                        table: table,
+                        field: field
+                    }
+                }).done(function (data) {
+                    var title = data.title || '';
+                    var content = data.content || '<p></p>';
+                    Popover.setOptions($trigger, {
+                        title: title,
+                        content: content
+                    });
+                    $trigger
+                        .attr('data-loaded', 'true')
+                        .one('hidden.bs.popover', function () {
+                        Popover.show($trigger);
+                    });
+                    Popover.hide($trigger);
+                });
+            }
+        };
+        return ContextHelp;
+    }());
+    return new ContextHelp();
 });