vod frog, frog with the vods
5
fork

Configure Feed

Select the types of activity you want to include in your feed.

remove play button, spacebar toggles play/pause

+18 -35
+2 -2
.svelte-kit/generated/server/internal.js
··· 22 22 service_worker_options: undefined, 23 23 server_error_boundaries: false, 24 24 templates: { 25 - app: ({ head, body, assets, nonce, env }) => "<!doctype html>\n<html lang=\"en\">\n <head>\n <meta charset=\"utf-8\" />\n <link rel=\"icon\" href=\"/frogcursor.png\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n <title>vod frog</title>\n " + head + "\n </head>\n <body>\n <div style=\"display: contents\">" + body + "</div>\n </body>\n</html>\n", 25 + app: ({ head, body, assets, nonce, env }) => "<!doctype html>\n<html lang=\"en\">\n <head>\n <meta charset=\"utf-8\" />\n <link rel=\"icon\" href=\"/frogicon.png\" />\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1\" />\n <title>vod frog</title>\n " + head + "\n </head>\n <body>\n <div style=\"display: contents\">" + body + "</div>\n </body>\n</html>\n", 26 26 error: ({ status, message }) => "<!doctype html>\n<html lang=\"en\">\n\t<head>\n\t\t<meta charset=\"utf-8\" />\n\t\t<title>" + message + "</title>\n\n\t\t<style>\n\t\t\tbody {\n\t\t\t\t--bg: white;\n\t\t\t\t--fg: #222;\n\t\t\t\t--divider: #ccc;\n\t\t\t\tbackground: var(--bg);\n\t\t\t\tcolor: var(--fg);\n\t\t\t\tfont-family:\n\t\t\t\t\tsystem-ui,\n\t\t\t\t\t-apple-system,\n\t\t\t\t\tBlinkMacSystemFont,\n\t\t\t\t\t'Segoe UI',\n\t\t\t\t\tRoboto,\n\t\t\t\t\tOxygen,\n\t\t\t\t\tUbuntu,\n\t\t\t\t\tCantarell,\n\t\t\t\t\t'Open Sans',\n\t\t\t\t\t'Helvetica Neue',\n\t\t\t\t\tsans-serif;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\theight: 100vh;\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t.error {\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tmax-width: 32rem;\n\t\t\t\tmargin: 0 1rem;\n\t\t\t}\n\n\t\t\t.status {\n\t\t\t\tfont-weight: 200;\n\t\t\t\tfont-size: 3rem;\n\t\t\t\tline-height: 1;\n\t\t\t\tposition: relative;\n\t\t\t\ttop: -0.05rem;\n\t\t\t}\n\n\t\t\t.message {\n\t\t\t\tborder-left: 1px solid var(--divider);\n\t\t\t\tpadding: 0 0 0 1rem;\n\t\t\t\tmargin: 0 0 0 1rem;\n\t\t\t\tmin-height: 2.5rem;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t}\n\n\t\t\t.message h1 {\n\t\t\t\tfont-weight: 400;\n\t\t\t\tfont-size: 1em;\n\t\t\t\tmargin: 0;\n\t\t\t}\n\n\t\t\t@media (prefers-color-scheme: dark) {\n\t\t\t\tbody {\n\t\t\t\t\t--bg: #222;\n\t\t\t\t\t--fg: #ddd;\n\t\t\t\t\t--divider: #666;\n\t\t\t\t}\n\t\t\t}\n\t\t</style>\n\t</head>\n\t<body>\n\t\t<div class=\"error\">\n\t\t\t<span class=\"status\">" + status + "</span>\n\t\t\t<div class=\"message\">\n\t\t\t\t<h1>" + message + "</h1>\n\t\t\t</div>\n\t\t</div>\n\t</body>\n</html>\n" 27 27 }, 28 - version_hash: "tbmlr0" 28 + version_hash: "139m7hs" 29 29 }; 30 30 31 31 export async function get_hooks() {
+1 -1
.svelte-kit/non-ambient.d.ts
··· 38 38 }; 39 39 Pathname(): "/"; 40 40 ResolvedPathname(): `${"" | `/${string}`}${ReturnType<AppTypes['Pathname']>}`; 41 - Asset(): "/favicon.png" | "/favicon.svg" | "/frogcursor-small.png" | "/frogcursor.png" | "/frogeye.png" | "/froggie.png" | "/froggiejump.png" | "/froggiestand.png" | "/robots.txt" | string & {}; 41 + Asset(): "/favicon.png" | "/favicon.svg" | "/frogcursor-small.png" | "/frogcursor.png" | "/frogeye.png" | "/froggie.png" | "/froggiejump.png" | "/froggiestand.png" | "/frogicon.png" | "/robots.txt" | string & {}; 42 42 } 43 43 }
spec/frogicon.png

This is a binary file and will not be displayed.

+1 -1
src/app.html
··· 2 2 <html lang="en"> 3 3 <head> 4 4 <meta charset="utf-8" /> 5 - <link rel="icon" href="/frogcursor.png" /> 5 + <link rel="icon" href="/frogicon.png" /> 6 6 <meta name="viewport" content="width=device-width, initial-scale=1" /> 7 7 <title>vod frog</title> 8 8 %sveltekit.head%
+13 -30
src/lib/VideoPlayer.svelte
··· 188 188 window.removeEventListener("mouseup", onScrubUp); 189 189 } 190 190 191 + function onKeyDown(e: KeyboardEvent) { 192 + if (e.code === 'Space' && videoEl) { 193 + e.preventDefault(); 194 + togglePlay(); 195 + } 196 + } 197 + 198 + $effect(() => { 199 + window.addEventListener('keydown', onKeyDown); 200 + return () => window.removeEventListener('keydown', onKeyDown); 201 + }); 202 + 191 203 function onMouseActivity() { 192 204 showControls = true; 193 205 if (hideTimeout) clearTimeout(hideTimeout); ··· 261 273 <img src="/frogeye.png" alt="fullscreen" class="frogeye" /> 262 274 </button> 263 275 264 - <!-- Play/pause overlay on center when paused --> 265 - {#if !playing} 266 - <button class="play-overlay" onclick={togglePlay}> 267 - <svg viewBox="0 0 24 24" 268 - ><path d="M8 5v14l11-7z" fill="currentColor" /></svg 269 - > 270 - </button> 271 - {/if} 276 + 272 277 273 278 {#if errorMsg} 274 279 <div class="error-overlay">{errorMsg}</div> ··· 378 383 filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4)); 379 384 } 380 385 381 - /* Center play button when paused */ 382 - .play-overlay { 383 - all: unset; 384 - position: absolute; 385 - inset: 0; 386 - display: flex; 387 - align-items: center; 388 - justify-content: center; 389 - cursor: pointer; 390 - } 391 386 392 - .play-overlay svg { 393 - width: 64px; 394 - height: 64px; 395 - color: #39ff44; 396 - filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5)); 397 - transition: transform 0.15s ease; 398 - } 399 - 400 - .play-overlay:hover svg { 401 - transform: scale(1.1); 402 - color: #ff3992; 403 - } 404 387 405 388 .error-overlay { 406 389 position: absolute;
+1 -1
src/routes/+layout.svelte
··· 6 6 </script> 7 7 8 8 <svelte:head> 9 - <link rel="icon" href="/frogcursor.png" /> 9 + <link rel="icon" href="/frogicon.png" /> 10 10 <style> 11 11 /* Cursor must be in global head style to override everything */ 12 12 *, *::before, *::after {
static/frogicon.png

This is a binary file and will not be displayed.