abathur/include_photoset.js Secret

## include_photoset.js
/**
	NOTE: This code requires jQuery to work. As of this posting this can be done by
	including the following tag (or an updated one...) in the <head> of your theme:
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

	To include a photoset in a text post without having it appear alone on your blog
	you'll post the photoset as normal, but indicate that it's private. When you return
	to your stream, you'll see a link to share the post. Click share and copy the url
	it gives you. I'll refer to this url as SHARE_URL below.

	Then go make your text post, and where you'd like to insert the photoset, use a
	comment like this: <!--photoset: SHARE_URL/xxx-->

	The /xxx at the end of the URL indicates the size of your photoset, and you'll
	need to add it manually for now. The current options are 500, 250 and 100; most
	themes use the 250 and 500 options. Replace SHARE_URL with the link you copied
	in the first step. Finish making your post.

	You can include the script directly pasting it into your template just before
	the closing </body> tag.

	You should include the following in your custom CSS, though you may want to
	customize this behavior somewhat:
	.SmallPhotoSet, .html_photoset, .photoset{width:100%;overflow:hidden;background-color:transparent;border:0;}

	NOTE:
	If your theme uses infiniscrolling you may notice photosets after the initial
	load not being replaced by this script; you may need to add your own call to
	replace_private_photosets() after the infiniscroller has loaded a new page of
	results.
*/
<script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?896"></script>
<script type="text/javascript">
var replace_private_photosets = function()
{
	var photosets = $("*").not("iframe").contents().filter(function(){ return (this.nodeType == 8 && this.data.indexOf("photoset:") > -1);});
	photosets.each(function()
	{
		// step 1: get blog name and strip info from url
		//blog name has to come from the tumblr_controls iframe, it's the only point of access tumblr gives us.
		var blog_name = $("#tumblr_controls").attr("src").split("=").pop();
		var url_test = new RegExp(/http:\/\/([-A-z._0-9]+)\/private\/(\d+)\/([A-z0-9-]+)\/(tumblr_[A-z0-9-]+)\/(\d+)/);
		/*
		[0] is full url
		[1] is domain
		[2] is post id
		[3] is some sort of hash tumblr generates
		[4] is the size
		*/
		var url_parts = url_test.exec(this.data);
		if(url_parts && url_parts.length == 5 && blog_name)
		{
			// step 2: generate html
			var iframe_url = "http://"+url_parts[1]+"/post/"+url_parts[2]+"/photoset_iframe/"+blog_name+"/"+url_parts[3]+"/"+url_parts[4];
			var new_html = '<div class="SmallPhotoSet" style="width:100%;overflow:hidden;"><div id="photoset_'+url_parts[2]+'" class="html_photoset" style="width:100%;overflow:hidden;"><iframe class="photoset" style="width:100%;border:0px; background-color:transparent; overflow:hidden;" src="'+iframe_url+'"></iframe></div></div>';
			// step 3: replace the comment
			$(this).replaceWith(new_html);
		}
	});
};
replace_private_photosets();
</script>
	/**
	NOTE: This code requires jQuery to work. As of this posting this can be done by
	including the following tag (or an updated one...) in the <head> of your theme:
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

	To include a photoset in a text post without having it appear alone on your blog
	you'll post the photoset as normal, but indicate that it's private. When you return
	to your stream, you'll see a link to share the post. Click share and copy the url
	it gives you. I'll refer to this url as SHARE_URL below.

	Then go make your text post, and where you'd like to insert the photoset, use a
	comment like this: <!--photoset: SHARE_URL/xxx-->

	The /xxx at the end of the URL indicates the size of your photoset, and you'll
	need to add it manually for now. The current options are 500, 250 and 100; most
	themes use the 250 and 500 options. Replace SHARE_URL with the link you copied
	in the first step. Finish making your post.

	You can include the script directly pasting it into your template just before
	the closing </body> tag.

	You should include the following in your custom CSS, though you may want to
	customize this behavior somewhat:
	.SmallPhotoSet, .html_photoset, .photoset{width:100%;overflow:hidden;background-color:transparent;border:0;}

	NOTE:
	If your theme uses infiniscrolling you may notice photosets after the initial
	load not being replaced by this script; you may need to add your own call to
	replace_private_photosets() after the infiniscroller has loaded a new page of
	results.
	*/
	<script type="text/javascript" language="javascript" src="http://assets.tumblr.com/javascript/tumblelog.js?896"></script>
	<script type="text/javascript">
	var replace_private_photosets = function()
	{
	var photosets = $("*").not("iframe").contents().filter(function(){ return (this.nodeType == 8 && this.data.indexOf("photoset:") > -1);});
	photosets.each(function()
	{
	// step 1: get blog name and strip info from url
	//blog name has to come from the tumblr_controls iframe, it's the only point of access tumblr gives us.
	var blog_name = $("#tumblr_controls").attr("src").split("=").pop();
	var url_test = new RegExp(/http:\/\/([-A-z._0-9]+)\/private\/(\d+)\/([A-z0-9-]+)\/(tumblr_[A-z0-9-]+)\/(\d+)/);
	/*
	[0] is full url
	[1] is domain
	[2] is post id
	[3] is some sort of hash tumblr generates
	[4] is the size
	*/
	var url_parts = url_test.exec(this.data);
	if(url_parts && url_parts.length == 5 && blog_name)
	{
	// step 2: generate html
	var iframe_url = "http://"+url_parts[1]+"/post/"+url_parts[2]+"/photoset_iframe/"+blog_name+"/"+url_parts[3]+"/"+url_parts[4];
	var new_html = '<div class="SmallPhotoSet" style="width:100%;overflow:hidden;"><div id="photoset_'+url_parts[2]+'" class="html_photoset" style="width:100%;overflow:hidden;"><iframe class="photoset" style="width:100%;border:0px; background-color:transparent; overflow:hidden;" src="'+iframe_url+'"></iframe></div></div>';
	// step 3: replace the comment
	$(this).replaceWith(new_html);
	}
	});
	};
	replace_private_photosets();
	</script>