entry.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252
  1. {{ define "title"}}{{ .entry.Title }}{{ end }}
  2. {{ define "content"}}
  3. <section class="entry" data-id="{{ .entry.ID }}">
  4. <header class="entry-header">
  5. <h1 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. </header>
  146. {{ if gt (len .entry.Content) 120 }}
  147. {{ if .user }}
  148. <div class="pagination-entry-top">
  149. {{ template "entry_pagination" . }}
  150. </div>
  151. {{ end }}
  152. {{ end }}
  153. <article role="article" class="entry-content gesture-nav-{{ $.user.GestureNav }}" dir="auto">
  154. {{ if (and .entry.Enclosures (not .entry.Feed.NoMediaPlayer)) }}
  155. {{ range .entry.Enclosures }}
  156. {{ if ne .URL "" }}
  157. {{ if hasPrefix .MimeType "audio/" }}
  158. <div class="enclosure-audio" >
  159. <audio controls preload="metadata"
  160. data-last-position="{{ .MediaProgression }}"
  161. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  162. >
  163. {{ if (and $.user (mustBeProxyfied "audio")) }}
  164. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  165. {{ else }}
  166. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  167. {{ end }}
  168. </audio>
  169. </div>
  170. {{ else if hasPrefix .MimeType "video/" }}
  171. <div class="enclosure-video">
  172. <video controls preload="metadata"
  173. data-last-position="{{ .MediaProgression }}"
  174. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  175. >
  176. {{ if (and $.user (mustBeProxyfied "video")) }}
  177. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  178. {{ else }}
  179. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  180. {{ end }}
  181. </video>
  182. </div>
  183. {{ end }}
  184. {{ end }}
  185. {{ end }}
  186. {{end}}
  187. {{ if .user }}
  188. {{ noescape (proxyFilter .entry.Content) }}
  189. {{ else }}
  190. {{ noescape .entry.Content }}
  191. {{ end }}
  192. </article>
  193. {{ if .entry.Enclosures }}
  194. <details class="entry-enclosures">
  195. <summary>{{ t "page.entry.attachments" }} ({{ len .entry.Enclosures }})</summary>
  196. {{ range .entry.Enclosures }}
  197. {{ if ne .URL "" }}
  198. <div class="entry-enclosure">
  199. {{ if hasPrefix .MimeType "audio/" }}
  200. <div class="enclosure-audio">
  201. <audio controls preload="metadata"
  202. data-last-position="{{ .MediaProgression }}"
  203. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  204. >
  205. {{ if (and $.user (mustBeProxyfied "audio")) }}
  206. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  207. {{ else }}
  208. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  209. {{ end }}
  210. </audio>
  211. </div>
  212. {{ else if hasPrefix .MimeType "video/" }}
  213. <div class="enclosure-video">
  214. <video controls preload="metadata"
  215. data-last-position="{{ .MediaProgression }}"
  216. data-save-url="{{ route "saveEnclosureProgression" "enclosureID" .ID }}"
  217. >
  218. {{ if (and $.user (mustBeProxyfied "video")) }}
  219. <source src="{{ proxyURL .URL }}" type="{{ .Html5MimeType }}">
  220. {{ else }}
  221. <source src="{{ .URL | safeURL }}" type="{{ .Html5MimeType }}">
  222. {{ end }}
  223. </video>
  224. </div>
  225. {{ else if hasPrefix .MimeType "image/" }}
  226. <div class="enclosure-image">
  227. {{ if (and $.user (mustBeProxyfied "image")) }}
  228. <img src="{{ proxyURL .URL }}" title="{{ .URL }} ({{ .MimeType }})" loading="lazy" alt="{{ .URL }} ({{ .MimeType }})">
  229. {{ else }}
  230. <img src="{{ .URL | safeURL }}" title="{{ .URL }} ({{ .MimeType }})" loading="lazy" alt="{{ .URL }} ({{ .MimeType }})">
  231. {{ end }}
  232. </div>
  233. {{ end }}
  234. <div class="entry-enclosure-download">
  235. <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>
  236. <small>{{ if gt .Size 0 }} - <strong>{{ formatFileSize .Size }}</strong>{{ end }}</small>
  237. </div>
  238. </div>
  239. {{ end }}
  240. {{ end }}
  241. </details>
  242. {{ end }}
  243. </section>
  244. {{ if .user }}
  245. <div class="pagination-entry-bottom">
  246. {{ template "entry_pagination" . }}
  247. </div>
  248. {{ end }}
  249. {{ end }}