MediaWiki:GalleryDetails-Tooltips.js
Jump to navigation
Jump to search
Note: After saving, you have to bypass your browser's cache to see the changes. Internet Explorer: press Ctrl-F5, Mozilla: hold down Shift while clicking Reload (or press Ctrl-Shift-R), Opera/Konqueror: press F5, Safari: hold down Shift + Alt while clicking Reload, Chrome: hold down Shift while clicking Reload.
 |
Documentation for this user script can be added at MediaWiki:GalleryDetails-Tooltips. |
- Report page listing warnings and errors.
// <source lang="javascript">
/*
A popup viewer for [[MediaWiki:Gadget-GalleryDetails.js]].
Author: [[User:Lupo]], January 2009
License: Quadruple licensed GFDL, GPL, LGPL and Creative Commons Attribution 3.0 (CC-BY-3.0)
*/
if (typeof (GalleryDetails) != 'undefined'
&& typeof (GalleryDetailsPopupViewer) == 'undefined')
{
importScript ('MediaWiki:Tooltips.js');
importScript ('MediaWiki:ImageLinks.js');
var GalleryDetailsPopupViewer = function () {};
GalleryDetailsPopupViewer.prototype = new GalleryDetailsViewer;
GalleryDetailsPopupViewer.button = null;
GalleryDetailsPopupViewer.button_img_url =
'//upload.wikimedia.org/wikipedia/commons/thumb/b/b4/Gtk-dialog-info.svg/16px-Gtk-dialog-info.svg.png';
GalleryDetailsPopupViewer.closer = null;
GalleryDetailsPopupViewer.close_img_url =
'//upload.wikimedia.org/wikipedia/commons/thumb/3/35/Button_normal.svg/14px-Button_normal.svg.png';
GalleryDetailsPopupViewer.tooltip_styles =
{ border : '1px solid #8888aa'
, backgroundColor : '#f7f8ff'
, padding : '0.3em'
, fontSize : ((skin && (skin == 'monobook' || skin == 'modern')) ? '127%' : '100%')
// Scale up to default text size
};
GalleryDetailsPopupViewer.prototype.display =
function (model)
{
if (!GalleryDetailsPopupViewer.button) {
// Create button class
var img = document.createElement ('img');
img.src = GalleryDetailsPopupViewer.button_img_url;
img.width = '16';
img.height = '16';
GalleryDetailsPopupViewer.button = Buttons.createClass ([img], 'gallery_details_button');
img = document.createElement ('img');
img.src = GalleryDetailsPopupViewer.close_img_url;
img.width = '14';
img.height = '14';
GalleryDetailsPopupViewer.closer = img;
}
for (var i = 0; i < model.nof_images; i++) {
var existing = model.image_list[i];
var details = this.check_info (existing);
if (details) continue; // No info...
details = this.create_details_box (existing);
var page_content = this.create_page_box (existing) || document.createTextNode ('No info found.');
var tbl = document.createElement ('table');
tbl.className = 'gallery_details';
// Create a table header with a small thumbnail at the left and the upload comment on the
// right
var tr = tbl.insertRow (-1);
var td = document.createElement ('td');
var imgs = existing.box.getElementsByTagName ('img');
var img = null;
for (var j = 0; j < imgs.length; j++) {
if ( imgs[j].parentNode.nodeName.toLowerCase () == 'a'
&& imgs[j].parentNode.className == 'image') {
// It's our thumbnail, I guess...
img = imgs[j]; break;
}
}
if (img) {
var w = img.width;
var h = img.height;
if (!w || !h) {
if (existing.page && existing.page.imageinfo && existing.page.imageinfo.length > 0) {
w = existing.page.imageinfo[0].width;
h = existing.page.imageinfo[0].height;
}
}
if (!w) w = img.offsetWidth;
if (!h) h = img.offsetHeight;
if (!h) h = w;
// Scale down to 90px maximum of width or height
var new_w = 0;
var new_h = 0;
if (w >= h) {
new_w = 90; new_h = Math.ceil (h * 90 / w);
} else {
new_w = Math.ceil (w * 90 / h); new_h = 90;
}
var url = img.src;
img = document.createElement ('img');
img.src = url;
img.width = "" + new_w;
img.height = "" + new_h;
var img_lk = document.createElement ('a');
img_lk.appendChild (img);
img_lk.href = mw.config.get('wgServer')
+ wgArticlePath.replace ('$1', 'File:' + encodeURI (existing.name));
img_lk.title = existing.name;
img_lk.className = 'image';
var inner_tbl = document.createElement ('table');
var inner_tr = inner_tbl.insertRow (-1);
var inner_td = document.createElement ('td');
inner_td.width = '100';
inner_td.vAlign = 'center';
inner_td.align = 'center';
inner_td.appendChild (img_lk);
inner_tr.appendChild (inner_td);
inner_td = document.createElement ('td');
var idiv = document.createElement ('div');
idiv.style.padding = "5px";
idiv.style.fontSize = "8pt";
idiv.style.lineHeight = "9pt";
idiv.appendChild (document.createTextNode ('Upload summary: '));
var italics = document.createElement ('em');
italics.appendChild (document.createTextNode (existing.page.imageinfo[0].comment));
idiv.appendChild (italics);
inner_td.appendChild (idiv);
inner_tr.appendChild (inner_td);
inner_tbl.width = '100%';
td.colSpan = '2';
td.appendChild (inner_tbl);
tr.appendChild (td);
tr = tbl.insertRow (-1);
td = document.createElement ('td');
}
// Put the details and the page info below, side by side
td.appendChild (details);
tr.appendChild (td);
td = document.createElement ('td');
td.appendChild (page_content);
tr.appendChild (td);
// Put the whole thing into a div
var ndiv = document.createElement ('div');
ndiv.appendChild (tbl);
// Give the image thumb a colored border
var thumb = getElementsByClassName (existing.box, 'a', 'image');
if (thumb && thumb.length > 0) {
thumb[0].firstChild.style.border = '2px solid '
+ (existing.status == GalleryDetails.BAD_FILE
? 'red'
: (existing.status == GalleryDetails.GOOD_FILE ? 'green' : 'yellow')
);
}
if ( existing.status != GalleryDetails.BAD_FILE
&& existing.page && existing.page.imageinfo && existing.page.imageinfo.length > 0)
{
var w = existing.page.imageinfo[0].width;
var h = existing.page.imageinfo[0].height;
var s = existing.page.imageinfo[0].size;
if ((w < 600 && h < 600 && w > 0 && h > 0 || s < 50000) && /\.jpe?g$/.test (existing.name)) {
// Mark small jpg files, even if license appears to be fine.
existing.box.style.background = 'pink';
}
}
// Create and insert the button
var button = Buttons.makeButton (GalleryDetailsPopupViewer.button, model.wrapper.id + '_button' + i, '#');
button.style.position = 'absolute';
button.style.top = '0px';
button.style.left = '0px';
var thumbbox = getElementsByClassName (existing.box, 'div', 'thumb');
if (thumbbox && thumbbox.length > 0)
thumbbox = thumbbox[0];
else if (thumb && thumb.length > 0) {
// Put a div around the image and its link
thumbbox = document.createElement ('div');
var parent = thumb[0].parentNode;
var before = thumb[0].nextSibling;
thumbbox.appendChild (thumb[0]);
parent.insertBefore (thumbbox, before);
var exif_data = this.get_exif_data (existing);
if (exif_data && exif_data.length > 0) {
if ( thumbbox.parentNode.nodeName.toLowerCase () == 'td'
&& thumbbox.parentNode.nextSibling.nodeName.toLowerCase () == 'td'
) {
for (var k = 0; k < exif_data.length; k++) {
thumbbox.parentNode.nextSibling.appendChild (document.createTextNode (' '));
thumbbox.parentNode.nextSibling.appendChild (exif_data[k]);
}
}
}
} else
thumbbox = null;
if (thumbbox) {
thumbbox.style.position = 'relative';
thumbbox.appendChild (button);
// Now attach the tooltip
var tooltip =
new Tooltip
( button
, ndiv
, { activate : Tooltip.CLICK
,deactivate : Tooltip.CLICK_ELEM
,close_button : GalleryDetailsPopupViewer.closer
,mode : Tooltip.MOUSE
,fixed_offset : {x:10, y: -10}
,open_delay : 0
,hide_delay : 0
}
, GalleryDetailsPopupViewer.tooltip_styles
);
}
}
};
GalleryDetailsPopupViewer.prototype.toggle =
function (model)
{
// No-op
};
// Redefine the factory method
GalleryDetailsLoader.getViewer =
function ()
{
return new GalleryDetailsPopupViewer ();
};
} // end if (guard)
// </source>