Update index.htm

This commit is contained in:
WenqiOfficial
2023-11-09 01:04:05 -08:00
committed by Zsolt Zitting
parent a3109aa2b7
commit 3dbf4173fa
+48 -48
View File
@@ -1,49 +1,49 @@
<!DOCTYPE html>
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width">
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>MercuryPlayer</title>
<style>html{background:black;font-family:Meiryo}select,option{-moz-font:-moz-pull-down-menu;font-family:Meiryo}canvas{position:fixed;left:0;top:0;height:100vh;width:100vw}</style>
<style>video{position:fixed;mask-size:100%;mask-image:url('data:image/svg+xml,%3Csvg height%3D"2" width%3D"2" version%3D"1.1" xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"%3E%3Cellipse style%3D"fill%3A%23000" cx%3D"1" cy%3D"1" rx%3D"1" ry%3D"1"%2F%3E%3C%2Fsvg%3E')}</style>
<style>.hide-control div:not(.no-hide) {opacity:0}</style>
<style>.long-audio audio {width:1000px}</style>
<style>
.bgm,.bgm *{opacity:1 !important}
.bgm{display:flex;height:40px;line-height:40px;background:rgba(30,30,30,0.7);width:300px;text-align:center}
.bgm svg{fill:currentColor}
.bgm *:hover>svg{fill:#48a0f7}
.bgm *:hover:active>svg{fill:#2d89e6}
.bgm>*{flex:none}
.bgm .btn{width:40px;padding:3px 0}
.bgm .progress{flex:1}
.bgm .progress input[type=range]{height:40px;margin:0;padding:0;width:100%}
.bgm .duration{width:80px;font-family:Arial;font-size:14px}
.bgm .duration .duration-grey{color:gray}
.bgm .volume{width:30px;padding:3px 0}
.bgm .volume_slider{width:50px;padding:0 15px 0 5px}
.bgm .volume_slider input[type=range]{height:40px;margin:0;padding:0;width:100%}
.long-audio .bgm {width:1000px;max-width:calc(100vw - 16px)}
</style>
</head>
<body ontouchstart>
<video src="../../../../mv_S03_62.mp4" preload id="bga"></video>
<canvas id="canvas"></canvas>
<div style="position:fixed;left:5px;bottom:5px;color:white" class="no-hide">
<div>SE Volume: <select id="se_volume"></select> <input id="se_file" name="mer_se_file" type="file" accept="audio/*" placeholder="sound effect file path..."/></div>
<div class="no-hide"><label><input type="checkbox" id="toggle_ui" autocomplete="off"><span>Hide UI</span></label></div>
<div><label><input type="checkbox" id="toggle_long_audio" autocomplete="off"><span>Long audio</span></label></div>
<div style="white-space:pre-wrap" id="stats"></div>
<div style="display:none"><select id="music_select"></select><br><select id="diffi_select"><option value="0">Normal</option><option value="1">Hard</option><option value="2" selected>Expert</option><option value="3">Inferno</option></select> <input type="button" value="Load" onclick="loadUsingSelect()"></div>
<div><input id="music_file" name="mer_file" type="file" accept=".mer" value=".mer path..."/> <input id="bgm_file" name="mer_bgm_file" type="file" accept="audio/*" placeholder="sound file path..."/> <input type="button" value="Load" onclick="loadUsingFile()"></div>
<input type="range" min="5" max="60" step="1" value="38" autocomplete="off" id="speed_input"><span id="speed_val">3.8</span><br>
<input type="button" value="play" onclick="play()">
<input type="button" value="pause" onclick="pause()">
<input type="button" value="stop" onclick="stop()"><br>
<!--<audio preload id="bgm" controls></audio>-->
<div class="bgm no-hide" id="bgm_custom"></div>
</div>
<div id="play_info" style="position:fixed;white-space:pre;left:0;top:0;color:white;font-family:Arial"></div>
<script>const enableBga = false</script>
<script src="chrome-file-helper.js"></script>
<script src="main.js"></script>
<!DOCTYPE html>
<head>
<meta charset="UTF-8" name="viewport" content="width=device-width">
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>MercuryPlayer</title>
<style>html{background:black;font-family:Meiryo}select,option{-moz-font:-moz-pull-down-menu;font-family:Meiryo}canvas{position:fixed;left:0;top:0;height:100vh;width:100vw}</style>
<style>video{position:fixed;mask-size:100%;mask-image:url('data:image/svg+xml,%3Csvg height%3D"2" width%3D"2" version%3D"1.1" xmlns%3D"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg"%3E%3Cellipse style%3D"fill%3A%23000" cx%3D"1" cy%3D"1" rx%3D"1" ry%3D"1"%2F%3E%3C%2Fsvg%3E')}</style>
<style>.hide-control div:not(.no-hide) {opacity:0}</style>
<style>.long-audio audio {width:1000px}</style>
<style>
.bgm,.bgm *{opacity:1 !important}
.bgm{display:flex;height:40px;line-height:40px;background:rgba(30,30,30,0.7);width:300px;text-align:center}
.bgm svg{fill:currentColor}
.bgm *:hover>svg{fill:#48a0f7}
.bgm *:hover:active>svg{fill:#2d89e6}
.bgm>*{flex:none}
.bgm .btn{width:40px;padding:3px 0}
.bgm .progress{flex:1}
.bgm .progress input[type=range]{height:40px;margin:0;padding:0;width:100%}
.bgm .duration{width:80px;font-family:Arial;font-size:14px}
.bgm .duration .duration-grey{color:gray}
.bgm .volume{width:30px;padding:3px 0}
.bgm .volume_slider{width:50px;padding:0 15px 0 5px}
.bgm .volume_slider input[type=range]{height:40px;margin:0;padding:0;width:100%}
.long-audio .bgm {width:1000px;max-width:calc(100vw - 16px)}
</style>
</head>
<body ontouchstart>
<video src="https://cloud.zeroarea.ml:5221/api/v3/file/get/9419/mv_s01_016.mp4?sign=P90P_FYMwo7YAODlSee4oP1dMWir55SG6PQCnmPtZnI%3D%3A0" preload id="bga"></video>
<canvas id="canvas"></canvas>
<div style="position:fixed;left:5px;bottom:5px;color:white" class="no-hide">
<div>SE Volume: <select id="se_volume"></select> <input id="se_file" name="mer_se_file" type="file" accept="audio/*" placeholder="sound effect file path..."/></div>
<div class="no-hide"><label><input type="checkbox" id="toggle_ui" autocomplete="off"><span>Hide UI</span></label></div>
<div><label><input type="checkbox" id="toggle_long_audio" autocomplete="off"><span>Long audio</span></label></div>
<div style="white-space:pre-wrap" id="stats"></div>
<div style="display:none"><select id="music_select"></select><br><select id="diffi_select"><option value="0">Normal</option><option value="1">Hard</option><option value="2" selected>Expert</option><option value="3">Inferno</option></select> <input type="button" value="Load" onclick="loadUsingSelect()"></div>
<div><input id="music_file" name="mer_file" type="file" accept=".mer" value=".mer path..."/> <input id="bgm_file" name="mer_bgm_file" type="file" accept="audio/*" placeholder="sound file path..."/> <input type="button" value="Load" onclick="loadUsingFile()"></div>
<input type="range" min="5" max="60" step="1" value="38" autocomplete="off" id="speed_input"><span id="speed_val">3.8</span><br>
<input type="button" value="play" onclick="play()">
<input type="button" value="pause" onclick="pause()">
<input type="button" value="stop" onclick="stop()"><br>
<!--<audio preload id="bgm" controls></audio>-->
<div class="bgm no-hide" id="bgm_custom"></div>
</div>
<div id="play_info" style="position:fixed;white-space:pre;left:0;top:0;color:white;font-family:Arial"></div>
<script>const enableBga = false</script>
<script src="chrome-file-helper.js"></script>
<script src="main.js"></script>
</body>