SiG Poster View

SiG Movie Posters

Create movie posters view on movies page
目前為 2016-11-28 提交的版本，檢視最新版本。
安裝腳本 ?
Wrap lines
// ==UserScript==
// @name         SiG Movie Posters
// @namespace    SoItGoes
// @version      0.1
// @description  Create movie posters view on movies page
// @author       cykage
// @match        https://soitgo.es/?c=Movies*
// @grant        GM_setValue
// @grant        GM_getValue
// ==/UserScript==

(function() {
    'use strict';
	//add toggle to middle bar
	var toggle = document.createElement('div');
	toggle.style.display = "inline-block";
	toggle.innerHTML = '<a><button id="poster-button">Poster Mode</button></a>';

	var middlebar = document.querySelector('#middlebar');
	var rightButtons = middlebar.childNodes[4];
	middlebar.insertBefore(toggle, rightButtons);
	
	
	if (GM_getValue('postersEnabled') === undefined) {
		GM_setValue('postersEnabled', false);
	} else if (GM_getValue('postersEnabled') === true) {
		document.querySelector('#poster-button').setAttribute('style', 'color: white !important');
		showPosters();
	}
	
	
	toggle.addEventListener('click', function() {
		if (!GM_getValue('postersEnabled')) {
			showPosters();
			GM_setValue('postersEnabled', true);
			document.querySelector('#poster-button').setAttribute('style', 'color: white !important');
		} else {
			//remove posters, bring back table
			document.querySelector('#poster-container').remove();
			document.querySelector('#links').style.display='block';
			document.querySelector('#poster-button').setAttribute('style', 'color: black !important');
			GM_setValue('postersEnabled', false);
		}
	});
	

	function showPosters(addedLinks=0) {
		//if Load More is clicked, addedLinks will be the list of the new links
		var posters = [];
		var links = document.querySelector('#links');
		var movies = addedLinks || document.querySelectorAll('.row.Movies');
		for (var movie of movies) {
			var img = movie.querySelector('img');
			var resTags = movie.querySelector('.tags').innerText;
			var sigLink = movie.querySelectorAll('a')[1].href;
			if (img) {
				var src = img.src;
				var res;
				if ( resTags.includes('720P') ) {
					res = '720P';
				} else if ( resTags.includes('1080P') ) {
					res = '1080P';
				} else {
					res = 'SD';
				}
				posters.push( {'src': src, 'res': res, 'link': sigLink} );
			}
		}
		
		//hide link table, create container and posters
		links.style.display = 'none';

		var posterContainer = document.createElement('div');
		posterContainer.setAttribute('id', 'poster-container');
		posterContainer.setAttribute('style','display:flex; justify-content: space-around; -webkit-flex-flow: row wrap');
		posterContainer.setAttribute('class', 'sixteen columns');
		
		var mainContainer = document.querySelector('#mainpage');
		
		if (addedLinks === 0) {
			//if Load More wasn't clicked, create new container
			mainContainer.insertBefore(posterContainer, links);
			
		} else {
			//if Load More was clicked, use existing container
			posterContainer = document.querySelector('#poster-container');
		}

		for (var poster of posters) {
			var posterImg = document.createElement('div');

			posterImg.innerHTML = (`
			<div style="padding:10px; position: relative">
				<a href="${poster.link}"><img style="width: 100%" src="${poster.src}" /></a>
				<span style="
					position: absolute; 
					top: 10px; 
					left: 10px;  
					color: white !important; 
					font: bold 12px/16px Helvetica, Sans-Serif; 
					letter-spacing: -1px;  
					background: rgb(0, 0, 0); /* fallback color */
					background: rgba(0, 0, 0, 0.4);
					padding: 3px; ">
					${poster.res}
				</span>
			</div>`);
			posterImg.style.width = "150px";
			posterContainer.appendChild(posterImg);
		}
	}
	
	//watch for new links added with Load More and add new divs to poster container
    var linkTable = document.querySelector('#links');
    var observer = new MutationObserver(function(mutations) {
        mutations.forEach(function(mutation) {
			if (GM_getValue('postersEnabled')) {
				showPosters(mutation.addedNodes);
			}
        });
    });

    observer.observe(linkTable, {childList: true });


})();
欢迎访问Greasy Fork镜像
