add video embeds

This commit is contained in:
MathMan05 2024-09-05 10:59:31 -05:00
parent c282c6c6f6
commit 715eae7ff2
3 changed files with 65 additions and 8 deletions

View file

@ -20,6 +20,8 @@ class Embed {
return this.generateImage(); return this.generateImage();
case "link": case "link":
return this.generateLink(); return this.generateLink();
case "video":
console.log(this);
case "article": case "article":
return this.generateArticle(); return this.generateArticle();
default: default:
@ -209,11 +211,35 @@ class Embed {
} }
if (this.json.thumbnail) { if (this.json.thumbnail) {
const img = document.createElement("img"); const img = document.createElement("img");
if (this.json.thumbnail.width && this.json.thumbnail.width) {
let scale = 1;
const inch = 96;
scale = Math.max(scale, this.json.thumbnail.width / inch / 4);
scale = Math.max(scale, this.json.thumbnail.height / inch / 3);
this.json.thumbnail.width /= scale;
this.json.thumbnail.height /= scale;
img.style.width = this.json.thumbnail.width + "px";
img.style.height = this.json.thumbnail.height + "px";
}
img.classList.add("bigembedimg"); img.classList.add("bigembedimg");
img.onclick = function () { if (this.json.video) {
const full = new Dialog(["img", img.src, ["fit"]]); img.onclick = async () => {
full.show(); img.remove();
}; const iframe = document.createElement("iframe");
iframe.src = this.json.video.url;
if (this.json.thumbnail.width && this.json.thumbnail.width) {
iframe.style.width = this.json.thumbnail.width + "px";
iframe.style.height = this.json.thumbnail.height + "px";
}
div.append(iframe);
};
}
else {
img.onclick = async () => {
const full = new Dialog(["img", img.src, ["fit"]]);
full.show();
};
}
img.src = this.json.thumbnail.proxy_url || this.json.thumbnail.url; img.src = this.json.thumbnail.proxy_url || this.json.thumbnail.url;
div.append(img); div.append(img);
} }

View file

@ -23,6 +23,8 @@ class Embed{
return this.generateImage(); return this.generateImage();
case"link": case"link":
return this.generateLink(); return this.generateLink();
case "video":
console.log(this);
case"article": case"article":
return this.generateArticle(); return this.generateArticle();
default: default:
@ -217,11 +219,34 @@ class Embed{
} }
if(this.json.thumbnail){ if(this.json.thumbnail){
const img=document.createElement("img"); const img=document.createElement("img");
if(this.json.thumbnail.width&&this.json.thumbnail.width){
let scale=1;
const inch=96;
scale=Math.max(scale,this.json.thumbnail.width/inch/4);
scale=Math.max(scale,this.json.thumbnail.height/inch/3);
this.json.thumbnail.width/=scale;
this.json.thumbnail.height/=scale;
img.style.width=this.json.thumbnail.width+"px";
img.style.height=this.json.thumbnail.height+"px";
}
img.classList.add("bigembedimg"); img.classList.add("bigembedimg");
img.onclick=function(){ if(this.json.video){
const full=new Dialog(["img",img.src,["fit"]]); img.onclick=async ()=>{
full.show(); img.remove();
}; const iframe=document.createElement("iframe");
iframe.src=this.json.video.url;
if(this.json.thumbnail.width&&this.json.thumbnail.width){
iframe.style.width=this.json.thumbnail.width+"px";
iframe.style.height=this.json.thumbnail.height+"px";
}
div.append(iframe);
};
}else{
img.onclick=async ()=>{
const full=new Dialog(["img",img.src,["fit"]]);
full.show();
};
}
img.src=this.json.thumbnail.proxy_url||this.json.thumbnail.url; img.src=this.json.thumbnail.proxy_url||this.json.thumbnail.url;
div.append(img); div.append(img);
} }

View file

@ -332,6 +332,12 @@ type embedjson={
}, },
provider:{ provider:{
name:string, name:string,
},
video:{
url: string,
width?: number|null,
height?: number|null,
proxy_url?: string
} }
} }
type presencejson={ type presencejson={