writefreely/templates/collection.tmpl

{{define "collection"}}<!DOCTYPE HTML>
<html {{if .Language}}lang="{{.Language}}"{{end}} dir="{{.Direction}}">
	<head>
		<meta charset="utf-8">

		<title>{{.DisplayTitle}}{{if not .SingleUser}} &mdash; {{.SiteName}}{{end}}</title>
		
		<link rel="stylesheet" type="text/css" href="/css/write.css" />
		<link rel="shortcut icon" href="/favicon.ico" />
		<link rel="canonical" href="{{.CanonicalURL}}">
		{{if gt .CurrentPage 1}}<link rel="prev" href="{{.PrevPageURL .Prefix .CurrentPage .IsTopLevel}}">{{end}}
		{{if lt .CurrentPage .TotalPages}}<link rel="next" href="{{.NextPageURL .Prefix .CurrentPage .IsTopLevel}}">{{end}}
		{{if not .IsPrivate}}<link rel="alternate" type="application/rss+xml" title="{{.DisplayTitle}} &raquo; Feed" href="{{.CanonicalURL}}feed/" />{{end}}
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />

		<meta name="generator" content="WriteFreely">
		<meta name="description" content="{{.Description}}">
		<meta itemprop="name" content="{{.DisplayTitle}}">
		<meta itemprop="description" content="{{.Description}}">
		<meta name="twitter:card" content="summary">
		<meta name="twitter:title" content="{{.DisplayTitle}}">
		<meta name="twitter:image" content="{{.AvatarURL}}">
		<meta name="twitter:description" content="{{.Description}}">
		<meta property="og:title" content="{{.DisplayTitle}}" />
		<meta property="og:site_name" content="{{.DisplayTitle}}" />
		<meta property="og:type" content="article" />
		<meta property="og:url" content="{{.CanonicalURL}}" />
		<meta property="og:description" content="{{.Description}}" />
		<meta property="og:image" content="{{.AvatarURL}}">
		{{if .StyleSheet}}<style type="text/css">{{.StyleSheetDisplay}}</style>{{end}}

		{{if .RenderMathJax}}
		  <!-- Add mathjax logic -->
		  {{template "mathjax" .}}
		{{end}}

		<!-- Add highlighting logic -->
		{{template "highlighting" . }}

	</head>
	<body id="collection" itemscope itemtype="http://schema.org/WebPage">
		{{if or .IsOwner .SingleUser}}<nav id="manage"><ul>
			<li><a onclick="void(0)">&#9776; Menu</a>
				<ul>
					{{ if .IsOwner }}
					{{if .SingleUser}}
					<li><a href="/me/new">New Post</a></li>
					{{else}}
					<li><a href="/#{{.Alias}}" class="write">{{.SiteName}}</a></li>
					{{end}}
					{{if .SimpleNav}}<li><a href="/new#{{.Alias}}">New Post</a></li>{{end}}
					<li><a href="/me/c/{{.Alias}}">Customize</a></li>
					<li><a href="/me/c/{{.Alias}}/stats">Stats</a></li>
					<li class="separator"><hr /></li>
					{{if not .SingleUser}}<li><a href="/me/c/"><img class="ic-18dp" src="/img/ic_blogs_dark@2x.png" /> View Blogs</a></li>{{end}}
					<li><a href="/me/posts/"><img class="ic-18dp" src="/img/ic_list_dark@2x.png" /> View Drafts</a></li>
					{{ else }}
					<li><a href="/login">Log in</a></li>
					{{ end }}
				</ul>
			</li>
		</ul></nav>{{end}}
		
		<header>
		{{if .Suspended}}
			{{template "user-suspended"}}
		{{end}}
		<h1 dir="{{.Direction}}" id="blog-title">{{if .Posts}}{{else}}<span class="writeas-prefix"><a href="/">write.as</a></span> {{end}}<a href="/{{if .IsTopLevel}}{{else}}{{.Prefix}}{{.Alias}}/{{end}}" class="h-card p-author u-url" rel="me author">{{.DisplayTitle}}</a></h1>
		{{if .Description}}<p class="description p-note">{{.Description}}</p>{{end}}
		{{/*if not .Public/*}}
			<!--p class="meta-note"><span>Private collection</span>. Only you can see this page.</p-->
		{{/*end*/}}
		{{if .PinnedPosts}}<nav>
			{{range .PinnedPosts}}<a class="pinned" href="{{if not $.SingleUser}}/{{$.Alias}}/{{.Slug.String}}{{else}}{{.CanonicalURL $.Host}}{{end}}">{{.PlainDisplayTitle}}</a>{{end}}</nav>
		{{end}}
		</header>
		
		{{if .Posts}}<section id="wrapper" itemscope itemtype="http://schema.org/Blog">{{else}}<div id="wrapper">{{end}}

			{{if .IsWelcome}}
			<div id="welcome">
				<h2>Welcome, <strong>{{.Username}}</strong>!</h2>
				<p>This is your new blog.</p>
				<p><a class="simple-cta" href="/#{{.Alias}}">Start writing</a>, or <a class="simple-cta" href="/me/c/{{.Alias}}">customize</a> your blog.</p>
				<p>Check out our <a class="simple-cta" href="https://guides.write.as/writing/?pk_campaign=welcome">writing guide</a> to see what else you can do, and <a class="simple-cta" href="/contact">get in touch</a> anytime with questions or feedback.</p>
			</div>
			{{end}}

			{{template "posts" .}}

		{{if gt .TotalPages 1}}<nav id="paging" class="content-container clearfix">
			{{if or (and .Format.Ascending (lt .CurrentPage .TotalPages)) (isRTL .Direction)}}
				{{if gt .CurrentPage 1}}<a href="{{.PrevPageURL .Prefix .CurrentPage .IsTopLevel}}">&#8672; {{if and .Format.Ascending (lt .CurrentPage .TotalPages)}}Previous{{else}}Newer{{end}}</a>{{end}}
				{{if lt .CurrentPage .TotalPages}}<a style="float:right;" href="{{.NextPageURL .Prefix .CurrentPage .IsTopLevel}}">{{if and .Format.Ascending (lt .CurrentPage .TotalPages)}}Next{{else}}Older{{end}} &#8674;</a>{{end}}
			{{else}}
				{{if lt .CurrentPage .TotalPages}}<a href="{{.NextPageURL .Prefix .CurrentPage .IsTopLevel}}">&#8672; Older</a>{{end}}
				{{if gt .CurrentPage 1}}<a style="float:right;" href="{{.PrevPageURL .Prefix .CurrentPage .IsTopLevel}}">Newer &#8674;</a>{{end}}
			{{end}}
		</nav>{{end}}

		{{if .Posts}}</section>{{else}}</div>{{end}}

		{{if .ShowFooterBranding }}
		<footer>
			<hr />
			<nav dir="ltr">
				{{if not .SingleUser}}<a class="home pubd" href="/">{{.SiteName}}</a> &middot; {{end}}powered by <a style="margin-left:0" href="https://writefreely.org">writefreely</a>
			</nav>
		</footer>
		{{ end }}
	</body>

	{{if .CanShowScript}}
		{{range .ExternalScripts}}<script type="text/javascript" src="{{.}}" async></script>{{end}}
		{{if .Script}}<script type="text/javascript">{{.ScriptDisplay}}</script>{{end}}
	{{end}}
	<script src="/js/h.js"></script>
	<script src="/js/postactions.js"></script>
	<script type="text/javascript">
var deleting = false;
function delPost(e, id, owned) {
	e.preventDefault();
	if (deleting) {
		return;
	}

	// TODO: UNDO!
	if (window.confirm('Are you sure you want to delete this post?')) {
		// AJAX
		deletePost(id, "", function() {
			// Remove post from list
			var $postEl = document.getElementById('post-' + id);
			$postEl.parentNode.removeChild($postEl);
			// TODO: add next post from this collection at the bottom
		});
	}
}

var deletePost = function(postID, token, callback) {
	deleting = true;

	var $delBtn = document.getElementById('post-' + postID).getElementsByClassName('delete action')[0];
	$delBtn.innerHTML = '...';

	var http = new XMLHttpRequest();
	var url = "/api/posts/" + postID;
	http.open("DELETE", url, true);
	http.onreadystatechange = function() {
		if (http.readyState == 4) {
			deleting = false;
			if (http.status == 204) {
				callback();
			} else if (http.status == 409) {
				$delBtn.innerHTML = 'delete';
				alert("Post is synced to another account. Delete the post from that account instead.");
				// TODO: show "remove" button instead of "delete" now
				// Persist that state.
				// Have it remove the post locally only.
			} else {
				$delBtn.innerHTML = 'delete';
				alert("Failed to delete." + (http.status>=500?" Please try again.":""));
			}
		}
	}
	http.send();
};

var pinning = false;
function pinPost(e, postID, slug, title) {
	e.preventDefault();
	if (pinning) {
		return;
	}
	pinning = true;

	var callback = function() {
		// Visibly remove post from collection
		var $postEl = document.getElementById('post-' + postID);
		$postEl.parentNode.removeChild($postEl);
		var $header = document.getElementsByTagName('header')[0];
		var $pinnedNavs = $header.getElementsByTagName('nav');
		// Add link to nav
		var link = '<a class="pinned" href="{{if not .SingleUser}}/{{.Alias}}/{{end}}'+slug+'">'+title+'</a>';
		if ($pinnedNavs.length == 0) {
			$header.insertAdjacentHTML("beforeend", '<nav>'+link+'</nav>');
		} else {
			$pinnedNavs[0].insertAdjacentHTML("beforeend", link);
		}
	};

	var $pinBtn = document.getElementById('post-' + postID).getElementsByClassName('pin action')[0];
	$pinBtn.innerHTML = '...';

	var http = new XMLHttpRequest();
	var url = "/api/collections/{{.Alias}}/pin";
	var params = [ { "id": postID } ];
	http.open("POST", url, true);
	http.setRequestHeader("Content-type", "application/json");
	http.onreadystatechange = function() {
		if (http.readyState == 4) {
			pinning = false;
			if (http.status == 200) {
				callback();
			} else if (http.status == 409) {
				$pinBtn.innerHTML = 'pin';
				alert("Post is synced to another account. Delete the post from that account instead.");
				// TODO: show "remove" button instead of "delete" now
				// Persist that state.
				// Have it remove the post locally only.
			} else {
				$pinBtn.innerHTML = 'pin';
				alert("Failed to pin." + (http.status>=500?" Please try again.":""));
			}
		}
	}
	http.send(JSON.stringify(params));
};

	try {
	  WebFontConfig = {
		custom: { families: [ 'Lora:400,700:latin', 'Open+Sans:400,700:latin' ], urls: [ '/css/fonts.css' ] }
	  };
	  (function() {
		var wf = document.createElement('script');
		wf.src = '/js/webfont.js';
		wf.type = 'text/javascript';
		wf.async = 'true';
		var s = document.getElementsByTagName('script')[0];
		s.parentNode.insertBefore(wf, s);
	  })();
	} catch (e) {}
	</script>
</html>{{end}}
Add user-facing templates and pages 6 years ago			`{{define "collection"}}<!DOCTYPE HTML>`
			`<html {{if .Language}}lang="{{.Language}}"{{end}} dir="{{.Direction}}">`
			`<head>`
			`<meta charset="utf-8">`

			`<title>{{.DisplayTitle}}{{if not .SingleUser}} — {{.SiteName}}{{end}}</title>`

			`<link rel="stylesheet" type="text/css" href="/css/write.css" />`
			`<link rel="shortcut icon" href="/favicon.ico" />`
			`<link rel="canonical" href="{{.CanonicalURL}}">`
			`{{if gt .CurrentPage 1}}<link rel="prev" href="{{.PrevPageURL .Prefix .CurrentPage .IsTopLevel}}">{{end}}`
			`{{if lt .CurrentPage .TotalPages}}<link rel="next" href="{{.NextPageURL .Prefix .CurrentPage .IsTopLevel}}">{{end}}`
			`{{if not .IsPrivate}}<link rel="alternate" type="application/rss+xml" title="{{.DisplayTitle}} » Feed" href="{{.CanonicalURL}}feed/" />{{end}}`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0" />`

Make WriteFreely spacing consistent 6 years ago			`<meta name="generator" content="WriteFreely">`
Add user-facing templates and pages 6 years ago			`<meta name="description" content="{{.Description}}">`
			`<meta itemprop="name" content="{{.DisplayTitle}}">`
			`<meta itemprop="description" content="{{.Description}}">`
			`<meta name="twitter:card" content="summary">`
			`<meta name="twitter:title" content="{{.DisplayTitle}}">`
Use avatar as blog link social media image 6 years ago			`<meta name="twitter:image" content="{{.AvatarURL}}">`
Add user-facing templates and pages 6 years ago			`<meta name="twitter:description" content="{{.Description}}">`
			`<meta property="og:title" content="{{.DisplayTitle}}" />`
			`<meta property="og:site_name" content="{{.DisplayTitle}}" />`
			`<meta property="og:type" content="article" />`
			`<meta property="og:url" content="{{.CanonicalURL}}" />`
			`<meta property="og:description" content="{{.Description}}" />`
Use avatar as blog link social media image 6 years ago			`<meta property="og:image" content="{{.AvatarURL}}">`
Fix whitespace in templates 6 years ago			`{{if .StyleSheet}}<style type="text/css">{{.StyleSheetDisplay}}</style>{{end}}`
Add user-facing templates and pages 6 years ago
Bring all MathJax logic into one common template Might as well do this right away, we're here anyway. 6 years ago			`{{if .RenderMathJax}}`
			`<!-- Add mathjax logic -->`
			`{{template "mathjax" .}}`
			`{{end}}`
Add code highlighting option This is a first stab at having a configurable code highlighting option, similar to the MathJax rendering option. This change makes a checkbox in the settings for code highlighting using the highlightjs.org library. What works: code highlighting in multi-user env is like I would expect. single and anon(?) needs work Things to resolve/consider: - does the .IsCode test for code highlighting need to stay? At least this and that should use the same version of the highlight.js lib. - can the common templating part be 'included' somehow? - the anon vs single-user vs multi-user code is not completely clear (to me) - bring js to local instead of cloudfare cdn (perhaps combine with MathJax) 6 years ago
Put the highlight logic into one common template It now loads unconditionally and highlights all code blocks. TODO: optimize to not load when there are no blocks 6 years ago			`<!-- Add highlighting logic -->`
			`{{template "highlighting" . }}`

Add user-facing templates and pages 6 years ago			`</head>`
			`<body id="collection" itemscope itemtype="http://schema.org/WebPage">`
Add login link on single-user blog This closes #15 6 years ago			`{{if or .IsOwner .SingleUser}}<nav id="manage"><ul>`
Add user-facing templates and pages 6 years ago			`<li><a onclick="void(0)">☰ Menu</a>`
			`<ul>`
Add login link on single-user blog This closes #15 6 years ago			`{{ if .IsOwner }}`
Fully support single-user mode - New editor nav - New backend nav - Support for drafts - Different footers on backend 6 years ago			`{{if .SingleUser}}`
			`<li><a href="/me/new">New Post</a></li>`
			`{{else}}`
Add user-facing templates and pages 6 years ago			`<li><a href="/#{{.Alias}}" class="write">{{.SiteName}}</a></li>`
Fully support single-user mode - New editor nav - New backend nav - Support for drafts - Different footers on backend 6 years ago			`{{end}}`
Use normal nav on user pages when SimpleNav This shows About, Reader, Log out links on backend user pages when logged in. It also adds "New post" buttons on the backend pages and blogs. 5 years ago			`{{if .SimpleNav}}<li><a href="/new#{{.Alias}}">New Post</a></li>{{end}}`
Add user-facing templates and pages 6 years ago			`<li><a href="/me/c/{{.Alias}}">Customize</a></li>`
			`<li><a href="/me/c/{{.Alias}}/stats">Stats</a></li>`
			`<li class="separator"><hr /></li>`
Fully support single-user mode - New editor nav - New backend nav - Support for drafts - Different footers on backend 6 years ago			`{{if not .SingleUser}}<li><a href="/me/c/"><img class="ic-18dp" src="/img/ic_blogs_dark@2x.png" /> View Blogs</a></li>{{end}}`
Add user-facing templates and pages 6 years ago			`<li><a href="/me/posts/"><img class="ic-18dp" src="/img/ic_list_dark@2x.png" /> View Drafts</a></li>`
Add login link on single-user blog This closes #15 6 years ago			`{{ else }}`
			`<li><a href="/login">Log in</a></li>`
			`{{ end }}`
Add user-facing templates and pages 6 years ago			`</ul>`
			`</li>`
			`</ul></nav>{{end}}`

			`<header>`
address PR comments - update error messages to be correct - move suspended message into template and include for other pages - check suspended status on all relevant pages and show message if logged in user is suspended. - fix possible nil pointer error - remove changes to db schema files - add version comment to migration - add UserStatus type with UserActive and UserSuspended - change database table to use status column instead of suspended - update toggle suspended handler to be toggle status in prep for possible future inclusion of further user statuses 5 years ago			`{{if .Suspended}}`
			`{{template "user-suspended"}}`
			`{{end}}`
Add user-facing templates and pages 6 years ago			`<h1 dir="{{.Direction}}" id="blog-title">{{if .Posts}}{{else}}<span class="writeas-prefix"><a href="/">write.as</a></span> {{end}}<a href="/{{if .IsTopLevel}}{{else}}{{.Prefix}}{{.Alias}}/{{end}}" class="h-card p-author u-url" rel="me author">{{.DisplayTitle}}</a></h1>`
			`{{if .Description}}<p class="description p-note">{{.Description}}</p>{{end}}`
			`{{/if not .Public/}}`
			`<!--p class="meta-note"><span>Private collection</span>. Only you can see this page.</p-->`
			`{{/end/}}`
			`{{if .PinnedPosts}}<nav>`
Fix collection template issues introduced in #205 This fixes a template rendering issue caused by bad references to $.Host in pinned posts links on single-user instances. Closes #207 5 years ago			`{{range .PinnedPosts}}<a class="pinned" href="{{if not $.SingleUser}}/{{$.Alias}}/{{.Slug.String}}{{else}}{{.CanonicalURL $.Host}}{{end}}">{{.PlainDisplayTitle}}</a>{{end}}</nav>`
Add user-facing templates and pages 6 years ago			`{{end}}`
			`</header>`

			`{{if .Posts}}<section id="wrapper" itemscope itemtype="http://schema.org/Blog">{{else}}<div id="wrapper">{{end}}`

			`{{if .IsWelcome}}`
			`<div id="welcome">`
			`<h2>Welcome, <strong>{{.Username}}</strong>!</h2>`
			`<p>This is your new blog.</p>`
			`<p><a class="simple-cta" href="/#{{.Alias}}">Start writing</a>, or <a class="simple-cta" href="/me/c/{{.Alias}}">customize</a> your blog.</p>`
			`<p>Check out our <a class="simple-cta" href="https://guides.write.as/writing/?pk_campaign=welcome">writing guide</a> to see what else you can do, and <a class="simple-cta" href="/contact">get in touch</a> anytime with questions or feedback.</p>`
			`</div>`
			`{{end}}`

			`{{template "posts" .}}`

			`{{if gt .TotalPages 1}}<nav id="paging" class="content-container clearfix">`
			`{{if or (and .Format.Ascending (lt .CurrentPage .TotalPages)) (isRTL .Direction)}}`
			`{{if gt .CurrentPage 1}}<a href="{{.PrevPageURL .Prefix .CurrentPage .IsTopLevel}}">⇠ {{if and .Format.Ascending (lt .CurrentPage .TotalPages)}}Previous{{else}}Newer{{end}}</a>{{end}}`
			`{{if lt .CurrentPage .TotalPages}}<a style="float:right;" href="{{.NextPageURL .Prefix .CurrentPage .IsTopLevel}}">{{if and .Format.Ascending (lt .CurrentPage .TotalPages)}}Next{{else}}Older{{end}} ⇢</a>{{end}}`
			`{{else}}`
			`{{if lt .CurrentPage .TotalPages}}<a href="{{.NextPageURL .Prefix .CurrentPage .IsTopLevel}}">⇠ Older</a>{{end}}`
			`{{if gt .CurrentPage 1}}<a style="float:right;" href="{{.PrevPageURL .Prefix .CurrentPage .IsTopLevel}}">Newer ⇢</a>{{end}}`
			`{{end}}`
			`</nav>{{end}}`

			`{{if .Posts}}</section>{{else}}</div>{{end}}`

			`{{if .ShowFooterBranding }}`
			`<footer>`
			`<hr />`
			`<nav dir="ltr">`
Make WriteFreely spacing consistent 6 years ago			`{{if not .SingleUser}}<a class="home pubd" href="/">{{.SiteName}}</a> · {{end}}powered by <a style="margin-left:0" href="https://writefreely.org">writefreely</a>`
Add user-facing templates and pages 6 years ago			`</nav>`
			`</footer>`
			`{{ end }}`
			`</body>`
Add code highlighting option This is a first stab at having a configurable code highlighting option, similar to the MathJax rendering option. This change makes a checkbox in the settings for code highlighting using the highlightjs.org library. What works: code highlighting in multi-user env is like I would expect. single and anon(?) needs work Things to resolve/consider: - does the .IsCode test for code highlighting need to stay? At least this and that should use the same version of the highlight.js lib. - can the common templating part be 'included' somehow? - the anon vs single-user vs multi-user code is not completely clear (to me) - bring js to local instead of cloudfare cdn (perhaps combine with MathJax) 6 years ago
Add user-facing templates and pages 6 years ago			`{{if .CanShowScript}}`
			`{{range .ExternalScripts}}<script type="text/javascript" src="{{.}}" async></script>{{end}}`
			`{{if .Script}}<script type="text/javascript">{{.ScriptDisplay}}</script>{{end}}`
			`{{end}}`
			`<script src="/js/h.js"></script>`
			`<script src="/js/postactions.js"></script>`
			`<script type="text/javascript">`
			`var deleting = false;`
			`function delPost(e, id, owned) {`
			`e.preventDefault();`
			`if (deleting) {`
			`return;`
			`}`

			`// TODO: UNDO!`
			`if (window.confirm('Are you sure you want to delete this post?')) {`
			`// AJAX`
			`deletePost(id, "", function() {`
			`// Remove post from list`
			`var $postEl = document.getElementById('post-' + id);`
			`$postEl.parentNode.removeChild($postEl);`
			`// TODO: add next post from this collection at the bottom`
			`});`
			`}`
			`}`

			`var deletePost = function(postID, token, callback) {`
			`deleting = true;`

			`var $delBtn = document.getElementById('post-' + postID).getElementsByClassName('delete action')[0];`
			`$delBtn.innerHTML = '...';`

			`var http = new XMLHttpRequest();`
			`var url = "/api/posts/" + postID;`
			`http.open("DELETE", url, true);`
			`http.onreadystatechange = function() {`
			`if (http.readyState == 4) {`
			`deleting = false;`
			`if (http.status == 204) {`
			`callback();`
			`} else if (http.status == 409) {`
			`$delBtn.innerHTML = 'delete';`
			`alert("Post is synced to another account. Delete the post from that account instead.");`
			`// TODO: show "remove" button instead of "delete" now`
			`// Persist that state.`
			`// Have it remove the post locally only.`
			`} else {`
			`$delBtn.innerHTML = 'delete';`
			`alert("Failed to delete." + (http.status>=500?" Please try again.":""));`
			`}`
			`}`
			`}`
			`http.send();`
			`};`

			`var pinning = false;`
			`function pinPost(e, postID, slug, title) {`
			`e.preventDefault();`
			`if (pinning) {`
			`return;`
			`}`
			`pinning = true;`

			`var callback = function() {`
			`// Visibly remove post from collection`
			`var $postEl = document.getElementById('post-' + postID);`
			`$postEl.parentNode.removeChild($postEl);`
			`var $header = document.getElementsByTagName('header')[0];`
			`var $pinnedNavs = $header.getElementsByTagName('nav');`
			`// Add link to nav`
Fix pinned post URL on single-user instances Previously, the URL of the dynamically-added pinned post on a single-user instance would include the username, causing the link to go to a non-existent page. This fixes that. 5 years ago			`var link = '<a class="pinned" href="{{if not .SingleUser}}/{{.Alias}}/{{end}}'+slug+'">'+title+'</a>';`
Add user-facing templates and pages 6 years ago			`if ($pinnedNavs.length == 0) {`
			`$header.insertAdjacentHTML("beforeend", '<nav>'+link+'</nav>');`
			`} else {`
			`$pinnedNavs[0].insertAdjacentHTML("beforeend", link);`
			`}`
			`};`

			`var $pinBtn = document.getElementById('post-' + postID).getElementsByClassName('pin action')[0];`
			`$pinBtn.innerHTML = '...';`

			`var http = new XMLHttpRequest();`
			`var url = "/api/collections/{{.Alias}}/pin";`
			`var params = [ { "id": postID } ];`
			`http.open("POST", url, true);`
			`http.setRequestHeader("Content-type", "application/json");`
			`http.onreadystatechange = function() {`
			`if (http.readyState == 4) {`
			`pinning = false;`
			`if (http.status == 200) {`
			`callback();`
			`} else if (http.status == 409) {`
			`$pinBtn.innerHTML = 'pin';`
			`alert("Post is synced to another account. Delete the post from that account instead.");`
			`// TODO: show "remove" button instead of "delete" now`
			`// Persist that state.`
			`// Have it remove the post locally only.`
			`} else {`
			`$pinBtn.innerHTML = 'pin';`
			`alert("Failed to pin." + (http.status>=500?" Please try again.":""));`
			`}`
			`}`
			`}`
			`http.send(JSON.stringify(params));`
			`};`

			`try {`
			`WebFontConfig = {`
			`custom: { families: [ 'Lora:400,700:latin', 'Open+Sans:400,700:latin' ], urls: [ '/css/fonts.css' ] }`
			`};`
			`(function() {`
			`var wf = document.createElement('script');`
			`wf.src = '/js/webfont.js';`
			`wf.type = 'text/javascript';`
			`wf.async = 'true';`
			`var s = document.getElementsByTagName('script')[0];`
			`s.parentNode.insertBefore(wf, s);`
			`})();`
			`} catch (e) {}`
			`</script>`
			`</html>{{end}}`