MediaWiki:Common.js

/* Any JavaScript here will be loaded for all users on every page load. */

        
$(function() {
	cDependent();
});

function cDependent(){
	if($('.mw-references-wrap').length > 0){
		$('.cdependent').show();
	}
}

/**
 * Creating a datatable
 * @example <>
 */

var selectors = [
    'table#listProjects',
];

var found = false;
for (var i = 0; i < selectors.length; i++) {
    if (document.querySelector(selectors[i])) {
        found = true;
        break;
    }
}

if (found === true) {
    const dtsource =
        'https://cdn.datatables.net/v/dt/moment-2.29.4/dt-2.3.7/b-3.2.6/b-colvis-3.2.6/b-html5-3.2.6/b-print-3.2.6/cc-1.2.0/date-1.6.3/fh-4.0.5/r-3.0.8/sc-2.4.3/sb-1.8.4/sp-2.3.5/sl-3.1.3/sr-1.4.3/datatables.min.css';

    if (!document.querySelector('link[href*="datatables.min.css"]')) {
        $('<link/>', { rel: 'stylesheet', href: dtsource }).appendTo('head');
    }

    $.ajaxSetup({ cache: true });

    $.when(
        mw.loader.getScript(
            'https://cdn.datatables.net/v/dt/moment-2.29.4/dt-2.3.7/b-3.2.6/b-colvis-3.2.6/b-html5-3.2.6/b-print-3.2.6/cc-1.2.0/date-1.6.3/fh-4.0.5/r-3.0.8/sc-2.4.3/sb-1.8.4/sp-2.3.5/sl-3.1.3/sr-1.4.3/datatables.min.js'
        )
    ).then(
        () => {
            window.datatablesLoaded = true;
            initDataTable();
        },
        e => mw.log.error(e.message) // Failed to load script
    );
}

function initDataTable() {

    var table = $('#listProjects').DataTable({
    	// dom: '<"top"lif>t<"bottom"p><"clear">',
    	// dom: 'Pfrtip',
    	dom: 'fQrtip',
		responsive: true,
		colReorder: true,
    	order: [[ 0, 'asc' ]],
    	columns: [
        	{ "title": "Film" },
        	{ "title": "Released" },
        	{ "title": "Studio" },
			{ "title": "Agency" },
			{ "title": "Project" },
			{ "title": "Type" },
			{ "title": "Asset" },
			{ "title": "Awards" },
		],
        aoColumns: [],
        lengthMenu: [
                [10, 25, 50, -1], [10, 25, 50, "All"]
        ],
        pageLength: 25,
        orderCellsTop: true,
        fixedHeader: true,
        searchBuilder: {
        	greyscale: true
    	},
        initComplete: function () {
        }
    });
}