 |
You are not currently logged in. Are you accessing the unsecure (http) portal? Click here to switch to the secure portal. |
MediaWiki:Gadget-ImageStack.js
Jump to navigation
Jump to search
Note: After saving, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Clear the cache in Tools → Preferences
// Written by User:Hellerhoff, 2011
/** Skript for Template:Imagestack */
/*jshint curly:false, jquery:true */
jQuery( document ).ready(function() {
'use strict';
var $imageStacks = $('div.ImageStack');
if (0 === $imageStacks.length) return;
$('.ImageStack_JS_required').hide();
if (document.URL.match(/printable/g)) return;
var scrollobject = false; // flag for scroll-dragging
var mouse_y = 0;
$(document).bind('mouseup', function(event) {
var did_scroll = !scrollobject;
scrollobject = false; // unset flag
return did_scroll;
}); // bind mouseup
$imageStacks.each( function () {
var currentImage = 0, length, loop,
$images, $t, $counter, $leftLink,
$rightLink, $currentCount;
$t = $( this );
loop = $t.find('.ImageStack_loop').length ? true : false;
//Use when 1.17 final is in use
//loop = $t.attr('data-loop') == 'true' ? true : false; //Get loop prop
$images = $t.find('.ImageStackUnits div.center');
length = $images.length;
if ( !length ) return true;
$counter = $('<div class="ImageStackCounter">');
$leftLink = $('<a>', { href: '#', text : '< ' }).click( function() {
toggleImage ( -1, loop );
return false;
});
$rightLink = $('<a>', { href: '#', text : ' >' }).click( function() {
toggleImage ( 1, loop );
return false;
});
$currentCount = $('<span>', {'class' : 'ImageStackCounterCurrent', text: '0' });
$counter.append($leftLink, '(' , $currentCount, '/', length, ')', $rightLink);
$counter.addClass('center');
$t.prepend( $counter );
$leftLink.add( $rightLink ).css({ fontSize : "110%", fontweight : "bold" });
$images.bind('mousewheel', function( event, delta ) {
delta = Math.floor( delta );
if ( delta !== 0 ) toggleImage( -delta, loop );
return false;
});
$images.bind('mousedown', function( event ) { // prepare scroll by drag
mouse_y = event.screenY; // remember mouse-position
scrollobject = true; // set flag
return false;
});
$images.bind('mousemove', function( event ) {
if ( scrollobject && Math.abs( mouse_y - event.screenY ) > 10 ) {
var offset = (mouse_y < event.screenY) ? 1 : -1;
mouse_y = event.screenY; // remember mouse-position for next event
toggleImage ( offset, loop );
}
return false;
});
var toggleImage = function( offset, loop ) {
currentImage += offset; //add offset
$leftLink.show();
$rightLink.show();
if ( !loop ) {
if ( currentImage <= 0 ) {
currentImage = 0;
$leftLink.hide();
} else if ( currentImage >= $images.length -1 ) {
currentImage = $images.length - 1;
$rightLink.hide();
}
} else {
if ( currentImage < 0 ) currentImage = $images.length - 1;
if ( currentImage >= $images.length ) currentImage = 0;
}
$images.hide(); //Hide all
$images.eq( currentImage ).show();
$currentCount.text( currentImage + 1 );
};
toggleImage ( 0, loop );
});
});
// else {
// commentText = currentimage.getAttribute("title");
// comment = document.createElement("span").appendChild(document.createTextNode(commentText));
// currentimage.removeAttribute("title");
// }
// if(rightlink !== undefined) {
// rightlink.setAttribute("title", commentText);
// }
