typo3/sysext/backend/Resources/Public/JavaScript/Toolbar/ShortcutMenu.js

   1 /*
   2  * This file is part of the TYPO3 CMS project.
   3  *
   4  * It is free software; you can redistribute it and/or modify it under
   5  * the terms of the GNU General Public License, either version 2
   6  * of the License, or any later version.
   7  *
   8  * For the full copyright and license information, please read the
   9  * LICENSE.txt file that was distributed with this source code.
  10  *
  11  * The TYPO3 project - inspiring people to share!
  12  */
  13
  14 /**
  15  * Module: TYPO3/CMS/Backend/Toolbar/ShortcutMenu
  16  * shortcut menu logic to add new shortcut, remove a shortcut
  17  * and edit a shortcut
  18  */
  19 define(['jquery', 'TYPO3/CMS/Backend/Modal', 'TYPO3/CMS/Backend/Icons'], function($, Modal, Icons) {
  20         'use strict';
  21
  22         /**
  23          *
  24          * @type {{options: {containerSelector: string, toolbarIconSelector: string, toolbarMenuSelector: string, shortcutItemSelector: string, shortcutDeleteSelector: string, shortcutEditSelector: string, shortcutFormTitleSelector: string, shortcutFormGroupSelector: string, shortcutFormSaveSelector: string, shortcutFormCancelSelector: string}}}
  25          * @exports TYPO3/CMS/Backend/Toolbar/ShortcutMenu
  26          */
  27         var ShortcutMenu = {
  28                 options: {
  29                         containerSelector: '#typo3-cms-backend-backend-toolbaritems-shortcuttoolbaritem',
  30                         toolbarIconSelector: '.dropdown-toggle span.icon',
  31                         toolbarMenuSelector: '.dropdown-menu',
  32                         shortcutItemSelector: '.dropdown-menu .shortcut',
  33                         shortcutDeleteSelector: '.shortcut-delete',
  34                         shortcutEditSelector: '.shortcut-edit',
  35                         shortcutFormTitleSelector: 'input[name="shortcut-title"]',
  36                         shortcutFormGroupSelector: 'select[name="shortcut-group"]',
  37                         shortcutFormSaveSelector: '.shortcut-form-save',
  38                         shortcutFormCancelSelector: '.shortcut-form-cancel',
  39                         shortcutFormSelector: '.shortcut-form'
  40                 }
  41         };
  42
  43         /**
  44          * build the in-place-editor for a shortcut
  45          *
  46          * @param {Object} $shortcutRecord
  47          */
  48         ShortcutMenu.editShortcut = function($shortcutRecord) {
  49                 // load the form
  50                 $.ajax({
  51                         url: TYPO3.settings.ajaxUrls['shortcut_editform'],
  52                         data: {
  53                                 shortcutId: $shortcutRecord.data('shortcutid'),
  54                                 shortcutGroup: $shortcutRecord.data('shortcutgroup')
  55                         },
  56                         cache: false
  57                 }).done(function(data) {
  58                         $shortcutRecord.html(data);
  59                 });
  60         };
  61
  62         /**
  63          * Save the data from the in-place-editor for a shortcut
  64          *
  65          * @param {Object} $shortcutRecord
  66          */
  67         ShortcutMenu.saveShortcutForm = function($shortcutRecord) {
  68                 $.ajax({
  69                         url: TYPO3.settings.ajaxUrls['shortcut_saveform'],
  70                         data: {
  71                                 shortcutId: $shortcutRecord.data('shortcutid'),
  72                                 shortcutTitle: $shortcutRecord.find(ShortcutMenu.options.shortcutFormTitleSelector).val(),
  73                                 shortcutGroup: $shortcutRecord.find(ShortcutMenu.options.shortcutFormGroupSelector).val()
  74                         },
  75                         type: 'post',
  76                         cache: false
  77                 }).done(function(data) {
  78                         // @todo: we can evaluate here, but what to do? a message?
  79                         ShortcutMenu.refreshMenu();
  80                 });
  81         };
  82
  83         /**
  84          * removes an existing short by sending an AJAX call
  85          *
  86          * @param {Object} $shortcutRecord
  87          */
  88         ShortcutMenu.deleteShortcut = function($shortcutRecord) {
  89                 // @todo: translations
  90                 Modal.confirm('Delete bookmark', 'Do you really want to remove this bookmark?')
  91                         .on('confirm.button.ok', function() {
  92                                 $.ajax({
  93                                         url: TYPO3.settings.ajaxUrls['shortcut_remove'],
  94                                         data: {
  95                                                 shortcutId: $shortcutRecord.data('shortcutid')
  96                                         },
  97                                         type: 'post',
  98                                         cache: false
  99                                 }).done(function() {
 100                                         // a reload is used in order to restore the original behaviour
 101                                         // e.g. remove groups that are now empty because the last one in the group
 102                                         // was removed
 103                                         ShortcutMenu.refreshMenu();
 104                                 });
 105                                 $(this).trigger('modal-dismiss');
 106                         })
 107                         .on('confirm.button.cancel', function() {
 108                                 $(this).trigger('modal-dismiss');
 109                         });
 110         };
 111
 112         /**
 113          * makes a call to the backend class to create a new shortcut,
 114          * when finished it reloads the menu
 115          *
 116          * @param {String} moduleName
 117          * @param {String} url
 118          * @param {String} confirmationText
 119          * @param {String} motherModule
 120          * @param {Object} shortcutButton
 121          * @param {String} displayName
 122          */
 123         ShortcutMenu.createShortcut = function(moduleName, url, confirmationText, motherModule, shortcutButton, displayName) {
 124                 if (typeof confirmationText !== 'undefined') {
 125                         // @todo: translations
 126                         Modal.confirm('Create bookmark', confirmationText)
 127                                 .on('confirm.button.ok', function() {
 128                                         var $toolbarItemIcon = $(ShortcutMenu.options.toolbarIconSelector, ShortcutMenu.options.containerSelector),
 129                                                 $existingIcon = $toolbarItemIcon.clone();
 130
 131                                         Icons.getIcon('spinner-circle-light', Icons.sizes.small).done(function(spinner) {
 132                                                 $toolbarItemIcon.replaceWith(spinner);
 133                                         });
 134
 135                                         $.ajax({
 136                                                 url: TYPO3.settings.ajaxUrls['shortcut_create'],
 137                                                 type: 'post',
 138                                                 data: {
 139                                                         module: moduleName,
 140                                                         url: url,
 141                                                         motherModName: motherModule,
 142                                                         displayName: displayName
 143                                                 },
 144                                                 cache: false
 145                                         }).done(function() {
 146                                                 ShortcutMenu.refreshMenu();
 147                                                 $(ShortcutMenu.options.toolbarIconSelector, ShortcutMenu.options.containerSelector).replaceWith($existingIcon);
 148                                                 if (typeof shortcutButton === 'object') {
 149                                                         Icons.getIcon('actions-system-shortcut-active', Icons.sizes.small).done(function(icons) {
 150                                                                 $(shortcutButton).html(icons['actions-system-shortcut-active']);
 151                                                         });
 152                                                         $(shortcutButton).addClass('active');
 153                                                         $(shortcutButton).attr('title', null);
 154                                                         $(shortcutButton).attr('onclick', null);
 155                                                 }
 156                                         });
 157                                         $(this).trigger('modal-dismiss');
 158                                 })
 159                                 .on('confirm.button.cancel', function() {
 160                                         $(this).trigger('modal-dismiss');
 161                                 });
 162                 }
 163
 164         };
 165
 166         /**
 167          * reloads the menu after an update
 168          */
 169         ShortcutMenu.refreshMenu = function() {
 170                 $.ajax({
 171                         url: TYPO3.settings.ajaxUrls['shortcut_list'],
 172                         type: 'get',
 173                         cache: false
 174                 }).done(function(data) {
 175                         $(ShortcutMenu.options.toolbarMenuSelector, ShortcutMenu.options.containerSelector).html(data);
 176                 });
 177         };
 178
 179         /**
 180          * Registers listeners
 181          */
 182         ShortcutMenu.initializeEvents = function() {
 183                 $(ShortcutMenu.options.containerSelector).on('click', ShortcutMenu.options.shortcutDeleteSelector, function(evt) {
 184                         evt.preventDefault();
 185                         evt.stopImmediatePropagation();
 186                         ShortcutMenu.deleteShortcut($(this).closest(ShortcutMenu.options.shortcutItemSelector));
 187                 }).on('click', ShortcutMenu.options.shortcutEditSelector, function(evt) {
 188                         evt.preventDefault();
 189                         evt.stopImmediatePropagation();
 190                         ShortcutMenu.editShortcut($(this).closest(ShortcutMenu.options.shortcutItemSelector));
 191                 }).on('click', ShortcutMenu.options.shortcutFormSaveSelector, function(evt) {
 192                         ShortcutMenu.saveShortcutForm($(this).closest(ShortcutMenu.options.shortcutItemSelector));
 193                 }).on('submit', ShortcutMenu.options.shortcutFormSelector, function(evt) {
 194                         evt.preventDefault();
 195                         evt.stopImmediatePropagation();
 196                         ShortcutMenu.saveShortcutForm($(this).closest(ShortcutMenu.options.shortcutItemSelector));
 197                 }).on('click', ShortcutMenu.options.shortcutFormCancelSelector, function() {
 198                         // re-render the menu on canceling the update of a shortcut
 199                         ShortcutMenu.refreshMenu();
 200                 });
 201         };
 202
 203         $(ShortcutMenu.initializeEvents);
 204
 205         // expose as global object
 206         TYPO3.ShortcutMenu = ShortcutMenu;
 207
 208         return ShortcutMenu;
 209 });