mirror of
https://github.com/Universal-Omega/PortableInfobox.git
synced 2024-12-04 20:59:08 +00:00
553f4521a0
JavaScript for PortableInfoboxes MediaCollections and CollapislbeGroups initialization was executed once while loading the file - so it was working propery for most common case which is displaying article (the view page). However sometimes content is loaded dynamically, after JavaScript already loaded and executed, and for such cases intialization was not happening. In particular such case is loading article preview from within the Classic Editor. Problem is solved by using solid and common MW approach of MediaWiki JavaScript hooks - specifically one named 'wikipage.content' which is meant to be fired whenever wikipage (in any context) is being displayed.
47 lines
1.2 KiB
JavaScript
47 lines
1.2 KiB
JavaScript
(function (window, $) {
|
|
'use strict';
|
|
|
|
var ImageCollection = {
|
|
init: function($content) {
|
|
var $imageCollections = $content.find('.pi-image-collection');
|
|
|
|
$imageCollections.each( function( index, collection ) {
|
|
var $collection = $imageCollections.eq(index),
|
|
$tabs = $collection.find('ul.pi-image-collection-tabs li'),
|
|
$tabContent = $collection.find('.pi-image-collection-tab-content');
|
|
|
|
$tabs.click( function() {
|
|
var $target = $(this),
|
|
tabId = $target.attr('data-pi-tab');
|
|
|
|
$tabs.removeClass('current');
|
|
$tabContent.removeClass('current');
|
|
|
|
$target.addClass('current');
|
|
$collection.find('#' + tabId).addClass('current');
|
|
});
|
|
});
|
|
}
|
|
};
|
|
|
|
var CollapsibleGroup = {
|
|
init: function($content) {
|
|
var $collapsibleGroups = $content.find('.pi-collapse');
|
|
|
|
$collapsibleGroups.each( function( index, group ) {
|
|
var $group = $collapsibleGroups.eq(index),
|
|
$header = $group.find('.pi-header');
|
|
|
|
$header.click( function() {
|
|
$group.toggleClass('pi-collapse-closed');
|
|
});
|
|
});
|
|
}
|
|
};
|
|
|
|
mw.hook('wikipage.content').add(function($content) {
|
|
ImageCollection.init($content);
|
|
CollapsibleGroup.init($content);
|
|
});
|
|
})(window, jQuery);
|