Mercurial > web
view music.html @ 69:2e645b936727
*: huge overhaul
1. the INDEX PAGE was broken for so long, but I really could not have been arsed to fix it.
2. all major css has been moved to css/style.css
3. png files are now all jpg files because having pngs on a website is overkill
4. update libopenmpt, not sure if it works (local JS doesn't work on my browser)
5. libopenmpt is now the JS-only version because browsers like pale moon still don't support
WASM
| author | Paper <mrpapersonic@gmail.com> |
|---|---|
| date | Sat, 30 Sep 2023 00:34:22 -0400 |
| parents | 6019514100d4 |
| children | 629553bdc8aa |
line wrap: on
line source
<!DOCTYPE html> <head> <title>Music - Paper's website</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <link href="./css/bootstrap.min.css" rel="stylesheet" media="screen"> <link href="./css/style.css" rel="stylesheet" media="screen"> <link rel="shortcut icon" type="image/x-icon" href="favicon.ico?"> <meta name="viewport" content="width=device-width, initial-scale=1.0"/> <style> body { background-size: cover; background-image: url("musicbg.jpg"); background-position: center top; background-size: cover; background-color: #1F255A; } </style> <script nonce="paper-web-inline"> window['libopenmpt'] = {}; libopenmpt.locateFile = function(filename) { return "./js/" + filename; }; libopenmpt.onRuntimeInitialized = function() { var player; function init() { if (player == undefined) player = new ChiptuneJsPlayer(new ChiptuneJsConfig(-1, 100, 1)); else player.stop(); } function afterLoad(path, buffer) { player.play(buffer); setMetadata(path); } function loadURL(path) { init(); player.load(path, afterLoad.bind(this, path)); } function setMetadata(filename) { var metadata = player.metadata(); if (metadata['title'] != '') document.getElementById('title').innerHTML = metadata['title']; else document.getElementById('title').innerHTML = filename; } function pauseButton() { player.togglePause(); } document.querySelector('#playpause').addEventListener('click', pauseButton, false); document.querySelectorAll('.song').forEach(function(e) { e.addEventListener('click', function(evt) { loadURL(evt.target.getAttribute("data-modurl")); }, false); }); }; </script> <script type="application/javascript" src="./js/chiptune2.js"></script> <script type="application/javascript" src="./js/libopenmpt.js"></script> </head> <body> <div class="navbar-wrapper"> <div class="container"> <div class="navbar navbar-inverse"> <div class="navbar-inner"> <a class="brand" href="./">Paper's website</a> <ul class="nav"> <li><a href="./">Home</a></li> <li class="active"><a href="#">Music</a></li> <li><a href="projects.html">Projects</a></li> </ul> </div> </div> </div> </div> <h1>Music</h1> <div class="box"> <p>Now playing:</p> <p id="title">nothing loaded</p> <button type="button" class="btn btn-primary" id="playpause">Play/Pause</button> </div> <div class="box"> <h2>Originals</h2> <p><a href="#" class="song" data-modurl="./music/paper_-_old_desk_tribute.xm">Old Desk Tribute [.XM]</a> <a href="./music/paper_-_old_desk_tribute.xm" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_chippygolucky.xm">Chippy-Go-Lucky [.XM]</a> <a href="./music/paper_-_chippygolucky.xm" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_whistling_meadows.it">Whistling Meadows [.IT]</a> <a href="./music/paper_-_whistling_meadows.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_shartlover.s3m">xX ShartLover1337 Xx [.S3M]</a> <a href="./music/paper_-_shartlover.s3m" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_reaching_the_world_border.it">Reaching the World Border [.IT]</a> <a href="./music/paper_-_reaching_the_world_border.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_sarta.mptm">THIS IS SARTA [.MPTM]</a> <a href="./music/paper_-_sarta.mptm" download>(Download)</a></p> </div> <div class="box"> <h2>Collabs</h2> <p><a href="#" class="song" data-modurl="./music/usa_keyboard_final.it">USA Keyboard (co-op with ishineee, rainbow, and quyu) [.IT]</a> <a href="./music/usa_keyboard_final.it" download>(Download)</a></p> </div> <div class="box"> <h2>Covers</h2> <p><a href="#" class="song" data-modurl="./music/paper_-_huxchx.it">Razerek - huxchx [.IT]</a> <a href="./music/paper_-_huxchx.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/gerudo_valley.s3m">Gerudo Valley (OPL2) [.S3M]</a> <a href="./music/gerudo_valley.s3m" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_tintin_on_the_moon.mod">TinTin on the Moon [.MOD]</a> <a href="./music/paper_-_tintin_on_the_moon.mod" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_dance_in_the_universe_cover.mod">Dance in the universe cover [.MOD]</a> <a href="music/paper_-_dance_in_the_universe_cover.mod" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_bob-omb_battlefield_remix.it">Super Mario 64 - Bob-omb Battlefield Remix [.IT]</a> <a href="./music/paper_-_bob-omb_battlefield_remix.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_point_of_no_hi-score.it">(mashup) Drax - Tiger Mission Hi-score + ESCHATOS OST - Point of No Return [.IT]</a> <a href="./music/paper_-_point_of_no_hi-score.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_vrc6n001_remake.it">(remake) Naruto - VRC6N001 [.IT]</a> <a href="./music/paper_-_vrc6n001_remake.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_hip_shop.it">Deltarune - Hip Shop [.IT]</a> <a href="./music/paper_-_hip_shop.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_nerou.it">ziner - Flatwoods Monster [.IT]</a> <a href="./music/paper_-_nerou.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_drip.xm">Leonz - Among Us Drip Theme [.XM]</a> <a href="./music/paper_-_drip.xm" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_3005.it">Childish Gambino - 3005 [.IT]</a> <a href="./music/paper_-_3005.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_infinity.it">Cho Ren Sha 68k - Infinity [.IT]</a> <a href="./music/paper_-_infinity.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_bestending.it">Aphex Twin - Avril 14th [.IT]</a> <a href="./music/paper_-_bestending.it" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_visitors.xm">KOTO - Visitors [.XM]</a> <a href="./music/paper_-_visitors.xm" download>(Download)</a></p> <p><a href="#" class="song" data-modurl="./music/paper_-_vrc6n001.it">Naruto - VRC6N001 [.IT]</a> <a href="./music/paper_-_vrc6n001.it" download download>(Download)</a></p> </div> </body>