Flickr Large Embed

Based on 'Flickr Original Link' (https://greasyfork.org/en/scripts/3135-flickr-original-link-beta). Adds an 'Embed' field containing HTML code for each photo.

目前為 2014-11-28 提交的版本,檢視 最新版本

// ==UserScript==
// @name        Flickr Large Embed
// @namespace   https://greasyfork.org/en/users/3901-ellouis
// @description Based on 'Flickr Original Link' (https://greasyfork.org/en/scripts/3135-flickr-original-link-beta). Adds an 'Embed' field containing HTML code for each photo. 
// @include     /^https?:\/\/.*\.?flickr\.com\/photos\/.*/
// @version     2014-11-27
// @grant       GM_getValue
// @grant       GM_setValue
// @require 	http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js
// ==/UserScript==
//

// TODO: 
// improve onclick	
// figure out how to refresh when navigating to previous/next on the photo page
// style embed (opacity?)

var source = "";

/*
 * support function
 */

function action_singlephoto() 
{
    var size = document.documentElement.innerHTML.match(/"sizes":{(.+?})}/i);

    var mWidth, mHeight, mLink, mSize, length;
    var strCss = ".bigButton {display : inline-block; cursor : pointer; border-style : solid; border-width : 2px; border-radius : 50px; padding : 15px 15px; font-size : 10pt; font-weight : bold;} .smallButton { display: inline-block; padding: 0.6em; margin: 0.4em; background-color: pink; border-radius:1.5em;font-size:10pt}";
    $('head').append('<style>' + strCss + '</style>');
    mSize = size[0].match(/"width":"?\d+"?,"height":"?\d+"?,/ig);
    mLink = size[0].match(/"url":"[^"]+"/ig);
    length = mLink.length;

	var embedSize = 0;
	var linkSize = 0;
    for (var k = 0; k < length; k++) {

		var myArray = mSize[k].match(/:\w+,/g);
		var width = parseInt(myArray[0].replace(':','').replace(',',''));
		var height = parseInt(myArray[1].replace(':','').replace(',',''));

		mSize[k] = mSize[k].replace(/"width":(\d+),"height":(\d+),/i, "$1 x $2");
		mLink[k] = "http:" + mLink[k].replace(/"url":"([^"]+)"/i, "$1").replace(/\\/g, "");

		if (embedSize == 0 && (width >= 800 || height >= 600) ) {
			embedSize = k;
		}
		
		if (linkSize == 0 && (width >= 2048 || height >= 1024) ) {
			linkSize = k;
		}
		
		if (embedSize == 0 && k == length-1) {
			embedSize = k;
		}
		if (linkSize == 0 && k == length-1) {
			linkSize = k;
		}
    }

	var embedCode = '<a href="' + mLink[linkSize] + '" target="_blank" border="0"><img src="' + mLink[embedSize] + '" border="0"/></a>';	

    var insertLocation = $('.sub-photo-right-row1');
    if (insertLocation.length > 0) {
		insertLocation.append('<div style="color: black; display:block;">Embed <input type="text" name="textfield" onFocus="this.select();" style="width:350px;" id="EMBED" value="Loading"/></div>');
		$('#EMBED').val(embedCode);
    }
}

function action_photostream() 
{
	source = document.documentElement.innerHTML.match(/"sizes":.*?}}/g);

    if (source == null) {
		console.log('err: no source');
		
		return false;
    }
    var t1 = $('a[data-track="prev"]').attr('href');
    if (t1 != null) {
		var t2 = $('span.this-page').text();
		t1 = t1.replace(/\/page\d+\//i, "/page" + t2 + "/");
		var $div = $('<div>');
		$div.load(t1, function() {
			var source2 = $(this).text().match(/"sizes":.*?}}/g);

			source = source.concat(source2);
		});
    }
    var target = $('body')[0];
    var config = {
		childList : true,
		subtree : true,
    };
    var observer = new MutationObserver(function(mutations, ob) {
		console.log("Mutation occurred");
		if ($('.myFuckingLink').filter(':first').length > 0) {
			console.log("Download link existed");
			
			return false;
		}
		var photoDisplayItem = $('.photo-display-item');
		console.time('Insert links');
		$('.myFuckingLink').remove();
		photoDisplayItem.each(showLink);
		console.timeEnd('Insert links');
    });
    observer.observe(target, config);
}

function pageType() 
{
    var title = $('head title').text();
    var type = "none";
    if (title.match(/flickr.+photostream/i) != null) type = 'photostream';
    else if (title.match(/an album on flickr/i) != null) type = 'photostream';
    else if (title.match(/flickr - photo sharing/i) != null) type = 'singlephoto';
    else if (title.match(/favorite photos and videos/i) != null) type = 'favorite';
	else if (title.match(/from the people you follow/i)!=null) type = 'favorite';
    // else if (document.URL.match(/flickr\.com\/groups\//i) != null) type = 'favorite';
    else if (title.match(/flickr.+pool$/i) != null) type = 'favorite';
    console.log("page type " + type);

    return type;
}

function showLink(index, elem) 
{
    var $e = $(elem);
    var photoId = $e.attr('data-photo-id');
	$e.find('.attribution-block').append('<div class="myFuckingLink" style="color: white; display:block;">Embed <input type="text" name="textfield" onFocus="this.select();" style="width:100px;" id="EMBED_' + photoId + '" value="Loading"/></div>');

	var embedUrl = false;
	var linkUrl = false;
	var currentEmbedWidth = 100000;
	var currentEmbedHeight = 100000;
	var currentLinkWidth = 100000;
	var currentLinkHeight = 100000;
	var maxWidth = 0;
	var maxHeight = 0;
	var maxUrl = false;

    for (var i = 0; i < source.length; i++) {

		if (source[i].indexOf(photoId) == 40) {

			var sizes = JSON.parse('{'+source[i]+'}');
			
			$.each(sizes.sizes, function( index, size ) {
			
				var width = parseInt(size.width);
				var height = parseInt(size.height);

				if ((width >= 800 || height >= 600) && width < currentEmbedWidth && height < currentEmbedHeight) {
					embedUrl = size.url;
					currentEmbedHeight = height;
					currentEmbedWidth = width;
				}
							
				if ((width >= 2048 || height >= 1024) && width < currentLinkWidth && height < currentLinkHeight ) {
					linkUrl = size.url;
					currentLinkHeight = height;
					currentLinkWidth = width;
				}
							
				if (width > maxWidth && height > maxHeight) {
					maxWidth = width;
					maxHeight = height;
					maxUrl = size.url;
				}

			});

			if (!linkUrl) {
				linkUrl = maxUrl;
			}
			if (!embedUrl) {
				embedUrl = maxUrl;
			}

			if (linkUrl && embedUrl) {
				var embedCode = '<a href="' + linkUrl + '" target="_blank" border="0"><img src="' + embedUrl + '" border="0"/></a>';	
				$('#EMBED_'+photoId).val(embedCode);
			}				
		}
	}
}

/*
 * end support
 */
var type = pageType();

if (type == 'photostream') {
	action_photostream();
} else if (type == 'singlephoto') {
	action_singlephoto();
}