A clean, Markdown-based publishing platform made for writers. Write together, and build a community. https://writefreely.org
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.
 
 
 
 
 

151 lines
6.2 KiB

  1. {{define "post"}}<!DOCTYPE HTML>
  2. <html {{if .Language.Valid}}lang="{{.Language.String}}"{{end}} dir="{{.Direction}}">
  3. <head prefix="og: http://ogp.me/ns# article: http://ogp.me/ns/article#">
  4. <meta charset="utf-8">
  5. <title>{{.PlainDisplayTitle}} {{localhtml "title dash" .Language.String}} {{.Collection.DisplayTitle}}</title>
  6. <link rel="stylesheet" type="text/css" href="/css/write.css" />
  7. <link rel="shortcut icon" href="/favicon.ico" />
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  9. <link rel="canonical" href="{{.CanonicalURL}}" />
  10. <meta name="generator" content="WriteFreely">
  11. <meta name="title" content="{{.PlainDisplayTitle}} {{localhtml "title dash" .Language.String}} {{if .Collection.Title}}{{.Collection.Title}}{{else}}{{.Collection.Alias}}{{end}}">
  12. <meta name="description" content="{{.Summary}}">
  13. {{if gt .Views 1}}<meta name="twitter:label1" value="Views">
  14. <meta name="twitter:data1" value="{{largeNumFmt .Views}}">{{end}}
  15. <meta name="author" content="{{.Collection.Title}}" />
  16. <meta itemprop="description" content="{{.Summary}}">
  17. <meta itemprop="datePublished" content="{{.CreatedDate}}" />
  18. <meta name="twitter:card" content="summary">
  19. <meta name="twitter:description" content="{{.Summary}}">
  20. <meta name="twitter:title" content="{{.PlainDisplayTitle}} {{localhtml "title dash" .Language.String}} {{if .Collection.Title}}{{.Collection.Title}}{{else}}{{.Collection.Alias}}{{end}}">
  21. {{if gt (len .Images) 0}}<meta name="twitter:image" content="{{index .Images 0}}">{{else}}<meta name="twitter:image" content="{{.Collection.AvatarURL}}">{{end}}
  22. <meta property="og:title" content="{{.PlainDisplayTitle}}" />
  23. <meta property="og:description" content="{{.Summary}}" />
  24. <meta property="og:site_name" content="{{.Collection.DisplayTitle}}" />
  25. <meta property="og:type" content="article" />
  26. <meta property="og:url" content="{{.CanonicalURL}}" />
  27. <meta property="og:updated_time" content="{{.Created8601}}" />
  28. {{range .Images}}<meta property="og:image" content="{{.}}" />{{else}}<meta property="og:image" content="{{.Collection.AvatarURL}}">{{end}}
  29. <meta property="article:published_time" content="{{.Created8601}}">
  30. {{if .Collection.StyleSheet}}<style type="text/css">{{.Collection.StyleSheetDisplay}}</style>{{end}}
  31. <style type="text/css">
  32. body footer {
  33. max-width: 40rem;
  34. margin: 0 auto;
  35. }
  36. body#post header {
  37. padding: 1em 1rem;
  38. }
  39. article time.dt-published {
  40. display: block;
  41. color: #666;
  42. }
  43. body#post article h2#title{
  44. margin-bottom: 0.5em;
  45. }
  46. article time.dt-published {
  47. margin-bottom: 1em;
  48. }
  49. </style>
  50. {{if .Collection.RenderMathJax}}
  51. <!-- Add mathjax logic -->
  52. {{template "mathjax" . }}
  53. {{end}}
  54. <!-- Add highlighting logic -->
  55. {{template "highlighting" .}}
  56. </head>
  57. <body id="post">
  58. <div id="overlay"></div>
  59. {{template "user-navigation" .}}
  60. <article id="post-body" class="{{.Font}} h-entry">{{if .IsScheduled}}<p class="badge">Scheduled</p>{{end}}{{if .Title.String}}<h2 id="title" class="p-name">{{.FormattedDisplayTitle}}</h2>{{end}}{{/* TODO: check format: if .Collection.Format.ShowDates*/}}<time class="dt-published" datetime="{{.Created}}" pubdate itemprop="datePublished" content="{{.Created}}">{{.DisplayDate}}</time><div class="e-content">{{.HTMLContent}}</div></article>
  61. {{ if .Collection.ShowFooterBranding }}
  62. <footer dir="ltr">
  63. <p style="text-align: left">Published by <a rel="author" href="{{if .IsTopLevel}}/{{else}}/{{.Collection.Alias}}/{{end}}" class="h-card p-author">{{.Collection.DisplayTitle}}</a>
  64. {{ if .IsOwner }} &middot; <span class="views" dir="ltr"><strong>{{largeNumFmt .Views}}</strong> {{pluralize "view" "views" .Views}}</span>
  65. &middot; <a class="xtra-feature" href="/{{if not .SingleUser}}{{.Collection.Alias}}/{{end}}{{.Slug.String}}/edit" dir="{{.Direction}}">Edit</a>
  66. {{if .IsPinned}} &middot; <a class="xtra-feature unpin" href="/{{.Collection.Alias}}/{{.Slug.String}}/unpin" dir="{{.Direction}}" onclick="unpinPost(event, '{{.ID}}')">Unpin</a>{{end}}
  67. {{ end }}
  68. </p>
  69. <nav>
  70. {{if .PinnedPosts}}
  71. {{range .PinnedPosts}}<a class="pinned{{if eq .Slug.String $.Slug.String}} selected{{end}}" href="{{if not $.SingleUser}}/{{$.Collection.Alias}}/{{.Slug.String}}{{else}}{{.CanonicalURL}}{{end}}">{{.PlainDisplayTitle}}</a>{{end}}
  72. {{end}}
  73. </nav>
  74. <hr>
  75. <nav><p style="font-size: 0.9em">{{localhtml "published with write.as" .Language.String}}</p></nav>
  76. </footer>
  77. {{ end }}
  78. </body>
  79. {{if .Collection.CanShowScript}}
  80. {{range .Collection.ExternalScripts}}<script type="text/javascript" src="{{.}}" async></script>{{end}}
  81. {{if .Collection.Script}}<script type="text/javascript">{{.Collection.ScriptDisplay}}</script>{{end}}
  82. {{end}}
  83. <script type="text/javascript">
  84. var pinning = false;
  85. function unpinPost(e, postID) {
  86. e.preventDefault();
  87. if (pinning) {
  88. return;
  89. }
  90. pinning = true;
  91. var $footer = document.getElementsByTagName('footer')[0];
  92. var callback = function() {
  93. // Hide current page
  94. var $pinnedNavLink = $footer.getElementsByTagName('nav')[0].querySelector('.pinned.selected');
  95. $pinnedNavLink.style.display = 'none';
  96. };
  97. var $pinBtn = $footer.getElementsByClassName('unpin')[0];
  98. $pinBtn.innerHTML = '...';
  99. var http = new XMLHttpRequest();
  100. var url = "/api/collections/{{.Collection.Alias}}/unpin";
  101. var params = [ { "id": postID } ];
  102. http.open("POST", url, true);
  103. http.setRequestHeader("Content-type", "application/json");
  104. http.onreadystatechange = function() {
  105. if (http.readyState == 4) {
  106. pinning = false;
  107. if (http.status == 200) {
  108. callback();
  109. $pinBtn.style.display = 'none';
  110. $pinBtn.innerHTML = 'Pin';
  111. } else if (http.status == 409) {
  112. $pinBtn.innerHTML = 'Unpin';
  113. } else {
  114. $pinBtn.innerHTML = 'Unpin';
  115. alert("Failed to unpin." + (http.status>=500?" Please try again.":""));
  116. }
  117. }
  118. }
  119. http.send(JSON.stringify(params));
  120. };
  121. try { // Fonts
  122. WebFontConfig = {
  123. custom: { families: [ 'Lora:400,700:latin', 'Open+Sans:400,700:latin' ], urls: [ '/css/fonts.css' ] }
  124. };
  125. (function() {
  126. var wf = document.createElement('script');
  127. wf.src = '/js/webfont.js';
  128. wf.type = 'text/javascript';
  129. wf.async = 'true';
  130. var s = document.getElementsByTagName('script')[0];
  131. s.parentNode.insertBefore(wf, s);
  132. })();
  133. } catch (e) { /* ¯\_(ツ)_/¯ */ }
  134. </script>
  135. </html>{{end}}