Publish HTML quickly. https://html.house
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

164 lines
5.3 KiB

  1. {{define "editor"}}<!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <title>HTMLhouse</title>
  5. <link rel="stylesheet" type="text/css" href="/css/house.css" />
  6. <link rel="shortcut icon" href="/favicon.ico" />
  7. <link rel="icon" type="image/png" href="/img/favicon-chrome.png" sizes="192x192">
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  9. <meta name="theme-color" content="#888888" />
  10. <meta name="description" content="Publish HTML with HTMLhouse.">
  11. <meta name="application-name" content="HTMLhouse">
  12. <meta name="application-url" content="https://html.house">
  13. <meta itemprop="name" content="HTMLhouse">
  14. <meta itemprop="description" content="Publish HTML with HTMLhouse.">
  15. <meta name="twitter:card" content="summary_large_image">
  16. <meta name="twitter:site" content="@HTMLhouse">
  17. <meta name="twitter:title" content="HTMLhouse">
  18. <meta name="twitter:description" content="Publish HTML with HTMLhouse.">
  19. <meta property="og:title" content="HTMLhouse" />
  20. <meta property="og:site_name" content="HTMLhouse" />
  21. <meta property="og:type" content="object" />
  22. <meta property="og:url" content="https://html.house/" />
  23. <meta property="og:description" content="Publish HTML with HTMLhouse." />
  24. </head>
  25. <body>
  26. <header>
  27. <h1>HTMLhouse</h1>
  28. <nav>
  29. {{if .ID}}<a class="home" href="/">&lt;&#8962;/&gt;</a>{{end}}
  30. <a href="/browse">browse</a>
  31. <a href="/about.html">about</a>
  32. <a href="/contact.html">contact</a>
  33. </nav>
  34. {{if .ID}}<a href="/{{.ID}}.html">view</a>{{end}}
  35. {{if .AllowPublish}}
  36. <a id="publish" href="#">{{if .ID}}update{{else}}publish{{end}}</a>
  37. <input type="checkbox" name="public" id="public"{{if .Public}} checked="checked"{{end}} /><label for="public">public</label>
  38. {{end}}
  39. </header>
  40. <pre id="editor" class="editor">{{.Content}}</pre>
  41. <div id="preview-wrap">
  42. <iframe id="preview"></iframe>
  43. </div>
  44. <script src="/js/jquery-2.1.4.min.js" type="text/javascript" charset="utf-8"></script>
  45. <script src="/js/ace.js" type="text/javascript" charset="utf-8"></script>
  46. <script src="/js/h.js"></script>
  47. <script>
  48. (function() {
  49. var publishing = false;
  50. var $publishBtn = $("#publish");
  51. var $publicCheck = document.getElementById("public");
  52. {{if .ID}}{{else}}var orig = "{{.Content}}";
  53. $publishBtn.addClass("no");{{end}}
  54. var houses = JSON.parse(H.get('neighborhood', '[]'));
  55. var hasBuilt = houses.length > 0;
  56. function updatePreview() {
  57. var val = editor.getSession().getValue();
  58. try {
  59. $view.contents().find("body").html(val);
  60. } catch (err) {
  61. console.error(err);
  62. }
  63. {{if .ID}}{{else}}if (val != orig) {
  64. publishing = false;
  65. $publishBtn.removeClass("no");
  66. $publishBtn.text("publish");
  67. } else {
  68. publishing = true;
  69. $publishBtn.addClass("no");
  70. $publishBtn.text("publish" + (!hasBuilt ? " (edit first)" : ""));
  71. }{{end}}
  72. }
  73. var justPublished = false;
  74. var editor = ace.edit("editor");
  75. var $view = $('#preview');
  76. editor.setTheme("ace/theme/chrome");
  77. editor.session.setMode("ace/mode/html");
  78. editor.getSession().on('change', updatePreview);
  79. {{if .ID}}{{else}}var saved = H.get('constructionSite', '');
  80. if (saved !== '') {
  81. editor.setValue(saved);
  82. }{{end}}
  83. updatePreview();
  84. {{if .ID}}{{else}}window.addEventListener('beforeunload', function(e) {
  85. if (!justPublished) {
  86. H.set('constructionSite', editor.getSession().getValue());
  87. }
  88. return null;
  89. });{{end}}
  90. if (hasBuilt) {
  91. $('header').append('<a href="/houses.html">my pages</a>');
  92. }
  93. {{if .ID}}var token;
  94. for (var i=0; i<houses.length; i++) {
  95. if (houses[i].id == "{{.ID}}") {
  96. token = houses[i].token;
  97. break;
  98. }
  99. }
  100. if (typeof token === "undefined") {
  101. $publishBtn.addClass("no");
  102. }{{else}}
  103. {{end}}
  104. $publishBtn.on('click', function(e) {
  105. e.preventDefault();
  106. if (publishing) {
  107. return;
  108. }
  109. publishing = true;
  110. $.ajax({
  111. type: "POST",
  112. url: "/⌂/{{if .ID}}{{.ID}}{{else}}create{{end}}",{{if .ID}}
  113. beforeSend: function (request) {
  114. request.setRequestHeader("Authorization", token);
  115. },{{end}}
  116. data: {html: editor.getSession().getValue(), public: $publicCheck.checked ? "true" : ""},
  117. success: function(data, status, xhr) {
  118. publishing = false;
  119. {{if .ID}}if (data.code == 200) { {{else}}if (data.code == 201) {
  120. var houses = JSON.parse(H.get('neighborhood', '[]'));
  121. houses.push({id: data.data.id, token: xhr.getResponseHeader('Authorization')});
  122. H.set('neighborhood', JSON.stringify(houses));{{end}}
  123. justPublished = true;
  124. {{if .ID}}{{else}}H.remove('constructionSite');{{end}}
  125. window.location = '/' + data.data.id + '.html';
  126. } else {
  127. alert(data.error_msg);
  128. }
  129. },
  130. error: function(jqXHR, status, error) {
  131. publishing = false;
  132. alert(error);
  133. }
  134. });
  135. });
  136. var _paq = _paq || [];
  137. _paq.push(["setCookieDomain", "*.html.house"]);
  138. _paq.push(["setDomains", ["*.html.house"]]);
  139. _paq.push(['trackPageView']);
  140. _paq.push(['enableLinkTracking']);
  141. (function() {
  142. var u="//analytics.write.as/";
  143. _paq.push(['setTrackerUrl', u+'piwik.php']);
  144. _paq.push(['setSiteId', 3]);
  145. var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
  146. g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
  147. })();
  148. })();
  149. </script>
  150. <noscript><p><img src="//analytics.write.as/piwik.php?idsite=3" style="border:0;" alt="" /></p></noscript>
  151. </body>
  152. </html>{{end}}