MDL-51222 Javascript: Trigger events for filters on DOM insertion

When nodes are added to the dom, they may need to be re-processed by a JS based
filter. To do this we need to trigger the legacy YUI event filter-content-updated.

To make this easier I added some wrappers to template that will insert the node, run any
JS and trigger the event.

I also changed existing yui code to call the amd function to trigger the event. This way
all jquery and yui listeners will always be notified.
This commit is contained in:
Damyon Wiese 2015-08-27 17:15:17 +08:00
parent 74ede2d89a
commit 28de777199
17 changed files with 284 additions and 135 deletions

View file

@ -1 +1 @@
define(["jquery","core/ajax","core/log","core/notification","core/templates","core/config","core/str"],function(a,b,c,d,e,f,g){var h=function(a,b){var c="@template "+b,d=0,e=[];if(e=a.match(/{{!([\s\S]*?)}}/g),null!==e)for(d=0;d<e.length;d++){var f=e[d],g=f.indexOf(c);if(-1!==g){var h=g+c.length+1;return f=f.substr(h,f.length-2-h)}}return!1},i=function(b,f,i){g.get_string("templateselected","tool_templatelibrary",b).done(function(b){a('[data-region="displaytemplateheader"]').text(b)}).fail(d.exception);var j=h(f,b);j===!1&&(j=h(i,b)),j&&(f=j),a('[data-region="displaytemplatesource"]').text(f);var k=f.match(/Example context \(json\):([\s\S]*)/),l=!1;if(k){var m=k[1].trim();try{l=a.parseJSON(m)}catch(n){c.debug("Could not parse json example context for template."),c.debug(n)}}l?e.render(b,l).done(function(b,c){a('[data-region="displaytemplateexample"]').empty(),a('[data-region="displaytemplateexample"]').append(b),e.runTemplateJS(c)}).fail(d.exception):g.get_string("templatehasnoexample","tool_templatelibrary").done(function(b){a('[data-region="displaytemplateexample"]').text(b)}).fail(d.exception)},j=function(c){var e=c.split("/"),g=e.shift(),h=e.shift(),j=b.call([{methodname:"core_output_load_template",args:{component:g,template:h,themename:f.theme}},{methodname:"tool_templatelibrary_load_canonical_template",args:{component:g,template:h}}],!0,!1);a.when.apply(a,j).done(function(a,b){i(c,a,b)}).fail(d.exception)};return a('[data-region="list-templates"]').on("click","[data-templatename]",function(){var b=a(this).data("templatename");j(b)}),{}});
define(["jquery","core/ajax","core/log","core/notification","core/templates","core/config","core/str"],function(a,b,c,d,e,f,g){var h=function(a,b){var c="@template "+b,d=0,e=[];if(e=a.match(/{{!([\s\S]*?)}}/g),null!==e)for(d=0;d<e.length;d++){var f=e[d],g=f.indexOf(c);if(-1!==g){var h=g+c.length+1;return f=f.substr(h,f.length-2-h)}}return!1},i=function(b,f,i){g.get_string("templateselected","tool_templatelibrary",b).done(function(b){a('[data-region="displaytemplateheader"]').text(b)}).fail(d.exception);var j=h(f,b);j===!1&&(j=h(i,b)),j&&(f=j),a('[data-region="displaytemplatesource"]').text(f);var k=f.match(/Example context \(json\):([\s\S]*)/),l=!1;if(k){var m=k[1].trim();try{l=a.parseJSON(m)}catch(n){c.debug("Could not parse json example context for template."),c.debug(n)}}l?e.render(b,l).done(function(b,c){e.replaceNodeContents(a('[data-region="displaytemplateexample"]'),b,c)}).fail(d.exception):g.get_string("templatehasnoexample","tool_templatelibrary").done(function(b){a('[data-region="displaytemplateexample"]').text(b)}).fail(d.exception)},j=function(c){var e=c.split("/"),g=e.shift(),h=e.shift(),j=b.call([{methodname:"core_output_load_template",args:{component:g,template:h,themename:f.theme}},{methodname:"tool_templatelibrary_load_canonical_template",args:{component:g,template:h}}],!0,!1);a.when.apply(a,j).done(function(a,b){i(c,a,b)}).fail(d.exception)};return a('[data-region="list-templates"]').on("click","[data-templatename]",function(){var b=a(this).data("templatename");j(b)}),{}});

View file

@ -1 +1 @@
define(["jquery","core/ajax","core/log","core/notification","core/templates"],function(a,b,c,d,e){var f=function(b){e.render("tool_templatelibrary/search_results",{templates:b}).done(function(b){a('[data-region="searchresults"]').replaceWith(b)}).fail(d.exception)},g=function(){var c=a('[data-field="component"]').val(),e=a('[data-field="search"]').val();b.call([{methodname:"tool_templatelibrary_list_templates",args:{component:c,search:e},done:f,fail:d.exception}],!0,!1)},h=null,i=function(a,b){null!==h&&window.clearTimeout(h),h=window.setTimeout(function(){a(),h=null},b)},j=function(){i(g,400)};return a('[data-region="list-templates"]').on("change",'[data-field="component"]',j),a('[data-region="list-templates"]').on("input",'[data-field="search"]',j),g(),{}});
define(["jquery","core/ajax","core/log","core/notification","core/templates"],function(a,b,c,d,e){var f=function(b){e.render("tool_templatelibrary/search_results",{templates:b}).done(function(b,c){e.replaceNode(a('[data-region="searchresults"]'),b,c)}).fail(d.exception)},g=function(){var c=a('[data-field="component"]').val(),e=a('[data-field="search"]').val();b.call([{methodname:"tool_templatelibrary_list_templates",args:{component:c,search:e},done:f,fail:d.exception}],!0,!1)},h=null,i=function(a,b){null!==h&&window.clearTimeout(h),h=window.setTimeout(function(){a(),h=null},b)},j=function(){i(g,400)};return a('[data-region="list-templates"]').on("change",'[data-field="component"]',j),a('[data-region="list-templates"]').on("input",'[data-field="search"]',j),g(),{}});

View file

@ -99,9 +99,7 @@ define(['jquery', 'core/ajax', 'core/log', 'core/notification', 'core/templates'
}
if (context) {
templates.render(templateName, context).done(function(html, js) {
$('[data-region="displaytemplateexample"]').empty();
$('[data-region="displaytemplateexample"]').append(html);
templates.runTemplateJS(js);
templates.replaceNodeContents($('[data-region="displaytemplateexample"]'), html, js);
}).fail(notification.exception);
} else {
str.get_string('templatehasnoexample', 'tool_templatelibrary').done(function(s) {

View file

@ -32,8 +32,8 @@ define(['jquery', 'core/ajax', 'core/log', 'core/notification', 'core/templates'
*/
var reloadListTemplate = function(templateList) {
templates.render('tool_templatelibrary/search_results', { templates: templateList })
.done(function (result) {
$('[data-region="searchresults"]').replaceWith(result);
.done(function (result, js) {
templates.replaceNode($('[data-region="searchresults"]'), result, js);
}).fail(notification.exception);
};