No OneTemporary
Actions

Size

18 KB

Subscribers

None

View Options

	diff --git a/templates/pad.tmpl b/templates/pad.tmpl
	index 3855068..e5f7e04 100644
	--- a/templates/pad.tmpl
	+++ b/templates/pad.tmpl
	@@ -1,459 +1,467 @@
	{{define "pad"}}<!DOCTYPE HTML>
	<html>
	<head>

	<title>{{if .Editing}}Editing {{if .Post.Title}}{{.Post.Title}}{{else}}{{.Post.Id}}{{end}}{{else}}New Post{{end}} — {{.SiteName}}</title>

	<link rel="stylesheet" type="text/css" href="/css/write.css" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />

	<meta name="google" value="notranslate">
	</head>
	<body id="pad" class="light">

	<div id="overlay"></div>

	<textarea id="writer" placeholder="Write..." class="{{.Post.Font}}" autofocus>{{if .Post.Title}}# {{.Post.Title}}

	{{end}}{{.Post.Content}}</textarea>

	<header id="tools">
	<div id="clip">
	{{if not .SingleUser}}<h1><a href="/me/c/" title="View blogs"><img class="ic-24dp" src="/img/ic_blogs_dark@2x.png" /></a></h1>{{end}}
	<nav id="target" {{if .SingleUser}}style="margin-left:0"{{end}}><ul>
	{{if .Editing}}<li>{{if .EditCollection}}<a href="{{.EditCollection.CanonicalURL}}">{{.EditCollection.Title}}</a>{{else}}<a>Draft</a>{{end}}</li>
	{{else}}<li><a id="publish-to"><span id="target-name">Draft</span> <img class="ic-18dp" src="/img/ic_down_arrow_dark@2x.png" /></a>
	<ul>
	<li class="menu-heading">Publish to...</li>
	<li class="target selected" id="anonymous"><a href="#anonymous"><i class="material-icons md-18">description</i> <em>Draft</em></a></li>
	{{if .Blogs}}{{range .Blogs}}
	<li class="target" id="blog-{{.Alias}}"><a href="#{{.Alias}}"><i class="material-icons md-18">public</i> {{if .Title}}{{.Title}}{{else}}{{.Alias}}{{end}}</a></li>
	{{end}}{{end}}
	<li id="user-separator" class="separator"><hr /></li>
	{{ if .SingleUser }}
	<li><a href="/"><i class="material-icons md-18">launch</i> View Blog</a></li>
	<li><a href="/me/c/{{.Username}}"><i class="material-icons md-18">palette</i> Customize</a></li>
	<li><a href="/me/c/{{.Username}}/stats"><i class="material-icons md-18">trending_up</i> Stats</a></li>
	{{ else }}
	<li><a href="/me/c/"><i class="material-icons md-18">library_books</i> View Blogs</a></li>
	{{ end }}
	<li><a href="/me/posts/"><i class="material-icons md-18">view_list</i> View Drafts</a></li>
	<li><a href="/me/logout"><i class="material-icons md-18">power_settings_new</i> Log out</a></li>
	</ul>
	</li>{{end}}
	</ul></nav>
	<nav id="font-picker" class="if-room room-3 hidden" style="margin-left:-1em"><ul>
	<li><a href="#" id="" onclick="return false"><img class="ic-24dp" src="/img/ic_font_dark@2x.png" /> <img class="ic-18dp" src="/img/ic_down_arrow_dark@2x.png" /></a>
	<ul style="text-align: center">
	<li class="menu-heading">Font</li>
	<li class="selected"><a class="font norm" href="#norm">Serif</a></li>
	<li><a class="font sans" href="#sans">Sans-serif</a></li>
	<li><a class="font wrap" href="#wrap">Monospace</a></li>
	</ul>
	</li>
	</ul></nav>
	<span id="wc" class="hidden if-room room-4">0 words</span>
	</div>
	<noscript style="margin-left: 2em;"><strong>NOTE</strong>: for now, you'll need Javascript enabled to post.</noscript>
	<div id="belt">
	{{if .Editing}}<div class="tool hidden if-room"><a href="{{if .EditCollection}}{{.EditCollection.CanonicalURL}}{{.Post.Slug}}/edit/meta{{else}}/{{if .SingleUser}}d/{{end}}{{.Post.Id}}/meta{{end}}" title="Edit post metadata" id="edit-meta"><img class="ic-24dp" src="/img/ic_info_dark@2x.png" /></a></div>{{end}}
	<div class="tool hidden if-room room-2"><a href="#theme" title="Toggle theme" id="toggle-theme"><img class="ic-24dp" src="/img/ic_brightness_dark@2x.png" /></a></div>
	<div class="tool if-room room-1"><a href="{{if not .User}}/pad/posts{{else}}/me/posts/{{end}}" title="View posts" id="view-posts"><img class="ic-24dp" src="/img/ic_list_dark@2x.png" /></a></div>
	<div class="tool"><a href="#publish" title="Publish" id="publish"><img class="ic-24dp" src="/img/ic_send_dark@2x.png" /></a></div>
	</div>
	</header>

	<script src="/js/h.js"></script>
	<script>
	function toggleTheme() {
	var btns = Array.prototype.slice.call(document.getElementById('tools').querySelectorAll('a img'));
	var newTheme = '';
	if (document.body.classList.contains('light')) {
	newTheme = 'dark';
	document.body.className = document.body.className.replace(/(?:^\|\s)light(?!\S)/g, newTheme);
	for (var i=0; i<btns.length; i++) {
	btns[i].src = btns[i].src.replace('_dark@2x.png', '@2x.png');
	}
	} else {
	newTheme = 'light';
	document.body.className = document.body.className.replace(/(?:^\|\s)dark(?!\S)/g, newTheme);
	for (var i=0; i<btns.length; i++) {
	btns[i].src = btns[i].src.replace('@2x.png', '_dark@2x.png');
	}
	}
	H.set('padTheme', newTheme);
	}
	if (H.get('padTheme', 'light') != 'light') {
	toggleTheme();
	}
	var $writer = H.getEl('writer');
	var $btnPublish = H.getEl('publish');
	var $wc = H.getEl("wc");
	var updateWordCount = function() {
	var words = 0;
	var val = $writer.el.value.trim();
	if (val != '') {
	words = $writer.el.value.trim().replace(/\s+/gi, ' ').split(' ').length;
	}
	$wc.el.innerText = words + " word" + (words != 1 ? "s" : "");
	};
	var setButtonStates = function() {
	if (!canPublish) {
	$btnPublish.el.className = 'disabled';
	return;
	}
	if ($writer.el.value.length === 0 \|\| (draftDoc != 'lastDoc' && $writer.el.value == origDoc)) {
	$btnPublish.el.className = 'disabled';
	} else {
	$btnPublish.el.className = '';
	}
	};
	{{if .Post.Id}}var draftDoc = 'draft{{.Post.Id}}';
	var origDoc = '{{.Post.Content}}';{{else}}var draftDoc = 'lastDoc';{{end}}
	H.load($writer, draftDoc, true);
	updateWordCount();

	var typingTimer;
	var doneTypingInterval = 200;

	var posts;
	{{if and .Post.Id (not .Post.Slug)}}
	var token = null;
	var curPostIdx;
	posts = JSON.parse(H.get('posts', '[]'));
	for (var i=0; i<posts.length; i++) {
	if (posts[i].id == "{{.Post.Id}}") {
	token = posts[i].token;
	break;
	}
	}
	var canPublish = token != null;
	{{else}}var canPublish = true;{{end}}
	var publishing = false;
	var justPublished = false;

	var publish = function(content, font) {
	{{if and (and .Post.Id (not .Post.Slug)) (not .User)}}
	if (!token) {
	alert("You don't have permission to update this post.");
	return;
	}
	if ($btnPublish.el.className == 'disabled') {
	return;
	}
	{{end}}
	$btnPublish.el.children[0].textContent = 'more_horiz';
	publishing = true;
	var xpostTarg = H.get('crosspostTarget', '[]');

	var http = new XMLHttpRequest();
	var lang = navigator.languages ? navigator.languages[0] : (navigator.language \|\| navigator.userLanguage);
	lang = lang.substring(0, 2);
	var post = H.getTitleStrict(content);

	var params = {
	body: post.content,
	title: post.title,
	font: font,
	lang: lang
	};
	{{ if .Post.Slug }}
	var url = "/api/collections/{{.EditCollection.Alias}}/posts/{{.Post.Id}}";
	{{ else if .Post.Id }}
	var url = "/api/posts/{{.Post.Id}}";
	if (typeof token === 'undefined' \|\| !token) {
	token = "";
	}
	params.token = token;
	{{ else }}
	var url = "/api/posts";
	var postTarget = H.get('postTarget', 'anonymous');
	if (postTarget != 'anonymous') {
	url = "/api/collections/" + postTarget + "/posts";
	}
	params.crosspost = JSON.parse(xpostTarg);
	{{ end }}

	http.open("POST", url, true);

	// Send the proper header information along with the request
	http.setRequestHeader("Content-type", "application/json");

	http.onreadystatechange = function() {
	if (http.readyState == 4) {
	publishing = false;
	if (http.status == 200 \|\| http.status == 201) {
	data = JSON.parse(http.responseText);
	id = data.data.id;
	nextURL = '{{if .SingleUser}}/d{{end}}/'+id;

	{{ if not .Post.Id }}
	// Post created
	if (postTarget != 'anonymous') {
	nextURL = {{if not .SingleUser}}'/'+postTarget+{{end}}'/'+data.data.slug;
	}
	editToken = data.data.token;

	{{ if not .User }}if (postTarget == 'anonymous') {
	// Save the data
	var posts = JSON.parse(H.get('posts', '[]'));

	{{if .Post.Id}}var newPost = H.createPost("{{.Post.Id}}", token, content);
	for (var i=0; i<posts.length; i++) {
	if (posts[i].id == "{{.Post.Id}}") {
	posts[i].title = newPost.title;
	posts[i].summary = newPost.summary;
	break;
	}
	}
	nextURL = "/pad/posts";{{else}}posts.push(H.createPost(id, editToken, content));{{end}}

	H.set('posts', JSON.stringify(posts));
	}
	{{ end }}
	{{ end }}

	justPublished = true;
	if (draftDoc != 'lastDoc') {
	H.remove(draftDoc);
	{{if .Editing}}H.remove('draft{{.Post.Id}}font');{{end}}
	} else {
	H.set(draftDoc, '');
	}

	{{if .EditCollection}}
	window.location = '{{.EditCollection.CanonicalURL}}{{.Post.Slug}}';
	{{else}}
	window.location = nextURL;
	{{end}}
	} else {
	$btnPublish.el.children[0].textContent = 'send';
	alert("Failed to post. Please try again.");
	}
	}
	}
	http.send(JSON.stringify(params));
	};

	setButtonStates();
	$writer.on('keyup input', function() {
	setButtonStates();
	clearTimeout(typingTimer);
	typingTimer = setTimeout(doneTyping, doneTypingInterval);
	}, false);
	$writer.on('keydown', function(e) {
	clearTimeout(typingTimer);
	if (e.keyCode == 13 && (e.metaKey \|\| e.ctrlKey)) {
	$btnPublish.el.click();
	}
	});
	$btnPublish.on('click', function(e) {
	e.preventDefault();
	if (!publishing && $writer.el.value) {
	var content = $writer.el.value;
	publish(content, selectedFont);
	}
	});

	H.getEl('toggle-theme').on('click', function(e) {
	e.preventDefault();
	var newTheme = 'light';
	if (document.body.className == 'light') {
	newTheme = 'dark';
	}
	toggleTheme();
	});

	var targets = document.querySelectorAll('#target li.target a');
	for (var i=0; i<targets.length; i++) {
	targets[i].addEventListener('click', function(e) {
	e.preventDefault();
	var targetName = this.href.substring(this.href.indexOf('#')+1);
	H.set('postTarget', targetName);

	document.querySelector('#target li.target.selected').classList.remove('selected');
	this.parentElement.classList.add('selected');
	var newText = this.innerText.split(' ');
	newText.shift();
	document.getElementById('target-name').innerText = newText.join(' ');
	});
	}
	var postTarget = H.get('postTarget', 'anonymous');
	if (location.hash != '') {
	postTarget = location.hash.substring(1);
	// TODO: pushState to /pad (or whatever the URL is) so we live on a clean URL
	location.hash = '';
	}
	var pte = document.querySelector('#target li.target#blog-'+postTarget+' a');
	if (pte != null) {
	pte.click();
	} else {
	postTarget = 'anonymous';
	H.set('postTarget', postTarget);
	}

	var sansLoaded = false;
	WebFontConfig = {
	custom: { families: [ 'Lora:400,700:latin' ], urls: [ '/css/fonts.css' ] }
	};
	var loadSans = function() {
	if (sansLoaded) return;
	sansLoaded = true;
	WebFontConfig.custom.families.push('Open+Sans:400,700:latin');
	try {
	(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) {}
	};
	var fonts = document.querySelectorAll('nav#font-picker a.font');
	for (var i=0; i<fonts.length; i++) {
	fonts[i].addEventListener('click', function(e) {
	e.preventDefault();
	selectedFont = this.href.substring(this.href.indexOf('#')+1);
	$writer.el.className = selectedFont;
	document.querySelector('nav#font-picker li.selected').classList.remove('selected');
	this.parentElement.classList.add('selected');
	H.set('{{if .Editing}}draft{{.Post.Id}}font{{else}}padFont{{end}}', selectedFont);
	if (selectedFont == 'sans') {
	loadSans();
	}
	});
	}
	var selectedFont = H.get('{{if .Editing}}draft{{.Post.Id}}font{{else}}padFont{{end}}', '{{.Post.Font}}');
	var sfe = document.querySelector('nav#font-picker a.font.'+selectedFont);
	if (sfe != null) {
	sfe.click();
	}

	var doneTyping = function() {
	if (draftDoc == 'lastDoc' \|\| $writer.el.value != origDoc) {
	H.save($writer, draftDoc);
	updateWordCount();
	}
	};
	window.addEventListener('beforeunload', function(e) {
	if (draftDoc != 'lastDoc' && $writer.el.value == origDoc) {
	H.remove(draftDoc);
	} else if (!justPublished) {
	doneTyping();
	}
	});

	try {
	(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) {
	// whatevs
	}

	var allowedFileTypes = ["image/png", "image/jpeg"];

	// using getElementsByTagName instead of querySelector for
	// more backward compatibility (and probably performance)
	var dropbox = document.getElementsByTagName("body")[0];
	dropbox.addEventListener("drop", drop, true);
	dropbox.addEventListener("dragover", function(e){e.preventDefault()}, true)
	// firefox needs this too in order to not show the floating cursor on linux
	// see [blogpost] for why we don't want this
	dropbox.addEventListener("dragenter", function(e){e.preventDefault()}, true)

	var textarea = document.getElementsByTagName("textarea")[0];

	function drop(e) {
	e.preventDefault();
	var files = e.dataTransfer.files;
	for (var i = 0; i < files.length; i++) {
	var file = files[i];
	// from https://stackoverflow.com/a/1818400/400257
	description = file.name.substr(0, file.name.lastIndexOf('.')) \|\| file.name;
	file.identifier = description+"_"+Math.random().toString(36).substring(2, 15);
	file.progress = 0;
	markdown = " [" + file.identifier + "](00%) ";
	// if we drop on a textarea, on firefox, we can get the position of the drop
	// by searching for the 'file://' uri that it appends to the textarea by default
	insertTextAtCursor(markdown, textarea);
	handleFile(file);
	}
	}

	function insertTextAtCursor(text, textarea){
	if (textarea.nodeName == "TEXTAREA") {
	// save cursor position so that we can set it back after the operation on value
	var startingPosition = textarea.selectionStart;
	var textBeforeCursor = textarea.value.substring(0, textarea.selectionStart);
	var textAfterCursor = textarea.value.substring(textarea.selectionEnd, textarea.value.length);
	textarea.value = textBeforeCursor + text + textAfterCursor;
	// set the cursor to its original position
	textarea.selectionStart = textarea.selectionEnd = startingPosition + text.length;
	} else throw "Element is not a textarea"
	}

	function handleFile(file){
	var ok = false;
	for (var i in allowedFileTypes){
	if (file.type.match(allowedFileTypes[i])) {ok=true; break;}
	}
	if (!ok) throw "disallowed file type";

	// var reader = new FileReader();
	// reader.readAsDataURL(file);
	var xhr = new XMLHttpRequest();
	// progressMgmt(xhr,file,img);
	xhr.open("POST", "http://localhost/minimalist-ajax-upload/upload.php");
	xhr.setRequestHeader("Cache-Control", "no-cache");
	xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
	xhr.setRequestHeader("X-File-Name", file.name);
	xhr.setRequestHeader("X-File-Size", file.size);

	xhr.upload.onprogress = function(e) {
	if (e.lengthComputable) {
	var startingPosition = textarea.selectionStart;
	var loaded = Math.ceil((e.loaded / e.total)*100);
	if (file.progress + 5 < loaded){
	file.progress = loaded;
	textarea.value = textarea.value.replace(getMarkdownRegex(file.identifier), "["+ file.identifier +"]("+padLeft(loaded,2)+"%)");
	textarea.selectionStart = textarea.selectionEnd = startingPosition;
	}
	}
	}

	var formData = new FormData();
	formData.append('file', file);
	xhr.send(formData);
	xhr.onreadystatechange = function(){
	if(xhr.readyState == 4){
	- processResponse(xhr.responseText, file.identifier);
	+ if (xhr.status == 200){
	+ processResponse(xhr.responseText, file.identifier);
	+ } else {
	+ processFailure(file.identifier);
	+ }
	}
	}
	}

	function processResponse(responseText, identifier){
	var response = JSON.parse(responseText);
	description = response.name.substr(0, response.name.lastIndexOf('.')) \|\| response.name;
	textarea.value = textarea.value.replace(getMarkdownRegex(identifier), "["+ description +"]("+response.url+")");
	}

	+ function processFailure(identifier){
	+ textarea.value = textarea.value.replace(getMarkdownRegex(identifier), "");
	+ }
	+
	function getMarkdownRegex(identifier){
	return new RegExp('\\[' + identifier + '\\]\$.*?\$');
	}

	function padLeft(number, padTo, str){
	return Array(padTo-String(number).length+1).join(str\|\|'0')+number;
	}

	</script>
	<link href="/css/icons.css" rel="stylesheet">
	</body>
	</html>{{end}}

File Metadata

Mime Type: text/x-diff
Expires: Sat, Nov 23, 4:58 AM (1 d, 11 h)
Storage Engine: blob
Storage Format: Raw Data
Storage Handle: 3104386

No OneTemporaryActions

View Options

File Metadata

Event Timeline

No OneTemporary
Actions