fix(icon): upload d'icône — retour d'erreur, WEBP, limite Nginx
- nginx: client_max_body_size 10m (limite par défaut 1 Mo bloquait les images) - icons.go: import _ golang.org/x/image/webp et image/gif pour décoder WEBP/GIF - index.html: retire SVG de l'accept (serveur le rejette) et corrige le hint - popups.js: try/catch autour de uploadIcon → message d'erreur visible dans le hint pendant 4s si l'upload échoue ; reset du file input pour re-sélectionner le même fichier ; rafraîchit l'img de la tuile avec cache-busting après succès Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
2bda420728
commit
f69c22039b
@@ -73,12 +73,12 @@
|
|||||||
<img id="pop-icon-img" src="" alt="" style="display:none">
|
<img id="pop-icon-img" src="" alt="" style="display:none">
|
||||||
<div class="agent-icon-overlay"><i class="fa-solid fa-camera"></i><span>Changer</span></div>
|
<div class="agent-icon-overlay"><i class="fa-solid fa-camera"></i><span>Changer</span></div>
|
||||||
</div>
|
</div>
|
||||||
<input type="file" id="icon-upload" accept=".svg,.jpg,.jpeg,.png,.webp" style="display:none">
|
<input type="file" id="icon-upload" accept=".jpg,.jpeg,.png,.webp" style="display:none">
|
||||||
<div style="flex:1">
|
<div style="flex:1">
|
||||||
<div class="pop-host" id="pop-host">—</div>
|
<div class="pop-host" id="pop-host">—</div>
|
||||||
<div class="pop-ip" id="pop-ip">—</div>
|
<div class="pop-ip" id="pop-ip">—</div>
|
||||||
<div style="font-size:10px;color:var(--ink-4);font-family:var(--font-terminal);margin-top:2px">
|
<div id="icon-hint" style="font-size:10px;color:var(--ink-4);font-family:var(--font-terminal);margin-top:2px">
|
||||||
Cliquer sur l'icône pour personnaliser · SVG JPG PNG WEBP · max 128×128 px
|
Cliquer sur l'icône pour personnaliser · JPG PNG WEBP · max 128×128 px
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="pop-led" id="pop-led"></div>
|
<div class="pop-led" id="pop-led"></div>
|
||||||
|
|||||||
+21
-2
@@ -30,8 +30,27 @@ const Popups = (() => {
|
|||||||
document.getElementById('icon-upload').onchange = async (e) => {
|
document.getElementById('icon-upload').onchange = async (e) => {
|
||||||
const file = e.target.files[0];
|
const file = e.target.files[0];
|
||||||
if (!file) return;
|
if (!file) return;
|
||||||
await API.uploadIcon(agentId, file);
|
const hint = document.getElementById('icon-hint');
|
||||||
img.src = API.iconUrl(agentId) + '?t=' + Date.now();
|
try {
|
||||||
|
await API.uploadIcon(agentId, file);
|
||||||
|
const ts = '?t=' + Date.now();
|
||||||
|
img.src = API.iconUrl(agentId) + ts;
|
||||||
|
img.style.display = 'block';
|
||||||
|
document.getElementById('pop-icon-fa').style.display = 'none';
|
||||||
|
const tileImg = document.querySelector(`#tile-${CSS.escape(agentId)} .t-icon img`);
|
||||||
|
if (tileImg) tileImg.src = API.iconUrl(agentId) + ts;
|
||||||
|
} catch (err) {
|
||||||
|
if (hint) {
|
||||||
|
hint.style.color = 'var(--err)';
|
||||||
|
hint.textContent = 'Erreur : ' + (err.message || 'téléversement échoué');
|
||||||
|
setTimeout(() => {
|
||||||
|
hint.style.color = '';
|
||||||
|
hint.textContent = 'Cliquer sur l\'icône pour personnaliser · JPG PNG WEBP · max 128×128 px';
|
||||||
|
}, 4000);
|
||||||
|
}
|
||||||
|
} finally {
|
||||||
|
e.target.value = '';
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
// Uptime
|
// Uptime
|
||||||
|
|||||||
@@ -3,6 +3,7 @@ package handlers
|
|||||||
import (
|
import (
|
||||||
"bytes"
|
"bytes"
|
||||||
"image"
|
"image"
|
||||||
|
_ "image/gif"
|
||||||
_ "image/jpeg"
|
_ "image/jpeg"
|
||||||
"image/png"
|
"image/png"
|
||||||
"io"
|
"io"
|
||||||
@@ -11,6 +12,7 @@ import (
|
|||||||
|
|
||||||
"github.com/disintegration/imaging"
|
"github.com/disintegration/imaging"
|
||||||
"github.com/user/nanometrics/server/db"
|
"github.com/user/nanometrics/server/db"
|
||||||
|
_ "golang.org/x/image/webp"
|
||||||
)
|
)
|
||||||
|
|
||||||
const maxIconSize = 128
|
const maxIconSize = 128
|
||||||
|
|||||||
@@ -2,6 +2,7 @@ server {
|
|||||||
listen 80;
|
listen 80;
|
||||||
root /usr/share/nginx/html;
|
root /usr/share/nginx/html;
|
||||||
index index.html;
|
index index.html;
|
||||||
|
client_max_body_size 10m;
|
||||||
|
|
||||||
location /api/ {
|
location /api/ {
|
||||||
proxy_pass http://server:8080;
|
proxy_pass http://server:8080;
|
||||||
|
|||||||
Reference in New Issue
Block a user