diff --git a/ChatTwo/Http/Processing.cs b/ChatTwo/Http/Processing.cs index 183dc02..75b0394 100644 --- a/ChatTwo/Http/Processing.cs +++ b/ChatTwo/Http/Processing.cs @@ -63,7 +63,7 @@ public class Processing // The emote name should be safe, it is checked against a list from BTTV. // Still sanitizing it for the extra safety. if (image is { Failed: false }) - return $""; + return $""; } var colour = text.Foreground; diff --git a/ChatTwo/Http/RouteController.cs b/ChatTwo/Http/RouteController.cs index 8025a64..4826d01 100644 --- a/ChatTwo/Http/RouteController.cs +++ b/ChatTwo/Http/RouteController.cs @@ -100,13 +100,21 @@ public class RouteController var emote = EmoteCache.GetEmote(name); - if (emote is not { IsLoaded: true }) + if (emote is null) { ctx.Response.StatusCode = 400; await ctx.Response.Send("Emote not valid."); return; } + // Wait for the emote to be loaded a maximum of 5 times + var timeout = 5; + while (!emote.IsLoaded && timeout > 0) + { + timeout--; + await Task.Delay(25); + } + ctx.Response.Headers.Add("Cache-Control", "max-age=86400"); await ctx.Response.Send(emote.RawData); } diff --git a/ChatTwo/Http/static/start.js b/ChatTwo/Http/static/start.js index 8fde8be..25d2d79 100644 --- a/ChatTwo/Http/static/start.js +++ b/ChatTwo/Http/static/start.js @@ -180,12 +180,17 @@ async function AddGfdStylesheet(gfdPath, texPath) { const gfdPromise = LoadGfd(gfdPath); const texUrl = URL.createObjectURL(await texPromise); const gfd = await gfdPromise; + let width = 0; + let height = 0; let stylesheets = []; for (const entry of gfd) { if (entry.width * entry.height <= 0) continue; + width = entry.width; + height = entry.height; + if (entry.redirect !== 0) { stylesheets[entry.redirect][0].push(entry.id); continue; @@ -210,7 +215,7 @@ async function AddGfdStylesheet(gfdPath, texPath) { ]; } - let stylesheet = ".gfd-icon::before { content: ''; display: inline-block; overflow: hidden; vertical-align: top; height:0; }"; + let stylesheet = ".gfd-icon::before { content: ''; display: inline-block; overflow: hidden; vertical-align: top; height:0; }\n"; for (const entry of stylesheets) { if (!entry) continue; @@ -218,6 +223,8 @@ async function AddGfdStylesheet(gfdPath, texPath) { stylesheet += `\n${entry[0].map(x => `.gfd-icon.gfd-icon-${x}::before`).join(', ')}{${entry[1]};}`; stylesheet += `\n${entry[0].map(x => `.gfd-icon.gfd-icon-hq-${x}::before`).join(', ')}{${entry[2]};}`; } + stylesheet += "\n.emote-icon { content: ''; display: inline-block; overflow: hidden; vertical-align: top; }"; + stylesheet += `\n.emote-icon.emote-icon-hq {width: ${width * 2}px; height: ${height * 2}px; margin-bottom: -40px}`; const styleNode = document.createElement("style"); styleNode.type = "text/css";