NFT display enhancement
Closed this issue · 2 comments
Displaying NFT only works with standard static images (PNG, JPEG, etc.)
However, a non negligible type of NFT are those outside this category and they seem most of the time completely ignored (except by Pool.pm).
Here are the metadata of a dynamic and interactive NFT written in HTML, as a link to IPFS + web argument
{
Design: {
Model: "Sad",
Series: "Smiley",
Size: "8x8x3"
},
Seeds: [
"cb65-4867-2302-43c9",
"0c30-3849-a759-461c",
"0000-3c65-df21-2904"
],
TimeSpan: {
After: "59,20,8",
Before: -2
},
Value: 7,
files: [
{
mediaType: "text/html",
name: "Viewer",
src: [
"ipfs://ipfs/QmPcPPZhNwomMXffbVGKx1HwD3ZWSQwtamPm1Lzv4HgtrW?data=",
"eyJuYW1lIjogIlNhZCIsICJzZXJpZXMiOiAiU21pbGV5IiwgIm51bWJlciI6IDEw",
"MjEsICJ3aWR0aCI6IDgsICJoZWlnaHQiOiA4LCAic2VlZHMiOiBbImNiNjUtNDg2",
"Ny0yMzAyLTQzYzkiLCAiMGMzMC0zODQ5LWE3NTktNDYxYyIsICIwMDAwLTNjNjUt",
"ZGYyMS0yOTA0Il0sICJjb2xvcnMiOiBbInJnYmEoMC4wLDAuMCwwLjAsMC4wKSIs",
"ICJyZ2IoMjUxLDE5NCwxNjgpIiwgInJnYigyNDksMjMxLDMyKSIsICJyZ2IoMjIs",
"MjMsMjYpIiwgInJnYigyNTUsMTMyLDM4KSIsICJyZ2IoMTI5LDMsMykiLCAicmdi",
"KDI1MCwyNTMsMjU1KSIsICJyZ2IoMTQ2LDY0LDMpIl0sICJvcmlnaW4iOiAtMiwg",
"InNjb3JlIjogNywgImxvbmdldml0eSI6IFs1OSwgMjAsIDhdLCAibnVtX3BpeGVs",
"cyI6IDUyfQ=="
]
}
],
image: [
"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8",
"uwAAAAd0lEQVR4nGOQidMAIj59EayIXZwLKMuAXxFElgFZ6OdzBQj636KGLM6ArO",
"LX3/8QRUAGsjoGZBVi4lIQRUDG70Mr4OoY0CxCthGnokZmZiDCrgjIB0pMcmCGKA",
"UysCiCq8O0C0URRB0coQQBMEyBiEBg4lcEkQUAEbJ7naWpvxsAAAAASUVORK5CYI",
"I="
],
mediaType: "image/png",
}
Pool.pm renders it perfectly, has in the following picture, while ccvault only displays a big grey empty square.
Even the thumbnail (which is a very small icon) is completely blurred with ccvault and becomes ugly.
A token holder certainly feels the need to display its collection of NFT nicely, and it means dealing with all sort of contents.
The Mesmerizer was also a HTML file completely on chain. It renders on the web version of ccvaultio, but not in the extension, due to content policies of the browser. Didn't had the time yet to look into it.
"Didn't had the time yet to look into it." -> "close this issue" :-)