GitHub/xiaomusic
1
0
Fork 0
mirror of https://github.com/hanxi/xiaomusic.git synced 2026-04-11 14:03:37 +08:00
Code Packages Releases Activity

feat: 支持自动填 ip 和端口

Browse Source
This commit is contained in:
涵曦
2025-01-07 08:34:07 +08:00
parent a8161579b4
commit d244575d7b
7 changed files with 66 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
xiaomusic/static/default/debug.html
View File

@@ -6,9 +6,9 @@
<meta name="viewport" content="width=device-width">
<title>Debug For XiaoMusic</title>
<link rel="stylesheet" type="text/css" href="./main.css?version=1735989367">
<link rel="stylesheet" type="text/css" href="./main.css?version=1736209939">
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
<script src="./jquery-3.7.1.min.js?version=1735989367"></script>
<script src="./jquery-3.7.1.min.js?version=1736209939"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-Z09NC1K7ZW"></script>

4
xiaomusic/static/default/downloadtool.html
View File

@@ -4,8 +4,8 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title>歌曲下载工具</title>
<link rel="stylesheet" type="text/css" href="./main.css?version=1735989367">
<script src="./jquery-3.7.1.min.js?version=1735989367"></script>
<link rel="stylesheet" type="text/css" href="./main.css?version=1736209939">
<script src="./jquery-3.7.1.min.js?version=1736209939"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-Z09NC1K7ZW"></script>

6
xiaomusic/static/default/index.html
View File

@@ -6,8 +6,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>小爱音箱操控面板</title>
<link href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined" rel="stylesheet">
<script src="./jquery-3.7.1.min.js?version=1735989367"></script>
<link rel="stylesheet" href="./main.css?version=1735989367">
<script src="./jquery-3.7.1.min.js?version=1736209939"></script>
<link rel="stylesheet" href="./main.css?version=1736209939">
<link rel="icon" href="./favicon.ico">
<!-- Google tag (gtag.js) -->
@@ -220,7 +220,7 @@
Powered by XiaoMusic
</div>
<script src="./md.js?version=1735989367">
<script src="./md.js?version=1736209939">
</script>
</body>

2
xiaomusic/static/default/m3u.html
View File

@@ -5,7 +5,7 @@
<link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width">
<title>M3U to JSON Converter</title>
<link rel="stylesheet" type="text/css" href="./main.css?version=1735989367">
<link rel="stylesheet" type="text/css" href="./main.css?version=1736209939">
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-Z09NC1K7ZW"></script>

5
xiaomusic/static/default/main.css
View File

@@ -351,3 +351,8 @@ span,p {
margin-left: auto;
text-decoration: none;
}
.setting-label {
display: flex;
align-items: center;
}

22
xiaomusic/static/default/setting.html
View File

@@ -5,9 +5,9 @@
<meta name="viewport" content="width=device-width">
<title>小爱音箱操控面板</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<script src="./jquery-3.7.1.min.js?version=1735989367"></script>
<script src="./setting.js?version=1735989367"></script>
<link rel="stylesheet" type="text/css" href="./main.css?version=1735989367">
<script src="./jquery-3.7.1.min.js?version=1736209939"></script>
<script src="./setting.js?version=1736209939"></script>
<link rel="stylesheet" type="text/css" href="./main.css?version=1736209939">
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-Z09NC1K7ZW"></script>
@@ -50,10 +50,20 @@ var vConsole = new window.VConsole();
<label for="password">*小米密码:</label>
<input id="password" type="password" placeholder="填写小米登录密码" />
<label for="hostname">*XIAOMUSIC_HOSTNAME(NAS的IP或域名):</label>
<label for="hostname" class="setting-label">*NAS的IP或域名:
<button class="option-inline mini-button" id="auto-hostname">
<span class="material-icons">sync_alt</span>
<span>自动填</span>
</button>
</label>
<input id="hostname" type="text" />
<label for="public_port">*本地端口(0表示跟容器端口一致):</label>
<label for="public_port" class="setting-label">*本地端口:
<button class="option-inline mini-button" id="auto-port">
<span class="material-icons">sync_alt</span>
<span>自动填</span>
</button>
</label>
<input id="public_port" type="number" value="0" />
</div>
<hr>
@@ -229,7 +239,7 @@ var vConsole = new window.VConsole();
<label for="recently_added_playlist_len">最近新增的歌曲数量:</label>
<input id="recently_added_playlist_len" type="number" value="50" />
<label for="music_list_url" style="display: flex;align-items: center;">歌单地址:
<label for="music_list_url" class="setting-label">歌单地址:
<button class="option-inline mini-button" id="get_music_list">
<span class="material-icons">sync_alt</span>
<span>获取歌单</span>

59
xiaomusic/static/default/setting.js
View File

@@ -1,13 +1,13 @@
$(function(){
$(function () {
// 拉取版本
$.get("/getversion", function(data, status) {
$.get("/getversion", function (data, status) {
console.log(data, status, data["version"]);
$("#version").text(`${data.version}`);
});
// 遍历所有的select元素，默认选中只有1个选项的
const autoSelectOne = () => {
$('select').each(function() {
$('select').each(function () {
// 如果select元素仅有一个option子元素
if ($(this).children('option').length === 1) {
// 选中这个option
@@ -16,7 +16,7 @@ $(function(){
});
};
function updateCheckbox(selector, mi_did, device_list,accountPassValid) {
function updateCheckbox(selector, mi_did, device_list, accountPassValid) {
// 清除现有的内容
$(selector).empty();
@@ -29,7 +29,7 @@ $(function(){
$(selector).append(loginTips);
return;
}
$.each(device_list, function(index, device) {
$.each(device_list, function (index, device) {
var did = device.miotDID;
var hardware = device.hardware;
var name = device.name;
@@ -59,7 +59,7 @@ $(function(){
var selectedDids = [];
// 仅选择给定容器中选中的复选框
$(containerSelector + ' .custom-checkbox:checked').each(function() {
$(containerSelector + ' .custom-checkbox:checked').each(function () {
var did = this.value;
selectedDids.push(did);
});
@@ -68,23 +68,23 @@ $(function(){
}
// 拉取现有配置
$.get("/getsetting?need_device_list=true", function(data, status) {
$.get("/getsetting?need_device_list=true", function (data, status) {
console.log(data, status);
const accountPassValid = data.account && data.password;
updateCheckbox("#mi_did", data.mi_did, data.device_list, accountPassValid);
// 初始化显示
for (const key in data) {
const $element = $("#" + key);
if ($element.length) {
if (data[key] === true) {
$element.val('true');
} else if (data[key] === false) {
$element.val('false');
} else {
$element.val(data[key]);
}
const $element = $("#" + key);
if ($element.length) {
if (data[key] === true) {
$element.val('true');
} else if (data[key] === false) {
$element.val('false');
} else {
$element.val(data[key]);
}
}
}
autoSelectOne();
@@ -94,7 +94,7 @@ $(function(){
var setting = $('#setting');
var inputs = setting.find('input, select, textarea');
var data = {};
inputs.each(function() {
inputs.each(function () {
var id = this.id;
if (id) {
data[id] = $(this).val();
@@ -173,17 +173,17 @@ $(function(){
data: formData,
processData: false,
contentType: false,
success: function(res) {
success: function (res) {
console.log(res);
alert("上传成功");
},
error: function(jqXHR, textStatus, errorThrown) {
error: function (jqXHR, textStatus, errorThrown) {
console.log(res);
alert("上传失败");
}
});
} else {
alert("请选择一个文件");
alert("请选择一个文件");
}
});
@@ -191,14 +191,29 @@ $(function(){
$("#clear_cache").on("click", () => {
localStorage.clear();
});
$("#hostname").on("change", function(){
$("#hostname").on("change", function () {
const hostname = $(this).val();
// 检查是否包含端口号（1到5位数字）
if (hostname.match(/:\d{1,5}$/)) {
alert("hostname禁止带端口号");
// 移除端口号
$(this).val(hostname.replace(/:\d{1,5}$/,""));
$(this).val(hostname.replace(/:\d{1,5}$/, ""));
}
});
$("#auto-hostname").on("click", () => {
const protocol = window.location.protocol;
const hostname = window.location.hostname;
const baseUrl = `${protocol}//${hostname}`;
console.log(baseUrl);
$("#hostname").val(baseUrl);
});
$("#auto-port").on("click", () => {
const port = window.location.port;
console.log(port);
$("#public_port").val(port);
});
});