Userscripts.org

There are 6 previous versions of this script.

// ==UserScript==
// @name           Flickr Large Embed
// @namespace      flickr.com
// @include        http://*flickr.com/*
// @include        https://*flickr.com/*
// ==/UserScript==


var $;

// Add jQuery
(function(){
	if (typeof unsafeWindow.jQuery == 'undefined') {
		var GM_Head = document.getElementsByTagName('head')[0] || document.documentElement,
			GM_JQ = document.createElement('script');

		GM_JQ.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js';
		GM_JQ.type = 'text/javascript';
		GM_JQ.async = true;

		GM_Head.insertBefore(GM_JQ, GM_Head.firstChild);
	}
	GM_wait();
})();

// Check if jQuery's loaded
function GM_wait() {
	if (typeof unsafeWindow.jQuery == 'undefined') {
		window.setTimeout(GM_wait, 100);
	} else {
		$ = unsafeWindow.jQuery.noConflict(true);
		letsJQuery();
	}
}

// All your GM code must be inside this function
function letsJQuery() {

	// If there's a photo-div, we're on the photo page
	if( $('.photo-div').html() != null )
	{
		// Get the photo ID
        var photoId = '';
        $("input[name^='photo']").each(function (index, domEle) {
            photoId = domEle.value;
        });
        
		var embedId = 'EMBED_' + photoId;

		// Create the textarea for the code
		var linkText = '<h4>Embed code</h4><div><input type="text" name="textfield" onFocus="this.select();" style="width:400px;" id="' + embedId + '" value="Loading"</></div><br />';		
		$('#photo').prepend( linkText );	
				
		// Get the sizes from the API
		getApiData( photoId, embedId );
	}

	// If there are StreamView divs, we're on the stream page
	if( $('.StreamView').html() != null )
	{	
		// The process is the same for each image in the page
		$("div[id^='photo_']").each(function (index, domEle) {

			// Get the photo id		
			var photoId = domEle.id.replace( 'photo_', '' );
			var embedId = 'EMBED_' + photoId;
	
			// Add EMBED input field
			var linkText = '<div><input type="text" name="textfield" onFocus="this.select();" style="width:200px;" id="' + embedId + '" value="Loading"</></div><br />';	
			$(this).append( linkText );

			// Get the sizes from the API
			getApiData( photoId, embedId );
      		 });
	}
	return true;
}

// Use the flickr API to get the dimensions and the URL of the large version of the current image
function getApiData( photoId, embedId )
{
	var jsonQuery = 'http://api.flickr.com/services/rest/?method=flickr.photos.getSizes&api_key=3dd3428e4e8826aea45ff3a49adee19a&photo_id=' + photoId + '&format=json&jsoncallback=?';
	
	var largeUrl = "";
	var mediumWidth = "";
	var mediumHeight = "";
	var mediumUrl = "";

	$.getJSON( jsonQuery, function( data ){
		// If sizes are returned, use them to feed the embed code
		$.each( data.sizes.size, function( i, item ){
			 
			if( item.label == 'Medium 640' )
			{
				mediumUrl = item.source;
				mediumWidth = item.width;
				mediumHeight = item.height;
			}
			if( item.label == 'Large' )
			{
				largeUrl = item.source;
				generateEmbedCode( embedId, largeUrl, mediumUrl, mediumWidth, mediumHeight );
			}
			

		});
		
	});

}

// Generate the content of the Embed input field
// Limit the width to 800px and the height to 640px
function generateEmbedCode( embedId, largeSrc, mediumSrc, width, height )
{
	width = parseInt( width );
	height = parseInt( height );

	// Make 800px the maximum width
	if( width > height && width > 800 )
	{ 
		width = ' width="800" ';
		height = ' ';
	}
	else
	{
		if( height > width && height > 640 )
		{ 
			// Make 640px the maximum height
			height = ' height="640" ';
			width = ' ';
		}
		else
		{
			width = ' width="' + width + '" ';
			height = ' height="' + height + '" ';
		}
	}

	var embedCode = '<a href="' + largeSrc + '" target="_blank" border="0"><img src="' + mediumSrc + '" ' + width + ' ' + height + ' border="0"/></a>';	

	$('#'+embedId).val( embedCode );	
}