[TASK] Migrate TYPO3/CMS/Opendocs/OpendocsMenu to TypeScript 92/59692/4
authorFrank Naegler <frank.naegler@typo3.org>
Wed, 13 Feb 2019 10:55:55 +0000 (11:55 +0100)
committerAnja Leichsenring <aleichsenring@ab-softlab.de>
Sun, 17 Feb 2019 09:26:19 +0000 (10:26 +0100)
Resolves: #87703
Releases: master
Change-Id: Ie44d5feae31b8c4cf64c621d12a42d6f7e6d574e
Reviewed-on: https://review.typo3.org/c/59692
Tested-by: TYPO3com <noreply@typo3.com>
Tested-by: Andreas Fernandez <a.fernandez@scripting-base.de>
Tested-by: Anja Leichsenring <aleichsenring@ab-softlab.de>
Reviewed-by: Andreas Fernandez <a.fernandez@scripting-base.de>
Reviewed-by: Anja Leichsenring <aleichsenring@ab-softlab.de>
Build/types/TYPO3/index.d.ts
typo3/sysext/opendocs/Classes/Backend/ToolbarItems/OpendocsToolbarItem.php
typo3/sysext/opendocs/Resources/Private/Templates/ToolbarItems/DropDown.html
typo3/sysext/opendocs/Resources/Private/TypeScript/Toolbar/OpendocsMenu.ts [new file with mode: 0644]
typo3/sysext/opendocs/Resources/Public/JavaScript/Toolbar/OpendocsMenu.js

index 391a56d..3d544f9 100644 (file)
@@ -13,6 +13,7 @@ declare namespace TYPO3 {
   export let ModuleMenu: any;
   export let Notification: any;
   export let Modal: any;
+  export let OpendocsMenu: any;
   export let Popover: any;
   export let Severity: any;
   export let ShortcutMenu: any;
index 219da91..f0903eb 100644 (file)
@@ -185,7 +185,8 @@ class OpendocsToolbarItem implements ToolbarItemInterface
             $pid = (int)$document[3]['uid'];
         }
 
-        $result['onClickCode'] = 'jump(' . GeneralUtility::quoteJSvalue($uri) . ', \'web_list\', \'web\', ' . $pid . '); TYPO3.OpendocsMenu.toggleMenu(); return false;';
+        $result['pid'] = $pid;
+        $result['uri'] = $uri;
         $result['md5sum'] = $identifier;
 
         return $result;
index 2637d72..627e648 100644 (file)
@@ -24,8 +24,7 @@
                                                        <core:iconForRecord table="{openDocument.table}" row="{openDocument.record}"/>
                                                </div>
                                                <div class="dropdown-table-column dropdown-table-title">
-                                                       <a class="dropdown-table-title-ellipsis" href="#" onclick="{openDocument.onClickCode}"
-                                                                target="contentIframe">
+                                                       <a class="dropdown-table-title-ellipsis t3js-open-doc" data-pid="{openDocument.pid}" href="{openDocument.uri}">
                                                                {openDocument.label}
                                                        </a>
                                                </div>
@@ -52,8 +51,7 @@
                                                        <core:iconForRecord table="{recentDocument.table}" row="{recentDocument.record}"/>
                                                </div>
                                                <div class="dropdown-table-column dropdown-table-title">
-                                                       <a class="dropdown-table-title-ellipsis" href="#" onclick="{recentDocument.onClickCode}"
-                                                                target="contentIframe">
+                                                       <a class="dropdown-table-title-ellipsis t3js-open-doc" data-pid="{recentDocument.pid}" href="{recentDocument.uri}" >
                                                                {recentDocument.label}
                                                        </a>
                                                </div>
diff --git a/typo3/sysext/opendocs/Resources/Private/TypeScript/Toolbar/OpendocsMenu.ts b/typo3/sysext/opendocs/Resources/Private/TypeScript/Toolbar/OpendocsMenu.ts
new file mode 100644 (file)
index 0000000..6cd28d8
--- /dev/null
@@ -0,0 +1,130 @@
+/*
+ * 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 * as $ from'jquery';
+import Icons = require('TYPO3/CMS/Backend/Icons');
+import Viewport = require('TYPO3/CMS/Backend/Viewport');
+
+enum Selectors {
+  containerSelector = '#typo3-cms-opendocs-backend-toolbaritems-opendocstoolbaritem',
+  closeSelector = '.t3js-topbar-opendocs-close',
+  menuContainerSelector = '.dropdown-menu',
+  toolbarIconSelector = '.toolbar-item-icon .t3js-icon',
+  openDocumentsItemsSelector = '.t3js-topbar-opendocs-item',
+  counterSelector = '#tx-opendocs-counter',
+  entrySelector = '.t3js-open-doc',
+}
+
+/**
+ * Module: TYPO3/CMS/Opendocs/OpendocsMenu
+ * main JS part taking care of
+ *  - navigating to the documents
+ *  - updating the menu
+ */
+class OpendocsMenu {
+  private readonly hashDataAttributeName: string = 'opendocsidentifier';
+
+  /**
+   * Updates the number of open documents in the toolbar according to the
+   * number of items in the menu bar.
+   */
+  private static updateNumberOfDocs(): void {
+    const num: number = $(Selectors.containerSelector).find(Selectors.openDocumentsItemsSelector).length;
+    $(Selectors.counterSelector).text(num).toggle(num > 0);
+  }
+
+  constructor() {
+    Viewport.Topbar.Toolbar.registerEvent((): void => {
+      this.initializeEvents();
+      this.updateMenu();
+    });
+  }
+
+  /**
+   * Displays the menu and does the AJAX call to the TYPO3 backend
+   */
+  public updateMenu(): void {
+    let $toolbarItemIcon = $(Selectors.toolbarIconSelector, Selectors.containerSelector);
+    let $existingIcon = $toolbarItemIcon.clone();
+
+    Icons.getIcon('spinner-circle-light', Icons.sizes.small).done((spinner: string): void => {
+      $toolbarItemIcon.replaceWith(spinner);
+    });
+
+    $.ajax({
+      url: TYPO3.settings.ajaxUrls.opendocs_menu,
+      type: 'post',
+      cache: false,
+      success: (data: string) => {
+        $(Selectors.containerSelector).find(Selectors.menuContainerSelector).html(data);
+        OpendocsMenu.updateNumberOfDocs();
+        $(Selectors.toolbarIconSelector, Selectors.containerSelector).replaceWith($existingIcon);
+      }
+    });
+  }
+
+  private initializeEvents(): void {
+    // send a request when removing an opendoc
+    $(Selectors.containerSelector).on('click', Selectors.closeSelector, (evt: JQueryEventObject): void => {
+      evt.preventDefault();
+      const md5 = $(evt.currentTarget).data(this.hashDataAttributeName);
+      if (md5) {
+        this.closeDocument(md5);
+      }
+    }).on('click', Selectors.entrySelector, (evt: JQueryEventObject): void => {
+      evt.preventDefault();
+
+      const $entry = $(evt.currentTarget);
+      this.toggleMenu();
+
+      window.jump($entry.attr('href'), 'web_list', 'web', $entry.data('pid'));
+    });
+  }
+
+  /**
+   * Closes an open document
+   */
+  private closeDocument(md5sum: string): void {
+    $.ajax({
+      url: TYPO3.settings.ajaxUrls.opendocs_closedoc,
+      type: 'post',
+      cache: false,
+      data: {
+        md5sum: md5sum
+      },
+      success: (data: string): void => {
+        $(Selectors.menuContainerSelector, Selectors.containerSelector).html(data);
+        OpendocsMenu.updateNumberOfDocs();
+        // Re-open the menu after closing a document
+        $(Selectors.containerSelector).toggleClass('open');
+      }
+    });
+  }
+
+  /**
+   * closes the menu (e.g. when clicked on an item)
+   */
+  private toggleMenu = (): void => {
+    $('.scaffold').removeClass('scaffold-toolbar-expanded');
+    $(Selectors.containerSelector).toggleClass('open');
+  }
+}
+
+let opendocsMenuObject: OpendocsMenu;
+opendocsMenuObject = new OpendocsMenu();
+
+if (typeof TYPO3 !== 'undefined') {
+  TYPO3.OpendocsMenu = opendocsMenuObject;
+}
+
+export = opendocsMenuObject;
index e294f55..94a1904 100644 (file)
  *
  * The TYPO3 project - inspiring people to share!
  */
-
-/**
- * Module: TYPO3/CMS/Opendocs/OpendocsMenu
- * main JS part taking care of
- *  - navigating to the documents
- *  - updating the menu
- */
-define([
-  'jquery',
-  'TYPO3/CMS/Backend/Icons',
-  'TYPO3/CMS/Backend/Viewport'
-], function($, Icons, Viewport) {
-  'use strict';
-
-  /**
-   *
-   * @type {{options: {containerSelector: string, hashDataAttributeName: string, closeSelector: string, menuContainerSelector: string, toolbarIconSelector: string, openDocumentsItemsSelector: string, counterSelector: string}}}
-   * @exports TYPO3/CMS/Opendocs/OpendocsMenu
-   */
-  var OpendocsMenu = {
-    options: {
-      containerSelector: '#typo3-cms-opendocs-backend-toolbaritems-opendocstoolbaritem',
-      hashDataAttributeName: 'opendocsidentifier',
-      closeSelector: '.t3js-topbar-opendocs-close',
-      menuContainerSelector: '.dropdown-menu',
-      toolbarIconSelector: '.toolbar-item-icon .t3js-icon',
-      openDocumentsItemsSelector: '.t3js-topbar-opendocs-item',
-      counterSelector: '#tx-opendocs-counter'
-    }
-  };
-
-  /**
-   * register event handlers
-   */
-  OpendocsMenu.initializeEvents = function() {
-    // send a request when removing an opendoc
-    $(OpendocsMenu.options.containerSelector).on('click', OpendocsMenu.options.closeSelector, function(evt) {
-      evt.preventDefault();
-      var md5 = $(this).data(OpendocsMenu.options.hashDataAttributeName);
-      if (md5) {
-        OpendocsMenu.closeDocument(md5);
-      }
-    });
-  };
-
-  /**
-   * Displays the menu and does the AJAX call to the TYPO3 backend
-   */
-  OpendocsMenu.updateMenu = function() {
-    var $toolbarItemIcon = $(OpendocsMenu.options.toolbarIconSelector, OpendocsMenu.options.containerSelector),
-      $existingIcon = $toolbarItemIcon.clone();
-
-    Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
-      $toolbarItemIcon.replaceWith(spinner);
-    });
-
-    $.ajax({
-      url: TYPO3.settings.ajaxUrls['opendocs_menu'],
-      type: 'post',
-      cache: false,
-      success: function(data) {
-        $(OpendocsMenu.options.containerSelector).find(OpendocsMenu.options.menuContainerSelector).html(data);
-        OpendocsMenu.updateNumberOfDocs();
-        $(OpendocsMenu.options.toolbarIconSelector, OpendocsMenu.options.containerSelector).replaceWith($existingIcon);
-      }
-    });
-  };
-
-  /**
-   * Updates the number of open documents in the toolbar according to the
-   * number of items in the menu bar.
-   */
-  OpendocsMenu.updateNumberOfDocs = function() {
-    var num = $(OpendocsMenu.options.containerSelector).find(OpendocsMenu.options.openDocumentsItemsSelector).length;
-    $(OpendocsMenu.options.counterSelector).text(num).toggle(num > 0);
-  };
-
-  /**
-   * Closes an open document
-   *
-   * @param {String} md5sum
-   */
-  OpendocsMenu.closeDocument = function(md5sum) {
-    $.ajax({
-      url: TYPO3.settings.ajaxUrls['opendocs_closedoc'],
-      type: 'post',
-      cache: false,
-      data: {
-        md5sum: md5sum
-      },
-      success: function(data) {
-        $(OpendocsMenu.options.menuContainerSelector, OpendocsMenu.options.containerSelector).html(data);
-        OpendocsMenu.updateNumberOfDocs();
-        // Re-open the menu after closing a document
-        $(OpendocsMenu.options.containerSelector).toggleClass('open');
-      }
-    });
-  };
-
-  /**
-   * closes the menu (e.g. when clicked on an item)
-   */
-  OpendocsMenu.toggleMenu = function() {
-    $('.scaffold').removeClass('scaffold-toolbar-expanded');
-    $(OpendocsMenu.options.containerSelector).toggleClass('open');
-  };
-
-  Viewport.Topbar.Toolbar.registerEvent(function() {
-    OpendocsMenu.initializeEvents();
-    OpendocsMenu.updateMenu();
-  });
-
-  // expose to global
-  TYPO3.OpendocsMenu = OpendocsMenu;
-
-  return OpendocsMenu;
-});
+define(["require","exports","jquery","TYPO3/CMS/Backend/Icons","TYPO3/CMS/Backend/Viewport"],function(e,t,o,n,c){"use strict";var r,a,i;return(a=r||(r={})).containerSelector="#typo3-cms-opendocs-backend-toolbaritems-opendocstoolbaritem",a.closeSelector=".t3js-topbar-opendocs-close",a.menuContainerSelector=".dropdown-menu",a.toolbarIconSelector=".toolbar-item-icon .t3js-icon",a.openDocumentsItemsSelector=".t3js-topbar-opendocs-item",a.counterSelector="#tx-opendocs-counter",a.entrySelector=".t3js-open-doc",i=new(function(){function e(){var e=this;this.hashDataAttributeName="opendocsidentifier",this.toggleMenu=function(){o(".scaffold").removeClass("scaffold-toolbar-expanded"),o(r.containerSelector).toggleClass("open")},c.Topbar.Toolbar.registerEvent(function(){e.initializeEvents(),e.updateMenu()})}return e.updateNumberOfDocs=function(){var e=o(r.containerSelector).find(r.openDocumentsItemsSelector).length;o(r.counterSelector).text(e).toggle(e>0)},e.prototype.updateMenu=function(){var t=o(r.toolbarIconSelector,r.containerSelector),c=t.clone();n.getIcon("spinner-circle-light",n.sizes.small).done(function(e){t.replaceWith(e)}),o.ajax({url:TYPO3.settings.ajaxUrls.opendocs_menu,type:"post",cache:!1,success:function(t){o(r.containerSelector).find(r.menuContainerSelector).html(t),e.updateNumberOfDocs(),o(r.toolbarIconSelector,r.containerSelector).replaceWith(c)}})},e.prototype.initializeEvents=function(){var e=this;o(r.containerSelector).on("click",r.closeSelector,function(t){t.preventDefault();var n=o(t.currentTarget).data(e.hashDataAttributeName);n&&e.closeDocument(n)}).on("click",r.entrySelector,function(t){t.preventDefault();var n=o(t.currentTarget);e.toggleMenu(),window.jump(n.attr("href"),"web_list","web",n.data("pid"))})},e.prototype.closeDocument=function(t){o.ajax({url:TYPO3.settings.ajaxUrls.opendocs_closedoc,type:"post",cache:!1,data:{md5sum:t},success:function(t){o(r.menuContainerSelector,r.containerSelector).html(t),e.updateNumberOfDocs(),o(r.containerSelector).toggleClass("open")}})},e}()),"undefined"!=typeof TYPO3&&(TYPO3.OpendocsMenu=i),i});
\ No newline at end of file