commit a3f32e775922b28e34a35e2d52a18cd881e6605c
parent 2d3a7aa151b5129a68b3477865c9231e5611604a
Author: Hunter
Date:   Thu, 18 Jun 2026 20:09:37 -0400

style stock images table

Diffstat:
MREADME.md | 14+++++++-------
Mpages/avocado_warehouse/index.html | 2+-
Mpages/my_homepage/index.html | 10+++++-----
Mpages/pizza_heaven/index.html | 8++++----
Rresources/images/bg_bricks.gif -> resources/images/Backgrounds/bg_bricks.gif | 0
Rresources/images/bg_checker.gif -> resources/images/Backgrounds/bg_checker.gif | 0
Rresources/images/bg_daisies.gif -> resources/images/Backgrounds/bg_daisies.gif | 0
Rresources/images/bg_desert.gif -> resources/images/Backgrounds/bg_desert.gif | 0
Rresources/images/bg_stars.gif -> resources/images/Backgrounds/bg_stars.gif | 0
Rresources/images/bg_trippy.gif -> resources/images/Backgrounds/bg_trippy.gif | 0
Rresources/images/bg_water.gif -> resources/images/Backgrounds/bg_water.gif | 0
Rresources/images/divider_blissey.gif -> resources/images/Dividers/blissey.gif | 0
Rresources/images/divider_blue_flowers.gif -> resources/images/Dividers/blue_flowers.gif | 0
Rresources/images/divider_blue_flowers2.gif -> resources/images/Dividers/blue_flowers2.gif | 0
Rresources/images/divider_rainbow.gif -> resources/images/Dividers/rainbow.gif | 0
Rresources/images/divider_rainbow_dots.gif -> resources/images/Dividers/rainbow_dots.gif | 0
Rresources/images/divider_red_flowers.gif -> resources/images/Dividers/red_flowers.gif | 0
Rresources/images/divider_wildflowers.gif -> resources/images/Dividers/wildflowers.gif | 0
Rresources/images/divider_yellow_flowers.gif -> resources/images/Dividers/yellow_flowers.gif | 0
Rresources/images/furby1.gif -> resources/images/Furby/furby1.gif | 0
Rresources/images/furby2.gif -> resources/images/Furby/furby2.gif | 0
Rresources/images/furby3.gif -> resources/images/Furby/furby3.gif | 0
Rresources/images/furby4.gif -> resources/images/Furby/furby4.gif | 0
Rresources/images/furby5.gif -> resources/images/Furby/furby5.gif | 0
Rresources/images/furby6.gif -> resources/images/Furby/furby6.gif | 0
Rresources/images/furby7.gif -> resources/images/Furby/furby7.gif | 0
Rresources/images/furby8.gif -> resources/images/Furby/furby8.gif | 0
Rresources/images/furby9.gif -> resources/images/Furby/furby9.gif | 0
Rresources/images/furby_banner.gif -> resources/images/Furby/furby_banner.gif | 0
Rresources/images/furby_clouds.gif -> resources/images/Furby/furby_clouds.gif | 0
Rresources/images/furby_field.gif -> resources/images/Furby/furby_field.gif | 0
Rresources/images/furby_pink.gif -> resources/images/Furby/furby_pink.gif | 0
Rresources/images/furby_shocked.gif -> resources/images/Furby/furby_shocked.gif | 0
Rresources/images/furby_weird.gif -> resources/images/Furby/furby_weird.gif | 0
Rresources/images/furbyland.gif -> resources/images/Furby/furbyland.gif | 0
Rresources/images/halloween_ghost.gif -> resources/images/Halloween/ghost.gif | 0
Rresources/images/halloween_jackolantern.gif -> resources/images/Halloween/jackolantern.gif | 0
Rresources/images/halloween_jackolantern2.gif -> resources/images/Halloween/jackolantern2.gif | 0
Rresources/images/hamster_angry.gif -> resources/images/Hamster/hamster_angry.gif | 0
Rresources/images/hamster_bath.gif -> resources/images/Hamster/hamster_bath.gif | 0
Rresources/images/hamster_building.gif -> resources/images/Hamster/hamster_building.gif | 0
Rresources/images/hamster_chewing.gif -> resources/images/Hamster/hamster_chewing.gif | 0
Rresources/images/hamster_confused.gif -> resources/images/Hamster/hamster_confused.gif | 0
Rresources/images/hamster_dance.gif -> resources/images/Hamster/hamster_dance.gif | 0
Rresources/images/hamster_dig.gif -> resources/images/Hamster/hamster_dig.gif | 0
Rresources/images/hamster_hacking.gif -> resources/images/Hamster/hamster_hacking.gif | 0
Rresources/images/hamster_happy.gif -> resources/images/Hamster/hamster_happy.gif | 0
Rresources/images/hamster_itchy.gif -> resources/images/Hamster/hamster_itchy.gif | 0
Rresources/images/hamster_monch.gif -> resources/images/Hamster/hamster_monch.gif | 0
Rresources/images/hamster_nunchucks.gif -> resources/images/Hamster/hamster_nunchucks.gif | 0
Rresources/images/hamster_omp.gif -> resources/images/Hamster/hamster_omp.gif | 0
Rresources/images/hamster_scared.gif -> resources/images/Hamster/hamster_scared.gif | 0
Rresources/images/hamster_sleep.gif -> resources/images/Hamster/hamster_sleep.gif | 0
Rresources/images/hamster_sleepy.gif -> resources/images/Hamster/hamster_sleepy.gif | 0
Rresources/images/24.gif -> resources/images/Other/24.gif | 0
Rresources/images/alarm_alarmed.gif -> resources/images/Other/alarm_alarmed.gif | 0
Rresources/images/alarm_snoozed.gif -> resources/images/Other/alarm_snoozed.gif | 0
Rresources/images/alien_ufo_crash.gif -> resources/images/Other/alien_ufo_crash.gif | 0
Rresources/images/alien_ufo_float.gif -> resources/images/Other/alien_ufo_float.gif | 0
Rresources/images/banana_dance.gif -> resources/images/Other/banana_dance.gif | 0
Rresources/images/bang.gif -> resources/images/Other/bang.gif | 0
Rresources/images/bigN.gif -> resources/images/Other/bigN.gif | 0
Rresources/images/birdbath.gif -> resources/images/Other/birdbath.gif | 0
Rresources/images/birds_chickadee.gif -> resources/images/Other/birds_chickadee.gif | 0
Rresources/images/birds_chicken.gif -> resources/images/Other/birds_chicken.gif | 0
Rresources/images/birds_dove.gif -> resources/images/Other/birds_dove.gif | 0
Rresources/images/birds_dove2.gif -> resources/images/Other/birds_dove2.gif | 0
Rresources/images/birdsnest.gif -> resources/images/Other/birdsnest.gif | 0
Rresources/images/bizzy_wizzy.gif -> resources/images/Other/bizzy_wizzy.gif | 0
Rresources/images/blahblah.gif -> resources/images/Other/blahblah.gif | 0
Rresources/images/body_spin.gif -> resources/images/Other/body_spin.gif | 0
Rresources/images/bonk.gif -> resources/images/Other/bonk.gif | 0
Rresources/images/brachiosaurus.gif -> resources/images/Other/brachiosaurus.gif | 0
Rresources/images/bright_idea.gif -> resources/images/Other/bright_idea.gif | 0
Rresources/images/butterflies.gif -> resources/images/Other/butterflies.gif | 0
Rresources/images/butterfly_blue.gif -> resources/images/Other/butterfly_blue.gif | 0
Rresources/images/butterfly_monarch.gif -> resources/images/Other/butterfly_monarch.gif | 0
Rresources/images/cactus.gif -> resources/images/Other/cactus.gif | 0
Rresources/images/cat.gif -> resources/images/Other/cat.gif | 0
Rresources/images/caterpillar.gif -> resources/images/Other/caterpillar.gif | 0
Rresources/images/cd.gif -> resources/images/Other/cd.gif | 0
Rresources/images/christmas_garland.gif -> resources/images/Other/christmas_garland.gif | 0
Rresources/images/christmas_holly.gif -> resources/images/Other/christmas_holly.gif | 0
Rresources/images/christmas_wreath.gif -> resources/images/Other/christmas_wreath.gif | 0
Rresources/images/christmas_wreath2.gif -> resources/images/Other/christmas_wreath2.gif | 0
Rresources/images/christmas_wreath3.gif -> resources/images/Other/christmas_wreath3.gif | 0
Rresources/images/click_here.gif -> resources/images/Other/click_here.gif | 0
Rresources/images/clippy.gif -> resources/images/Other/clippy.gif | 0
Rresources/images/coffee.gif -> resources/images/Other/coffee.gif | 0
Rresources/images/computer.gif -> resources/images/Other/computer.gif | 0
Rresources/images/construct.gif -> resources/images/Other/construct.gif | 0
Rresources/images/cow.gif -> resources/images/Other/cow.gif | 0
Rresources/images/curtain.gif -> resources/images/Other/curtain.gif | 0
Rresources/images/daisies.gif -> resources/images/Other/daisies.gif | 0
Rresources/images/dancingman.gif -> resources/images/Other/dancingman.gif | 0
Rresources/images/dancingwoman.gif -> resources/images/Other/dancingwoman.gif | 0
Rresources/images/dark_tidings.gif -> resources/images/Other/dark_tidings.gif | 0
Rresources/images/devil.gif -> resources/images/Other/devil.gif | 0
Aresources/images/Other/disco_ball.gif | 0
Rresources/images/dollhouse.gif -> resources/images/Other/dollhouse.gif | 0
Rresources/images/donut_blink.gif -> resources/images/Other/donut_blink.gif | 0
Rresources/images/donut_drink.gif -> resources/images/Other/donut_drink.gif | 0
Rresources/images/donut_love.gif -> resources/images/Other/donut_love.gif | 0
Rresources/images/doraemon.gif -> resources/images/Other/doraemon.gif | 0
Rresources/images/doraemon_stamp.gif -> resources/images/Other/doraemon_stamp.gif | 0
Rresources/images/dvd.gif -> resources/images/Other/dvd.gif | 0
Rresources/images/email.gif -> resources/images/Other/email.gif | 0
Rresources/images/email2.gif -> resources/images/Other/email2.gif | 0
Rresources/images/fish_bass.gif -> resources/images/Other/fish_bass.gif | 0
Rresources/images/fish_rainbow_trout.gif -> resources/images/Other/fish_rainbow_trout.gif | 0
Rresources/images/fish_salmon.gif -> resources/images/Other/fish_salmon.gif | 0
Rresources/images/fish_trout.gif -> resources/images/Other/fish_trout.gif | 0
Rresources/images/fish_trout2.gif -> resources/images/Other/fish_trout2.gif | 0
Rresources/images/flaming_chariot.gif -> resources/images/Other/flaming_chariot.gif | 0
Rresources/images/flowers.gif -> resources/images/Other/flowers.gif | 0
Rresources/images/frog_car.gif -> resources/images/Other/frog_car.gif | 0
Rresources/images/gaia.gif -> resources/images/Other/gaia.gif | 0
Rresources/images/garf.gif -> resources/images/Other/garf.gif | 0
Rresources/images/gc_icon.gif -> resources/images/Other/gc_icon.gif | 0
Rresources/images/hacker_skull.gif -> resources/images/Other/hacker_skull.gif | 0
Rresources/images/hacking.gif -> resources/images/Other/hacking.gif | 0
Rresources/images/hamtaro.gif -> resources/images/Other/hamtaro.gif | 0
Rresources/images/hellokitty.gif -> resources/images/Other/hellokitty.gif | 0
Aresources/images/Other/hint.gif | 0
Rresources/images/home.gif -> resources/images/Other/home.gif | 0
Rresources/images/kings.gif -> resources/images/Other/kings.gif | 0
Rresources/images/kogu.gif -> resources/images/Other/kogu.gif | 0
Rresources/images/kori.gif -> resources/images/Other/kori.gif | 0
Rresources/images/lil_buddha.gif -> resources/images/Other/lil_buddha.gif | 0
Rresources/images/lil_demon.gif -> resources/images/Other/lil_demon.gif | 0
Rresources/images/mac.gif -> resources/images/Other/mac.gif | 0
Rresources/images/mailbox.gif -> resources/images/Other/mailbox.gif | 0
Rresources/images/mario64.gif -> resources/images/Other/mario64.gif | 0
Rresources/images/modchips.gif -> resources/images/Other/modchips.gif | 0
Rresources/images/neopet.gif -> resources/images/Other/neopet.gif | 0
Rresources/images/ness.gif -> resources/images/Other/ness.gif | 0
Rresources/images/new_bunny.gif -> resources/images/Other/new_bunny.gif | 0
Rresources/images/orbit.gif -> resources/images/Other/orbit.gif | 0
Rresources/images/pika_construction.gif -> resources/images/Other/pika_construction.gif | 0
Rresources/images/pink_clock.gif -> resources/images/Other/pink_clock.gif | 0
Rresources/images/pizza_pointer.gif -> resources/images/Other/pizza_pointer.gif | 0
Rresources/images/pizza_pointer2.gif -> resources/images/Other/pizza_pointer2.gif | 0
Rresources/images/pochacco.gif -> resources/images/Other/pochacco.gif | 0
Rresources/images/providence.gif -> resources/images/Other/providence.gif | 0
Rresources/images/ratrace.gif -> resources/images/Other/ratrace.gif | 0
Rresources/images/ratrace2.gif -> resources/images/Other/ratrace2.gif | 0
Rresources/images/rilakkuma_dance.gif -> resources/images/Other/rilakkuma_dance.gif | 0
Rresources/images/ring.gif -> resources/images/Other/ring.gif | 0
Rresources/images/sailor_moon.gif -> resources/images/Other/sailor_moon.gif | 0
Rresources/images/samus.gif -> resources/images/Other/samus.gif | 0
Rresources/images/scared_mouse.gif -> resources/images/Other/scared_mouse.gif | 0
Rresources/images/skateboard.gif -> resources/images/Other/skateboard.gif | 0
Rresources/images/smiley_bar.gif -> resources/images/Other/smiley_bar.gif | 0
Rresources/images/smiley_dancing.gif -> resources/images/Other/smiley_dancing.gif | 0
Rresources/images/smiling_pizza.gif -> resources/images/Other/smiling_pizza.gif | 0
Rresources/images/spacedog.gif -> resources/images/Other/spacedog.gif | 0
Rresources/images/spinninbrain.gif -> resources/images/Other/spinninbrain.gif | 0
Rresources/images/squidward.gif -> resources/images/Other/squidward.gif | 0
Rresources/images/stonehenge.gif -> resources/images/Other/stonehenge.gif | 0
Rresources/images/sun_claymation.gif -> resources/images/Other/sun_claymation.gif | 0
Rresources/images/sun_coffee.gif -> resources/images/Other/sun_coffee.gif | 0
Rresources/images/sun_smiling.gif -> resources/images/Other/sun_smiling.gif | 0
Rresources/images/sun_welcome.gif -> resources/images/Other/sun_welcome.gif | 0
Rresources/images/surfin.gif -> resources/images/Other/surfin.gif | 0
Rresources/images/tamas.gif -> resources/images/Other/tamas.gif | 0
Rresources/images/telephone.gif -> resources/images/Other/telephone.gif | 0
Rresources/images/tooth.gif -> resources/images/Other/tooth.gif | 0
Rresources/images/trashcan_burp.gif -> resources/images/Other/trashcan_burp.gif | 0
Rresources/images/trashcan_chase.gif -> resources/images/Other/trashcan_chase.gif | 0
Rresources/images/trashcan_chomp.gif -> resources/images/Other/trashcan_chomp.gif | 0
Rresources/images/underconstruction.gif -> resources/images/Other/underconstruction.gif | 0
Rresources/images/welcome.gif -> resources/images/Other/welcome.gif | 0
Rresources/images/windows.gif -> resources/images/Other/windows.gif | 0
Rresources/images/wishingwell.gif -> resources/images/Other/wishingwell.gif | 0
Rresources/images/wizard.gif -> resources/images/Other/wizard.gif | 0
Rresources/images/y2k.gif -> resources/images/Other/y2k.gif | 0
Rresources/images/tux_badboy.gif -> resources/images/Tux/tux_badboy.gif | 0
Rresources/images/tux_blink.gif -> resources/images/Tux/tux_blink.gif | 0
Rresources/images/tux_chug.gif -> resources/images/Tux/tux_chug.gif | 0
Rresources/images/tux_got_root.gif -> resources/images/Tux/tux_got_root.gif | 0
Rresources/images/tux_hacking.gif -> resources/images/Tux/tux_hacking.gif | 0
Rresources/images/tux_linux_power.gif -> resources/images/Tux/tux_linux_power.gif | 0
Rresources/images/ww_9volt.gif -> resources/images/WarioWare/9volt.gif | 0
Rresources/images/ww_ana.gif -> resources/images/WarioWare/ana.gif | 0
Rresources/images/ww_crygor.gif -> resources/images/WarioWare/crygor.gif | 0
Rresources/images/ww_dribble.gif -> resources/images/WarioWare/dribble.gif | 0
Rresources/images/ww_jimmy.gif -> resources/images/WarioWare/jimmy.gif | 0
Rresources/images/ww_kat.gif -> resources/images/WarioWare/kat.gif | 0
Rresources/images/ww_mona.gif -> resources/images/WarioWare/mona.gif | 0
Rresources/images/ww_orbulon.gif -> resources/images/WarioWare/orbulon.gif | 0
Rresources/images/ww_spitz.gif -> resources/images/WarioWare/spitz.gif | 0
Rresources/images/ww_wario.gif -> resources/images/WarioWare/wario.gif | 0
Dresources/images/disco_ball.gif | 0
Dresources/images/hint.gif | 0
Mresources/js/main.js | 114+++++++++++++++++++++++++++++++++++++++++++++++++------------------------------
Mresources/resource-manifest.json | 568+++++++++++++++++++++++++++----------------------------------------------------
Mresources/scripts/generate_resource_manifest.py | 21++++++++++++++-------
197 files changed, 292 insertions(+), 445 deletions(-)

diff --git a/README.md b/README.md @@ -3,7 +3,7 @@ Craft handmade websites in their natural habitat (your web browser). <a href="https://hunterirving.github.io/web_workshop/"> -<img src="resources/images/pika_construction.gif" width="155"></a><br><br> +<img src="resources/images/Other/pika_construction.gif" width="155"></a><br><br> Web Workshop was born as a teaching tool for web development classes, with the goal of making web publishing more accessible, especially to those who have never written code before. @@ -29,7 +29,7 @@ Recently, Web Workshop has become an editor of choice for <a href="https://html. - Your work is automatically saved, and restored when you reload the page 3. Press `⌘ + S` to export your work as an HTML file (`⌘ + O` to open an existing file) -<img src="resources/images/hacking.gif" width="300"> +<img src="resources/images/Other/hacking.gif" width="300"> ## Stock Images A library of stock images is included for your convenience. To browse them, type `<img src="?">` anywhere in the editor pane, then click to select an image from the resulting table. @@ -40,7 +40,7 @@ A library of stock images is included for your convenience. To browse them, type Alternatively, if you know the name of the image you'd like to use, you can add it to your project like so: `<img src="coffee.gif">`. -<img src="resources/images/coffee.gif"> +<img src="resources/images/Other/coffee.gif"> ## Boilerplate Type `<!>` to insert the following starter HTML: @@ -64,7 +64,7 @@ Type `<!>` to insert the following starter HTML: - to toggle <b>line wrapping</b>, press <kbd>F2</kbd> (enabled by default) ## Installation for Offline Use -<img src="resources/images/hint.gif" width=60px> +<img src="resources/images/Other/hint.gif" width=60px> <i> Wanna make websites on your phone? Try installing Web Workshop as a <a href="https://hunterirving.github.io/web_workshop/pages/pwa">Progressive Web App</a>!</i> (You can install it as a desktop app, too...) @@ -73,17 +73,17 @@ Wanna make websites on your phone? Try installing Web Workshop as a <a href="htt - [CodeMirror 6](https://codemirror.net/) - [GitHub Dark Theme for CodeMirror](https://github.com/fsegurai/codemirror-themes) -<img src="resources/images/bright_idea.gif"> +<img src="resources/images/Other/bright_idea.gif"> ## License GPLv3 (see <a href="LICENSE">LICENSE</a> for details). <br> -<img src="resources/images/bigN.gif" width=110px> +<img src="resources/images/Other/bigN.gif" width=110px> ## Contributing Feel free to open issues or submit pull requests for improvements! -<img src="resources/images/gaia.gif" width=180px> +<img src="resources/images/Other/gaia.gif" width=180px> diff --git a/pages/avocado_warehouse/index.html b/pages/avocado_warehouse/index.html @@ -36,7 +36,7 @@ </ul> <center> <h1 style="color:goldenrod">Try it Now!! Our yummy avocado coffee beverage</h1> - <img src="https://hunterirving.github.io/web_workshop/resources/images/coffee.gif" style="width:200px; height:200px;"> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/coffee.gif" style="width:200px; height:200px;"> <i><p>"What the? Eww..." - Jen Lu</p></i> <hr> <p>Avocados in the courtroom?<br>This vid made us L-O-L<br>(Laff Out Loud)</p> diff --git a/pages/my_homepage/index.html b/pages/my_homepage/index.html @@ -29,21 +29,21 @@ Welcome to my World Wide Web Site 🌞 </h1> <center> - <img src="https://hunterirving.github.io/web_workshop/resources/images/welcome.gif" width=400px> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/welcome.gif" width=400px> <p> brace yourself. you are in for a wild ride!! </p> - <a href="https://hunterirving.com"><img src="https://hunterirving.github.io/web_workshop/resources/images/windows.gif" style="padding:10px;"></a> + <a href="https://hunterirving.com"><img src="https://hunterirving.github.io/web_workshop/resources/images/Other/windows.gif" style="padding:10px;"></a> <h3>enter by "clicking" on the window above....<br>if you <i><span style="color:red">dare</span></i>.....!</h3> - <img src="https://hunterirving.github.io/web_workshop/resources/images/scared_mouse.gif" style="transform: scaleX(-1); margin-bottom:25px"><img src="https://hunterirving.github.io/web_workshop/resources/images/mac.png" width=200px> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/scared_mouse.gif" style="transform: scaleX(-1); margin-bottom:25px"><img src="https://hunterirving.github.io/web_workshop/resources/images/mac.png" width=200px> </center> <h1 class="heading"> Here are a few of my favorite images... 🍀 </h1> <center> - <img src="https://hunterirving.github.io/web_workshop/resources/images/cd.gif" style="width:150px"> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/cd.gif" style="width:150px"> <br><br> - <img src="https://hunterirving.github.io/web_workshop/resources/images/pika_construction.gif" style="width:50%; image-rendering: pixelated;"> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/pika_construction.gif" style="width:50%; image-rendering: pixelated;"> </center> </body> </html> \ No newline at end of file diff --git a/pages/pizza_heaven/index.html b/pages/pizza_heaven/index.html @@ -46,9 +46,9 @@ <b><span style="color: red; text-shadow: 3px 3px 5px white;">THE BEST</span> <span style="color:green; text-shadow: 3px 3px 5px white;">PIZZA</span> <span style="color:white">IN THE WORLD</span></b> </p> <hr> - <img src="https://hunterirving.github.io/web_workshop/resources/images/smiling_pizza.gif"> - <img src="https://hunterirving.github.io/web_workshop/resources/images/gaia.gif" width=200px> - <img src="https://hunterirving.github.io/web_workshop/resources/images/smiling_pizza.gif"> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/smiling_pizza.gif"> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/gaia.gif" width=200px> + <img src="https://hunterirving.github.io/web_workshop/resources/images/Other/smiling_pizza.gif"> <div class="block"> <marquee scrollamount=20>AYY, I'M MAKIN' PIZZA HERE !</marquee> </div> @@ -92,6 +92,6 @@ But you better not disparage our pizza pies again, capeeshe??? </p> <br><br> - <center><img src="https://hunterirving.github.io/web_workshop/resources/images/smiling_pizza.gif"></center><br><br> + <center><img src="https://hunterirving.github.io/web_workshop/resources/images/Other/smiling_pizza.gif"></center><br><br> </body> </html> \ No newline at end of file diff --git a/resources/images/bg_bricks.gif b/resources/images/Backgrounds/bg_bricks.gif Binary files differ. diff --git a/resources/images/bg_checker.gif b/resources/images/Backgrounds/bg_checker.gif Binary files differ. diff --git a/resources/images/bg_daisies.gif b/resources/images/Backgrounds/bg_daisies.gif Binary files differ. diff --git a/resources/images/bg_desert.gif b/resources/images/Backgrounds/bg_desert.gif Binary files differ. diff --git a/resources/images/bg_stars.gif b/resources/images/Backgrounds/bg_stars.gif Binary files differ. diff --git a/resources/images/bg_trippy.gif b/resources/images/Backgrounds/bg_trippy.gif Binary files differ. diff --git a/resources/images/bg_water.gif b/resources/images/Backgrounds/bg_water.gif Binary files differ. diff --git a/resources/images/divider_blissey.gif b/resources/images/Dividers/blissey.gif Binary files differ. diff --git a/resources/images/divider_blue_flowers.gif b/resources/images/Dividers/blue_flowers.gif Binary files differ. diff --git a/resources/images/divider_blue_flowers2.gif b/resources/images/Dividers/blue_flowers2.gif Binary files differ. diff --git a/resources/images/divider_rainbow.gif b/resources/images/Dividers/rainbow.gif Binary files differ. diff --git a/resources/images/divider_rainbow_dots.gif b/resources/images/Dividers/rainbow_dots.gif Binary files differ. diff --git a/resources/images/divider_red_flowers.gif b/resources/images/Dividers/red_flowers.gif Binary files differ. diff --git a/resources/images/divider_wildflowers.gif b/resources/images/Dividers/wildflowers.gif Binary files differ. diff --git a/resources/images/divider_yellow_flowers.gif b/resources/images/Dividers/yellow_flowers.gif Binary files differ. diff --git a/resources/images/furby1.gif b/resources/images/Furby/furby1.gif Binary files differ. diff --git a/resources/images/furby2.gif b/resources/images/Furby/furby2.gif Binary files differ. diff --git a/resources/images/furby3.gif b/resources/images/Furby/furby3.gif Binary files differ. diff --git a/resources/images/furby4.gif b/resources/images/Furby/furby4.gif Binary files differ. diff --git a/resources/images/furby5.gif b/resources/images/Furby/furby5.gif Binary files differ. diff --git a/resources/images/furby6.gif b/resources/images/Furby/furby6.gif Binary files differ. diff --git a/resources/images/furby7.gif b/resources/images/Furby/furby7.gif Binary files differ. diff --git a/resources/images/furby8.gif b/resources/images/Furby/furby8.gif Binary files differ. diff --git a/resources/images/furby9.gif b/resources/images/Furby/furby9.gif Binary files differ. diff --git a/resources/images/furby_banner.gif b/resources/images/Furby/furby_banner.gif Binary files differ. diff --git a/resources/images/furby_clouds.gif b/resources/images/Furby/furby_clouds.gif Binary files differ. diff --git a/resources/images/furby_field.gif b/resources/images/Furby/furby_field.gif Binary files differ. diff --git a/resources/images/furby_pink.gif b/resources/images/Furby/furby_pink.gif Binary files differ. diff --git a/resources/images/furby_shocked.gif b/resources/images/Furby/furby_shocked.gif Binary files differ. diff --git a/resources/images/furby_weird.gif b/resources/images/Furby/furby_weird.gif Binary files differ. diff --git a/resources/images/furbyland.gif b/resources/images/Furby/furbyland.gif Binary files differ. diff --git a/resources/images/halloween_ghost.gif b/resources/images/Halloween/ghost.gif Binary files differ. diff --git a/resources/images/halloween_jackolantern.gif b/resources/images/Halloween/jackolantern.gif Binary files differ. diff --git a/resources/images/halloween_jackolantern2.gif b/resources/images/Halloween/jackolantern2.gif Binary files differ. diff --git a/resources/images/hamster_angry.gif b/resources/images/Hamster/hamster_angry.gif Binary files differ. diff --git a/resources/images/hamster_bath.gif b/resources/images/Hamster/hamster_bath.gif Binary files differ. diff --git a/resources/images/hamster_building.gif b/resources/images/Hamster/hamster_building.gif Binary files differ. diff --git a/resources/images/hamster_chewing.gif b/resources/images/Hamster/hamster_chewing.gif Binary files differ. diff --git a/resources/images/hamster_confused.gif b/resources/images/Hamster/hamster_confused.gif Binary files differ. diff --git a/resources/images/hamster_dance.gif b/resources/images/Hamster/hamster_dance.gif Binary files differ. diff --git a/resources/images/hamster_dig.gif b/resources/images/Hamster/hamster_dig.gif Binary files differ. diff --git a/resources/images/hamster_hacking.gif b/resources/images/Hamster/hamster_hacking.gif Binary files differ. diff --git a/resources/images/hamster_happy.gif b/resources/images/Hamster/hamster_happy.gif Binary files differ. diff --git a/resources/images/hamster_itchy.gif b/resources/images/Hamster/hamster_itchy.gif Binary files differ. diff --git a/resources/images/hamster_monch.gif b/resources/images/Hamster/hamster_monch.gif Binary files differ. diff --git a/resources/images/hamster_nunchucks.gif b/resources/images/Hamster/hamster_nunchucks.gif Binary files differ. diff --git a/resources/images/hamster_omp.gif b/resources/images/Hamster/hamster_omp.gif Binary files differ. diff --git a/resources/images/hamster_scared.gif b/resources/images/Hamster/hamster_scared.gif Binary files differ. diff --git a/resources/images/hamster_sleep.gif b/resources/images/Hamster/hamster_sleep.gif Binary files differ. diff --git a/resources/images/hamster_sleepy.gif b/resources/images/Hamster/hamster_sleepy.gif Binary files differ. diff --git a/resources/images/24.gif b/resources/images/Other/24.gif Binary files differ. diff --git a/resources/images/alarm_alarmed.gif b/resources/images/Other/alarm_alarmed.gif Binary files differ. diff --git a/resources/images/alarm_snoozed.gif b/resources/images/Other/alarm_snoozed.gif Binary files differ. diff --git a/resources/images/alien_ufo_crash.gif b/resources/images/Other/alien_ufo_crash.gif Binary files differ. diff --git a/resources/images/alien_ufo_float.gif b/resources/images/Other/alien_ufo_float.gif Binary files differ. diff --git a/resources/images/banana_dance.gif b/resources/images/Other/banana_dance.gif Binary files differ. diff --git a/resources/images/bang.gif b/resources/images/Other/bang.gif Binary files differ. diff --git a/resources/images/bigN.gif b/resources/images/Other/bigN.gif Binary files differ. diff --git a/resources/images/birdbath.gif b/resources/images/Other/birdbath.gif Binary files differ. diff --git a/resources/images/birds_chickadee.gif b/resources/images/Other/birds_chickadee.gif Binary files differ. diff --git a/resources/images/birds_chicken.gif b/resources/images/Other/birds_chicken.gif Binary files differ. diff --git a/resources/images/birds_dove.gif b/resources/images/Other/birds_dove.gif Binary files differ. diff --git a/resources/images/birds_dove2.gif b/resources/images/Other/birds_dove2.gif Binary files differ. diff --git a/resources/images/birdsnest.gif b/resources/images/Other/birdsnest.gif Binary files differ. diff --git a/resources/images/bizzy_wizzy.gif b/resources/images/Other/bizzy_wizzy.gif Binary files differ. diff --git a/resources/images/blahblah.gif b/resources/images/Other/blahblah.gif Binary files differ. diff --git a/resources/images/body_spin.gif b/resources/images/Other/body_spin.gif Binary files differ. diff --git a/resources/images/bonk.gif b/resources/images/Other/bonk.gif Binary files differ. diff --git a/resources/images/brachiosaurus.gif b/resources/images/Other/brachiosaurus.gif Binary files differ. diff --git a/resources/images/bright_idea.gif b/resources/images/Other/bright_idea.gif Binary files differ. diff --git a/resources/images/butterflies.gif b/resources/images/Other/butterflies.gif Binary files differ. diff --git a/resources/images/butterfly_blue.gif b/resources/images/Other/butterfly_blue.gif Binary files differ. diff --git a/resources/images/butterfly_monarch.gif b/resources/images/Other/butterfly_monarch.gif Binary files differ. diff --git a/resources/images/cactus.gif b/resources/images/Other/cactus.gif Binary files differ. diff --git a/resources/images/cat.gif b/resources/images/Other/cat.gif Binary files differ. diff --git a/resources/images/caterpillar.gif b/resources/images/Other/caterpillar.gif Binary files differ. diff --git a/resources/images/cd.gif b/resources/images/Other/cd.gif Binary files differ. diff --git a/resources/images/christmas_garland.gif b/resources/images/Other/christmas_garland.gif Binary files differ. diff --git a/resources/images/christmas_holly.gif b/resources/images/Other/christmas_holly.gif Binary files differ. diff --git a/resources/images/christmas_wreath.gif b/resources/images/Other/christmas_wreath.gif Binary files differ. diff --git a/resources/images/christmas_wreath2.gif b/resources/images/Other/christmas_wreath2.gif Binary files differ. diff --git a/resources/images/christmas_wreath3.gif b/resources/images/Other/christmas_wreath3.gif Binary files differ. diff --git a/resources/images/click_here.gif b/resources/images/Other/click_here.gif Binary files differ. diff --git a/resources/images/clippy.gif b/resources/images/Other/clippy.gif Binary files differ. diff --git a/resources/images/coffee.gif b/resources/images/Other/coffee.gif Binary files differ. diff --git a/resources/images/computer.gif b/resources/images/Other/computer.gif Binary files differ. diff --git a/resources/images/construct.gif b/resources/images/Other/construct.gif Binary files differ. diff --git a/resources/images/cow.gif b/resources/images/Other/cow.gif Binary files differ. diff --git a/resources/images/curtain.gif b/resources/images/Other/curtain.gif Binary files differ. diff --git a/resources/images/daisies.gif b/resources/images/Other/daisies.gif Binary files differ. diff --git a/resources/images/dancingman.gif b/resources/images/Other/dancingman.gif Binary files differ. diff --git a/resources/images/dancingwoman.gif b/resources/images/Other/dancingwoman.gif Binary files differ. diff --git a/resources/images/dark_tidings.gif b/resources/images/Other/dark_tidings.gif Binary files differ. diff --git a/resources/images/devil.gif b/resources/images/Other/devil.gif Binary files differ. diff --git a/resources/images/Other/disco_ball.gif b/resources/images/Other/disco_ball.gif Binary files differ. diff --git a/resources/images/dollhouse.gif b/resources/images/Other/dollhouse.gif Binary files differ. diff --git a/resources/images/donut_blink.gif b/resources/images/Other/donut_blink.gif Binary files differ. diff --git a/resources/images/donut_drink.gif b/resources/images/Other/donut_drink.gif Binary files differ. diff --git a/resources/images/donut_love.gif b/resources/images/Other/donut_love.gif Binary files differ. diff --git a/resources/images/doraemon.gif b/resources/images/Other/doraemon.gif Binary files differ. diff --git a/resources/images/doraemon_stamp.gif b/resources/images/Other/doraemon_stamp.gif Binary files differ. diff --git a/resources/images/dvd.gif b/resources/images/Other/dvd.gif Binary files differ. diff --git a/resources/images/email.gif b/resources/images/Other/email.gif Binary files differ. diff --git a/resources/images/email2.gif b/resources/images/Other/email2.gif Binary files differ. diff --git a/resources/images/fish_bass.gif b/resources/images/Other/fish_bass.gif Binary files differ. diff --git a/resources/images/fish_rainbow_trout.gif b/resources/images/Other/fish_rainbow_trout.gif Binary files differ. diff --git a/resources/images/fish_salmon.gif b/resources/images/Other/fish_salmon.gif Binary files differ. diff --git a/resources/images/fish_trout.gif b/resources/images/Other/fish_trout.gif Binary files differ. diff --git a/resources/images/fish_trout2.gif b/resources/images/Other/fish_trout2.gif Binary files differ. diff --git a/resources/images/flaming_chariot.gif b/resources/images/Other/flaming_chariot.gif Binary files differ. diff --git a/resources/images/flowers.gif b/resources/images/Other/flowers.gif Binary files differ. diff --git a/resources/images/frog_car.gif b/resources/images/Other/frog_car.gif Binary files differ. diff --git a/resources/images/gaia.gif b/resources/images/Other/gaia.gif Binary files differ. diff --git a/resources/images/garf.gif b/resources/images/Other/garf.gif Binary files differ. diff --git a/resources/images/gc_icon.gif b/resources/images/Other/gc_icon.gif Binary files differ. diff --git a/resources/images/hacker_skull.gif b/resources/images/Other/hacker_skull.gif Binary files differ. diff --git a/resources/images/hacking.gif b/resources/images/Other/hacking.gif Binary files differ. diff --git a/resources/images/hamtaro.gif b/resources/images/Other/hamtaro.gif Binary files differ. diff --git a/resources/images/hellokitty.gif b/resources/images/Other/hellokitty.gif Binary files differ. diff --git a/resources/images/Other/hint.gif b/resources/images/Other/hint.gif Binary files differ. diff --git a/resources/images/home.gif b/resources/images/Other/home.gif Binary files differ. diff --git a/resources/images/kings.gif b/resources/images/Other/kings.gif Binary files differ. diff --git a/resources/images/kogu.gif b/resources/images/Other/kogu.gif Binary files differ. diff --git a/resources/images/kori.gif b/resources/images/Other/kori.gif Binary files differ. diff --git a/resources/images/lil_buddha.gif b/resources/images/Other/lil_buddha.gif Binary files differ. diff --git a/resources/images/lil_demon.gif b/resources/images/Other/lil_demon.gif Binary files differ. diff --git a/resources/images/mac.gif b/resources/images/Other/mac.gif Binary files differ. diff --git a/resources/images/mailbox.gif b/resources/images/Other/mailbox.gif Binary files differ. diff --git a/resources/images/mario64.gif b/resources/images/Other/mario64.gif Binary files differ. diff --git a/resources/images/modchips.gif b/resources/images/Other/modchips.gif Binary files differ. diff --git a/resources/images/neopet.gif b/resources/images/Other/neopet.gif Binary files differ. diff --git a/resources/images/ness.gif b/resources/images/Other/ness.gif Binary files differ. diff --git a/resources/images/new_bunny.gif b/resources/images/Other/new_bunny.gif Binary files differ. diff --git a/resources/images/orbit.gif b/resources/images/Other/orbit.gif Binary files differ. diff --git a/resources/images/pika_construction.gif b/resources/images/Other/pika_construction.gif Binary files differ. diff --git a/resources/images/pink_clock.gif b/resources/images/Other/pink_clock.gif Binary files differ. diff --git a/resources/images/pizza_pointer.gif b/resources/images/Other/pizza_pointer.gif Binary files differ. diff --git a/resources/images/pizza_pointer2.gif b/resources/images/Other/pizza_pointer2.gif Binary files differ. diff --git a/resources/images/pochacco.gif b/resources/images/Other/pochacco.gif Binary files differ. diff --git a/resources/images/providence.gif b/resources/images/Other/providence.gif Binary files differ. diff --git a/resources/images/ratrace.gif b/resources/images/Other/ratrace.gif Binary files differ. diff --git a/resources/images/ratrace2.gif b/resources/images/Other/ratrace2.gif Binary files differ. diff --git a/resources/images/rilakkuma_dance.gif b/resources/images/Other/rilakkuma_dance.gif Binary files differ. diff --git a/resources/images/ring.gif b/resources/images/Other/ring.gif Binary files differ. diff --git a/resources/images/sailor_moon.gif b/resources/images/Other/sailor_moon.gif Binary files differ. diff --git a/resources/images/samus.gif b/resources/images/Other/samus.gif Binary files differ. diff --git a/resources/images/scared_mouse.gif b/resources/images/Other/scared_mouse.gif Binary files differ. diff --git a/resources/images/skateboard.gif b/resources/images/Other/skateboard.gif Binary files differ. diff --git a/resources/images/smiley_bar.gif b/resources/images/Other/smiley_bar.gif Binary files differ. diff --git a/resources/images/smiley_dancing.gif b/resources/images/Other/smiley_dancing.gif Binary files differ. diff --git a/resources/images/smiling_pizza.gif b/resources/images/Other/smiling_pizza.gif Binary files differ. diff --git a/resources/images/spacedog.gif b/resources/images/Other/spacedog.gif Binary files differ. diff --git a/resources/images/spinninbrain.gif b/resources/images/Other/spinninbrain.gif Binary files differ. diff --git a/resources/images/squidward.gif b/resources/images/Other/squidward.gif Binary files differ. diff --git a/resources/images/stonehenge.gif b/resources/images/Other/stonehenge.gif Binary files differ. diff --git a/resources/images/sun_claymation.gif b/resources/images/Other/sun_claymation.gif Binary files differ. diff --git a/resources/images/sun_coffee.gif b/resources/images/Other/sun_coffee.gif Binary files differ. diff --git a/resources/images/sun_smiling.gif b/resources/images/Other/sun_smiling.gif Binary files differ. diff --git a/resources/images/sun_welcome.gif b/resources/images/Other/sun_welcome.gif Binary files differ. diff --git a/resources/images/surfin.gif b/resources/images/Other/surfin.gif Binary files differ. diff --git a/resources/images/tamas.gif b/resources/images/Other/tamas.gif Binary files differ. diff --git a/resources/images/telephone.gif b/resources/images/Other/telephone.gif Binary files differ. diff --git a/resources/images/tooth.gif b/resources/images/Other/tooth.gif Binary files differ. diff --git a/resources/images/trashcan_burp.gif b/resources/images/Other/trashcan_burp.gif Binary files differ. diff --git a/resources/images/trashcan_chase.gif b/resources/images/Other/trashcan_chase.gif Binary files differ. diff --git a/resources/images/trashcan_chomp.gif b/resources/images/Other/trashcan_chomp.gif Binary files differ. diff --git a/resources/images/underconstruction.gif b/resources/images/Other/underconstruction.gif Binary files differ. diff --git a/resources/images/welcome.gif b/resources/images/Other/welcome.gif Binary files differ. diff --git a/resources/images/windows.gif b/resources/images/Other/windows.gif Binary files differ. diff --git a/resources/images/wishingwell.gif b/resources/images/Other/wishingwell.gif Binary files differ. diff --git a/resources/images/wizard.gif b/resources/images/Other/wizard.gif Binary files differ. diff --git a/resources/images/y2k.gif b/resources/images/Other/y2k.gif Binary files differ. diff --git a/resources/images/tux_badboy.gif b/resources/images/Tux/tux_badboy.gif Binary files differ. diff --git a/resources/images/tux_blink.gif b/resources/images/Tux/tux_blink.gif Binary files differ. diff --git a/resources/images/tux_chug.gif b/resources/images/Tux/tux_chug.gif Binary files differ. diff --git a/resources/images/tux_got_root.gif b/resources/images/Tux/tux_got_root.gif Binary files differ. diff --git a/resources/images/tux_hacking.gif b/resources/images/Tux/tux_hacking.gif Binary files differ. diff --git a/resources/images/tux_linux_power.gif b/resources/images/Tux/tux_linux_power.gif Binary files differ. diff --git a/resources/images/ww_9volt.gif b/resources/images/WarioWare/9volt.gif Binary files differ. diff --git a/resources/images/ww_ana.gif b/resources/images/WarioWare/ana.gif Binary files differ. diff --git a/resources/images/ww_crygor.gif b/resources/images/WarioWare/crygor.gif Binary files differ. diff --git a/resources/images/ww_dribble.gif b/resources/images/WarioWare/dribble.gif Binary files differ. diff --git a/resources/images/ww_jimmy.gif b/resources/images/WarioWare/jimmy.gif Binary files differ. diff --git a/resources/images/ww_kat.gif b/resources/images/WarioWare/kat.gif Binary files differ. diff --git a/resources/images/ww_mona.gif b/resources/images/WarioWare/mona.gif Binary files differ. diff --git a/resources/images/ww_orbulon.gif b/resources/images/WarioWare/orbulon.gif Binary files differ. diff --git a/resources/images/ww_spitz.gif b/resources/images/WarioWare/spitz.gif Binary files differ. diff --git a/resources/images/ww_wario.gif b/resources/images/WarioWare/wario.gif Binary files differ. diff --git a/resources/images/disco_ball.gif b/resources/images/disco_ball.gif Binary files differ. diff --git a/resources/images/hint.gif b/resources/images/hint.gif Binary files differ. diff --git a/resources/js/main.js b/resources/js/main.js @@ -3,15 +3,18 @@ let editorView; const preview = document.getElementById('preview'); // Stock images loaded from manifest - can be referenced by bare filename -let stockImages = new Map(); // lowercase -> original filename +let stockImages = new Map(); // lowercase filename -> path relative to images/ // Load stock image list from manifest const stockImagesReady = fetch('resources/resource-manifest.json') .then(r => r.json()) .then(manifest => { manifest.images.forEach(path => { - const filename = path.split('/').pop(); - stockImages.set(filename.toLowerCase(), filename); + const marker = '/resources/images/'; + const i = path.indexOf(marker); + const rel = i === -1 ? path.split('/').pop() : path.slice(i + marker.length); + const filename = rel.split('/').pop(); + stockImages.set(filename.toLowerCase(), rel); }); }) .catch(() => console.log('Could not load resource manifest')); @@ -21,38 +24,88 @@ function rewriteBareImageSrcs(html) { // Rewrite <img src="filename.ext"> html = html.replace(/(<img\s[^>]*\bsrc\s*=\s*["'])([^"'/:]+\.(gif|png|jpg|jpeg|svg|webp))(["'])/gi, (match, before, filename, ext, after) => { - const original = stockImages.get(filename.toLowerCase()); - if (original) { - return before + 'resources/images/' + original + after; + const rel = stockImages.get(filename.toLowerCase()); + if (rel) { + return before + 'resources/images/' + rel + after; } return match; }); // Rewrite url(filename.ext) in CSS html = html.replace(/(url\(\s*["']?)([^"')/:]+\.(gif|png|jpg|jpeg|svg|webp))(["']?\s*\))/gi, (match, before, filename, ext, after) => { - const original = stockImages.get(filename.toLowerCase()); - if (original) { - return before + 'resources/images/' + original + after; + const rel = stockImages.get(filename.toLowerCase()); + if (rel) { + return before + 'resources/images/' + rel + after; } return match; }); return html; } -// Expand <img src="?"> tags into gallery table +const galleryStyle = `<style> +.stock-image-gallery { -webkit-tap-highlight-color: transparent; } +.stock-image-gallery details { padding-top: 5px; padding-bottom: 5px; background: #fff; } +.stock-image-gallery summary { cursor: pointer; user-select: none; padding: 0px 0 10px 10px; font-weight: 600; font-size: 1.9rem; list-style: none; background: #fff; } +.stock-image-gallery summary::-webkit-details-marker { display: none; } +.stock-image-gallery summary::before { content: ""; display: inline-block; width: 0.5em; height: 0.5em; margin-right: 0.45em; vertical-align: 0.09em; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); transform: translateX(0.08em); } +.stock-image-gallery details[open] > summary::before { clip-path: polygon(0 0, 100% 0, 50% 100%); transform: translateY(0.08em); } +.stock-image-gallery table, .stock-image-gallery td { border: none; } +.stock-image-gallery td { text-align: center; vertical-align: middle; font-size: 1.4rem; overflow-wrap: break-word; } +.stock-image-gallery tr:nth-child(odd) { background: #e1e7fcff; } +.stock-image-gallery tr:nth-child(even) { background: #fff; } +.stock-image-gallery img { display: block; margin: 0 auto; image-rendering: pixelated; } +.stock-image-gallery summary span, .stock-image-gallery .stock-image-name { color: #000; } +</style>`; + +// Preview chrome (overscroll reset + fullscreen toggle), injected into the srcdoc so it +// renders immediately at parse time instead of waiting for the iframe's load event (which +// blocks on all gallery images finishing). Inline onclick avoids needing a post-load listener. +const previewChrome = '<style>* { overscroll-behavior: none !important; } .iframe-fullscreen-toggle { position: fixed; top: 5px; right: 5px; z-index: 10000; background: rgba(0, 0, 0, 0.2); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); color: white; border: none; border-radius: 4px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.2s; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); -webkit-tap-highlight-color: transparent; outline: none; user-select: none; } .iframe-fullscreen-toggle svg { filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.3)); opacity: 0.8; transition: opacity 0.2s; } @media (hover: hover) and (pointer: fine) { .iframe-fullscreen-toggle:hover { background: rgba(0, 0, 0, 0.35); } .iframe-fullscreen-toggle:hover svg { opacity: 1; } }</style><button id="fullscreenToggle" class="iframe-fullscreen-toggle" title="Toggle fullscreen" onclick="parent.postMessage(\'toggleFullscreen\', \'*\')"><svg width="20" height="20" viewBox="0 0 14 14" fill="white"><path d="M 7,14 H 5 v 5 h 5 V 17 H 7 Z M 5,10 H 7 V 7 h 3 V 5 H 5 Z m 12,7 h -3 v 2 h 5 V 14 H 17 Z M 14,5 v 2 h 3 v 3 h 2 V 5 Z" transform="translate(-5,-5)"/></svg></button>'; + +// Order categories alphabetically, with Other last +function compareCategories(a, b) { + if (a === 'Other') return 1; + if (b === 'Other') return -1; + return a.localeCompare(b); +} + +// Natural sort so "2 Ivysaur" comes before "10 Caterpie" +function compareNatural(a, b) { + return a.localeCompare(b, undefined, { numeric: true, sensitivity: 'base' }); +} + +// Expand <img src="?"> tags into a categorized gallery of stock images function expandImagesTag(html) { return html.replace(/<img\s+src\s*=\s*["']?\?["']?\s*\/?>/gi, () => { - const images = Array.from(stockImages.values()).sort(); - if (images.length === 0) return '<p>No images available</p>'; - const rows = images.map(filename => - `<tr class="stock-image-row" data-filename="${filename}" style="cursor:pointer;user-select:none;"><td>${filename}</td><td style="text-align:center;"><img src="resources/images/${filename}" style="max-width:100%;height:auto;pointer-events:none;"></td></tr>` - ).join(''); - return `<table class="stock-image-table" border="1" cellpadding="8" cellspacing="0" style="max-width:100%;box-sizing:border-box;table-layout:fixed;"><colgroup><col style="width:50%"><col style="width:50%"></colgroup>${rows}</table>`; + if (stockImages.size === 0) return '<p>No images available</p>'; + + // Group relative paths by their top-level category folder + const categories = new Map(); + for (const rel of stockImages.values()) { + const slash = rel.indexOf('/'); + const category = slash === -1 ? 'Other' : rel.slice(0, slash); + const filename = rel.split('/').pop(); + if (!categories.has(category)) categories.set(category, []); + categories.get(category).push({ rel, filename }); + } + + const sections = Array.from(categories.keys()).sort(compareCategories).map(category => { + const items = categories.get(category).sort((a, b) => compareNatural(a.filename, b.filename)); + const rows = items.map(({ rel, filename }) => { + // prefer wrapping after _ and . over breaking mid-word + const displayName = filename.replace(/[_.]/g, '$&<wbr>'); + return `<tr class="stock-image-row" data-filename="${filename}" style="cursor:pointer;user-select:none;"><td><span class="stock-image-name">${displayName}</span></td><td><img src="resources/images/${rel}" style="max-width:100%;height:auto;pointer-events:none;"></td></tr>`; + }).join(''); + const table = `<table class="stock-image-table" cellpadding="8" cellspacing="0" style="width:100%;max-width:100%;box-sizing:border-box;table-layout:fixed;"><colgroup><col style="width:50%"><col style="width:50%"></colgroup>${rows}</table>`; + return `<details><summary><span>${category}</span></summary>${table}</details>`; + }).join(''); + + return `${galleryStyle}<div class="stock-image-gallery">${sections}</div>`; }); } const editorPane = document.querySelector('.editor-pane'); const previewPane = document.querySelector('.preview-pane'); -const storageKey = 'html-lab-content'; +const storageKey = 'web-workshop-content'; let isFullscreen = false; let showLineNumbers = false; let enableLineWrapping = false; @@ -170,7 +223,7 @@ function updatePreview() { // Use srcdoc to create a completely fresh document context // Expand <images> tag and rewrite bare stock image filenames const processedCode = expandImagesTag(rewriteBareImageSrcs(code.trim())) || '<!DOCTYPE html><html><head></head><body></body></html>'; - preview.srcdoc = processedCode; + preview.srcdoc = processedCode + previewChrome; // Add our functionality after the iframe loads const onLoad = () => { @@ -178,31 +231,6 @@ function updatePreview() { const doc = preview.contentDocument; if (!doc) return; - // Add CSS for overscroll and button - const style = doc.createElement('style'); - style.textContent = '* { overscroll-behavior: none !important; } .iframe-fullscreen-toggle { position: fixed; top: 5px; right: 5px; z-index: 10000; background: rgba(0, 0, 0, 0.2); color: white; border: none; border-radius: 4px; width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color 0.2s; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2); -webkit-tap-highlight-color: transparent; outline: none; user-select: none; } .iframe-fullscreen-toggle svg { filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.3)); opacity: 0.8; transition: opacity 0.2s; } @media (hover: hover) and (pointer: fine) { .iframe-fullscreen-toggle:hover { background: rgba(0, 0, 0, 0.35); } .iframe-fullscreen-toggle:hover svg { opacity: 1; } }'; - doc.head.appendChild(style); - - // Create fullscreen button - const existingButton = doc.getElementById('fullscreenToggle'); - if (existingButton) existingButton.remove(); - - const button = doc.createElement('button'); - button.id = 'fullscreenToggle'; - button.className = 'iframe-fullscreen-toggle'; - button.title = 'Toggle fullscreen'; - - // Use inline SVG to avoid being affected by user's img styles - button.innerHTML = '<svg width="20" height="20" viewBox="0 0 14 14" fill="white"><path d="M 7,14 H 5 v 5 h 5 V 17 H 7 Z M 5,10 H 7 V 7 h 3 V 5 H 5 Z m 12,7 h -3 v 2 h 5 V 14 H 17 Z M 14,5 v 2 h 3 v 3 h 2 V 5 Z" transform="translate(-5,-5)"/></svg>'; - - button.addEventListener('click', function() { - parent.postMessage('toggleFullscreen', '*'); - }); - - if (doc.body) { - doc.body.appendChild(button); - } - // Add click handlers for stock image table rows const stockImageRows = doc.querySelectorAll('.stock-image-row'); stockImageRows.forEach(row => { diff --git a/resources/resource-manifest.json b/resources/resource-manifest.json @@ -1,387 +1,9 @@ { "generated_at": "auto-generated by GitHub Actions", - "images": [ - "/web_workshop/resources/images/24.gif", - "/web_workshop/resources/images/alarm_alarmed.gif", - "/web_workshop/resources/images/alarm_snoozed.gif", - "/web_workshop/resources/images/alien_ufo_crash.gif", - "/web_workshop/resources/images/alien_ufo_float.gif", - "/web_workshop/resources/images/banana_dance.gif", - "/web_workshop/resources/images/bang.gif", - "/web_workshop/resources/images/bg_bricks.gif", - "/web_workshop/resources/images/bg_checker.gif", - "/web_workshop/resources/images/bg_daisies.gif", - "/web_workshop/resources/images/bg_desert.gif", - "/web_workshop/resources/images/bg_stars.gif", - "/web_workshop/resources/images/bg_trippy.gif", - "/web_workshop/resources/images/bg_water.gif", - "/web_workshop/resources/images/bigN.gif", - "/web_workshop/resources/images/birdbath.gif", - "/web_workshop/resources/images/birds_chickadee.gif", - "/web_workshop/resources/images/birds_chicken.gif", - "/web_workshop/resources/images/birds_dove.gif", - "/web_workshop/resources/images/birds_dove2.gif", - "/web_workshop/resources/images/birdsnest.gif", - "/web_workshop/resources/images/bizzy_wizzy.gif", - "/web_workshop/resources/images/blahblah.gif", - "/web_workshop/resources/images/body_spin.gif", - "/web_workshop/resources/images/bonk.gif", - "/web_workshop/resources/images/brachiosaurus.gif", - "/web_workshop/resources/images/bright_idea.gif", - "/web_workshop/resources/images/butterflies.gif", - "/web_workshop/resources/images/butterfly_blue.gif", - "/web_workshop/resources/images/butterfly_monarch.gif", - "/web_workshop/resources/images/cactus.gif", - "/web_workshop/resources/images/cat.gif", - "/web_workshop/resources/images/caterpillar.gif", - "/web_workshop/resources/images/cd.gif", - "/web_workshop/resources/images/christmas_garland.gif", - "/web_workshop/resources/images/christmas_holly.gif", - "/web_workshop/resources/images/christmas_wreath.gif", - "/web_workshop/resources/images/christmas_wreath2.gif", - "/web_workshop/resources/images/christmas_wreath3.gif", - "/web_workshop/resources/images/click_here.gif", - "/web_workshop/resources/images/clippy.gif", - "/web_workshop/resources/images/coffee.gif", - "/web_workshop/resources/images/computer.gif", - "/web_workshop/resources/images/construct.gif", - "/web_workshop/resources/images/cow.gif", - "/web_workshop/resources/images/curtain.gif", - "/web_workshop/resources/images/daisies.gif", - "/web_workshop/resources/images/dancingman.gif", - "/web_workshop/resources/images/dancingwoman.gif", - "/web_workshop/resources/images/dark_tidings.gif", - "/web_workshop/resources/images/devil.gif", - "/web_workshop/resources/images/disco_ball.gif", - "/web_workshop/resources/images/divider_blissey.gif", - "/web_workshop/resources/images/divider_blue_flowers.gif", - "/web_workshop/resources/images/divider_blue_flowers2.gif", - "/web_workshop/resources/images/divider_rainbow.gif", - "/web_workshop/resources/images/divider_rainbow_dots.gif", - "/web_workshop/resources/images/divider_red_flowers.gif", - "/web_workshop/resources/images/divider_wildflowers.gif", - "/web_workshop/resources/images/divider_yellow_flowers.gif", - "/web_workshop/resources/images/dollhouse.gif", - "/web_workshop/resources/images/donut_blink.gif", - "/web_workshop/resources/images/donut_drink.gif", - "/web_workshop/resources/images/donut_love.gif", - "/web_workshop/resources/images/doraemon.gif", - "/web_workshop/resources/images/doraemon_stamp.gif", - "/web_workshop/resources/images/dvd.gif", - "/web_workshop/resources/images/email.gif", - "/web_workshop/resources/images/email2.gif", - "/web_workshop/resources/images/fish_bass.gif", - "/web_workshop/resources/images/fish_rainbow_trout.gif", - "/web_workshop/resources/images/fish_salmon.gif", - "/web_workshop/resources/images/fish_trout.gif", - "/web_workshop/resources/images/fish_trout2.gif", - "/web_workshop/resources/images/flaming_chariot.gif", - "/web_workshop/resources/images/flowers.gif", - "/web_workshop/resources/images/frog_car.gif", - "/web_workshop/resources/images/furby1.gif", - "/web_workshop/resources/images/furby2.gif", - "/web_workshop/resources/images/furby3.gif", - "/web_workshop/resources/images/furby4.gif", - "/web_workshop/resources/images/furby5.gif", - "/web_workshop/resources/images/furby6.gif", - "/web_workshop/resources/images/furby7.gif", - "/web_workshop/resources/images/furby8.gif", - "/web_workshop/resources/images/furby9.gif", - "/web_workshop/resources/images/furby_banner.gif", - "/web_workshop/resources/images/furby_clouds.gif", - "/web_workshop/resources/images/furby_field.gif", - "/web_workshop/resources/images/furby_pink.gif", - "/web_workshop/resources/images/furby_shocked.gif", - "/web_workshop/resources/images/furby_weird.gif", - "/web_workshop/resources/images/furbyland.gif", - "/web_workshop/resources/images/gaia.gif", - "/web_workshop/resources/images/garf.gif", - "/web_workshop/resources/images/gc_icon.gif", - "/web_workshop/resources/images/hacker_skull.gif", - "/web_workshop/resources/images/hacking.gif", - "/web_workshop/resources/images/halloween_ghost.gif", - "/web_workshop/resources/images/halloween_jackolantern.gif", - "/web_workshop/resources/images/halloween_jackolantern2.gif", - "/web_workshop/resources/images/hamster_angry.gif", - "/web_workshop/resources/images/hamster_bath.gif", - "/web_workshop/resources/images/hamster_building.gif", - "/web_workshop/resources/images/hamster_chewing.gif", - "/web_workshop/resources/images/hamster_confused.gif", - "/web_workshop/resources/images/hamster_dance.gif", - "/web_workshop/resources/images/hamster_dig.gif", - "/web_workshop/resources/images/hamster_hacking.gif", - "/web_workshop/resources/images/hamster_happy.gif", - "/web_workshop/resources/images/hamster_itchy.gif", - "/web_workshop/resources/images/hamster_monch.gif", - "/web_workshop/resources/images/hamster_nunchucks.gif", - "/web_workshop/resources/images/hamster_omp.gif", - "/web_workshop/resources/images/hamster_scared.gif", - "/web_workshop/resources/images/hamster_sleep.gif", - "/web_workshop/resources/images/hamster_sleepy.gif", - "/web_workshop/resources/images/hamtaro.gif", - "/web_workshop/resources/images/hellokitty.gif", - "/web_workshop/resources/images/hint.gif", - "/web_workshop/resources/images/home.gif", - "/web_workshop/resources/images/kings.gif", - "/web_workshop/resources/images/kogu.gif", - "/web_workshop/resources/images/kori.gif", - "/web_workshop/resources/images/lil_buddha.gif", - "/web_workshop/resources/images/lil_demon.gif", - "/web_workshop/resources/images/mac.gif", - "/web_workshop/resources/images/mailbox.gif", - "/web_workshop/resources/images/mario64.gif", - "/web_workshop/resources/images/modchips.gif", - "/web_workshop/resources/images/neopet.gif", - "/web_workshop/resources/images/ness.gif", - "/web_workshop/resources/images/new_bunny.gif", - "/web_workshop/resources/images/orbit.gif", - "/web_workshop/resources/images/pika_construction.gif", - "/web_workshop/resources/images/pink_clock.gif", - "/web_workshop/resources/images/pizza_pointer.gif", - "/web_workshop/resources/images/pizza_pointer2.gif", - "/web_workshop/resources/images/pochacco.gif", - "/web_workshop/resources/images/providence.gif", - "/web_workshop/resources/images/ratrace.gif", - "/web_workshop/resources/images/ratrace2.gif", - "/web_workshop/resources/images/rilakkuma_dance.gif", - "/web_workshop/resources/images/ring.gif", - "/web_workshop/resources/images/sailor_moon.gif", - "/web_workshop/resources/images/samus.gif", - "/web_workshop/resources/images/scared_mouse.gif", - "/web_workshop/resources/images/skateboard.gif", - "/web_workshop/resources/images/smiley_bar.gif", - "/web_workshop/resources/images/smiley_dancing.gif", - "/web_workshop/resources/images/smiling_pizza.gif", - "/web_workshop/resources/images/spacedog.gif", - "/web_workshop/resources/images/spinninbrain.gif", - "/web_workshop/resources/images/squidward.gif", - "/web_workshop/resources/images/stonehenge.gif", - "/web_workshop/resources/images/sun_claymation.gif", - "/web_workshop/resources/images/sun_coffee.gif", - "/web_workshop/resources/images/sun_smiling.gif", - "/web_workshop/resources/images/sun_welcome.gif", - "/web_workshop/resources/images/surfin.gif", - "/web_workshop/resources/images/tamas.gif", - "/web_workshop/resources/images/telephone.gif", - "/web_workshop/resources/images/tooth.gif", - "/web_workshop/resources/images/trashcan_burp.gif", - "/web_workshop/resources/images/trashcan_chase.gif", - "/web_workshop/resources/images/trashcan_chomp.gif", - "/web_workshop/resources/images/tux_badboy.gif", - "/web_workshop/resources/images/tux_blink.gif", - "/web_workshop/resources/images/tux_chug.gif", - "/web_workshop/resources/images/tux_got_root.gif", - "/web_workshop/resources/images/tux_hacking.gif", - "/web_workshop/resources/images/tux_linux_power.gif", - "/web_workshop/resources/images/underconstruction.gif", - "/web_workshop/resources/images/welcome.gif", - "/web_workshop/resources/images/windows.gif", - "/web_workshop/resources/images/wishingwell.gif", - "/web_workshop/resources/images/wizard.gif", - "/web_workshop/resources/images/ww_9volt.gif", - "/web_workshop/resources/images/ww_ana.gif", - "/web_workshop/resources/images/ww_crygor.gif", - "/web_workshop/resources/images/ww_dribble.gif", - "/web_workshop/resources/images/ww_jimmy.gif", - "/web_workshop/resources/images/ww_kat.gif", - "/web_workshop/resources/images/ww_mona.gif", - "/web_workshop/resources/images/ww_orbulon.gif", - "/web_workshop/resources/images/ww_spitz.gif", - "/web_workshop/resources/images/ww_wario.gif", - "/web_workshop/resources/images/y2k.gif" - ], "resources": [ "/web_workshop/resources/css/styles.css", "/web_workshop/resources/icons/construction.png", "/web_workshop/resources/icons/construction_padded.png", - "/web_workshop/resources/images/24.gif", - "/web_workshop/resources/images/alarm_alarmed.gif", - "/web_workshop/resources/images/alarm_snoozed.gif", - "/web_workshop/resources/images/alien_ufo_crash.gif", - "/web_workshop/resources/images/alien_ufo_float.gif", - "/web_workshop/resources/images/banana_dance.gif", - "/web_workshop/resources/images/bang.gif", - "/web_workshop/resources/images/bg_bricks.gif", - "/web_workshop/resources/images/bg_checker.gif", - "/web_workshop/resources/images/bg_daisies.gif", - "/web_workshop/resources/images/bg_desert.gif", - "/web_workshop/resources/images/bg_stars.gif", - "/web_workshop/resources/images/bg_trippy.gif", - "/web_workshop/resources/images/bg_water.gif", - "/web_workshop/resources/images/bigN.gif", - "/web_workshop/resources/images/birdbath.gif", - "/web_workshop/resources/images/birds_chickadee.gif", - "/web_workshop/resources/images/birds_chicken.gif", - "/web_workshop/resources/images/birds_dove.gif", - "/web_workshop/resources/images/birds_dove2.gif", - "/web_workshop/resources/images/birdsnest.gif", - "/web_workshop/resources/images/bizzy_wizzy.gif", - "/web_workshop/resources/images/blahblah.gif", - "/web_workshop/resources/images/body_spin.gif", - "/web_workshop/resources/images/bonk.gif", - "/web_workshop/resources/images/brachiosaurus.gif", - "/web_workshop/resources/images/bright_idea.gif", - "/web_workshop/resources/images/butterflies.gif", - "/web_workshop/resources/images/butterfly_blue.gif", - "/web_workshop/resources/images/butterfly_monarch.gif", - "/web_workshop/resources/images/cactus.gif", - "/web_workshop/resources/images/cat.gif", - "/web_workshop/resources/images/caterpillar.gif", - "/web_workshop/resources/images/cd.gif", - "/web_workshop/resources/images/christmas_garland.gif", - "/web_workshop/resources/images/christmas_holly.gif", - "/web_workshop/resources/images/christmas_wreath.gif", - "/web_workshop/resources/images/christmas_wreath2.gif", - "/web_workshop/resources/images/christmas_wreath3.gif", - "/web_workshop/resources/images/click_here.gif", - "/web_workshop/resources/images/clippy.gif", - "/web_workshop/resources/images/coffee.gif", - "/web_workshop/resources/images/computer.gif", - "/web_workshop/resources/images/construct.gif", - "/web_workshop/resources/images/cow.gif", - "/web_workshop/resources/images/curtain.gif", - "/web_workshop/resources/images/daisies.gif", - "/web_workshop/resources/images/dancingman.gif", - "/web_workshop/resources/images/dancingwoman.gif", - "/web_workshop/resources/images/dark_tidings.gif", - "/web_workshop/resources/images/devil.gif", - "/web_workshop/resources/images/disco_ball.gif", - "/web_workshop/resources/images/divider_blissey.gif", - "/web_workshop/resources/images/divider_blue_flowers.gif", - "/web_workshop/resources/images/divider_blue_flowers2.gif", - "/web_workshop/resources/images/divider_rainbow.gif", - "/web_workshop/resources/images/divider_rainbow_dots.gif", - "/web_workshop/resources/images/divider_red_flowers.gif", - "/web_workshop/resources/images/divider_wildflowers.gif", - "/web_workshop/resources/images/divider_yellow_flowers.gif", - "/web_workshop/resources/images/dollhouse.gif", - "/web_workshop/resources/images/donut_blink.gif", - "/web_workshop/resources/images/donut_drink.gif", - "/web_workshop/resources/images/donut_love.gif", - "/web_workshop/resources/images/doraemon.gif", - "/web_workshop/resources/images/doraemon_stamp.gif", - "/web_workshop/resources/images/dvd.gif", - "/web_workshop/resources/images/email.gif", - "/web_workshop/resources/images/email2.gif", - "/web_workshop/resources/images/fish_bass.gif", - "/web_workshop/resources/images/fish_rainbow_trout.gif", - "/web_workshop/resources/images/fish_salmon.gif", - "/web_workshop/resources/images/fish_trout.gif", - "/web_workshop/resources/images/fish_trout2.gif", - "/web_workshop/resources/images/flaming_chariot.gif", - "/web_workshop/resources/images/flowers.gif", - "/web_workshop/resources/images/frog_car.gif", - "/web_workshop/resources/images/furby1.gif", - "/web_workshop/resources/images/furby2.gif", - "/web_workshop/resources/images/furby3.gif", - "/web_workshop/resources/images/furby4.gif", - "/web_workshop/resources/images/furby5.gif", - "/web_workshop/resources/images/furby6.gif", - "/web_workshop/resources/images/furby7.gif", - "/web_workshop/resources/images/furby8.gif", - "/web_workshop/resources/images/furby9.gif", - "/web_workshop/resources/images/furby_banner.gif", - "/web_workshop/resources/images/furby_clouds.gif", - "/web_workshop/resources/images/furby_field.gif", - "/web_workshop/resources/images/furby_pink.gif", - "/web_workshop/resources/images/furby_shocked.gif", - "/web_workshop/resources/images/furby_weird.gif", - "/web_workshop/resources/images/furbyland.gif", - "/web_workshop/resources/images/gaia.gif", - "/web_workshop/resources/images/garf.gif", - "/web_workshop/resources/images/gc_icon.gif", - "/web_workshop/resources/images/hacker_skull.gif", - "/web_workshop/resources/images/hacking.gif", - "/web_workshop/resources/images/halloween_ghost.gif", - "/web_workshop/resources/images/halloween_jackolantern.gif", - "/web_workshop/resources/images/halloween_jackolantern2.gif", - "/web_workshop/resources/images/hamster_angry.gif", - "/web_workshop/resources/images/hamster_bath.gif", - "/web_workshop/resources/images/hamster_building.gif", - "/web_workshop/resources/images/hamster_chewing.gif", - "/web_workshop/resources/images/hamster_confused.gif", - "/web_workshop/resources/images/hamster_dance.gif", - "/web_workshop/resources/images/hamster_dig.gif", - "/web_workshop/resources/images/hamster_hacking.gif", - "/web_workshop/resources/images/hamster_happy.gif", - "/web_workshop/resources/images/hamster_itchy.gif", - "/web_workshop/resources/images/hamster_monch.gif", - "/web_workshop/resources/images/hamster_nunchucks.gif", - "/web_workshop/resources/images/hamster_omp.gif", - "/web_workshop/resources/images/hamster_scared.gif", - "/web_workshop/resources/images/hamster_sleep.gif", - "/web_workshop/resources/images/hamster_sleepy.gif", - "/web_workshop/resources/images/hamtaro.gif", - "/web_workshop/resources/images/hellokitty.gif", - "/web_workshop/resources/images/hint.gif", - "/web_workshop/resources/images/home.gif", - "/web_workshop/resources/images/kings.gif", - "/web_workshop/resources/images/kogu.gif", - "/web_workshop/resources/images/kori.gif", - "/web_workshop/resources/images/lil_buddha.gif", - "/web_workshop/resources/images/lil_demon.gif", - "/web_workshop/resources/images/mac.gif", - "/web_workshop/resources/images/mailbox.gif", - "/web_workshop/resources/images/mario64.gif", - "/web_workshop/resources/images/modchips.gif", - "/web_workshop/resources/images/neopet.gif", - "/web_workshop/resources/images/ness.gif", - "/web_workshop/resources/images/new_bunny.gif", - "/web_workshop/resources/images/orbit.gif", - "/web_workshop/resources/images/pika_construction.gif", - "/web_workshop/resources/images/pink_clock.gif", - "/web_workshop/resources/images/pizza_pointer.gif", - "/web_workshop/resources/images/pizza_pointer2.gif", - "/web_workshop/resources/images/pochacco.gif", - "/web_workshop/resources/images/providence.gif", - "/web_workshop/resources/images/ratrace.gif", - "/web_workshop/resources/images/ratrace2.gif", - "/web_workshop/resources/images/rilakkuma_dance.gif", - "/web_workshop/resources/images/ring.gif", - "/web_workshop/resources/images/sailor_moon.gif", - "/web_workshop/resources/images/samus.gif", - "/web_workshop/resources/images/scared_mouse.gif", - "/web_workshop/resources/images/skateboard.gif", - "/web_workshop/resources/images/smiley_bar.gif", - "/web_workshop/resources/images/smiley_dancing.gif", - "/web_workshop/resources/images/smiling_pizza.gif", - "/web_workshop/resources/images/spacedog.gif", - "/web_workshop/resources/images/spinninbrain.gif", - "/web_workshop/resources/images/squidward.gif", - "/web_workshop/resources/images/stonehenge.gif", - "/web_workshop/resources/images/sun_claymation.gif", - "/web_workshop/resources/images/sun_coffee.gif", - "/web_workshop/resources/images/sun_smiling.gif", - "/web_workshop/resources/images/sun_welcome.gif", - "/web_workshop/resources/images/surfin.gif", - "/web_workshop/resources/images/tamas.gif", - "/web_workshop/resources/images/telephone.gif", - "/web_workshop/resources/images/tooth.gif", - "/web_workshop/resources/images/trashcan_burp.gif", - "/web_workshop/resources/images/trashcan_chase.gif", - "/web_workshop/resources/images/trashcan_chomp.gif", - "/web_workshop/resources/images/tux_badboy.gif", - "/web_workshop/resources/images/tux_blink.gif", - "/web_workshop/resources/images/tux_chug.gif", - "/web_workshop/resources/images/tux_got_root.gif", - "/web_workshop/resources/images/tux_hacking.gif", - "/web_workshop/resources/images/tux_linux_power.gif", - "/web_workshop/resources/images/underconstruction.gif", - "/web_workshop/resources/images/welcome.gif", - "/web_workshop/resources/images/windows.gif", - "/web_workshop/resources/images/wishingwell.gif", - "/web_workshop/resources/images/wizard.gif", - "/web_workshop/resources/images/ww_9volt.gif", - "/web_workshop/resources/images/ww_ana.gif", - "/web_workshop/resources/images/ww_crygor.gif", - "/web_workshop/resources/images/ww_dribble.gif", - "/web_workshop/resources/images/ww_jimmy.gif", - "/web_workshop/resources/images/ww_kat.gif", - "/web_workshop/resources/images/ww_mona.gif", - "/web_workshop/resources/images/ww_orbulon.gif", - "/web_workshop/resources/images/ww_spitz.gif", - "/web_workshop/resources/images/ww_wario.gif", - "/web_workshop/resources/images/y2k.gif", "/web_workshop/resources/js/codemirror-bundle.js", "/web_workshop/resources/js/main.js", "/web_workshop/resources/readme_images/picnic.png", @@ -391,5 +13,195 @@ "/web_workshop/resources/ui/fullscreen.svg", "/web_workshop/resources/vendor/build.mjs", "/web_workshop/resources/vendor/package.json" + ], + "images": [ + "/web_workshop/resources/images/Backgrounds/bg_bricks.gif", + "/web_workshop/resources/images/Backgrounds/bg_checker.gif", + "/web_workshop/resources/images/Backgrounds/bg_daisies.gif", + "/web_workshop/resources/images/Backgrounds/bg_desert.gif", + "/web_workshop/resources/images/Backgrounds/bg_stars.gif", + "/web_workshop/resources/images/Backgrounds/bg_trippy.gif", + "/web_workshop/resources/images/Backgrounds/bg_water.gif", + "/web_workshop/resources/images/Dividers/blissey.gif", + "/web_workshop/resources/images/Dividers/blue_flowers.gif", + "/web_workshop/resources/images/Dividers/blue_flowers2.gif", + "/web_workshop/resources/images/Dividers/rainbow.gif", + "/web_workshop/resources/images/Dividers/rainbow_dots.gif", + "/web_workshop/resources/images/Dividers/red_flowers.gif", + "/web_workshop/resources/images/Dividers/wildflowers.gif", + "/web_workshop/resources/images/Dividers/yellow_flowers.gif", + "/web_workshop/resources/images/Furby/furby1.gif", + "/web_workshop/resources/images/Furby/furby2.gif", + "/web_workshop/resources/images/Furby/furby3.gif", + "/web_workshop/resources/images/Furby/furby4.gif", + "/web_workshop/resources/images/Furby/furby5.gif", + "/web_workshop/resources/images/Furby/furby6.gif", + "/web_workshop/resources/images/Furby/furby7.gif", + "/web_workshop/resources/images/Furby/furby8.gif", + "/web_workshop/resources/images/Furby/furby9.gif", + "/web_workshop/resources/images/Furby/furby_banner.gif", + "/web_workshop/resources/images/Furby/furby_clouds.gif", + "/web_workshop/resources/images/Furby/furby_field.gif", + "/web_workshop/resources/images/Furby/furby_pink.gif", + "/web_workshop/resources/images/Furby/furby_shocked.gif", + "/web_workshop/resources/images/Furby/furby_weird.gif", + "/web_workshop/resources/images/Furby/furbyland.gif", + "/web_workshop/resources/images/Halloween/ghost.gif", + "/web_workshop/resources/images/Halloween/jackolantern.gif", + "/web_workshop/resources/images/Halloween/jackolantern2.gif", + "/web_workshop/resources/images/Hamster/hamster_angry.gif", + "/web_workshop/resources/images/Hamster/hamster_bath.gif", + "/web_workshop/resources/images/Hamster/hamster_building.gif", + "/web_workshop/resources/images/Hamster/hamster_chewing.gif", + "/web_workshop/resources/images/Hamster/hamster_confused.gif", + "/web_workshop/resources/images/Hamster/hamster_dance.gif", + "/web_workshop/resources/images/Hamster/hamster_dig.gif", + "/web_workshop/resources/images/Hamster/hamster_hacking.gif", + "/web_workshop/resources/images/Hamster/hamster_happy.gif", + "/web_workshop/resources/images/Hamster/hamster_itchy.gif", + "/web_workshop/resources/images/Hamster/hamster_monch.gif", + "/web_workshop/resources/images/Hamster/hamster_nunchucks.gif", + "/web_workshop/resources/images/Hamster/hamster_omp.gif", + "/web_workshop/resources/images/Hamster/hamster_scared.gif", + "/web_workshop/resources/images/Hamster/hamster_sleep.gif", + "/web_workshop/resources/images/Hamster/hamster_sleepy.gif", + "/web_workshop/resources/images/Other/24.gif", + "/web_workshop/resources/images/Other/alarm_alarmed.gif", + "/web_workshop/resources/images/Other/alarm_snoozed.gif", + "/web_workshop/resources/images/Other/alien_ufo_crash.gif", + "/web_workshop/resources/images/Other/alien_ufo_float.gif", + "/web_workshop/resources/images/Other/banana_dance.gif", + "/web_workshop/resources/images/Other/bang.gif", + "/web_workshop/resources/images/Other/bigN.gif", + "/web_workshop/resources/images/Other/birdbath.gif", + "/web_workshop/resources/images/Other/birds_chickadee.gif", + "/web_workshop/resources/images/Other/birds_chicken.gif", + "/web_workshop/resources/images/Other/birds_dove.gif", + "/web_workshop/resources/images/Other/birds_dove2.gif", + "/web_workshop/resources/images/Other/birdsnest.gif", + "/web_workshop/resources/images/Other/bizzy_wizzy.gif", + "/web_workshop/resources/images/Other/blahblah.gif", + "/web_workshop/resources/images/Other/body_spin.gif", + "/web_workshop/resources/images/Other/bonk.gif", + "/web_workshop/resources/images/Other/brachiosaurus.gif", + "/web_workshop/resources/images/Other/bright_idea.gif", + "/web_workshop/resources/images/Other/butterflies.gif", + "/web_workshop/resources/images/Other/butterfly_blue.gif", + "/web_workshop/resources/images/Other/butterfly_monarch.gif", + "/web_workshop/resources/images/Other/cactus.gif", + "/web_workshop/resources/images/Other/cat.gif", + "/web_workshop/resources/images/Other/caterpillar.gif", + "/web_workshop/resources/images/Other/cd.gif", + "/web_workshop/resources/images/Other/christmas_garland.gif", + "/web_workshop/resources/images/Other/christmas_holly.gif", + "/web_workshop/resources/images/Other/christmas_wreath.gif", + "/web_workshop/resources/images/Other/christmas_wreath2.gif", + "/web_workshop/resources/images/Other/christmas_wreath3.gif", + "/web_workshop/resources/images/Other/click_here.gif", + "/web_workshop/resources/images/Other/clippy.gif", + "/web_workshop/resources/images/Other/coffee.gif", + "/web_workshop/resources/images/Other/computer.gif", + "/web_workshop/resources/images/Other/construct.gif", + "/web_workshop/resources/images/Other/cow.gif", + "/web_workshop/resources/images/Other/curtain.gif", + "/web_workshop/resources/images/Other/daisies.gif", + "/web_workshop/resources/images/Other/dancingman.gif", + "/web_workshop/resources/images/Other/dancingwoman.gif", + "/web_workshop/resources/images/Other/dark_tidings.gif", + "/web_workshop/resources/images/Other/devil.gif", + "/web_workshop/resources/images/Other/disco_ball.gif", + "/web_workshop/resources/images/Other/dollhouse.gif", + "/web_workshop/resources/images/Other/donut_blink.gif", + "/web_workshop/resources/images/Other/donut_drink.gif", + "/web_workshop/resources/images/Other/donut_love.gif", + "/web_workshop/resources/images/Other/doraemon.gif", + "/web_workshop/resources/images/Other/doraemon_stamp.gif", + "/web_workshop/resources/images/Other/dvd.gif", + "/web_workshop/resources/images/Other/email.gif", + "/web_workshop/resources/images/Other/email2.gif", + "/web_workshop/resources/images/Other/fish_bass.gif", + "/web_workshop/resources/images/Other/fish_rainbow_trout.gif", + "/web_workshop/resources/images/Other/fish_salmon.gif", + "/web_workshop/resources/images/Other/fish_trout.gif", + "/web_workshop/resources/images/Other/fish_trout2.gif", + "/web_workshop/resources/images/Other/flaming_chariot.gif", + "/web_workshop/resources/images/Other/flowers.gif", + "/web_workshop/resources/images/Other/frog_car.gif", + "/web_workshop/resources/images/Other/gaia.gif", + "/web_workshop/resources/images/Other/garf.gif", + "/web_workshop/resources/images/Other/gc_icon.gif", + "/web_workshop/resources/images/Other/hacker_skull.gif", + "/web_workshop/resources/images/Other/hacking.gif", + "/web_workshop/resources/images/Other/hamtaro.gif", + "/web_workshop/resources/images/Other/hellokitty.gif", + "/web_workshop/resources/images/Other/hint.gif", + "/web_workshop/resources/images/Other/home.gif", + "/web_workshop/resources/images/Other/kings.gif", + "/web_workshop/resources/images/Other/kogu.gif", + "/web_workshop/resources/images/Other/kori.gif", + "/web_workshop/resources/images/Other/lil_buddha.gif", + "/web_workshop/resources/images/Other/lil_demon.gif", + "/web_workshop/resources/images/Other/mac.gif", + "/web_workshop/resources/images/Other/mailbox.gif", + "/web_workshop/resources/images/Other/mario64.gif", + "/web_workshop/resources/images/Other/modchips.gif", + "/web_workshop/resources/images/Other/neopet.gif", + "/web_workshop/resources/images/Other/ness.gif", + "/web_workshop/resources/images/Other/new_bunny.gif", + "/web_workshop/resources/images/Other/orbit.gif", + "/web_workshop/resources/images/Other/pika_construction.gif", + "/web_workshop/resources/images/Other/pink_clock.gif", + "/web_workshop/resources/images/Other/pizza_pointer.gif", + "/web_workshop/resources/images/Other/pizza_pointer2.gif", + "/web_workshop/resources/images/Other/pochacco.gif", + "/web_workshop/resources/images/Other/providence.gif", + "/web_workshop/resources/images/Other/ratrace.gif", + "/web_workshop/resources/images/Other/ratrace2.gif", + "/web_workshop/resources/images/Other/rilakkuma_dance.gif", + "/web_workshop/resources/images/Other/ring.gif", + "/web_workshop/resources/images/Other/sailor_moon.gif", + "/web_workshop/resources/images/Other/samus.gif", + "/web_workshop/resources/images/Other/scared_mouse.gif", + "/web_workshop/resources/images/Other/skateboard.gif", + "/web_workshop/resources/images/Other/smiley_bar.gif", + "/web_workshop/resources/images/Other/smiley_dancing.gif", + "/web_workshop/resources/images/Other/smiling_pizza.gif", + "/web_workshop/resources/images/Other/spacedog.gif", + "/web_workshop/resources/images/Other/spinninbrain.gif", + "/web_workshop/resources/images/Other/squidward.gif", + "/web_workshop/resources/images/Other/stonehenge.gif", + "/web_workshop/resources/images/Other/sun_claymation.gif", + "/web_workshop/resources/images/Other/sun_coffee.gif", + "/web_workshop/resources/images/Other/sun_smiling.gif", + "/web_workshop/resources/images/Other/sun_welcome.gif", + "/web_workshop/resources/images/Other/surfin.gif", + "/web_workshop/resources/images/Other/tamas.gif", + "/web_workshop/resources/images/Other/telephone.gif", + "/web_workshop/resources/images/Other/tooth.gif", + "/web_workshop/resources/images/Other/trashcan_burp.gif", + "/web_workshop/resources/images/Other/trashcan_chase.gif", + "/web_workshop/resources/images/Other/trashcan_chomp.gif", + "/web_workshop/resources/images/Other/underconstruction.gif", + "/web_workshop/resources/images/Other/welcome.gif", + "/web_workshop/resources/images/Other/windows.gif", + "/web_workshop/resources/images/Other/wishingwell.gif", + "/web_workshop/resources/images/Other/wizard.gif", + "/web_workshop/resources/images/Other/y2k.gif", + "/web_workshop/resources/images/Tux/tux_badboy.gif", + "/web_workshop/resources/images/Tux/tux_blink.gif", + "/web_workshop/resources/images/Tux/tux_chug.gif", + "/web_workshop/resources/images/Tux/tux_got_root.gif", + "/web_workshop/resources/images/Tux/tux_hacking.gif", + "/web_workshop/resources/images/Tux/tux_linux_power.gif", + "/web_workshop/resources/images/WarioWare/9volt.gif", + "/web_workshop/resources/images/WarioWare/ana.gif", + "/web_workshop/resources/images/WarioWare/crygor.gif", + "/web_workshop/resources/images/WarioWare/dribble.gif", + "/web_workshop/resources/images/WarioWare/jimmy.gif", + "/web_workshop/resources/images/WarioWare/kat.gif", + "/web_workshop/resources/images/WarioWare/mona.gif", + "/web_workshop/resources/images/WarioWare/orbulon.gif", + "/web_workshop/resources/images/WarioWare/spitz.gif", + "/web_workshop/resources/images/WarioWare/wario.gif" ] } \ No newline at end of file diff --git a/resources/scripts/generate_resource_manifest.py b/resources/scripts/generate_resource_manifest.py @@ -19,13 +19,14 @@ def generate_resource_manifest(): resources_dir = repo_root / 'resources' images_dir = resources_dir / 'images' - # Collect all image files + # Collect all image files (recursively, so category subfolders are included) image_files = [] if images_dir.exists(): - for file_path in images_dir.iterdir(): + for file_path in images_dir.rglob('*'): if file_path.is_file() and file_path.suffix.lower() in image_extensions: # Create relative path from web root (GitHub Pages subdirectory) - relative_path = f"/web_workshop/resources/images/{file_path.name}" + rel = file_path.relative_to(images_dir).as_posix() + relative_path = f"/web_workshop/resources/images/{rel}" image_files.append(relative_path) # Collect ALL resource files (no extension filtering) @@ -33,6 +34,12 @@ def generate_resource_manifest(): if resources_dir.exists(): for file_path in resources_dir.rglob('*'): if file_path.is_file(): + # Skip dev-only / gitignored files so local runs match CI output + if 'node_modules' in file_path.parts or file_path.name in ('package-lock.json', '.DS_Store'): + continue + # Images are listed separately in the images array; don't duplicate them here + if images_dir in file_path.parents: + continue # Create relative path from web root (GitHub Pages subdirectory) relative_path = f"/web_workshop/resources/{file_path.relative_to(resources_dir).as_posix()}" resource_files.append(relative_path) @@ -43,15 +50,15 @@ def generate_resource_manifest(): # Create manifest object manifest = { - "images": image_files, + "generated_at": "auto-generated by GitHub Actions", "resources": resource_files, - "generated_at": "auto-generated by GitHub Actions" + "images": image_files } - + # Write manifest file manifest_path = resources_dir / 'resource-manifest.json' with open(manifest_path, 'w', encoding='utf-8') as f: - json.dump(manifest, f, indent=2, sort_keys=True) + json.dump(manifest, f, indent=2) print(f"Generated manifest with {len(image_files)} images and {len(resource_files)} resources:") for img in image_files: