MDL-57280 javascript: add modal registry

Add a modal registry for the types and make the factory use it to allow
code to register modal types at run time and use the factory for
non-core modals.
This commit is contained in:
Ryan Wyllie 2016-12-06 01:58:52 +00:00
parent 0f59b6dd75
commit 0531ce1a29
4 changed files with 99 additions and 22 deletions

View File

@ -1 +1 @@
define(["jquery","core/modal_events","core/modal","core/modal_save_cancel","core/modal_confirm","core/modal_cancel","core/templates","core/notification","core/custom_interaction_events"],function(a,b,c,d,e,f,g,h,i){var j={DEFAULT:"core/modal",SAVE_CANCEL:"core/modal_save_cancel",CONFIRM:"core/modal_confirm",CANCEL:"core/modal_cancel"},k={DEFAULT:c,SAVE_CANCEL:d,CONFIRM:e,CANCEL:f},l={DEFAULT:"DEFAULT",SAVE_CANCEL:"SAVE_CANCEL",CONFIRM:"CONFIRM",CANCEL:"CANCEL"},m=function(a,c){"undefined"!=typeof c&&(i.define(c,[i.events.activate]),c.on(i.events.activate,function(b,c){a.show(),c.originalEvent.preventDefault()}),a.getRoot().on(b.hidden,function(){c.focus()}))},n=function(b,c,d){c=a(c);var e=k[b],f=new e(c);return m(f,d),f},o=function(b,c){var d=j[b];return g.render(d,{}).then(function(d){var e=a(d);return n(b,e,c)}).fail(h.exception)},p=function(a,b){var c=a.type||l.DEFAULT,d=!!a.large;return l[c]||(c=l.DEFAULT),o(c,b).then(function(b){return"undefined"!=typeof a.title&&b.setTitle(a.title),"undefined"!=typeof a.body&&b.setBody(a.body),"undefined"!=typeof a.footer&&b.setFooter(a.footer),d&&b.setLarge(),b})};return{create:p,types:l}});
define(["jquery","core/modal_events","core/modal_registry","core/modal","core/modal_save_cancel","core/modal_confirm","core/modal_cancel","core/templates","core/notification","core/custom_interaction_events"],function(a,b,c,d,e,f,g,h,i,j){var k={DEFAULT:"core/modal",SAVE_CANCEL:"core/modal_save_cancel",CONFIRM:"core/modal_confirm",CANCEL:"core/modal_cancel"},l={DEFAULT:"DEFAULT",SAVE_CANCEL:"SAVE_CANCEL",CONFIRM:"CONFIRM",CANCEL:"CANCEL"};c.register(l.DEFAULT,d,k.DEFAULT),c.register(l.SAVE_CANCEL,e,k.SAVE_CANCEL),c.register(l.CONFIRM,f,k.CONFIRM),c.register(l.CANCEL,g,k.CANCEL);var m=function(a,c){"undefined"!=typeof c&&(j.define(c,[j.events.activate]),c.on(j.events.activate,function(b,c){a.show(),c.originalEvent.preventDefault()}),a.getRoot().on(b.hidden,function(){c.focus()}))},n=function(b,c,d){c=a(c);var e=b.module,f=new e(c);return m(f,d),f},o=function(b,c){var d=b.template;return h.render(d,{}).then(function(d){var e=a(d);return n(b,e,c)}).fail(i.exception)},p=function(a,b){var d=a.type||l.DEFAULT,e=!!a.large,f=null;return f=c.get(d),f||i.exception({message:"Unable to find modal of type: "+d}),o(f,b).then(function(b){return"undefined"!=typeof a.title&&b.setTitle(a.title),"undefined"!=typeof a.body&&b.setBody(a.body),"undefined"!=typeof a.footer&&b.setFooter(a.footer),e&&b.setLarge(),b})};return{create:p,types:l}});

1
lib/amd/build/modal_registry.min.js vendored Normal file
View File

@ -0,0 +1 @@
define(["core/notification"],function(a){var b={},c=function(a){return b[a]},d=function(d,e,f){c(d)&&a.exception({message:"Modal of type '"+d+"' is already registered"}),e&&"function"==typeof e||a.exception({message:"You must provide a modal module"}),f||a.exception({message:"You must provide a modal template"}),b[d]={module:e,template:f}};return{register:d,get:c}});

View File

@ -22,9 +22,11 @@
* @copyright 2016 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', 'core/modal_confirm', 'core/modal_cancel',
define(['jquery', 'core/modal_events', 'core/modal_registry', 'core/modal',
'core/modal_save_cancel', 'core/modal_confirm', 'core/modal_cancel',
'core/templates', 'core/notification', 'core/custom_interaction_events'],
function($, ModalEvents, Modal, ModalSaveCancel, ModalConfirm, ModalCancel, Templates, Notification, CustomEvents) {
function($, ModalEvents, ModalRegistry, Modal, ModalSaveCancel, ModalConfirm,
ModalCancel, Templates, Notification, CustomEvents) {
// The templates for each type of modal.
var TEMPLATES = {
@ -34,14 +36,6 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
CANCEL: 'core/modal_cancel',
};
// The JS classes for each type of modal.
var CLASSES = {
DEFAULT: Modal,
SAVE_CANCEL: ModalSaveCancel,
CONFIRM: ModalConfirm,
CANCEL: ModalCancel,
};
// The available types of modals.
var TYPES = {
DEFAULT: 'DEFAULT',
@ -50,6 +44,12 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
CANCEL: 'CANCEL',
};
// Register the common set of modals.
ModalRegistry.register(TYPES.DEFAULT, Modal, TEMPLATES.DEFAULT);
ModalRegistry.register(TYPES.SAVE_CANCEL, ModalSaveCancel, TEMPLATES.SAVE_CANCEL);
ModalRegistry.register(TYPES.CONFIRM, ModalConfirm, TEMPLATES.CONFIRM);
ModalRegistry.register(TYPES.CANCEL, ModalCancel, TEMPLATES.CANCEL);
/**
* Set up the events required to show the modal and return focus when the modal
* is closed.
@ -77,15 +77,15 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
* the trigger between the modal and the trigger element.
*
* @method createFromElement
* @param {string} type A modal type (see TYPES)
* @param {object} registryConf A config from the ModalRegistry
* @param {object} modalElement The modal HTML jQuery object
* @param {object} triggerElement The trigger HTML jQuery object
* @return {object} Modal instance
*/
var createFromElement = function(type, modalElement, triggerElement) {
var createFromElement = function(registryConf, modalElement, triggerElement) {
modalElement = $(modalElement);
var ClassName = CLASSES[type];
var modal = new ClassName(modalElement);
var module = registryConf.module;
var modal = new module(modalElement);
setUpTrigger(modal, triggerElement);
return modal;
@ -97,17 +97,17 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
* trigger element.
*
* @method createFromType
* @param {string} type A modal type (see TYPES)
* @param {object} registryConf A config from the ModalRegistry
* @param {object} triggerElement The trigger HTML jQuery object
* @return {promise} Resolved with a Modal instance
*/
var createFromType = function(type, triggerElement) {
var templateName = TEMPLATES[type];
var createFromType = function(registryConf, triggerElement) {
var templateName = registryConf.template;
return Templates.render(templateName, {})
.then(function(html) {
var modalElement = $(html);
return createFromElement(type, modalElement, triggerElement);
return createFromElement(registryConf, modalElement, triggerElement);
})
.fail(Notification.exception);
};
@ -123,12 +123,15 @@ define(['jquery', 'core/modal_events', 'core/modal', 'core/modal_save_cancel', '
var create = function(modalConfig, triggerElement) {
var type = modalConfig.type || TYPES.DEFAULT;
var isLarge = modalConfig.large ? true : false;
var registryConf = null;
if (!TYPES[type]) {
type = TYPES.DEFAULT;
registryConf = ModalRegistry.get(type);
if (!registryConf) {
Notification.exception({message: 'Unable to find modal of type: ' + type});
}
return createFromType(type, triggerElement)
return createFromType(registryConf, triggerElement)
.then(function(modal) {
if (typeof modalConfig.title != 'undefined') {
modal.setTitle(modalConfig.title);

View File

@ -0,0 +1,73 @@
// This file is part of Moodle - http://moodle.org/
//
// Moodle is free software: you can redistribute it and/or modify
// it under the terms of the GNU General Public License as published by
// the Free Software Foundation, either version 3 of the License, or
// (at your option) any later version.
//
// Moodle is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU General Public License for more details.
//
// You should have received a copy of the GNU General Public License
// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
/**
* A registry for the different types of modal.
*
* @module core/modal_registry
* @class modal_registry
* @package core
* @copyright 2016 Ryan Wyllie <ryan@moodle.com>
* @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
*/
define(['core/notification'], function(Notification) {
// A singleton registry for all modules to access. Allows types to be
// added at runtime.
var registry = {};
/**
* Get a registered type of modal.
*
* @method get
* @param {string} type The type of modal to get
* @return {object} The registered config for the modal
*/
var get = function(type) {
return registry[type];
};
/**
* Register a modal with the registry.
*
* @method register
* @param {string} type The type of modal (must be unique)
* @param {function} module The modal module (must be a constructor function of type core/modal)
* @param {string} template The template name of the modal
*/
var register = function(type, module, template) {
if (get(type)) {
Notification.exception({message: "Modal of type '" + type + "' is already registered"});
}
if (!module || typeof module !== 'function') {
Notification.exception({message: "You must provide a modal module"});
}
if (!template) {
Notification.exception({message: "You must provide a modal template"});
}
registry[type] = {
module: module,
template: template,
};
};
return {
register: register,
get: get,
};
});