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.

// Written by User:Hellerhoff, 2011
/** Script for Template:Imagestack */

/*jshint curly:false, jquery:true */
var launch = function($c) {
	'use strict';

	var $imageStacks = $('div.ImageStack', $c);
	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).on('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.on('mousewheel', function(event, 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) {
			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 );