ÿØÿà JFIF    ÿÛ „  ( %"1!%)+...383,7(-.+  -+++--++++---+-+-----+---------------+---+-++7-----ÿÀ  ß â" ÿÄ     ÿÄ H    !1AQaq"‘¡2B±ÁÑð#R“Ò Tbr‚²á3csƒ’ÂñDS¢³$CÿÄ   ÿÄ %  !1AQa"23‘ÿÚ   ? ôÿ ¨pŸªáÿ —åYõõ\?àÒü©ŠÄï¨pŸªáÿ —åYõõ\?àÓü©ŠÄá 0Ÿªáÿ Ÿå[úƒ ú®ði~TÁbqÐ8OÕpÿ ƒOò¤Oè`–RÂáœá™êi€ßÉ< FtŸI“öÌ8úDf´°å}“¾œ6  öFá°y¥jñÇh†ˆ¢ã/ÃÐ:ªcÈ "Y¡ðÑl>ÿ ”ÏËte:qž\oäŠe÷󲍷˜HT4&ÿ ÓÐü6ö®¿øþßèô Ÿ•7Ñi’•j|“ñì>b…þS?*Óôÿ ÓÐü*h¥£ír¶ü UãS炟[AÐaè[ûª•õ&õj?†Éö+EzP—WeÒírJFt ‘BŒ†Ï‡%#tE Øz ¥OÛ«!1›üä±Í™%ºÍãö]°î(–:@<‹ŒÊö×òÆt¦ãº+‡¦%ÌÁ²h´OƒJŒtMÜ>ÀÜÊw3Y´•牋4ǍýʏTì>œú=Íwhyë,¾Ôò×õ¿ßÊa»«þˆѪQ|%6ž™A õ%:øj<>É—ÿ Å_ˆCbõ¥š±ý¯Ýƒï…¶|RëócÍf溪“t.СøTÿ *Ä¿-{†çàczůŽ_–^XþŒ±miB[X±d 1,é”zEù»& î9gœf™9Ð'.;—™i}!ôšåîqêÛ٤ёý£½ÆA–àôe"A$˝Úsäÿ ÷Û #°xŸëí(l »ý3—¥5m! rt`†0~'j2(]S¦¦kv,ÚÇ l¦øJA£Šƒ J3E8ÙiŽ:cÉžúeZ°€¯\®kÖ(79«Ž:¯X”¾³Š&¡* ….‰Ž(ÜíŸ2¥ª‡×Hi²TF¤ò[¨íÈRëÉ䢍mgÑ.Ÿ<öäS0í„ǹÁU´f#Vß;Õ–…P@3ío<ä-±»Ž.L|kªÀê›fÂ6@»eu‚|ÓaÞÆŸ…¨ááå>åŠ?cKü6ùTÍÆ”†sĤÚ;H2RÚ†õ\Ö·Ÿn'¾ ñ#ºI¤Å´%çÁ­‚â7›‹qT3Iï¨ÖÚ5I7Ë!ÅOóŸ¶øÝñØôת¦$Tcö‘[«Ö³šÒ';Aþ ¸èíg A2Z"i¸vdÄ÷.iõ®§)¿]¤À†–‡É&ä{V¶iŽ”.Ó×Õÿ û?h¬Mt–íª[ÿ Ñÿ ÌV(í}=ibÔ¡›¥¢±b Lô¥‡piη_Z<‡z§èŒ)iÖwiÇ 2hÙ3·=’d÷8éŽ1¦¸c¤µ€7›7Ø ð\á)} ¹fËí›pAÃL%âc2 í§æQz¿;T8sæ°qø)QFMð‰XŒÂ±N¢aF¨…8¯!U  Z©RÊ ÖPVÄÀÍin™Ì-GˆªÅËŠ›•zË}º±ŽÍFò¹}Uw×#ä5B¤{î}Ð<ÙD é©¤&‡ïDbàÁôMÁ.// 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 . /** * Custom Field interaction management for Moodle. * * @module core_customfield/form * @copyright 2018 Toni Barbera * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later */ import 'core/inplace_editable'; import {call as fetchMany} from 'core/ajax'; import { getString, getStrings, } from 'core/str'; import ModalForm from 'core_form/modalform'; import Notification from 'core/notification'; import Pending from 'core/pending'; import SortableList from 'core/sortable_list'; import Templates from 'core/templates'; import jQuery from 'jquery'; /** * Display confirmation dialogue * * @param {Number} id * @param {String} type * @param {String} component * @param {String} area * @param {Number} itemid */ const confirmDelete = (id, type, component, area, itemid) => { const pendingPromise = new Pending('core_customfield/form:confirmDelete'); getStrings([ {'key': 'confirm'}, {'key': 'confirmdelete' + type, component: 'core_customfield'}, {'key': 'yes'}, {'key': 'no'}, ]) .then(strings => { return Notification.confirm(strings[0], strings[1], strings[2], strings[3], function() { const pendingDeletePromise = new Pending('core_customfield/form:confirmDelete'); fetchMany([ { methodname: (type === 'field') ? 'core_customfield_delete_field' : 'core_customfield_delete_category', args: {id}, }, {methodname: 'core_customfield_reload_template', args: {component, area, itemid}} ])[1] .then(response => Templates.render('core_customfield/list', response)) .then((html, js) => Templates.replaceNode(jQuery('[data-region="list-page"]'), html, js)) .then(pendingDeletePromise.resolve) .catch(Notification.exception); }); }) .then(pendingPromise.resolve) .catch(Notification.exception); }; /** * Creates a new custom fields category with default name and updates the list * * @param {String} component * @param {String} area * @param {Number} itemid */ const createNewCategory = (component, area, itemid) => { const pendingPromise = new Pending('core_customfield/form:createNewCategory'); const promises = fetchMany([ {methodname: 'core_customfield_create_category', args: {component, area, itemid}}, {methodname: 'core_customfield_reload_template', args: {component, area, itemid}} ]); promises[1].then(response => Templates.render('core_customfield/list', response)) .then((html, js) => Templates.replaceNode(jQuery('[data-region="list-page"]'), html, js)) .then(() => pendingPromise.resolve()) .catch(Notification.exception); }; /** * Create new custom field * * @param {HTMLElement} element * @param {String} component * @param {String} area * @param {Number} itemid */ const createNewField = (element, component, area, itemid) => { const pendingPromise = new Pending('core_customfield/form:createNewField'); const returnFocus = element.closest(".action-menu").querySelector(".dropdown-toggle"); const form = new ModalForm({ formClass: "core_customfield\\field_config_form", args: { categoryid: element.getAttribute('data-categoryid'), type: element.getAttribute('data-type'), }, modalConfig: { title: getString('addingnewcustomfield', 'core_customfield', element.getAttribute('data-typename')), }, returnFocus, }); form.addEventListener(form.events.FORM_SUBMITTED, () => { const pendingCreatedPromise = new Pending('core_customfield/form:createdNewField'); const promises = fetchMany([ {methodname: 'core_customfield_reload_template', args: {component: component, area: area, itemid: itemid}} ]); promises[0].then(response => Templates.render('core_customfield/list', response)) .then((html, js) => Templates.replaceNode(jQuery('[data-region="list-page"]'), html, js)) .then(() => pendingCreatedPromise.resolve()) .catch(() => window.location.reload()); }); form.show(); pendingPromise.resolve(); }; /** * Edit custom field * * @param {HTMLElement} element * @param {String} component * @param {String} area * @param {Number} itemid */ const editField = (element, component, area, itemid) => { const pendingPromise = new Pending('core_customfield/form:editField'); const form = new ModalForm({ formClass: "core_customfield\\field_config_form", args: { id: element.getAttribute('data-id'), }, modalConfig: { title: getString('editingfield', 'core_customfield', element.getAttribute('data-name')), }, returnFocus: element, }); form.addEventListener(form.events.FORM_SUBMITTED, () => { const pendingCreatedPromise = new Pending('core_customfield/form:createdNewField'); const promises = fetchMany([ {methodname: 'core_customfield_reload_template', args: {component: component, area: area, itemid: itemid}} ]); promises[0].then(response => Templates.render('core_customfield/list', response)) .then((html, js) => Templates.replaceNode(jQuery('[data-region="list-page"]'), html, js)) .then(() => pendingCreatedPromise.resolve()) .catch(() => window.location.reload()); }); form.show(); pendingPromise.resolve(); }; /** * Fetch the category name from an inplace editable, given a child node of that field. * * @param {NodeElement} nodeElement * @returns {String} */ const getCategoryNameFor = nodeElement => nodeElement .closest('[data-category-id]') .find('[data-inplaceeditable][data-itemtype=category][data-component=core_customfield]') .attr('data-value'); const setupSortableLists = rootNode => { // Sort category. const sortCat = new SortableList( '#customfield_catlist .categorieslist', { moveHandlerSelector: '.movecategory [data-drag-type=move]', } ); sortCat.getElementName = nodeElement => Promise.resolve(getCategoryNameFor(nodeElement)); // Note: The sortable list currently uses jQuery events. jQuery('[data-category-id]').on(SortableList.EVENTS.DROP, (evt, info) => { if (info.positionChanged) { const pendingPromise = new Pending('core_customfield/form:categoryid:on:sortablelist-drop'); fetchMany([{ methodname: 'core_customfield_move_category', args: { id: info.element.data('category-id'), beforeid: info.targetNextElement.data('category-id') } }])[0] .then(pendingPromise.resolve) .catch(Notification.exception); } evt.stopPropagation(); // Important for nested lists to prevent multiple targets. }); // Sort fields. var sort = new SortableList( '#customfield_catlist .fieldslist tbody', { moveHandlerSelector: '.movefield [data-drag-type=move]', } ); sort.getDestinationName = (parentElement, afterElement) => { if (!afterElement.length) { return getString('totopofcategory', 'customfield', getCategoryNameFor(parentElement)); } else if (afterElement.attr('data-field-name')) { return getString('afterfield', 'customfield', afterElement.attr('data-field-name')); } else { return Promise.resolve(''); } }; jQuery('[data-field-name]').on(SortableList.EVENTS.DROP, (evt, info) => { if (info.positionChanged) { const pendingPromise = new Pending('core_customfield/form:fieldname:on:sortablelist-drop'); fetchMany([{ methodname: 'core_customfield_move_field', args: { id: info.element.data('field-id'), beforeid: info.targetNextElement.data('field-id'), categoryid: Number(info.targetList.closest('[data-category-id]').attr('data-category-id')) }, }])[0] .then(pendingPromise.resolve) .catch(Notification.exception); } evt.stopPropagation(); // Important for nested lists to prevent multiple targets. }); jQuery('[data-field-name]').on(SortableList.EVENTS.DRAG, evt => { var pendingPromise = new Pending('core_customfield/form:fieldname:on:sortablelist-drag'); evt.stopPropagation(); // Important for nested lists to prevent multiple targets. // Refreshing fields tables. Templates.render('core_customfield/nofields', {}) .then(html => { rootNode.querySelectorAll('.categorieslist > *') .forEach(category => { const fields = category.querySelectorAll('.field:not(.sortable-list-is-dragged)'); const noFields = category.querySelector('.nofields'); if (!fields.length && !noFields) { category.querySelector('tbody').innerHTML = html; } else if (fields.length && noFields) { noFields.remove(); } }); return; }) .then(pendingPromise.resolve) .catch(Notification.exception); }); jQuery('[data-category-id], [data-field-name]').on(SortableList.EVENTS.DRAGSTART, (evt, info) => { setTimeout(() => { jQuery('.sortable-list-is-dragged').width(info.element.width()); }, 501); }); }; /** * Initialise the custom fields manager. */ export const init = () => { const rootNode = document.querySelector('#customfield_catlist'); const component = rootNode.dataset.component; const area = rootNode.dataset.area; const itemid = rootNode.dataset.itemid; rootNode.addEventListener('click', e => { const roleHolder = e.target.closest('[data-role]'); if (!roleHolder) { return; } if (roleHolder.dataset.role === 'deletefield') { e.preventDefault(); confirmDelete(roleHolder.dataset.id, 'field', component, area, itemid); return; } if (roleHolder.dataset.role === 'deletecategory') { e.preventDefault(); confirmDelete(roleHolder.dataset.id, 'category', component, area, itemid); return; } if (roleHolder.dataset.role === 'addnewcategory') { e.preventDefault(); createNewCategory(component, area, itemid); return; } if (roleHolder.dataset.role === 'addfield') { e.preventDefault(); createNewField(roleHolder, component, area, itemid); return; } if (roleHolder.dataset.role === 'editfield') { e.preventDefault(); editField(roleHolder, component, area, itemid); return; } }); setupSortableLists(rootNode, component, area, itemid); };