[BUGFIX] Catch submit event while saving shortcut with enter
[Packages/TYPO3.CMS.git] / 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 });