mirror of
https://github.com/moodle/moodle.git
synced 2025-08-05 00:46:50 +02:00
b85cba317e
The new course creation for Moodle 4.0 requires to add some leavel of reactivity to the frontend. Instead of building a specific solution only for the course editor, in this commit there's a generic solution that can be used in other places in Moodle to implement single state reactive components.
2 lines
4.9 KiB
JavaScript
2 lines
4.9 KiB
JavaScript
define ("core/local/reactive/basecomponent",["exports","core/templates"],function(a,b){"use strict";Object.defineProperty(a,"__esModule",{value:!0});a.default=void 0;b=function(a){return a&&a.__esModule?a:{default:a}}(b);function c(a,b){return h(a)||g(a,b)||e(a,b)||d()}function d(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function e(a,b){if(!a)return;if("string"==typeof a)return f(a,b);var c=Object.prototype.toString.call(a).slice(8,-1);if("Object"===c&&a.constructor)c=a.constructor.name;if("Map"===c||"Set"===c)return Array.from(c);if("Arguments"===c||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(c))return f(a,b)}function f(a,b){if(null==b||b>a.length)b=a.length;for(var c=0,d=Array(b);c<b;c++){d[c]=a[c]}return d}function g(a,b){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(a)))return;var c=[],d=!0,e=!1,f=void 0;try{for(var g=a[Symbol.iterator](),h;!(d=(h=g.next()).done);d=!0){c.push(h.value);if(b&&c.length===b)break}}catch(a){e=!0;f=a}finally{try{if(!d&&null!=g["return"])g["return"]()}finally{if(e)throw f}}return c}function h(a){if(Array.isArray(a))return a}function i(a,b){if(!(a instanceof b)){throw new TypeError("Cannot call a class as a function")}}function j(a,b){for(var c=0,d;c<b.length;c++){d=b[c];d.enumerable=d.enumerable||!1;d.configurable=!0;if("value"in d)d.writable=!0;Object.defineProperty(a,d.key,d)}}function k(a,b,c){if(b)j(a.prototype,b);if(c)j(a,c);return a}var l=function(){function a(b){i(this,a);if(b.element===void 0||!(b.element instanceof HTMLElement)){throw Error("Reactive components needs a main DOM element to dispatch events")}if(b.reactive===void 0){throw Error("Reactive components needs a reactive module to work with")}this.reactive=b.reactive;this.element=b.element;this.eventHandlers=new Map([]);this.eventListeners=[];this.selectors={};this.events=this.constructor.getEvents();this.create(b);if(b.selectors!==void 0){this.addSelectors(b.selectors)}this.reactive.registerComponent(this)}k(a,[{key:"create",value:function create(){}},{key:"destroy",value:function destroy(){}},{key:"getWatchers",value:function getWatchers(){return[]}},{key:"stateReady",value:function stateReady(){}},{key:"getElement",value:function getElement(a,b){if(a===void 0&&b===void 0){return this.element}var c=b?"[data-id='".concat(b,"']"):"",d="".concat(null!==a&&void 0!==a?a:"").concat(c);return this.element.querySelector(d)}},{key:"getElements",value:function getElements(a,b){var c=b?"[data-id='".concat(b,"']"):"",d="".concat(null!==a&&void 0!==a?a:"").concat(c);return this.element.querySelectorAll(d)}},{key:"addSelectors",value:function addSelectors(a){for(var b=0,d=Object.entries(a);b<d.length;b++){var e=c(d[b],2),f=e[0],g=e[1];this.selectors[f]=g}}},{key:"getSelector",value:function getSelector(a){return this.selectors[a]}},{key:"dispatchEvent",value:function dispatchEvent(a,b){this.element.dispatchEvent(new CustomEvent(a,{bubbles:!0,detail:b}))}},{key:"renderComponent",value:function renderComponent(a,c,d){return new Promise(function(e,f){a.addEventListener("ComponentRegistration:Success",function(a){var b=a.detail;e(b.component)});a.addEventListener("ComponentRegistration:Fail",function(){f("Registration of ".concat(c," fails."))});b.default.renderForPromise(c,d).then(function(c){var d=c.html,e=c.js;b.default.replaceNodeContents(a,d,e);return!0}).catch(function(a){f("Rendering of ".concat(c," throws an error."));throw a})})}},{key:"addEventListener",value:function addEventListener(a,b,c){var d=this.eventHandlers.get(c);if(d===void 0){d=c.bind(this);this.eventHandlers.set(c,d)}a.addEventListener(b,d);this.eventListeners.push({target:a,type:b,bindListener:d})}},{key:"removeEventListener",value:function removeEventListener(a,b,c){var d=this.eventHandlers.get(c);if(d===void 0){return}a.removeEventListener(b,d)}},{key:"removeAllEventListeners",value:function removeAllEventListeners(){this.eventListeners.forEach(function(a){var b=a.target,c=a.type,d=a.bindListener;b.removeEventListener(c,d)});this.eventListeners=[]}},{key:"remove",value:function remove(){this.unregister();this.element.remove()}},{key:"unregister",value:function unregister(){this.reactive.unregisterComponent(this);this.removeAllEventListeners();this.destroy()}},{key:"dispatchRegistrationSuccess",value:function dispatchRegistrationSuccess(){if(this.element.parentNode===void 0){return}this.element.parentNode.dispatchEvent(new CustomEvent("ComponentRegistration:Success",{bubbles:!1,detail:{component:this}}))}},{key:"dispatchRegistrationFail",value:function dispatchRegistrationFail(){if(this.element.parentNode===void 0){return}this.element.parentNode.dispatchEvent(new CustomEvent("ComponentRegistration:Fail",{bubbles:!1,detail:{component:this}}))}}],[{key:"getEvents",value:function getEvents(){return{}}}]);return a}();a.default=l;return a.default});
|
|
//# sourceMappingURL=basecomponent.min.js.map
|