1
0
mirror of https://github.com/writeas/htmlhouse synced 2025-07-18 21:08:16 +00:00
htmlhouse/templates/editor.html

135 lines
4.3 KiB
HTML
Raw Normal View History

2015-10-12 04:24:26 +00:00
{{define "editor"}}<!DOCTYPE HTML>
2015-10-10 20:44:12 +00:00
<html>
<head>
<title>HTMLhouse</title>
<link rel="stylesheet" type="text/css" href="/css/house.css" />
<link rel="shortcut icon" href="/favicon.ico" />
<link rel="icon" type="image/png" href="/img/favicon-chrome.png" sizes="192x192">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="theme-color" content="#888888" />
<meta name="description" content="Publish HTML with HTMLhouse.">
<meta name="application-name" content="HTMLhouse">
<meta name="application-url" content="https://html.house">
<meta itemprop="name" content="HTMLhouse">
<meta itemprop="description" content="Publish HTML with HTMLhouse.">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="HTMLhouse">
<meta name="twitter:description" content="Publish HTML with HTMLhouse.">
<meta property="og:title" content="HTMLhouse" />
<meta property="og:site_name" content="HTMLhouse" />
<meta property="og:type" content="object" />
<meta property="og:url" content="https://html.house/" />
<meta property="og:description" content="Publish HTML with HTMLhouse." />
</head>
<body>
<header>
<h1>HTMLhouse</h1>
<nav>
2015-10-12 04:24:26 +00:00
{{if .ID}}<a class="home" href="/">&lt;&#8962;/&gt;</a>{{end}}
2015-10-11 12:27:43 +00:00
<a href="/about.html">about</a>
2015-10-12 05:47:06 +00:00
<a href="mailto:hello@write.as">contact</a>
<a target="_blank" href="https://twitter.com/htmlhouse">@HTMLhouse</a>
2015-10-10 20:44:12 +00:00
</nav>
2015-10-12 04:24:26 +00:00
{{if .ID}}<a href="/{{.ID}}.html">view</a>{{end}}
<a id="publish" href="#">{{if .ID}}update{{else}}publish{{end}}</a>
2015-10-10 20:44:12 +00:00
</header>
2015-10-12 04:24:26 +00:00
<pre id="editor">{{.Content}}</pre>
2015-10-10 20:44:12 +00:00
<div id="preview-wrap">
<iframe id="preview"></iframe>
</div>
<script src="https://code.jquery.com/jquery-2.1.4.min.js" type="text/javascript" charset="utf-8"></script>
<script src="/js/ace.js" type="text/javascript" charset="utf-8"></script>
2015-10-12 04:24:26 +00:00
<script src="https://write.as/js/h.js"></script>
2015-10-10 20:44:12 +00:00
<script>
var publishing = false;
var $publishBtn = $("#publish");
{{if .ID}}{{else}}var orig = "{{.Content}}";
$publishBtn.addClass("no");{{end}}
2015-10-23 20:21:30 +00:00
var houses = JSON.parse(H.get('neighborhood', '[]'));
var hasBuilt = houses.length > 0;
2015-10-10 20:44:12 +00:00
function updatePreview() {
var val = editor.getSession().getValue();
$view.contents().find('body').html(val);
{{if .ID}}{{else}}if (val != orig) {
publishing = false;
$publishBtn.removeClass("no");
$publishBtn.text("publish");
} else {
publishing = true;
$publishBtn.addClass("no");
2015-10-23 20:21:30 +00:00
$publishBtn.text("publish" + (!hasBuilt ? " (edit first)" : ""));
}{{end}}
2015-10-10 20:44:12 +00:00
}
var editor = ace.edit("editor");
var $view = $('#preview');
editor.setTheme("ace/theme/chrome");
editor.session.setMode("ace/mode/html");
editor.getSession().on('change', updatePreview);
updatePreview();
2015-10-11 12:10:28 +00:00
2015-10-23 20:21:30 +00:00
if (hasBuilt) {
$('header').append('<a href="/houses.html">my pages</a>');
}
{{if .ID}}var token;
for (var i=0; i<houses.length; i++) {
if (houses[i].id == "{{.ID}}") {
token = houses[i].token;
break;
}
}
2015-10-23 20:21:30 +00:00
if (typeof token === "undefined") {
$publishBtn.addClass("no");
}{{else}}
{{end}}
$publishBtn.on('click', function(e) {
2015-10-11 12:10:28 +00:00
e.preventDefault();
2015-10-12 04:24:26 +00:00
if (publishing) {
return;
}
publishing = true;
$.ajax({
type: "POST",
url: "/⌂/{{if .ID}}{{.ID}}{{else}}create{{end}}",{{if .ID}}
beforeSend: function (request) {
request.setRequestHeader("Authorization", token);
},{{end}}
data: {html: editor.getSession().getValue()},
success: function(data, status, xhr) {
publishing = false;
2015-10-12 04:53:30 +00:00
{{if .ID}}if (data.meta.code == 200) { {{else}}if (data.meta.code == 201) {
2015-10-12 04:24:26 +00:00
var houses = JSON.parse(H.get('neighborhood', '[]'));
houses.push({id: data.data.id, token: xhr.getResponseHeader('Authorization')});
2015-10-12 04:53:30 +00:00
H.set('neighborhood', JSON.stringify(houses));{{end}}
2015-10-12 04:24:26 +00:00
window.location = '/' + data.data.id + '.html';
2015-10-12 04:53:30 +00:00
} else {
alert(data.meta.error_msg);
2015-10-12 04:24:26 +00:00
}
},
2015-10-12 04:53:30 +00:00
error: function(jqXHR, status, error) {
2015-10-12 04:24:26 +00:00
publishing = false;
2015-10-12 04:53:30 +00:00
alert(error);
2015-10-11 12:10:28 +00:00
}
});
});
2015-10-10 20:44:12 +00:00
</script>
<script type="text/javascript">
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-47877053-8', 'auto');
ga('send', 'pageview');
</script>
</body>
2015-10-12 04:24:26 +00:00
</html>{{end}}