Imgur Album Slideshow

Adds a menu to Imgur albums to start a slideshow

Ekde 2017/04/02. Vidu La ĝisdata versio.

You will need to install an extension such as Tampermonkey, Greasemonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install an extension such as Tampermonkey or Violentmonkey to install this script.

You will need to install an extension such as Tampermonkey or Userscripts to install this script.

You will need to install an extension such as Tampermonkey to install this script.

You will need to install a user script manager extension to install this script.

(I already have a user script manager, let me install it!)

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install an extension such as Stylus to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

You will need to install a user style manager extension to install this style.

(I already have a user style manager, let me install it!)

// ==UserScript==
// @name         Imgur Album Slideshow
// @version      v3.4
// @description  Adds a menu to Imgur albums to start a slideshow
// @author       Withaika
// @match        *://imgur.com/a/*
// @grant        none
// @require      http://code.jquery.com/jquery-1.12.4.min.js
// @require      http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js
// @namespace https://greasyfork.org/users/94615
// ==/UserScript==

(function() {
	$("#right-content").prepend("<div id='ssMenu' style='box-sizing: border-box;width: 300px;padding: 8px;background-color: #2c2f34;border-radius: 4px;height: 90px;'><center><p style='display:inline-block;padding-bottom:10px;'>Delay (s):</p><input value='3' style='display:inline-block;width:30px;margin-bottom:10px;'id='ssSec'></input></center><center><button id='ssStart' style='text-align: center;cursor: pointer;padding-left: 15px;height: 36px;box-sizing: border-box;padding-right: 15px;background: #5c69ff;border: none;color: #F2F2F2;text-decoration: none;outline: 0;-webkit-user-select: none;user-select: none;cursor: pointer; display: inline-block;border-radius: 2px;font-size: 14px;border: none;font-family: \"Open Sans\",sans-serif;'>Start Slideshow</button></center></div>");
})();

var slideIndex = 1;
var Images=[];

function plusDivs(n) {
	showDivs(slideIndex += n);
}

function showDivs(n) {
	var i;
	var x = Images;
	if (n > x.length) {slideIndex = 1;} 
	if (n < 1) {slideIndex = x.length;}
	document.getElementById("FSSI").src=x[slideIndex-1]; 
}

function startSlide(){
	var undefinedImages = _widgetFactory._.config.gallery.image.album_images;
	for (i=0;i<undefinedImages.length;i++){
		ext=undefinedImages[i].ext;
		hsh=undefinedImages[i].hash;
		Images.push("https://i.imgur.com/"+hsh+ext);
	}
	var delay = parseInt(document.getElementById("ssSec").value);
	var isPaused=false;
	$("body").append("<div class='post-container'></div>");
	$("body").append("<div id='FSS' style='display:none'><img id='FSSI' style='width:auto;height:100%' src=''></div>");
	$(document).keydown(function(e) {
		switch(e.which) {
			case 37: // left
				plusDivs(-1);
				break;
			case 38: // up
				delay--;
				break;
			case 39: // right
				plusDivs(1);
				break;
			case 40: // down
				delay++;
				break;
			case 32: // space
				if (isPaused){isPaused=false;}else{isPaused=true;}
				break;
			case 27: // escape
				FSTog(document.getElementById("FSSI"));
				isPaused=true;
				break;
			default: return;
		}
		e.preventDefault();
	});
	showDivs(slideIndex);
	document.getElementById("FSS").style.display="";
	FSTog(document.getElementById("FSSI"));
	window.setInterval(function(){
		if(!isPaused) {
			plusDivs(1);
		}
	}, delay*1000);
}

Element.prototype.remove = function() {
	this.parentElement.removeChild(this);
};
NodeList.prototype.remove = HTMLCollection.prototype.remove = function() {
	for(var i = this.length - 1; i >= 0; i--) {
		if(this[i] && this[i].parentElement) {
			this[i].parentElement.removeChild(this[i]);
		}
	}
};

function FSTog(element) {
	if (!element.fullscreenElement && !element.mozFullScreenElement && !element.webkitFullscreenElement && !element.msFullscreenElement ) {  // current working methods
		if (element.requestFullscreen) {
			element.requestFullscreen();
		} else if (element.msRequestFullscreen) {
			element.msRequestFullscreen();
		} else if (element.mozRequestFullScreen) {
			element.mozRequestFullScreen();
		} else if (element.webkitRequestFullscreen) {
			element.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
		}
	} else {
		if (element.exitFullscreen) {
			element.exitFullscreen();
		} else if (element.msExitFullscreen) {
			element.msExitFullscreen();
		} else if (element.mozCancelFullScreen) {
			element.mozCancelFullScreen();
		} else if (element.webkitExitFullscreen) {
			element.webkitExitFullscreen();
		}
	}
}

document.getElementById("ssStart").addEventListener("click", function(){
	startSlide();
});

function httpGet(theUrl, callback)
{
	var xmlHttp = new XMLHttpRequest();
	xmlHttp.onreadystatechange = function() { 
		if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
			callback(xmlHttp.responseText);
	};
	xmlHttp.open("GET", theUrl, true); // true for asynchronous 
	xmlHttp.send(null);
}