mirror of
https://codeberg.org/forgejo/forgejo.git
synced 2025-08-19 17:01:12 +00:00
83ea43cf49
After seeing #8111 use a webcomponent, I think that they are a neat usecase for Forgejo where most of the frontend is backend-generated, with some "island of enhancements". I am considering using a webcomponent for the CITATION management (last occurrence of [`Blob.GetBlobContent`](https://codeberg.org/forgejo/forgejo/issues/8222)), however I noticed that the developer experience wasn't ideal. With this PR it would be very easy to declare a webcomponent, which will be loaded only if needed (I converted `model-viewer` and `pdf-object` to this technique). Some cleanup in the neighbor webcomponents. ## Testing 1) Create a new repository or use an existing one. 2) Upload a `.pdf` or `.glb` file (such as https://codeberg.org/forgejo/forgejo/src/branch/forgejo/tests/testdata/data/viewer/Unicode%E2%9D%A4%E2%99%BBTest.glb) 3) Open the Network inspector and view the file in the repository. - After a short loading spinner, the PDF or 3D model should be rendered in a viewer - the related JS should have been loaded (e.g. http://localhost:3000/assets/js/model-viewer.494bf0cd.js) - visiting another page and check that this JS file isn't loaded Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/8510 Reviewed-by: Gusted <gusted@noreply.codeberg.org> Reviewed-by: 0ko <0ko@noreply.codeberg.org> Reviewed-by: Beowulf <beowulf@beocode.eu> Co-authored-by: oliverpool <git@olivier.pfad.fr> Co-committed-by: oliverpool <git@olivier.pfad.fr>
65 lines
3 KiB
Go HTML Template
65 lines
3 KiB
Go HTML Template
{{template "repo/settings/layout_head" (dict "ctxData" . "pageClass" "repository settings lfs")}}
|
|
<div class="user-main-content twelve wide column content repository file list">
|
|
<div class="tab-size-8 non-diff-file-content">
|
|
<h4 class="ui top attached header">
|
|
<a href="{{.LFSFilesLink}}">{{ctx.Locale.Tr "repo.settings.lfs"}}</a> / <span class="truncate sha">{{.LFSFile.Oid}}</span>
|
|
<div class="ui right">
|
|
{{if .EscapeStatus.Escaped}}
|
|
<a class="ui tiny basic button unescape-button tw-hidden">{{ctx.Locale.Tr "repo.unescape_control_characters"}}</a>
|
|
<a class="ui tiny basic button escape-button">{{ctx.Locale.Tr "repo.escape_control_characters"}}</a>
|
|
{{end}}
|
|
<a class="ui primary tiny button" href="{{.LFSFilesLink}}/find?oid={{.LFSFile.Oid}}&size={{.LFSFile.Size}}">{{ctx.Locale.Tr "repo.settings.lfs_findcommits"}}</a>
|
|
</div>
|
|
</h4>
|
|
<div class="ui bottom attached table unstackable segment">
|
|
{{template "repo/unicode_escape_prompt" dict "EscapeStatus" .EscapeStatus "root" $}}
|
|
<div class="file-view{{if .IsMarkup}} markup {{.MarkupType}}{{else if .IsPlainText}} plain-text{{else if .IsTextFile}} code-view{{end}}">
|
|
{{if .IsMarkup}}
|
|
{{if .FileContent}}{{.FileContent | SafeHTML}}{{end}}
|
|
{{else if .IsPlainText}}
|
|
<pre>{{if .FileContent}}{{.FileContent | SafeHTML}}{{end}}</pre>
|
|
{{else if not .IsTextFile}}
|
|
<div class="view-raw">
|
|
{{if .IsImageFile}}
|
|
<img src="{{$.RawFileLink}}" alt="">
|
|
{{else if .IsVideoFile}}
|
|
<video controls src="{{$.RawFileLink}}">
|
|
<strong>{{ctx.Locale.Tr "repo.video_not_supported_in_browser"}}</strong>
|
|
</video>
|
|
{{else if .IsAudioFile}}
|
|
<audio controls src="{{$.RawFileLink}}">
|
|
<strong>{{ctx.Locale.Tr "repo.audio_not_supported_in_browser"}}</strong>
|
|
</audio>
|
|
{{else if .IsPDFFile}}
|
|
<lazy-webc tag="pdf-object" src="{{$.RawFileLink}}">
|
|
<a href="{{$.RawFileLink}}" class="ui basic button">{{ctx.Locale.Tr "repo.diff.view_file"}}</a>
|
|
</lazy-webc>
|
|
{{else if .Is3DModelFile}}
|
|
{{if .IsGLBFile}}
|
|
<lazy-webc tag="model-viewer" src="{{$.RawFileLink}}" ar shadow-intensity="2" camera-controls touch-action="pan-y"></lazy-webc>
|
|
{{else}}
|
|
<a href="{{$.RawFileLink}}" rel="nofollow">{{ctx.Locale.Tr "repo.file_view_raw"}}!</a>
|
|
{{end}}
|
|
{{else}}
|
|
<a href="{{$.RawFileLink}}" rel="nofollow">{{ctx.Locale.Tr "repo.file_view_raw"}}</a>
|
|
{{end}}
|
|
</div>
|
|
{{else if .FileSize}}
|
|
<table>
|
|
<tbody>
|
|
<tr>
|
|
{{if .IsFileTooLarge}}
|
|
<td><strong>{{ctx.Locale.Tr "repo.file_too_large"}}</strong></td>
|
|
{{else}}
|
|
<td class="lines-num">{{.LineNums}}</td>
|
|
<td class="lines-code"><pre><code class="{{.HighlightClass}}"><ol>{{.FileContent}}</ol></code></pre></td>
|
|
{{end}}
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
{{end}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{template "repo/settings/layout_footer" .}}
|