MediaWiki:Gadget-ImageStack.js

Замечание: Возможно, после публикации вам придётся очистить кэш своего браузера, чтобы увидеть изменения.

• Firefox / Safari: Удерживая клавишу Shift, нажмите на панели инструментов Обновить либо нажмите Ctrl+F5 или Ctrl+R (⌘+R на Mac)
• Google Chrome: Нажмите Ctrl+Shift+R (⌘+Shift+R на Mac)
• Internet Explorer / Edge: Удерживая Ctrl, нажмите Обновить либо нажмите Ctrl+F5
• Opera: Нажмите Ctrl+F5.

jQuery( document ).ready(function() {

$(".ImageStack_JS_required").hide();

if (document.URL.match(/printable/g)) return;

var scrollobject = false;    // flag for scroll-dragging
var mouse_y = 0;

$(document).on('mouseup', function(event) {
  var did_scroll = !scrollobject;
  scrollobject = false;    // unset flag
  return did_scroll;
}); // bind mouseup



$("div.ImageStack").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 > *');
	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.on('mousewheel', function( event, delta ) {
        console.log(delta, Math.floor( delta ))
		delta =  Math.floor( delta );
		if ( delta != 0 ) toggleImage( -delta, loop );
		return false;
	});
	$images.on('mousedown', function( event ) {	// prepare scroll by drag
			mouse_y = event.screenY;	// remember mouse-position
			scrollobject = true;	// set flag
			return false;
	});
	$images.on('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 ) {
        console.log(currentImage, 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 );
});
});

mw.hook( 'wikipage.content' ).add( launch );