small-packages/luci-app-aurora-config/htdocs/luci-static/resources/utils/asset-upload.js

"use strict";"require baseclass";"require rpc";"require ui";const MAX_UPLOAD=8388608,formatSize=e=>e>=1048576?(e/1048576).toFixed(1)+" MB":Math.max(1,Math.round(e/1024))+" KB",extOf=e=>(e.match(/\.([a-z0-9]+)$/i)?.[1]||"").toLowerCase();return baseclass.extend({MAX_UPLOAD:8388608,formatSize:formatSize,extOf:extOf,checkFile(e,t){const a=t?.exts||[],s=extOf(e.name);return a.length&&!a.includes(s)?{ok:!1,err:_("Unsupported file type. Allowed: %s").format(a.join(", "))}:e.size>8388608?{ok:!1,err:_("File is %s, exceeding the 8MB limit.").format(formatSize(e.size))}:{ok:!0,err:""}},uploadToRouter:e=>new Promise((t,a)=>{const s=new XMLHttpRequest;e.onProgress&&s.upload.addEventListener("progress",t=>{t.lengthComputable&&e.onProgress(Math.round(t.loaded/t.total*100))}),s.addEventListener("load",()=>200===s.status?t():a(new Error(_("Upload failed (HTTP %s)").format(s.status)))),s.addEventListener("error",()=>a(new Error(_("Upload failed"))));const r=new FormData;r.append("sessionid",rpc.getSessionID()),r.append("filename",e.tmpPath),r.append("filemode","0600"),r.append("filedata",e.file,e.file.name),s.open("POST","/cgi-bin/cgi-upload"),s.withCredentials=!0,s.send(r)}),createAssetManager(e){const t=e.rows||[],a=E("div",{}),s=E("div",{});a.appendChild(s),t.length?a.appendChild(E("table",{class:"table"},[E("tr",{class:"tr table-titles"},[E("th",{class:"th",style:"width:56px;"},""),E("th",{class:"th"},_("Name")),E("th",{class:"th"},e.badgeHeader),E("th",{class:"th"},_("Size")),E("th",{class:"th center"},"")]),...t.map(e=>E("tr",{class:"tr"},[E("td",{class:"td"},e.preview),E("td",{class:"td",style:"word-break:break-all;"},e.name),E("td",{class:"td",style:"color:var(--text-muted);font-size:0.9em;"},e.badge||""),E("td",{class:"td",style:"color:var(--text-muted);font-variant-numeric:tabular-nums;white-space:nowrap;"},formatSize(e.size||0)),E("td",{class:"td center"},E("button",{type:"button",class:"cbi-button cbi-button-remove",click:e.onDelete},_("Delete")))]))])):a.appendChild(E("div",{style:"padding:0.5em 0;"},[E("em",{},e.emptyText)]));const r=()=>{for(;s.firstChild;)s.firstChild.remove()},i=()=>{r();const t=E("input",{type:"file",style:"display:none;",accept:e.bar&&e.bar.accept||""});t.addEventListener("change",()=>{const e=t.files&&t.files[0];t.value="",e&&o(e)});const a=E("button",{type:"button",style:"display:block;width:100%;border:2px dashed var(--hairline);border-radius:0.5em;padding:1.25em 1em;text-align:center;cursor:pointer;margin-bottom:0.75em;transition:border-color 0.15s,background 0.15s;",click:()=>t.click(),dragover:e=>{e.preventDefault(),a.style.borderColor="var(--brand)",a.style.background="var(--brand-subtle)"},dragleave:()=>{a.style.borderColor="",a.style.background=""},drop:e=>{e.preventDefault(),a.style.borderColor="",a.style.background="";const t=e.dataTransfer&&e.dataTransfer.files[0];t&&o(t)}},[E("div",{style:"font-size:1.5em;margin-bottom:0.25em;pointer-events:none;"},"⬆"),E("strong",{style:"pointer-events:none;"},e.bar.hint),E("div",{style:"font-size:0.8em;opacity:0.6;margin-top:0.25em;pointer-events:none;"},e.bar.sub||"")]);s.appendChild(a),s.appendChild(t)},o=t=>{const a=e.checkFile(t);r(),s.appendChild(((t,a)=>{const s=e.form.fields(t),r=E("div",{style:"height:100%;width:0%;transition:width 0.12s linear;background:var(--brand);border-radius:999px;"}),o=E("div",{style:"display:none;height:5px;border-radius:999px;background:var(--hairline);overflow:hidden;margin-top:0.6em;"},[r]),n=e=>{r.style.width=e+"%"};let l=!1;const d=E("button",{type:"button",class:"cbi-button",click:i},_("Cancel")),c=E("div",{style:"margin-bottom:0.6em;"},[E("strong",{style:"word-break:break-all;"},t.name)," · "+formatSize(t.size)]),b=a.ok?null:E("p",{style:"color:var(--danger);font-weight:600;font-size:0.9em;margin:0 0 0.6em;"},a.err),p=E("div",{style:"margin-bottom:0.6em;"},s.rows.map(e=>E("div",{class:"cbi-value"},[E("label",{class:"cbi-value-title"},e.label),E("div",{class:"cbi-value-field"},e.control)]))),m=E("button",{type:"button",class:"cbi-button cbi-button-positive"},_("Confirm Upload")),u=()=>{l||(m.disabled=!a.ok||!s.valid())};u(),p.addEventListener("input",u),p.addEventListener("change",u);const h=E("div",{class:"right"},[d," ",m]);return m.addEventListener("click",()=>{l=!0,m.disabled=!0,d.disabled=!0,s.setDisabled(!0),o.style.display="block",n(0);const a=s.value();e.upload(t,a,n).catch(e=>{l=!1,d.disabled=!1,s.setDisabled(!1),o.style.display="none",n(0),u(),ui.addNotification(null,E("p",_("Upload failed: %s").format(e.message)),"error")})}),E("div",{style:"margin-bottom:0.5em;padding-bottom:0.6em;border-bottom:1px solid var(--hairline);"},[c,b,p,h,o].filter(Boolean))})(t,a))};return i(),a},confirmDelete:e=>new Promise(t=>{ui.showModal(e.title,[E("p",{},e.message),E("div",{class:"right"},[E("button",{class:"btn",click:()=>{ui.hideModal(),t(!1)}},_("Cancel"))," ",E("button",{class:"btn cbi-button-negative",click:()=>{ui.hideModal(),t(!0)}},_("Delete"))])])})});