file.html (5624B)
1 {{template "_header" .}} 2 <h2>File: {{.Data.File.Filename}}</h2> 3 4 <div class="file-container"> 5 6 <div class="file-sidebar"> 7 8 <details open> 9 <summary>Tags</summary> 10 <ul id="tags-list"> 11 {{range $k, $vs := .Data.File.Tags}} 12 <li> 13 <span class="file-tag-category">{{$k}}:</span><br> 14 {{range $i, $v := $vs}} 15 {{if $i}}<br> {{end}} 16 <form method="post" action="/file/{{$.Data.File.ID}}/tag/delete" class="ajax-tag-form"><input type="hidden" name="category" value="{{$k}}"><input type="hidden" name="value" value="{{$v}}"><button class="text-button" type="submit">x</button></form> 17 <a href="/tag/{{pathEscape $k}}/{{pathEscape $v}}">{{$v}}</a> 18 {{end}} 19 </li> 20 {{else}} 21 <li>No tags yet</li> 22 {{end}} 23 </ul> 24 </details> 25 26 <details> 27 <summary>Add Tags</summary> 28 <form method="post" class="ajax-tag-form"> 29 <input type="text" name="category" list="categories" placeholder="Category"><br> 30 <datalist id="categories">{{range .Data.Categories}}<option value="{{.}}">{{end}}</datalist> 31 <input type="text" name="value" placeholder="Value"><br> 32 <button class="text-button" type="submit">Add Tag</button> 33 </form> 34 </details> 35 <script src="/static/ajax-tags.js" defer></script> 36 37 <details> 38 <summary>Properties</summary> 39 {{if .Data.Properties}} 40 <ul> 41 {{range $k, $v := .Data.Properties}} 42 <li> 43 <span class="file-tag-category">{{$k}}:</span> 44 <a href="/property/{{$k}}/{{$v}}" {{if eq $k "filetype"}}style="text-transform:lowercase"{{end}}>{{$v}}</a> 45 </li> 46 {{end}} 47 </ul> 48 {{else}} 49 <p>No properties computed yet.</p> 50 {{end}} 51 </details> 52 53 <details> 54 <summary>Raw URL</summary> 55 <input id="raw-url" value="http://{{.IP}}:{{.Port}}/uploads/{{.Data.EscapedFilename}}"><br> 56 <button class="text-button" id="copy-btn">Copy</button><br> 57 <span id="copy-status"></span> 58 <script src="/static/copy-link.js" defer></script> 59 </details> 60 61 <details> 62 <summary>File Actions</summary> 63 64 <script src="/static/rename-file.js" defer></script> 65 <form id="renameForm-{{.Data.File.ID}}" method="post" action="/file/{{.Data.File.ID}}/rename"> 66 <input type="hidden" name="newfilename" value="{{.Data.File.Filename}}"> 67 <button type="button" class="text-button rename-button" data-file-id="{{.Data.File.ID}}" data-current-name="{{.Data.File.Filename}}">Rename File</button> 68 </form> 69 <br /> 70 <form method="post" action="/file/{{.Data.File.ID}}/delete"> 71 <button type="submit" onclick="return confirm('Are you sure you want to delete this file? This cannot be undone!')" class="text-button">Delete File</button> 72 </form> 73 </details> 74 </div> 75 76 <div class="file-content"> 77 78 {{if hasAnySuffix .Data.File.Filename ".jpg" ".jpeg" ".png" ".gif" ".webp"}} 79 <div id="imageContainer" class="media-container"> 80 <a href="/uploads/{{.Data.EscapedFilename}}" target="_blank"><img src="/uploads/{{.Data.EscapedFilename}}" id="imageViewer" class="file-content-image"></a><br> 81 </div> 82 <script src="/static/timestamps.js" defer></script> 83 {{else if hasAnySuffix .Data.File.Filename ".cbz"}} 84 <div class="cbz-preview"> 85 <a href="/cbz/{{.Data.File.ID}}"> 86 <img src="/uploads/thumbnails/{{.Data.File.Filename}}.jpg" class="file-content-image" alt="CBZ Preview"> 87 </a> 88 <div class="cbz-open-button"> 89 <a href="/cbz/{{.Data.File.ID}}" class="text-button" style="display: inline-block; padding: 10px 20px; margin-top: 10px;">📖 Open CBZ Viewer</a> 90 </div> 91 </div> 92 {{else if hasAnySuffix .Data.File.Filename ".mp4" ".webm" ".mov" ".m4v"}} 93 <div id="videoContainer" class="media-container"> 94 <video id="videoPlayer" controls loop muted width="600"> 95 <source src="/uploads/{{.Data.EscapedFilename}}"> 96 </video><br> 97 </div> 98 <script src="/static/timestamps.js" defer></script> 99 {{else if hasAnySuffix .Data.File.Filename ".txt" ".md"}} 100 <div id="text-viewer-container"> 101 <div> 102 <button onclick="toggleLineNumbers()" class="text-button">Line Numbers</button> 103 <button onclick="toggleFullscreen()" class="text-button">Fullscreen</button> 104 </div> 105 <pre id="text-viewer" data-filename="{{.Data.EscapedFilename}}">Loading...</pre> 106 </div> 107 <script src="/static/text-viewer.js"></script> 108 <script src="/static/common.js"></script> 109 {{else}} 110 <a href="/uploads/{{.Data.EscapedFilename}}">Download file</a><br> 111 {{end}} 112 113 <div class="description-section"> 114 <h3>Description</h3> 115 116 <!-- Display Mode --> 117 <div id="description-display" data-original-description="{{.Data.File.Description}}"> 118 {{if .Data.File.Description}} 119 <div id="current-description" >{{.Data.File.Description}}</div> 120 {{else}} 121 <div id="no-description">No description set</div> 122 {{end}} 123 <button class="text-button" id="edit-description-btn" onclick="toggleDescriptionEdit()"> 124 {{if .Data.File.Description}}Edit Description{{else}}Add Description{{end}} 125 </button> 126 </div> 127 128 <!-- Edit Mode (initially hidden) --> 129 <div id="description-edit" style="display: none;"> 130 <form method="post"> 131 <input type="hidden" name="action" value="update_description"> 132 <div> 133 <textarea 134 id="description-textarea" 135 name="description" 136 rows="6" 137 maxlength="2048" 138 placeholder="Enter description..." 139 >{{.Data.File.Description}}</textarea> 140 </div> 141 <div style="margin-top: 8px; display: flex; align-items: center; gap: 10px;"> 142 <button class="text-button" type="submit">Save Description</button> 143 <button class="text-button" type="button" onclick="cancelDescriptionEdit()">Cancel</button> 144 </div> 145 </form> 146 </div> 147 </div> 148 149 <script src="/static/description.js" defer></script> 150 151 </div> 152 153 {{template "_footer"}}