☰

Something Awful Image Fixes

Smarter image handling on the Something Awful forums.

当前为 2015-05-16 提交的版本，查看 最新版本。

// ==UserScript==
// @name			Something Awful Image Fixes
// @namespace		SA
// @description		Smarter image handling on the Something Awful forums.
// @include			http://forums.somethingawful.com/*
// @version			1.1.2
// @grant			GM_openInTab
// @run-at			document-end
// @icon			http://forums.somethingawful.com/favicon.ico
// ==/UserScript==

var Util = {
	createImage: function(src) {
		var image = document.createElement('img');

		image.setAttribute('src', src);

		// Make sure the image is styled correctly:
		Util.setElementStyles(image);

		return image;
	},

	createVideo: function() {
		var video = document.createElement('video');

		// Set attributes to ensure gif style playback:
		video.setAttribute('preload', 'auto');
		video.setAttribute('autoplay', 'autoplay');
		video.setAttribute('muted', 'muted');
		video.setAttribute('loop', 'loop');
		video.setAttribute('webkit-playsinline', 'webkit-playsinline');

		// Make sure the video is styled correctly:
		Util.setElementStyles(video);

		// Add media sources:
		for (index in arguments) {
			var source = document.createElement('source');

			source.setAttribute('src', arguments[index][0]);
			source.setAttribute('type', arguments[index][1]);

			video.appendChild(source);
		}

		return video;
	},

	createImgur: function(src) {
		var bits = /\/(.{5}|.{7})[hls]?\.(jpg|png|gif)/i.exec(src);

		// Could not parse the image:
		if (bits) {
			var identity = bits[1],
				extension = bits[2].toLowerCase();

			// Is a video:
			if ('gif' === extension) {
				return Util.createVideo(
					['//i.imgur.com/' + identity + '.webm',	'video/webm'],
					['//i.imgur.com/' + identity + '.mp4',	'video/mp4']
				);
			}

			// Is an image:
			else {
				return Util.createLink(
					'//i.imgur.com/' + identity + '.' + extension,
					Util.createImage(
						'//i.imgur.com/' + identity + 'h.' + extension
					)
				);
			}
		}

		// The source was invalid:
		else {
			return Util.createEmpty();
		}
	},

	createFlickr: function(src) {
		var bits = /^(.+?\.com\/.+?\/.+?_.+?)(_[omstzb])?\.(.+?)$/.exec(src),
			location,
			extension;

		// Create an image:
		if (bits) {
			var location = bits[1],
				extension = bits[3].toLowerCase();

			return Util.createLink(
				location + '_b.' + extension,
				Util.createImage(
					location + '_b.' + extension
				)
			);
		}

		// The source was invalid:
		else {
			return Util.createEmpty();
		}
	},

	createLink: function(href, element) {
		var link = document.createElement('a');

		link.setAttribute('href', href);
		link.appendChild(element);

		return link;
	},

	createEmpty: function() {
		var span = document.createElement('span');

		span.setAttribute('data-saif-empty', 'yes');

		return span;
	},

	setElementStyles: function(element) {
		element.style.display = 'inline-block';
		element.style.marginBottom = '5px';
		element.style.marginTop = '5px';
		element.style.maxWidth = '100%';
	}
};

try {
	var forEach = Array.prototype.forEach;
	var posts = document.querySelectorAll('table.post'),
		images = document.querySelectorAll('td.postbody img');

	// Prevent images from loading:
	window.stop();

	// Redirect the page:
	if (document.querySelectorAll('meta[http-equiv=refresh]').length) {
		var rule = document.querySelectorAll('meta[http-equiv=refresh]')[0].getAttribute('content');

		if (/URL=(.+)$/.test(rule)) {
			window.location = /URL=(.+)$/.exec(rule)[1];
		}
	}

	// Remove content images:
	forEach.call(images, function(image) {
		var src = image.getAttribute('src');

		// Exclude smilies:
		if (!/somethingawful[.]com[/](images[/]smilies|forumsystem[/]emoticons)[/]/.test(src)) {
			var placeholder = document.createElement('span');

			placeholder.setAttribute('data-saif-src', src);

			image.parentNode.replaceChild(placeholder, image);
		}
	});

	// Reload all other images:
	forEach.call(document.querySelectorAll('img'), function(image) {
		image.parentNode.replaceChild(image.cloneNode(), image);
	});

	// Reload embedded videos:
	forEach.call(document.querySelectorAll('td.postbody iframe'), function(iframe) {
		iframe.parentNode.replaceChild(iframe.cloneNode(), iframe);
	});

	// Fix post table styles:
	forEach.call(posts, function(post) {
		post.style.tableLayout = 'fixed';
	});

	// Process images:
	forEach.call(document.querySelectorAll('[data-saif-src]'), function(placeholder) {
		var src = placeholder.getAttribute('data-saif-src');

		if (/i\.imgur\.com/.test(src)) {
			element = Util.createImgur(src);
		}

		else if (/staticflickr\.com\//.test(src)) {
			element = Util.createFlickr(src);
		}

		else {
			element = Util.createImage(src);
		}

		placeholder.parentNode.replaceChild(element, placeholder);
	});
}

catch (e) {
	console.log("Exception: " + e.name + " Message: " + e.message);
}