MediaWiki based online Tasks management for ingest tool
JSHTMLWidget Extension
JSHTMLWidget is an extension that allows the instantiation of a html widget and inclusion of dependent js/css files. Due to security reasons there are special directories where the html files are placed. Also the js and css files that are referenced from the resulting page need to reside in a special location (in order to prevent cross site scripting attacks).
Use of JSHTMLWidget
<JSHTMLWidget htmlbody="widget.html" jsincludes="file1.js|file2.js|..|filen.js" cssincludes="file1.css|file2.css|...|filen.css"> </JSHTMLWidget>
The above markup will be expanded in with the content of the “widget.html” file. Also the jsincludes files and cssinclude files will be referenced in the <head> section of the rendered page.
- Requirements
In order to be able to include the specified js and css files the $wgAllowUserJs and $wgAllowUserCss variables need to be set to the value “true” in the LocalSettings.php (or whatever configuration file is used).
TaskList Widget
The TaskList widget uses the JSHTMLWidget extension. The widget uses the following files:
- TaskMonitor/body.html – the html body of the widget.
- TaskMonitor/refresh.js – the js file that contains the js code that send AJAX requests to the server in order to update the status of the tasks;
- TaskMonitor/taskmonitor.css – contains css markup used by the html elements in the widget’s body;
- It also uses the JQuery library for DOM manipulation and JTemplates for manipulation of html templates in javascript.
TaskList widget periodically sends an AJAX request to the server to update the status of the tasks displayed in the page.
Use of TaskList widget
<JSHTMLWidget htmlbody="TaskMonitor/body.html" jsincludes="lib/jquery/jquery-1.3.1.js|lib/jTemplates/jquery-jtemplates_uncompressed.js|TaskMonitor/refresh.js" cssincludes="TaskMonitor/taskmonitor.css"></JSHTMLWidget>