entry.html 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257
  1. {{ define "title"}}{{ .entry.Title }}{{ end }}
  2. {{ define "header"}}
  3. <header class="page-header" aria-labelledby="page-header-title">
  4. <div class="entry-header">
  5. <h1 id="page-header-title" dir="auto">
  6. <a href="{{ .entry.URL | safeURL }}" target="_blank" rel="noopener noreferrer" referrerpolicy="no-referrer">{{ .entry.Title }}</a>
  7. </h1>
  8. {{ if .user }}
  9. <div class="entry-actions">
  10. <ul>
  11. <li>
  12. <a href="#"
  13. title="{{ t "entry.status.title" }}"
  14. data-toggle-status="true"
  15. data-label-loading="{{ t "entry.state.saving" }}"
  16. data-label-unread="{{ t "entry.status.unread" }}"
  17. data-label-read="{{ t "entry.status.read" }}"
  18. data-toast-unread="{{ t "entry.status.toast.unread" }}"
  19. data-toast-read="{{ t "entry.status.toast.read" }}"
  20. data-value="{{ if eq .entry.Status "read" }}read{{ else }}unread{{ end }}"
  21. >{{ if eq .entry.Status "unread" }}{{ icon "read" }}{{ else }}{{ icon "unread" }}{{ end }}<span class="icon-label">{{ if eq .entry.Status "unread" }}{{ t "entry.status.read" }}{{ else }}{{ t "entry.status.unread" }}{{ end }}</span></a>
  22. </li>
  23. <li>
  24. <a href="#"
  25. data-toggle-bookmark="true"
  26. data-bookmark-url="{{ route "toggleBookmark" "entryID" .entry.ID }}"
  27. data-label-loading="{{ t "entry.state.saving" }}"
  28. data-label-star="{{ t "entry.bookmark.toggle.on" }}"
  29. data-label-unstar="{{ t "entry.bookmark.toggle.off" }}"
  30. data-toast-star="{{ t "entry.bookmark.toast.on" }}"
  31. data-toast-unstar="{{ t "entry.bookmark.toast.off" }}"
  32. data-value="{{ if .entry.Starred }}star{{ else }}unstar{{ end }}"
  33. >{{ if .entry.Starred }}{{ icon "unstar" }}{{ else }}{{ icon "star" }}{{ end }}<span class="icon-label">{{ if .entry.Starred }}{{ t "entry.bookmark.toggle.off" }}{{ else }}{{ t "entry.bookmark.toggle.on" }}{{ end }}</span></a>
  34. </li>
  35. {{ if .hasSaveEntry }}
  36. <li>
  37. <a href="#"
  38. title="{{ t "entry.save.title" }}"
  39. data-save-entry="true"
  40. data-save-url="{{ route "saveEntry" "entryID" .entry.ID }}"
  41. data-label-loading="{{ t "entry.state.saving" }}"
  42. data-label-done="{{ t "entry.save.completed" }}"
  43. data-toast-done="{{ t "entry.save.toast.completed" }}"
  44. >{{ icon "save" }}<span class="icon-label">{{ t "entry.save.label" }}</span></a>
  45. </li>
  46. {{ end }}
  47. {{ if .entry.ShareCode }}
  48. <li>
  49. <a href="{{ route "sharedEntry" "shareCode" .entry.ShareCode }}"
  50. title="{{ t "entry.shared_entry.title" }}"
  51. data-share-status="shared"
  52. target="_blank">{{ icon "share" }}<span class="icon-label">{{ t "entry.shared_entry.label" }}</span></a>
  53. </li>
  54. <li>
  55. <a href="#"
  56. data-confirm="true"
  57. data-url="{{ route "unshareEntry" "entryID" .entry.ID }}"
  58. data-label-question="{{ t "confirm.question" }}"
  59. data-label-yes="{{ t "confirm.yes" }}"
  60. data-label-no="{{ t "confirm.no" }}"
  61. data-label-loading="{{ t "confirm.loading" }}">{{ icon "delete" }}<span class="icon-label">{{ t "entry.unshare.label" }}</span></a>
  62. </li>
  63. {{ else }}
  64. <li>
  65. <a href="{{ route "shareEntry" "entryID" .entry.ID }}"
  66. title="{{ t "entry.share.title" }}"
  67. data-share-status="share"
  68. target="_blank">{{ icon "share" }}<span class="icon-label">{{ t "entry.share.label" }}</span></a>
  69. </li>
  70. {{ end }}
  71. <li>
  72. <a href="{{ .entry.URL | safeURL }}"
  73. target="_blank"
  74. rel="noopener noreferrer"
  75. referrerpolicy="no-referrer"
  76. data-original-link="{{ .user.MarkReadOnView }}">{{ icon "external-link" }}<span class="icon-label">{{ t "entry.external_link.label" }}</span></a>
  77. </li>
  78. <li>
  79. <a href="#"
  80. title="{{ t "entry.scraper.title" }}"
  81. data-fetch-content-entry="true"
  82. data-fetch-content-url="{{ route "fetchContent" "entryID" .entry.ID }}"
  83. data-label-loading="{{ t "entry.state.loading" }}"
  84. >{{ icon "scraper" }}<span class="icon-label">{{ t "entry.scraper.label" }}</span></a>
  85. </li>
  86. {{ if .entry.CommentsURL }}
  87. <li>
  88. <a href="{{ .entry.CommentsURL | safeURL }}"
  89. title="{{ t "entry.comments.title" }}"
  90. target="_blank"
  91. rel="noopener noreferrer"
  92. referrerpolicy="no-referrer"
  93. data-comments-link="true"
  94. >{{ icon "comment" }}<span class="icon-label">{{ t "entry.comments.label" }}</span></a>
  95. </li>
  96. {{ end }}
  97. </ul>
  98. </div>
  99. {{ end }}
  100. <div class="entry-meta" dir="auto">
  101. <span class="entry-website">
  102. {{ if and .user (ne .entry.Feed.Icon.IconID 0) }}
  103. <img src="{{ route "icon" "iconID" .entry.Feed.Icon.IconID }}" width="16" height="16" loading="lazy" alt="{{ .entry.Feed.Title }}">
  104. {{ end }}
  105. {{ if .user }}
  106. <a href="{{ route "feedEntries" "feedID" .entry.Feed.ID }}">{{ .entry.Feed.Title }}</a>
  107. {{ else }}
  108. <a href="{{ .entry.Feed.SiteURL | safeURL }}">{{ .entry.Feed.Title }}</a>
  109. {{ end }}
  110. </span>
  111. {{ if .entry.Author }}
  112. <span class="entry-author">
  113. {{ if isEmail .entry.Author }}
  114. - <a href="mailto:{{ .entry.Author }}">{{ .entry.Author }}</a>
  115. {{ else }}
  116. – <em>{{ .entry.Author }}</em>
  117. {{ end }}
  118. </span>
  119. {{ end }}
  120. {{ if .user }}
  121. <span class="category">
  122. <a href="{{ route "categoryEntries" "categoryID" .entry.Feed.Category.ID }}">{{ .entry.Feed.Category.Title }}</a>
  123. </span>
  124. {{ end }}
  125. </div>
  126. {{ if .entry.Tags }}
  127. <div class="entry-tags">
  128. {{ t "entry.tags.label" }}
  129. {{range $i, $e := .entry.Tags}}{{if $i}}, {{end}}<strong>{{ $e }}</strong>{{end}}
  130. </div>
  131. {{ end }}
  132. <div class="entry-date">
  133. {{ if .user }}
  134. <time datetime="{{ isodate .entry.Date }}" title="{{ isodate .entry.Date }}">{{ elapsed $.user.Timezone .entry.Date }}</time>
  135. {{ else }}
  136. <time datetime="{{ isodate .entry.Date }}" title="{{ isodate .entry.Date }}">{{ elapsed "UTC" .entry.Date }}</time>
  137. {{ end }}
  138. {{ if and .user.ShowReadingTime (gt .entry.ReadingTime 0) }}
  139. &centerdot;
  140. <span class="entry-reading-time">
  141. {{ plural "entry.estimated_reading_time" .entry.ReadingTime .entry.ReadingTime }}
  142. </span>
  143. {{ end }}
  144. </div>
  145. </div>
  146. </header>
  147. {{ end }}
  148. {{ define "content"}}
  149. {{ if gt (len .entry.Content) 120 }}
  150. {{ if .user }}
  151. <div class="pagination-entry-top">
  152. {{ template "entry_pagination" . }}
  153. </div>
  154. {{ end }}
  155. {{ end }}
  156. <article role="article" class="entry-content gesture-nav-{{ $.user.GestureNav }}" dir="auto">
  157. {{ if (and .entry.Enclosures (not .entry.Feed.NoMediaPlayer)) }}
  158. {{ range .entry.Enclosures }}
  159. {{ if ne .URL "" }}
  160. {{ if hasPrefix .MimeType "audio/" }}
  161. <div class="enclosure-audio" >
  162. <audio controls preload="metadata"
  163. data-last-position="{{ .MediaProgression }}"
  164. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  165. >
  166. {{ if (and $.user (mustBeProxyfied "audio")) }}
  167. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  168. {{ else }}
  169. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  170. {{ end }}
  171. </audio>
  172. </div>
  173. {{ else if hasPrefix .MimeType "video/" }}
  174. <div class="enclosure-video">
  175. <video controls preload="metadata"
  176. data-last-position="{{ .MediaProgression }}"
  177. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  178. >
  179. {{ if (and $.user (mustBeProxyfied "video")) }}
  180. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  181. {{ else }}
  182. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  183. {{ end }}
  184. </video>
  185. </div>
  186. {{ end }}
  187. {{ end }}
  188. {{ end }}
  189. {{end}}
  190. {{ if .user }}
  191. {{ noescape (proxyFilter .entry.Content) }}
  192. {{ else }}
  193. {{ noescape .entry.Content }}
  194. {{ end }}
  195. </article>
  196. {{ if .entry.Enclosures }}
  197. <details class="entry-enclosures">
  198. <summary>{{ t "page.entry.attachments" }} ({{ len .entry.Enclosures }})</summary>
  199. {{ range .entry.Enclosures }}
  200. {{ if ne .URL "" }}
  201. <div class="entry-enclosure">
  202. {{ if hasPrefix .MimeType "audio/" }}
  203. <div class="enclosure-audio">
  204. <audio controls preload="metadata"
  205. data-last-position="{{ .MediaProgression }}"
  206. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  207. >
  208. {{ if (and $.user (mustBeProxyfied "audio")) }}
  209. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  210. {{ else }}
  211. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  212. {{ end }}
  213. </audio>
  214. </div>
  215. {{ else if hasPrefix .MimeType "video/" }}
  216. <div class="enclosure-video">
  217. <video controls preload="metadata"
  218. data-last-position="{{ .MediaProgression }}"
  219. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  220. >
  221. {{ if (and $.user (mustBeProxyfied "video")) }}
  222. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  223. {{ else }}
  224. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  225. {{ end }}
  226. </video>
  227. </div>
  228. {{ else if hasPrefix .MimeType "image/" }}
  229. <div class="enclosure-image">
  230. {{ if (and $.user (mustBeProxyfied "image")) }}
  231. <img src="{{ proxyURL .URL }}" title="{{ .URL }} ({{ .MimeType }})" loading="lazy" alt="{{ .URL }} ({{ .MimeType }})">
  232. {{ else }}
  233. <img src="{{ .URL | safeURL }}" title="{{ .URL }} ({{ .MimeType }})" loading="lazy" alt="{{ .URL }} ({{ .MimeType }})">
  234. {{ end }}
  235. </div>
  236. {{ end }}
  237. <div class="entry-enclosure-download">
  238. <a href="{{ .URL | safeURL }}" title="{{ t "action.download" }}{{ if gt .Size 0 }} - {{ formatFileSize .Size }}{{ end }} ({{ .MimeType }})" target="_blank" rel="noopener noreferrer" referrerpolicy="no-referrer">{{ .URL | safeURL }}</a>
  239. <small>{{ if gt .Size 0 }} - <strong>{{ formatFileSize .Size }}</strong>{{ end }}</small>
  240. </div>
  241. </div>
  242. {{ end }}
  243. {{ end }}
  244. </details>
  245. {{ end }}
  246. {{ if .user }}
  247. <div class="pagination-entry-bottom">
  248. {{ template "entry_pagination" . }}
  249. </div>
  250. {{ end }}
  251. {{ end }}