diff --git a/xiaomusic/static/default/app.js b/xiaomusic/static/default/app.js
index 7c81cd7..28156d2 100644
--- a/xiaomusic/static/default/app.js
+++ b/xiaomusic/static/default/app.js
@@ -117,8 +117,7 @@ $(function(){
});
});
- // 拉取播放列表
- function refresh_music_list() {
+ function _refresh_music_list(callback) {
$('#music_list').empty();
$.get("/musiclist", function(data, status) {
console.log(data, status);
@@ -151,13 +150,35 @@ $(function(){
}
}
})
+ callback();
})
+ }
- // 每3秒获取下正在播放的音乐
- get_playing_music();
- setInterval(() => {
+ // 拉取播放列表
+ function refresh_music_list() {
+ // 刷新列表时清空并临时禁用搜索框
+ const searchInput = document.getElementById('search');
+ const oriPlaceHolder = searchInput.placeholder
+ const oriValue = searchInput.value
+ const inputEvent = new Event('input', { bubbles: true });
+ searchInput.value = '';
+ // 分发事件,让其他控件改变状态
+ searchInput.dispatchEvent(inputEvent);
+ searchInput.disabled = true;
+ searchInput.placeholder = '请等待...';
+
+ _refresh_music_list(() => {
+ // 刷新完成再启用
+ searchInput.disabled = false;
+ searchInput.value = oriValue
+ searchInput.dispatchEvent(inputEvent);
+ searchInput.placeholder = oriPlaceHolder;
+ // 每3秒获取下正在播放的音乐
get_playing_music();
- }, 3000);
+ setInterval(() => {
+ get_playing_music();
+ }, 3000);
+ });
}
$("#play_music_list").on("click", () => {
@@ -291,32 +312,27 @@ $(function(){
const searchInput = document.getElementById('search');
const musicSelect = document.getElementById('music-name');
+ const musicSelectLabel = document.getElementById('music-name-label');
searchInput.addEventListener('input', debounce(function() {
const query = searchInput.value.trim();
if (query.length === 0) {
musicSelect.innerHTML = '';
+ musicSelect.style.display = 'none'
+ musicSelectLabel.style.display = 'none'
return;
}
+ musicSelect.style.display = 'block'
+ musicSelectLabel.style.display = 'block'
fetch(`/searchmusic?name=${encodeURIComponent(query)}`)
.then(response => response.json())
.then(data => {
musicSelect.innerHTML = ''; // 清空现有选项
- // 添加用户输入作为一个选项
- const userOption = document.createElement('option');
- userOption.value = query;
- userOption.textContent = `使用关键词联网搜索: ${query}`;
- musicSelect.appendChild(userOption);
-
- if (data.length === 0) {
- const option = document.createElement('option');
- option.textContent = '没有匹配的结果';
- option.disabled = true;
- musicSelect.appendChild(option);
- } else {
+ // 找到的优先显示
+ if (data.length > 0) {
data.forEach(song => {
const option = document.createElement('option');
option.value = song
@@ -324,12 +340,57 @@ $(function(){
musicSelect.appendChild(option);
});
}
+
+ // 添加用户输入作为一个选项
+ const userOption = document.createElement('option');
+ userOption.value = query;
+ userOption.textContent = `使用关键词联网搜索: ${query}`;
+ musicSelect.appendChild(userOption);
+
+ // 提示没找到
+ if (data.length === 0) {
+ const option = document.createElement('option');
+ option.textContent = '没有匹配的结果';
+ option.disabled = true;
+ musicSelect.appendChild(option);
+ }
})
.catch(error => {
console.error('Error fetching data:', error);
});
}, 300));
-
+
+ // 动态显示保存文件名输入框
+ const musicNameSelect = document.getElementById('music-name');
+ const musicFilenameInput = document.getElementById('music-filename');
+ function updateInputVisibility() {
+ const selectedOption = musicNameSelect.options[musicNameSelect.selectedIndex];
+ var startsWithKeyword;
+ if (musicNameSelect.options.length === 0) {
+ startsWithKeyword = false;
+ } else {
+ startsWithKeyword = selectedOption.text.startsWith('使用关键词联网搜索:');
+ }
+
+ if (startsWithKeyword) {
+ musicFilenameInput.style.display = 'block';
+ musicFilenameInput.placeholder = '请输入保存为的文件名称(默认:' + selectedOption.value + ')';
+ } else {
+ musicFilenameInput.style.display = 'none';
+ }
+ }
+ // 观察元素修改
+ const observer = new MutationObserver((mutationsList) => {
+ for (const mutation of mutationsList) {
+ if (mutation.type === 'childList') {
+ updateInputVisibility()
+ }
+ }
+ });
+ observer.observe(musicNameSelect, { childList: true });
+ // 监听用户输入
+ musicNameSelect.addEventListener('change', updateInputVisibility);
+
function get_playing_music() {
$.get(`/playingmusic?did=${did}`, function(data, status) {
console.log(data);
diff --git a/xiaomusic/static/default/index.html b/xiaomusic/static/default/index.html
index 8a7d032..5519abe 100644
--- a/xiaomusic/static/default/index.html
+++ b/xiaomusic/static/default/index.html
@@ -53,12 +53,12 @@ var vConsole = new window.VConsole();
-
-