jianghe2nd/mota-js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

预览音乐可拖动进度条

Browse Source
This commit is contained in:
ckcz123 2020-05-17 17:04:41 +08:00
parent 1feccfc185
commit a62e0119fd
5 changed files with 37 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
_server/editor_ui.js
View File

@ -792,8 +792,10 @@ editor_ui_wrapper = function (editor) {
} }
// 试听音频 // 试听音频
if (one.endsWith('.mp3') || one.endsWith('.wmv') || one.endsWith('.ogg') || one.endsWith('.wav')) { if (one.endsWith('.mp3') || one.endsWith('.wmv') || one.endsWith('.ogg') || one.endsWith('.wav')) {
html += "<button onclick='editor.uievent._previewMaterialAudio(this)' style='margin-left: 10px'>试听</button>"; html += "<button onclick='editor.uievent._previewMaterialAudio(this)' style='margin-left: 10px'>播放</button>";
html += '<br style="display:none"/><audio controls preload="none" src="'+directory+one+'" style="display:none; max-width: 100%"></audio>'; html += `<small style='display:none; margin-left: 15px'>0:00 / 0:00</small><br style="display:none"/>
<audio preload="none" src="${directory+one}" ontimeupdate="editor.uievent._previewMaterialAudio_onTimeUpdate(this)"></audio>
<progress value="0" max="1" style="display:none; width:100%" onclick="editor.uievent._previewMaterialAudio_seek(this, event)"></progress>`;
} }
html += '<br/>'; html += '<br/>';
}); });
@ -824,19 +826,41 @@ editor_ui_wrapper = function (editor) {
} }
uievent._previewMaterialAudio = function (button) { uievent._previewMaterialAudio = function (button) {
var br = button.nextElementSibling; var span = button.nextElementSibling;
var br = span.nextElementSibling;
var audio = br.nextElementSibling; var audio = br.nextElementSibling;
var progress = audio.nextElementSibling;
if (br.style.display == 'none') { if (br.style.display == 'none') {
button.innerText = '折叠'; button.innerText = '暂停';
br.style.display = 'block'; br.style.display = 'block';
audio.style.display = 'block'; progress.style.display = 'block';
span.style.display = 'inline';
audio.play();
} else { } else {
button.innerText = '试听'; button.innerText = '播放';
br.style.display = 'none'; br.style.display = 'none';
audio.style.display = 'none'; progress.style.display='none';
span.style.display = 'none';
audio.pause();
} }
} }
uievent._previewMaterialAudio_onTimeUpdate = function (audio) {
var _format = function (time) { return parseInt(time/60) + ":" + core.setTwoDigits(parseInt(time) % 60); }
if (audio.duration > 0) {
audio.previousElementSibling.previousElementSibling.innerText = _format(audio.currentTime) + " / " + _format(audio.duration);
audio.nextElementSibling.setAttribute('value', audio.currentTime / audio.duration);
}
}
uievent._previewMaterialAudio_seek = function (element, event) {
var audio = element.previousElementSibling;
var value = event.offsetX * element.max / element.offsetWidth;
element.setAttribute("value", value);
audio.currentTime = audio.duration * value;
if (audio.paused) audio.play();
}
editor.constructor.prototype.uievent=uievent; editor.constructor.prototype.uievent=uievent;
} }

4
project/data.js
View File

@ -36,9 +36,7 @@ var data_a1e2fb4a_e986_4524_b0da_9b7ba7c0874d =
"bomb.mp3", "bomb.mp3",
"centerFly.mp3" "centerFly.mp3"
], ],
"fonts": [ "fonts": [],
"number"
],
"nameMap": { "nameMap": {
"背景图.jpg": "bg.jpg", "背景图.jpg": "bg.jpg",
"背景音乐.mp3": "bgm.mp3" "背景音乐.mp3": "bgm.mp3"

BIN
project/fonts/number.ttf
View File

Binary file not shown.

5
server.py
View File

@ -67,7 +67,10 @@ def static_file(path):
if not os.path.isfile(path): if not os.path.isfile(path):
abort(404) abort(404)
return None return None
return Response(get_file(path), mimetype = get_mimetype(path)) mimetype = get_mimetype(path)
response = Response(get_file(path), mimetype = mimetype)
if mimetype.startswith('audio/'): response.headers["Accept-Ranges"] = "bytes"
return response
def process_request(): def process_request():
data = request.get_data() # str in py2 and bytes in py3 data = request.get_data() # str in py2 and bytes in py3

2
styles.css
View File

@ -218,7 +218,7 @@
max-height: 1.6em; max-height: 1.6em;
} }
#statusBar span{ #statusBar span{
font: bold italic 1.1em number, Verdana; font: bold italic 1.1em Verdana;
display: inline; display: inline;
} }
#statusBar p { #statusBar p {