Fetch artwork offered only over http for the https page (#90)
Through ipodderx.sdf1.net the page is https, the browser upgrades an http:// image to https, and a host with no https, such as The Secret Cabal's CDN, answers nothing, so no artwork. On an https page, the page now asks /api/art for those, and ipx fetches them. It only fetches an address some feed or entry names as its artwork, and only an image, up to 5 MB, so the route cannot be pointed at anything else on the network. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -145,9 +145,14 @@ const tint=name=>{ let h=0; for(const c of name||'?') h=(h*31+c.charCodeAt(0))>>
|
||||
function tileHTML(name,cls){
|
||||
return `<div class="art ini ${cls||''}" style="--tint:${tint(name)}">${esc(initials(name))}</div>`;
|
||||
}
|
||||
/// On the https page, the browser upgrades an http:// image to https, and a host that has no
|
||||
/// https shows nothing (issue #90); ipx fetches those itself.
|
||||
function artSrc(url: string){
|
||||
return location.protocol==='https:'&&/^http:\/\//i.test(url) ? '/api/art?u='+encodeURIComponent(url) : url;
|
||||
}
|
||||
function artHTML(url: string | null, name: string, cls?: string){
|
||||
return url
|
||||
? `<img class="art ${cls||''}" src="${esc(url)}" alt="" loading="lazy" onerror="this.outerHTML=${esc(JSON.stringify(tileHTML(name,cls)))}">`
|
||||
? `<img class="art ${cls||''}" src="${esc(artSrc(url))}" alt="" loading="lazy" onerror="this.outerHTML=${esc(JSON.stringify(tileHTML(name,cls)))}">`
|
||||
: tileHTML(name,cls);
|
||||
}
|
||||
/// A folder's tile is its first four shows' art. With fewer than four to show, the folder's own.
|
||||
@@ -156,7 +161,7 @@ function folderArt(f,kids){
|
||||
if(art.length<4) return artHTML(f.image,f.title||f.id);
|
||||
// Tinted underneath, so art that fails to load leaves colour behind rather than a hole.
|
||||
return `<div class="art ini mosaic" style="--tint:${tint(f.title||f.id)}">${art.map(c=>
|
||||
`<img src="${esc(c.image)}" alt="" loading="lazy" onerror="this.style.visibility='hidden'">`).join('')}</div>`;
|
||||
`<img src="${esc(artSrc(c.image))}" alt="" loading="lazy" onerror="this.style.visibility='hidden'">`).join('')}</div>`;
|
||||
}
|
||||
|
||||
/// The sidebar slides over the page on a phone, so it needs a scrim to tap away.
|
||||
|
||||
Reference in New Issue
Block a user