MDL-68409 js: Convert cancel modals to ES6
authorAndrew Nicols <andrew@nicols.co.uk>
Tue, 14 Apr 2020 06:32:09 +0000 (14:32 +0800)
committerAndrew Nicols <andrew@nicols.co.uk>
Mon, 4 May 2020 07:08:11 +0000 (15:08 +0800)
lib/amd/build/modal_cancel.min.js
lib/amd/build/modal_cancel.min.js.map
lib/amd/build/modal_save_cancel.min.js
lib/amd/build/modal_save_cancel.min.js.map
lib/amd/src/modal_cancel.js
lib/amd/src/modal_save_cancel.js

index c172543..90366c2 100644 (file)
Binary files a/lib/amd/build/modal_cancel.min.js and b/lib/amd/build/modal_cancel.min.js differ
index 95e19e1..ff44652 100644 (file)
Binary files a/lib/amd/build/modal_cancel.min.js.map and b/lib/amd/build/modal_cancel.min.js.map differ
index 366a16f..5cf92de 100644 (file)
Binary files a/lib/amd/build/modal_save_cancel.min.js and b/lib/amd/build/modal_save_cancel.min.js differ
index cbe4dbf..e934234 100644 (file)
Binary files a/lib/amd/build/modal_save_cancel.min.js.map and b/lib/amd/build/modal_save_cancel.min.js.map differ
index 2e182c1..8f593f0 100644 (file)
  * @copyright  2016 Ryan Wyllie <ryan@moodle.com>
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
-define(['jquery', 'core/notification', 'core/custom_interaction_events', 'core/modal', 'core/modal_events'],
-        function($, Notification, CustomEvents, Modal, ModalEvents) {
+import Modal from 'core/modal';
 
-    var SELECTORS = {
-        CANCEL_BUTTON: '[data-action="cancel"]',
-    };
+export default class extends Modal {
+    constructor(root) {
+        super(root);
 
-    /**
-     * Constructor for the Modal.
-     *
-     * @param {object} root The root jQuery element for the modal
-     */
-    var ModalCancel = function(root) {
-        Modal.call(this, root);
-
-        if (!this.getFooter().find(SELECTORS.CANCEL_BUTTON).length) {
+        if (!this.getFooter().find(this.getActionSelector('cancel')).length) {
             Notification.exception({message: 'No cancel button found'});
         }
-    };
-
-    ModalCancel.prototype = Object.create(Modal.prototype);
-    ModalCancel.prototype.constructor = ModalCancel;
-
-    /**
-     * Override parent implementation to prevent changing the footer content.
-     */
-    ModalCancel.prototype.setFooter = function() {
-        Notification.exception({message: 'Can not change the footer of a cancel modal'});
-        return;
-    };
+    }
 
     /**
-     * Set up all of the event handling for the modal.
-     *
-     * @method registerEventListeners
+     * Register all event listeners.
      */
-    ModalCancel.prototype.registerEventListeners = function() {
-        // Apply parent event listeners.
-        Modal.prototype.registerEventListeners.call(this);
-
-        this.getModal().on(CustomEvents.events.activate, SELECTORS.CANCEL_BUTTON, function(e, data) {
-            var cancelEvent = $.Event(ModalEvents.cancel);
-            this.getRoot().trigger(cancelEvent, this);
-
-            if (!cancelEvent.isDefaultPrevented()) {
-                this.hide();
-                data.originalEvent.preventDefault();
-            }
-        }.bind(this));
-    };
-
-    return ModalCancel;
-});
+    registerEventListeners() {
+        // Call the parent registration.
+        super.registerEventListeners();
+
+        // Register to close on cancel.
+        this.registerCloseOnCancel();
+    }
+}
index 8b37e86..42416be 100644 (file)
  * @copyright  2016 Ryan Wyllie <ryan@moodle.com>
  * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
  */
-define(['jquery', 'core/notification', 'core/custom_interaction_events', 'core/modal', 'core/modal_events'],
-        function($, Notification, CustomEvents, Modal, ModalEvents) {
+import Modal from 'core/modal';
 
-    var SELECTORS = {
-        SAVE_BUTTON: '[data-action="save"]',
-        CANCEL_BUTTON: '[data-action="cancel"]',
-    };
+export default class extends Modal {
+    constructor(root) {
+        super(root);
 
-    /**
-     * Constructor for the Modal.
-     *
-     * @param {object} root The root jQuery element for the modal
-     */
-    var ModalSaveCancel = function(root) {
-        Modal.call(this, root);
-
-        if (!this.getFooter().find(SELECTORS.SAVE_BUTTON).length) {
+        if (!this.getFooter().find(this.getActionSelector('save')).length) {
             Notification.exception({message: 'No save button found'});
         }
 
-        if (!this.getFooter().find(SELECTORS.CANCEL_BUTTON).length) {
+        if (!this.getFooter().find(this.getActionSelector('cancel')).length) {
             Notification.exception({message: 'No cancel button found'});
         }
-    };
+    }
+
+    /**
+     * Register all event listeners.
+     */
+    registerEventListeners() {
+        // Call the parent registration.
+        super.registerEventListeners();
 
-    ModalSaveCancel.prototype = Object.create(Modal.prototype);
-    ModalSaveCancel.prototype.constructor = ModalSaveCancel;
+        // Register to close on save/cancel.
+        this.registerCloseOnSave();
+        this.registerCloseOnCancel();
+    }
 
     /**
      * Override parent implementation to prevent changing the footer content.
      */
-    ModalSaveCancel.prototype.setFooter = function() {
+    setFooter() {
         Notification.exception({message: 'Can not change the footer of a save cancel modal'});
         return;
-    };
+    }
 
     /**
-     * Set up all of the event handling for the modal.
+     * Set the title of the save button.
      *
-     * @method registerEventListeners
+     * @param {String|Promise} value The button text, or a Promise which will resolve it
+     * @returns{Promise}
      */
-    ModalSaveCancel.prototype.registerEventListeners = function() {
-        // Apply parent event listeners.
-        Modal.prototype.registerEventListeners.call(this);
-
-        this.getModal().on(CustomEvents.events.activate, SELECTORS.SAVE_BUTTON, function(e, data) {
-            var saveEvent = $.Event(ModalEvents.save);
-            this.getRoot().trigger(saveEvent, this);
-
-            if (!saveEvent.isDefaultPrevented()) {
-                this.hide();
-                data.originalEvent.preventDefault();
-            }
-        }.bind(this));
-
-        this.registerCloseOnCancel();
-    };
-
-    /**
-     * Allows to overwrite the text of "Save changes" button.
-     *
-     * This method is overloaded to take either a string value for the button title or a jQuery promise that is resolved with
-     * text most commonly from a Str.get_string call.
-     *
-     * @param {(String|object)} value The button text, or a jQuery promise which will resolve it
-     */
-    ModalSaveCancel.prototype.setSaveButtonText = function(value) {
-        var button = this.getFooter().find(SELECTORS.SAVE_BUTTON);
-
-        this.asyncSet(value, button.text.bind(button));
-    };
-
-    return ModalSaveCancel;
-});
+    setSaveButtonText(value) {
+        return this.setButtonText('save', value);
+    }
+}