annotate 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
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
rev   line source
20
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
1 <!DOCTYPE html>
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
2 <head>
56
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
3 <title>Music - Paper's website</title>
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
4 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
57
ac1900c0e376 html: Remove CSP and use local files
Paper <mrpapersonic@gmail.com>
parents: 56
diff changeset
5 <link href="./css/bootstrap.min.css" rel="stylesheet" media="screen">
69
2e645b936727 *: huge overhaul
Paper <mrpapersonic@gmail.com>
parents: 67
diff changeset
6 <link href="./css/style.css" rel="stylesheet" media="screen">
42
8051fdef82da Downgrade to bootstrap 2.3.2
Paper <mrpapersonic@gmail.com>
parents: 41
diff changeset
7 <link rel="shortcut icon" type="image/x-icon" href="favicon.ico?">
56
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
8 <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
69
2e645b936727 *: huge overhaul
Paper <mrpapersonic@gmail.com>
parents: 67
diff changeset
9 <style>
56
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
10 body {
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
11 background-size: cover;
69
2e645b936727 *: huge overhaul
Paper <mrpapersonic@gmail.com>
parents: 67
diff changeset
12 background-image: url("musicbg.jpg");
67
6019514100d4 html: fix random scaling shit on >1080p monitors
Paper <mrpapersonic@gmail.com>
parents: 64
diff changeset
13 background-position: center top;
69
2e645b936727 *: huge overhaul
Paper <mrpapersonic@gmail.com>
parents: 67
diff changeset
14 background-size: cover;
2e645b936727 *: huge overhaul
Paper <mrpapersonic@gmail.com>
parents: 67
diff changeset
15 background-color: #1F255A;
56
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
16 }
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
17 </style>
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
18 <script nonce="paper-web-inline">
32
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
19 window['libopenmpt'] = {};
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
20
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
21 libopenmpt.locateFile = function(filename) {
39
35c68429641d [music.html] Use updated libopenmpt
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 37
diff changeset
22 return "./js/" + filename;
32
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
23 };
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
24
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
25 libopenmpt.onRuntimeInitialized = function() {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
26 var player;
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
27
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
28 function init() {
53
1a6df6d6b7ea music: use The Mod Archive for direct links
Paper <mrpapersonic@gmail.com>
parents: 50
diff changeset
29 if (player == undefined)
41
f71c5c19940f Specify our interpolation filter in music.html
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 40
diff changeset
30 player = new ChiptuneJsPlayer(new ChiptuneJsConfig(-1, 100, 1));
53
1a6df6d6b7ea music: use The Mod Archive for direct links
Paper <mrpapersonic@gmail.com>
parents: 50
diff changeset
31 else
32
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
32 player.stop();
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
33 }
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
34
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
35 function afterLoad(path, buffer) {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
36 player.play(buffer);
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
37 setMetadata(path);
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
38 }
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
39
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
40 function loadURL(path) {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
41 init();
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
42 player.load(path, afterLoad.bind(this, path));
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
43 }
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
44
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
45 function setMetadata(filename) {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
46 var metadata = player.metadata();
53
1a6df6d6b7ea music: use The Mod Archive for direct links
Paper <mrpapersonic@gmail.com>
parents: 50
diff changeset
47 if (metadata['title'] != '')
32
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
48 document.getElementById('title').innerHTML = metadata['title'];
53
1a6df6d6b7ea music: use The Mod Archive for direct links
Paper <mrpapersonic@gmail.com>
parents: 50
diff changeset
49 else
32
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
50 document.getElementById('title').innerHTML = filename;
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
51 }
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
52
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
53 function pauseButton() {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
54 player.togglePause();
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
55 }
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
56
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
57 document.querySelector('#playpause').addEventListener('click', pauseButton, false);
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
58 document.querySelectorAll('.song').forEach(function(e) {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
59 e.addEventListener('click', function(evt) {
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
60 loadURL(evt.target.getAttribute("data-modurl"));
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
61 }, false);
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
62 });
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
63 };
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
64 </script>
59
d1e77bf4b37f music: move inline script to before libopenmpt is loaded
Paper <mrpapersonic@gmail.com>
parents: 58
diff changeset
65 <script type="application/javascript" src="./js/chiptune2.js"></script>
d1e77bf4b37f music: move inline script to before libopenmpt is loaded
Paper <mrpapersonic@gmail.com>
parents: 58
diff changeset
66 <script type="application/javascript" src="./js/libopenmpt.js"></script>
20
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
67 </head>
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
68 <body>
45
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
69 <div class="navbar-wrapper">
56
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
70 <div class="container">
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
71 <div class="navbar navbar-inverse">
45
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
72 <div class="navbar-inner">
50
65a2123aaf04 Make the brand text on navbar link to main page
Paper <mrpapersonic@gmail.com>
parents: 47
diff changeset
73 <a class="brand" href="./">Paper's website</a>
45
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
74 <ul class="nav">
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
75 <li><a href="./">Home</a></li>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
76 <li class="active"><a href="#">Music</a></li>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
77 <li><a href="projects.html">Projects</a></li>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
78 </ul>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
79 </div>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
80 </div>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
81 </div>
e44fb9a05998 why does this work?
Paper <37962225+mrpapersonic@users.noreply.github.com>
parents: 44
diff changeset
82 </div>
20
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
83 <h1>Music</h1>
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
84 <div class="box">
32
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
85 <p>Now playing:</p>
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
86 <p id="title">nothing loaded</p>
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
87 <button type="button" class="btn btn-primary" id="playpause">Play/Pause</button>
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
88 </div>
fc37e1f8b89e Add chiptune2.js functionality
Paper <mrpapersonic@gmail.com>
parents: 31
diff changeset
89 <div class="box">
20
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
90 <h2>Originals</h2>
64
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
91 <p><a href="#" class="song" data-modurl="./music/paper_-_old_desk_tribute.xm">Old Desk Tribute [.XM]</a>&nbsp;<a href="./music/paper_-_old_desk_tribute.xm" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
92 <p><a href="#" class="song" data-modurl="./music/paper_-_chippygolucky.xm">Chippy-Go-Lucky [.XM]</a>&nbsp;<a href="./music/paper_-_chippygolucky.xm" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
93 <p><a href="#" class="song" data-modurl="./music/paper_-_whistling_meadows.it">Whistling Meadows [.IT]</a>&nbsp;<a href="./music/paper_-_whistling_meadows.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
94 <p><a href="#" class="song" data-modurl="./music/paper_-_shartlover.s3m">xX ShartLover1337 Xx [.S3M]</a>&nbsp;<a href="./music/paper_-_shartlover.s3m" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
95 <p><a href="#" class="song" data-modurl="./music/paper_-_reaching_the_world_border.it">Reaching the World Border [.IT]</a>&nbsp;<a href="./music/paper_-_reaching_the_world_border.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
96 <p><a href="#" class="song" data-modurl="./music/paper_-_sarta.mptm">THIS IS SARTA [.MPTM]</a>&nbsp;<a href="./music/paper_-_sarta.mptm" download>(Download)</a></p>
53
1a6df6d6b7ea music: use The Mod Archive for direct links
Paper <mrpapersonic@gmail.com>
parents: 50
diff changeset
97 </div>
56
c95a96b61d9a html: Add Content Security Policy headers
Paper <mrpapersonic@gmail.com>
parents: 53
diff changeset
98 <div class="box">
53
1a6df6d6b7ea music: use The Mod Archive for direct links
Paper <mrpapersonic@gmail.com>
parents: 50
diff changeset
99 <h2>Collabs</h2>
64
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
100 <p><a href="#" class="song" data-modurl="./music/usa_keyboard_final.it">USA Keyboard (co-op with ishineee, rainbow, and quyu) [.IT]</a>&nbsp;<a href="./music/usa_keyboard_final.it" download>(Download)</a></p>
20
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
101 </div>
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
102 <div class="box">
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
103 <h2>Covers</h2>
64
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
104 <p><a href="#" class="song" data-modurl="./music/paper_-_huxchx.it">Razerek - huxchx [.IT]</a>&nbsp;<a href="./music/paper_-_huxchx.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
105 <p><a href="#" class="song" data-modurl="./music/gerudo_valley.s3m">Gerudo Valley (OPL2) [.S3M]</a>&nbsp;<a href="./music/gerudo_valley.s3m" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
106 <p><a href="#" class="song" data-modurl="./music/paper_-_tintin_on_the_moon.mod">TinTin on the Moon [.MOD]</a>&nbsp;<a href="./music/paper_-_tintin_on_the_moon.mod" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
107 <p><a href="#" class="song" data-modurl="./music/paper_-_dance_in_the_universe_cover.mod">Dance in the universe cover [.MOD]</a>&nbsp;<a href="music/paper_-_dance_in_the_universe_cover.mod" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
108 <p><a href="#" class="song" data-modurl="./music/paper_-_bob-omb_battlefield_remix.it">Super Mario 64 - Bob-omb Battlefield Remix [.IT]</a>&nbsp;<a href="./music/paper_-_bob-omb_battlefield_remix.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
109 <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>&nbsp;<a href="./music/paper_-_point_of_no_hi-score.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
110 <p><a href="#" class="song" data-modurl="./music/paper_-_vrc6n001_remake.it">(remake) Naruto - VRC6N001 [.IT]</a>&nbsp;<a href="./music/paper_-_vrc6n001_remake.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
111 <p><a href="#" class="song" data-modurl="./music/paper_-_hip_shop.it">Deltarune - Hip Shop [.IT]</a>&nbsp;<a href="./music/paper_-_hip_shop.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
112 <p><a href="#" class="song" data-modurl="./music/paper_-_nerou.it">ziner - Flatwoods Monster [.IT]</a>&nbsp;<a href="./music/paper_-_nerou.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
113 <p><a href="#" class="song" data-modurl="./music/paper_-_drip.xm">Leonz - Among Us Drip Theme [.XM]</a>&nbsp;<a href="./music/paper_-_drip.xm" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
114 <p><a href="#" class="song" data-modurl="./music/paper_-_3005.it">Childish Gambino - 3005 [.IT]</a>&nbsp;<a href="./music/paper_-_3005.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
115 <p><a href="#" class="song" data-modurl="./music/paper_-_infinity.it">Cho Ren Sha 68k - Infinity [.IT]</a>&nbsp;<a href="./music/paper_-_infinity.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
116 <p><a href="#" class="song" data-modurl="./music/paper_-_bestending.it">Aphex Twin - Avril 14th [.IT]</a>&nbsp;<a href="./music/paper_-_bestending.it" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
117 <p><a href="#" class="song" data-modurl="./music/paper_-_visitors.xm">KOTO - Visitors [.XM]</a>&nbsp;<a href="./music/paper_-_visitors.xm" download>(Download)</a></p>
b3d3ac6f8c9d *: Update site contents
Paper <mrpapersonic@gmail.com>
parents: 59
diff changeset
118 <p><a href="#" class="song" data-modurl="./music/paper_-_vrc6n001.it">Naruto - VRC6N001 [.IT]</a>&nbsp;<a href="./music/paper_-_vrc6n001.it" download download>(Download)</a></p>
20
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
119 </div>
79a7939810c0 Complete redesign
Paper <mrpapersonic@gmail.com>
parents:
diff changeset
120 </body>