add music files to duality article

input/projects/duality.md

@@ -4,6 +4,7 @@ parent: projects
 git: https://codeberg.org/xythobuz/Duality
 github: https://github.com/xythobuz/Duality
 date: 2025-08-19
+update: 2025-09-01
 comments: true
 favicon: https://xythobuz.github.io/Duality/favicon.png
 auto_toc: true
@@ -541,11 +542,31 @@ The Duality in-game theme song was more difficult.
 It consists more of noises and some LFOs instead of clearly defined notes, so transcribing was pretty hard.
 In the end I used a trial version of [AnthemScore](https://www.lunaverus.com/) in Wine to get an approximate idea of the notes, but the result is not great.
 
+Here are some direct comparisons.
+First the San Andreas Theme, used as menu music.
+
 <!--%
 lightgallery([
     [ "https://www.youtube.com/watch?v=7qfbi3HACV8", "San Andreas Theme" ],
+    [ "img/duality_music_menu.opus", "audio/ogg", "", "Duality Menu Music" ],
+])
+%-->
+
+Next the score screen music, which comes from the FF7 victory fanfare.
+
+<!--%
+lightgallery([
     [ "https://www.youtube.com/watch?v=rgUksX6eM0Y", "Final Fantasy VII Victory Fanfare" ],
+    [ "img/duality_music_score.opus", "audio/ogg", "", "Duality Score Music" ],
+])
+%-->
+
+And the in-game music, from the original Duality.
+
+<!--%
+lightgallery([
     [ "https://www.youtube.com/watch?v=duiUhk5ZkaA", "Duality Theme" ],
+    [ "img/duality_music_game.opus", "audio/ogg", "", "Duality Gameplay Music" ],
 ])
 %-->
 

macros.py

@@ -404,11 +404,12 @@ def printSteamMenuDeutsch():
 # call this macro like this:
 
 # lightgallery([
-#     [ "image-link", "description" ],
-#     [ "image-link", "thumbnail-link", "description" ],
-#     [ "youtube-link", "thumbnail-link", "description" ],
-#     [ "video-link", "mime", "thumbnail-link", "image-link", "description" ],
-#     [ "video-link", "mime", "", "", "description" ],
+#     [ "image-link", "description" ], # 2 elements
+#     [ "image-link", "thumbnail-link", "description" ], # 3 elements
+#     [ "youtube-link", "thumbnail-link", "description" ], # 3 elements
+#     [ "audio-link", "mime", "", "description" ], # 4 elements
+#     [ "video-link", "mime", "thumbnail-link", "image-link", "description" ], # 5 elements
+#     [ "video-link", "mime", "", "", "description" ], # 5 elements
 # ])
 
 # it will also auto-generate thumbnails and resize and strip EXIF from images
@@ -511,6 +512,11 @@ def lightgallery(links):
                     style = ' style="max-width:300px;max-height:300px;"'
             lightgallery_check_thumbnail(link, img)
             print('<div class="border" style="position:relative;" data-src="' + link + '"><a href="' + link + '"><img class="pic" src="' + img + '" alt="' + alt + '"' + style + '>' + img2 + '</a></div>')
+        elif len(l) == 4:
+            link, mime, none, alt = l
+            print('<div class="border">')
+            print('<audio controls style="display:block;"><source src="' + link + '" type="' + mime + '" /></audio>')
+            print('<p class="audio_text"><a href="' + link + '">Download audio</a></p></div>')
         elif len(l) == 5:
             v_i += 1
             link, mime, thumb, poster, alt = videos[v_i]

static/css/style.css

@@ -399,6 +399,12 @@ span.font-small {
     border-radius: 10px;
 }
 
+.audio_text {
+    text-align: center;
+    margin: 0.2em;
+    font-size: smaller;
+}
+
 blockquote {
     position: relative;
     padding: 1em 0.5em;