Provide consistent enter-key support in dialogs
authorAlexander Ebert <ebert@woltlab.com>
Sat, 25 Nov 2017 23:56:07 +0000 (00:56 +0100)
committerAlexander Ebert <ebert@woltlab.com>
Sat, 25 Nov 2017 23:56:07 +0000 (00:56 +0100)
See #2480

wcfsetup/install/files/js/WoltLabSuite/Core/Acp/Ui/Template/Group/Copy.js
wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Code.js
wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Quote.js
wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Spoiler.js
wcfsetup/install/files/js/WoltLabSuite/Core/Ui/Redactor/Table.js

index 0c9186ecf35b79c0d4822e03f955376d939e2770..77fb2aaecc79e2858577796aef3d825696720cee 100644 (file)
@@ -6,7 +6,7 @@
  * @license    GNU Lesser General Public License <http://opensource.org/licenses/lgpl-license.php>
  * @module     WoltLabSuite/Core/Acp/Ui/Template/Group/Copy
  */
-define(['Ajax', 'EventKey', 'Language', 'Ui/Dialog', 'Ui/Notification'], function(Ajax, EventKey, Language, UiDialog, UiNotification) {
+define(['Ajax', 'Language', 'Ui/Dialog', 'Ui/Notification'], function(Ajax, Language, UiDialog, UiNotification) {
        "use strict";
        
        var _name = null;
@@ -40,34 +40,13 @@ define(['Ajax', 'EventKey', 'Language', 'Ui/Dialog', 'Ui/Notification'], functio
                        UiDialog.open(this);
                },
                
-               /**
-                * Submits the values for the new template group.
-                * 
-                * @param       {Event}         event
-                * @protected
-                */
-               _submit: function (event) {
-                       event.preventDefault();
-                       
-                       var valid = true;
-                       [_name, _folderName].forEach(function (input) {
-                               if (input.value.trim() === '') {
-                                       elInnerError(input, Language.get('wcf.global.form.error.empty'));
-                                       valid = false;
-                               }
-                               else {
-                                       elInnerError(input, false);
+               _dialogSubmit: function () {
+                       Ajax.api(this, {
+                               parameters: {
+                                       templateGroupName: _name.value,
+                                       templateGroupFolderName: _folderName.value
                                }
                        });
-                       
-                       if (valid) {
-                               Ajax.api(this, {
-                                       parameters: {
-                                               templateGroupName: _name.value,
-                                               templateGroupFolderName: _folderName.value
-                                       }
-                               });
-                       }
                },
                
                _ajaxSuccess: function (data) {
@@ -83,32 +62,24 @@ define(['Ajax', 'EventKey', 'Language', 'Ui/Dialog', 'Ui/Notification'], functio
                        return {
                                id: 'templateGroupCopy',
                                options: {
-                                       onSetup: (function (content) {
+                                       onSetup: (function () {
                                                ['Name', 'FolderName'].forEach((function(type) {
                                                        var input = elById('copyTemplateGroup' + type);
                                                        input.value = elById('templateGroup' + type).value;
                                                        
                                                        if (type === 'Name') _name = input;
                                                        else _folderName = input;
-                                                       
-                                                       input.addEventListener('keydown', (function (event) {
-                                                               if (EventKey.Enter(event)) {
-                                                                       this._submit(event);
-                                                               }
-                                                       }).bind(this));
                                                }).bind(this));
-                                               
-                                               elBySel('.formSubmit > button[data-type="submit"]', content).addEventListener(WCF_CLICK_EVENT, this._submit.bind(this));
                                        }).bind(this),
                                        title: Language.get('wcf.acp.template.group.copy')
                                },
                                source: '<dl>' +
                                        '<dt><label for="copyTemplateGroupName">' + Language.get('wcf.global.name') + '</label></dt>' +
-                                       '<dd><input type="text" id="copyTemplateGroupName" class="long"></dd>' +
+                                       '<dd><input type="text" id="copyTemplateGroupName" class="long" data-dialog-submit-on-enter="true" required></dd>' +
                                '</dl>' +
                                '<dl>' +
                                        '<dt><label for="copyTemplateGroupFolderName">' + Language.get('wcf.acp.template.group.folderName') + '</label></dt>' +
-                                       '<dd><input type="text" id="copyTemplateGroupFolderName" class="long"></dd>' +
+                                       '<dd><input type="text" id="copyTemplateGroupFolderName" class="long" data-dialog-submit-on-enter="true" required></dd>' +
                                '</dl>' +
                                '<div class="formSubmit">' +
                                        '<button class="buttonPrimary" data-type="submit">' + Language.get('wcf.global.button.submit') + '</button>' +
index e1c3cfdbb4436dcf08af9055e68e1e719f2c1a94..feff3e8351e6524012cb5fa14397386dc98f86db 100644 (file)
@@ -16,10 +16,10 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                        _bbcodeCode: function() {},
                        _observeLoad: function() {},
                        _edit: function() {},
-                       _save: function() {},
                        _setTitle: function() {},
                        _delete: function() {},
-                       _dialogSetup: function() {}
+                       _dialogSetup: function() {},
+                       _dialogSubmit: function() {}
                };
                return Fake;
        }
@@ -128,12 +128,9 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                /**
                 * Saves the changes to the code's properties.
                 * 
-                * @param       {Event}         event           event object
                 * @protected
                 */
-               _save: function(event) {
-                       event.preventDefault();
-                       
+               _dialogSubmit: function() {
                        var id = 'redactor-code-' + this._elementId;
                        
                        ['file', 'highlighter', 'line'].forEach((function (attr) {
@@ -207,13 +204,12 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                                        }).bind(this),
                                        
                                        onSetup: (function() {
-                                               elById(idButtonSave).addEventListener(WCF_CLICK_EVENT, this._save.bind(this));
                                                elById(idButtonDelete).addEventListener(WCF_CLICK_EVENT, this._delete.bind(this));
                                                
                                                // set highlighters
                                                var highlighters = '<option value="">' + Language.get('wcf.editor.code.highlighter.detect') + '</option>';
                                                
-                                               var value, values = [];
+                                               var values = [];
                                                //noinspection JSUnresolvedVariable
                                                for (var highlighter in this._editor.opts.woltlab.highlighters) {
                                                        //noinspection JSUnresolvedVariable
@@ -262,20 +258,20 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                                        + '<dl>'
                                                + '<dt><label for="' + idLine + '">' + Language.get('wcf.editor.code.line') + '</label></dt>'
                                                + '<dd>'
-                                                       + '<input type="number" id="' + idLine + '" min="0" value="1" class="long">'
+                                                       + '<input type="number" id="' + idLine + '" min="0" value="1" class="long" data-dialog-submit-on-enter="true">'
                                                        + '<small>' + Language.get('wcf.editor.code.line.description') + '</small>'
                                                + '</dd>'
                                        + '</dl>'
                                        + '<dl>'
                                                + '<dt><label for="' + idFile + '">' + Language.get('wcf.editor.code.file') + '</label></dt>'
                                                + '<dd>'
-                                                       + '<input type="text" id="' + idFile + '" class="long">'
+                                                       + '<input type="text" id="' + idFile + '" class="long" data-dialog-submit-on-enter="true">'
                                                        + '<small>' + Language.get('wcf.editor.code.file.description') + '</small>'
                                                + '</dd>'
                                        + '</dl>'
                                + '</div>'
                                + '<div class="formSubmit">'
-                                       + '<button id="' + idButtonSave + '" class="buttonPrimary">' + Language.get('wcf.global.button.save') + '</button>'
+                                       + '<button id="' + idButtonSave + '" class="buttonPrimary" data-type="submit">' + Language.get('wcf.global.button.save') + '</button>'
                                        + '<button id="' + idButtonDelete + '">' + Language.get('wcf.global.button.delete') + '</button>'
                                + '</div>'
                        };
index d759581cbbf60d57bfb77452e17cd1bb111fd1d4..58e5c6e5b8d19a4fe83df626e399ae897438d59f 100644 (file)
@@ -20,7 +20,8 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                        _save: function() {},
                        _setTitle: function() {},
                        _delete: function() {},
-                       _dialogSetup: function() {}
+                       _dialogSetup: function() {},
+                       _dialogSubmit: function() {}
                };
                return Fake;
        }
@@ -182,12 +183,9 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                /**
                 * Saves the changes to the quote's properties.
                 * 
-                * @param       {Event}         event           event object
                 * @protected
                 */
-               _save: function(event) {
-                       event.preventDefault();
-                       
+               _dialogSubmit: function() {
                        var id = 'redactor-quote-' + this._elementId;
                        var urlInput = elById(id + '-url');
                        
@@ -267,7 +265,6 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                                        }).bind(this),
                                        
                                        onSetup: (function() {
-                                               elById(idButtonSave).addEventListener(WCF_CLICK_EVENT, this._save.bind(this));
                                                elById(idButtonDelete).addEventListener(WCF_CLICK_EVENT, this._delete.bind(this));
                                        }).bind(this),
                                        
@@ -282,19 +279,19 @@ define(['Core', 'EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util'
                                        + '<dl>'
                                                + '<dt><label for="' + idAuthor + '">' + Language.get('wcf.editor.quote.author') + '</label></dt>'
                                                + '<dd>'
-                                                       + '<input type="text" id="' + idAuthor + '" class="long">'
+                                                       + '<input type="text" id="' + idAuthor + '" class="long" data-dialog-submit-on-enter="true">'
                                                + '</dd>'
                                        + '</dl>'
                                        + '<dl>'
                                                + '<dt><label for="' + idUrl + '">' + Language.get('wcf.editor.quote.url') + '</label></dt>'
                                                + '<dd>'
-                                                       + '<input type="text" id="' + idUrl + '" class="long">'
+                                                       + '<input type="text" id="' + idUrl + '" class="long" data-dialog-submit-on-enter="true">'
                                                        + '<small>' + Language.get('wcf.editor.quote.url.description') + '</small>'
                                                + '</dd>'
                                        + '</dl>'
                                + '</div>'
                                + '<div class="formSubmit">'
-                                       + '<button id="' + idButtonSave + '" class="buttonPrimary">' + Language.get('wcf.global.button.save') + '</button>'
+                                       + '<button id="' + idButtonSave + '" class="buttonPrimary" data-type="submit">' + Language.get('wcf.global.button.save') + '</button>'
                                        + '<button id="' + idButtonDelete + '">' + Language.get('wcf.global.button.delete') + '</button>'
                                + '</div>'
                        };
index c450fccafae6e3e86c3dd6360978d2677f4db92e..99db222693287f9f827c4cadfd90d9da9f14598e 100644 (file)
@@ -16,10 +16,10 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                        _bbcodeSpoiler: function() {},
                        _observeLoad: function() {},
                        _edit: function() {},
-                       _save: function() {},
                        _setTitle: function() {},
                        _delete: function() {},
-                       _dialogSetup: function() {}
+                       _dialogSetup: function() {},
+                       _dialogSubmit: function() {}
                };
                return Fake;
        }
@@ -116,12 +116,9 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                /**
                 * Saves the changes to the spoiler's properties.
                 * 
-                * @param       {Event}         event           event object
                 * @protected
                 */
-               _save: function(event) {
-                       event.preventDefault();
-                       
+               _dialogSubmit: function() {
                        elData(this._spoiler, 'label', elById('redactor-spoiler-' + this._elementId + '-label').value);
                        
                        this._setTitle(this._spoiler);
@@ -180,7 +177,6 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                                        }).bind(this),
                                        
                                        onSetup: (function() {
-                                               elById(idButtonSave).addEventListener(WCF_CLICK_EVENT, this._save.bind(this));
                                                elById(idButtonDelete).addEventListener(WCF_CLICK_EVENT, this._delete.bind(this));
                                        }).bind(this),
                                        
@@ -194,13 +190,13 @@ define(['EventHandler', 'EventKey', 'Language', 'StringUtil', 'Dom/Util', 'Ui/Di
                                        + '<dl>'
                                                + '<dt><label for="' + idLabel + '">' + Language.get('wcf.editor.spoiler.label') + '</label></dt>'
                                                + '<dd>'
-                                                       + '<input type="text" id="' + idLabel + '" class="long">'
+                                                       + '<input type="text" id="' + idLabel + '" class="long" data-dialog-submit-on-enter="true">'
                                                        + '<small>' + Language.get('wcf.editor.spoiler.label.description') + '</small>'
                                                + '</dd>'
                                        + '</dl>'
                                + '</div>'
                                + '<div class="formSubmit">'
-                                       + '<button id="' + idButtonSave + '" class="buttonPrimary">' + Language.get('wcf.global.button.save') + '</button>'
+                                       + '<button id="' + idButtonSave + '" class="buttonPrimary" data-type="submit">' + Language.get('wcf.global.button.save') + '</button>'
                                        + '<button id="' + idButtonDelete + '">' + Language.get('wcf.global.button.delete') + '</button>'
                                + '</div>'
                        };
index 2ac1328af2f3630f814e03e7f6139d0eba433197..5da25e6a3d8c546bb284ffe9c46711562c325fbe 100644 (file)
@@ -11,7 +11,6 @@ define(['Language', 'Ui/Dialog'], function(Language, UiDialog) {
                return Fake;
        }
        
-       var _boundListener = false;
        var _callback = null;
        
        return {
@@ -19,15 +18,9 @@ define(['Language', 'Ui/Dialog'], function(Language, UiDialog) {
                        UiDialog.open(this);
                        
                        _callback = options.submitCallback;
-                       
-                       if (!_boundListener) {
-                               _boundListener = true;
-                               
-                               elById('redactor-modal-button-action').addEventListener(WCF_CLICK_EVENT, this._submit.bind(this));
-                       }
                },
                
-               _submit: function() {
+               _dialogSubmit: function() {
                        // check if rows and cols are within the boundaries
                        var isValid = true;
                        ['rows', 'cols'].forEach(function(type) {
@@ -56,14 +49,14 @@ define(['Language', 'Ui/Dialog'], function(Language, UiDialog) {
                                },
                                source: '<dl>'
                                                + '<dt><label for="redactor-table-rows">' + Language.get('wcf.editor.table.rows') + '</label></dt>'
-                                               + '<dd><input type="number" id="redactor-table-rows" class="small" min="1" max="100" value="2"></dd>'
+                                               + '<dd><input type="number" id="redactor-table-rows" class="small" min="1" max="100" value="2" data-dialog-submit-on-enter="true"></dd>'
                                        + '</dl>'
                                        + '<dl>'
                                                + '<dt><label for="redactor-table-cols">' + Language.get('wcf.editor.table.cols') + '</label></dt>'
-                                               + '<dd><input type="number" id="redactor-table-cols" class="small" min="1" max="100" value="3"></dd>'
+                                               + '<dd><input type="number" id="redactor-table-cols" class="small" min="1" max="100" value="3" data-dialog-submit-on-enter="true"></dd>'
                                        + '</dl>'
                                        + '<div class="formSubmit">'
-                                               + '<button id="redactor-modal-button-action" class="buttonPrimary">' + Language.get('wcf.global.button.insert') + '</button>'
+                                               + '<button id="redactor-modal-button-action" class="buttonPrimary" data-type="submit">' + Language.get('wcf.global.button.insert') + '</button>'
                                        + '</div>'
                        };
                }