2024-11-13 11:26:59 +08:00
|
|
|
|
<!--
|
|
|
|
|
* @Descripttion:
|
|
|
|
|
* @version:
|
|
|
|
|
* @Author: Eugene
|
|
|
|
|
* @Date: 2022-05-23 09:31:25
|
|
|
|
|
* @LastEditors: Andy
|
|
|
|
|
* @LastEditTime: 2024-03-23 18:41:30
|
|
|
|
|
-->
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<script type="text/javascript" src="js/webView.js"></script>
|
|
|
|
|
<meta charset="UTF-8">
|
|
|
|
|
<meta http-equiv="max-age" content="31536000">
|
|
|
|
|
<meta http-equiv="Pragma" content="public">
|
|
|
|
|
<meta http-equiv="Cache-control" content="public">
|
|
|
|
|
<meta http-equiv="Cache" content="public">
|
|
|
|
|
<meta name="viewport"
|
|
|
|
|
content="width=device-width, initial-scale=1, minimum-scale=0.01, maximum-scale=1, user-scalable=yes" />
|
|
|
|
|
<title>屏幕参数</title>
|
|
|
|
|
<link rel="stylesheet" href="css/style.css">
|
|
|
|
|
<link rel="stylesheet" href="css/common.css">
|
|
|
|
|
<link rel="prefetch" href="content_pattern1.html">
|
|
|
|
|
<script src="js/jquery-3.4.1.min.js"></script>
|
|
|
|
|
<script src="js/MQTT_port.js"></script>
|
|
|
|
|
<script src="js/jsonid.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<div class="contain">
|
|
|
|
|
<header>
|
|
|
|
|
<span><a href="screen_main.html"><返回</a></span>
|
|
|
|
|
</header>
|
|
|
|
|
<div class="box">
|
|
|
|
|
<!-- <form action="content.html" method="post"> -->
|
|
|
|
|
<ul>
|
|
|
|
|
<li>
|
|
|
|
|
<label>屏幕模板:</label>
|
|
|
|
|
<select id="template">
|
|
|
|
|
<option selected="selected" value="0">自定义</option>
|
|
|
|
|
<option value="1">伸缩屏</option>
|
|
|
|
|
<option value="2">大屏</option>
|
|
|
|
|
<option value="3">小屏</option>
|
|
|
|
|
</select>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<label>OE极性:</label>
|
|
|
|
|
<select id="oe_polarity">
|
|
|
|
|
<option value="0">0</option>
|
|
|
|
|
<option selected="selected" value="1">1</option>
|
|
|
|
|
</select>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<label>DATA极性:</label>
|
|
|
|
|
<select id="data_polarity">
|
|
|
|
|
<option value="0">0</option>
|
|
|
|
|
<option selected="selected" value="1">1</option>
|
|
|
|
|
</select>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<label>屏宽:</label>
|
|
|
|
|
<input type="number" name="screenwidth" placeholder="请输入数值" id="sw">
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<label>屏高:</label>
|
|
|
|
|
<input type="number" name="screenheight" placeholder="请输入数值" id="sh">
|
|
|
|
|
</li>
|
|
|
|
|
<!-- <li>
|
|
|
|
|
<label>色彩:</label>
|
|
|
|
|
<input type="radio" name="screencolor" id="mono" checked="checked" value="mono"><label
|
|
|
|
|
for="mono">单色</label>
|
|
|
|
|
<input type="radio" name="screencolor" id="two-color" value="two-color"><label
|
|
|
|
|
for="two-color">双色</label>
|
|
|
|
|
</li> -->
|
|
|
|
|
<li>
|
|
|
|
|
<label>屏幕旋转:</label>
|
|
|
|
|
<select name="screenrotate" id="srt">
|
|
|
|
|
<option selected="selected" value="0">0度</option>
|
|
|
|
|
<option value="90">90度</option>
|
|
|
|
|
<option value="180">180度</option>
|
|
|
|
|
<option value="270">270度</option>
|
|
|
|
|
</select>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<button name="submit" id="read">读取</button><br>
|
|
|
|
|
<input type="submit" id="set" value="设置"></button>
|
|
|
|
|
<!-- </form> -->
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<footer>
|
|
|
|
|
<ul>
|
|
|
|
|
<li><a href="screen_main.html">首页</a></li>
|
|
|
|
|
<li><a class="active" href="screen_par.html">屏参</a></li>
|
|
|
|
|
<li><a href="screen_program.html">节目管理</a></li>
|
|
|
|
|
<li><a href="#">联系我们</a></li>
|
|
|
|
|
</ul>
|
|
|
|
|
<div style="height:80px" hidden="hidden"></div>
|
|
|
|
|
</footer>
|
|
|
|
|
</div>
|
|
|
|
|
<div id="result_prompt_txt" class="toast">
|
|
|
|
|
<span>结果内容</span>
|
|
|
|
|
</div>
|
|
|
|
|
<script>
|
|
|
|
|
json_id = localStorage.getItem("json_id");
|
|
|
|
|
var screen_par_reply_parse_fun;
|
|
|
|
|
/*********************************************************屏幕参数页面数据提交->读取数据**************************************************/
|
|
|
|
|
var baseHost = document.location.origin
|
|
|
|
|
//mode 提示消息显示模式(0关闭 1显示 3显示特定时间) txt显示内容
|
|
|
|
|
function result_prompt_display(mode, txt) {
|
|
|
|
|
document.getElementById("result_prompt_txt").getElementsByTagName("span")[0].innerHTML = txt;
|
|
|
|
|
if (mode == 0) {
|
|
|
|
|
$("#result_prompt_txt").css("display", "none");
|
|
|
|
|
} else if (mode == 1) {
|
|
|
|
|
$("#result_prompt_txt").css("display", "flex");
|
|
|
|
|
} else {
|
|
|
|
|
$("#result_prompt_txt").css("display", "flex");
|
|
|
|
|
setTimeout(function () {
|
|
|
|
|
$("#result_prompt_txt").css("display", "none");
|
|
|
|
|
}, 500);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
function item_init(obj) {
|
|
|
|
|
document.getElementById('sw').value = obj.screen_p.w
|
|
|
|
|
document.getElementById('sh').value = obj.screen_p.h
|
|
|
|
|
document.getElementById('oe_polarity').value = obj.screen_p.oe
|
|
|
|
|
document.getElementById('data_polarity').value = obj.screen_p.data
|
|
|
|
|
// if (obj.screen_p.oe == 0 && obj.screen_p.data == 1) {
|
|
|
|
|
// document.getElementById('two-color').checked = "checked"
|
|
|
|
|
// } else {
|
|
|
|
|
// document.getElementById('mono').checked = "checked"
|
|
|
|
|
// }
|
|
|
|
|
document.getElementById('srt').value = obj.screen_p.screen_angle
|
|
|
|
|
}
|
|
|
|
|
function screen_par_reply_parse(json_str) {
|
|
|
|
|
let json = jQuery.parseJSON(json_str);
|
|
|
|
|
if ("screen_p" in json.led_protocol) {
|
|
|
|
|
item_init(json.led_protocol);
|
|
|
|
|
result_prompt_display(2, "获取屏幕参数成功");
|
|
|
|
|
}
|
|
|
|
|
else if ("screen_ok" in json.led_protocol) {
|
|
|
|
|
del_all_icon();
|
|
|
|
|
result_prompt_display(2, "设置屏幕参数成功");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
screen_par_reply_parse_fun = screen_par_reply_parse;
|
|
|
|
|
function get_screen_parameter() {
|
|
|
|
|
var screen_start = {};
|
|
|
|
|
// screen_start.jsonid = json_id;
|
|
|
|
|
screen_start = new Object()
|
|
|
|
|
screen_start.get_screen = 1;
|
|
|
|
|
var str = JSON.stringify(screen_start);
|
2025-03-26 17:10:39 +08:00
|
|
|
|
let send_string = "{\"JSON_id\":" + json_id + ",\"board_id\":102"+",\"led_protocol\":" + str + "}";
|
2024-11-13 11:26:59 +08:00
|
|
|
|
console.log(str);
|
|
|
|
|
result_prompt_display(1, "获取中...");
|
|
|
|
|
if (MQTT_MODE == 0) {
|
|
|
|
|
var xhr = new XMLHttpRequest();
|
|
|
|
|
xhr.open('POST', baseHost + '/communication', true);
|
|
|
|
|
xhr.setRequestHeader('content-type', 'application/json');
|
2025-03-26 17:10:39 +08:00
|
|
|
|
xhr.send(send_string);
|
2024-11-13 11:26:59 +08:00
|
|
|
|
xhr.onreadystatechange = function () {
|
|
|
|
|
if (xhr.readyState == 4) {
|
|
|
|
|
if (xhr.status == 200) {
|
|
|
|
|
screen_par_reply_parse(xhr.responseText);
|
|
|
|
|
} else {
|
|
|
|
|
result_prompt_display(2, "获取屏幕参数失败");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
MQTT_send(str);
|
|
|
|
|
}
|
|
|
|
|
json_id++;
|
|
|
|
|
localStorage.setItem("json_id", json_id);
|
|
|
|
|
}
|
|
|
|
|
$(function () {
|
|
|
|
|
if (/xazn/.test(navigator.userAgent)||/uni-app/.test(navigator.userAgent)) {
|
|
|
|
|
// 在App中
|
|
|
|
|
document.addEventListener("UniAppJSBridgeReady", function () {
|
|
|
|
|
get_screen_parameter();
|
|
|
|
|
$('#read').on('click', function () {
|
|
|
|
|
get_screen_parameter();
|
|
|
|
|
})
|
|
|
|
|
});
|
|
|
|
|
} else {
|
|
|
|
|
get_screen_parameter();
|
|
|
|
|
$('#read').on('click', function () {
|
|
|
|
|
get_screen_parameter();
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
// $(function () {
|
|
|
|
|
// get_screen_parameter();
|
|
|
|
|
// $('#read').on('click', function () {
|
|
|
|
|
// get_screen_parameter();
|
|
|
|
|
// })
|
|
|
|
|
// })
|
|
|
|
|
$("#template").on("change", function () {
|
|
|
|
|
if (document.getElementById("template").value == "1") {
|
|
|
|
|
document.getElementById('sw').value = 64;
|
|
|
|
|
document.getElementById('sh').value = 32;
|
|
|
|
|
// document.getElementById('mono').checked = "checked";
|
|
|
|
|
document.getElementById('srt').value = 270;
|
|
|
|
|
}
|
|
|
|
|
else if (document.getElementById("template").value == "2") {
|
|
|
|
|
document.getElementById('sw').value = 64;
|
|
|
|
|
document.getElementById('sh').value = 32;
|
|
|
|
|
// document.getElementById('mono').checked = "checked";
|
|
|
|
|
document.getElementById('srt').value = 180;
|
|
|
|
|
}
|
|
|
|
|
else if (document.getElementById("template").value == "3") {
|
|
|
|
|
document.getElementById('sw').value = 64;
|
|
|
|
|
document.getElementById('sh').value = 16;
|
|
|
|
|
// document.getElementById('mono').checked = "checked";
|
|
|
|
|
document.getElementById('srt').value = 0;
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
/*********************************************************屏幕参数页面数据提交->设置数据**************************************************/
|
|
|
|
|
function del_all_icon() {
|
|
|
|
|
let manage = {};
|
|
|
|
|
// manage.jsonid = json_id;
|
|
|
|
|
manage = new Object()
|
|
|
|
|
manage.pro_manage = new Object();
|
|
|
|
|
manage.pro_manage.type = 2;
|
|
|
|
|
manage.pro_manage.data = -1;
|
|
|
|
|
var str = JSON.stringify(manage);
|
2025-03-26 17:10:39 +08:00
|
|
|
|
let send_string = "{\"JSON_id\":" + json_id + ",\"board_id\":102"+",\"led_protocol\":" + str + "}";
|
2024-11-13 11:26:59 +08:00
|
|
|
|
if (MQTT_MODE == 0) {
|
|
|
|
|
var xhr = new XMLHttpRequest();
|
|
|
|
|
xhr.open('post', baseHost + '/communication', true);
|
|
|
|
|
xhr.setRequestHeader('content-type', 'application/json');
|
2025-03-26 17:10:39 +08:00
|
|
|
|
xhr.send(send_string);
|
2024-11-13 11:26:59 +08:00
|
|
|
|
xhr.onreadystatechange = function () {
|
|
|
|
|
if (xhr.readyState == 4) {
|
|
|
|
|
if (xhr.status == 200) {
|
|
|
|
|
console.log("删除全部节目");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
MQTT_send(str);
|
|
|
|
|
}
|
|
|
|
|
json_id++;
|
|
|
|
|
localStorage.setItem("json_id", json_id);
|
|
|
|
|
}
|
|
|
|
|
$('#set').on('click', function () {
|
|
|
|
|
// var flag = confirm("更改屏参后会清空节目");
|
|
|
|
|
if (1) {
|
|
|
|
|
var screen_width = parseInt($('#sw').val())
|
|
|
|
|
var screen_height = parseInt($('#sh').val())
|
|
|
|
|
var oecolor = $("input[type='radio']:checked").val()
|
|
|
|
|
var screen_angle = parseInt($('#srt').val())
|
|
|
|
|
var screen = {}
|
|
|
|
|
// screen.jsonid = json_id;
|
|
|
|
|
screen = new Object()
|
|
|
|
|
screen.screen_p = new Object()
|
|
|
|
|
//获取屏幕宽度、高度
|
|
|
|
|
screen.screen_p.w = screen_width
|
|
|
|
|
screen.screen_p.h = screen_height
|
|
|
|
|
/*mono:单色 two-color:双色
|
|
|
|
|
*如果oecolor==momo 输出oe极性为1 另一个值则为0
|
|
|
|
|
*/
|
|
|
|
|
// if (oecolor === "mono") {
|
|
|
|
|
// screen.screen_p.oe = 1
|
|
|
|
|
// screen.screen_p.data = 0
|
|
|
|
|
// } else {
|
|
|
|
|
// screen.screen_p.oe = 0
|
|
|
|
|
// screen.screen_p.data = 1
|
|
|
|
|
// }
|
|
|
|
|
screen.screen_p.oe = parseInt($('#oe_polarity').val())
|
|
|
|
|
screen.screen_p.data = parseInt($('#data_polarity').val())
|
|
|
|
|
screen.screen_p.screen_angle = screen_angle;
|
|
|
|
|
let str = JSON.stringify(screen);
|
2025-03-26 17:10:39 +08:00
|
|
|
|
let send_string = "{\"JSON_id\":" + json_id + ",\"board_id\":102"+",\"led_protocol\":" + str + "}";
|
2024-11-13 11:26:59 +08:00
|
|
|
|
console.log(str);
|
|
|
|
|
result_prompt_display(1, "设置中...");
|
|
|
|
|
if (MQTT_MODE == 0) {
|
|
|
|
|
var xhr = new XMLHttpRequest();
|
|
|
|
|
xhr.open('post', baseHost + '/communication', true);
|
|
|
|
|
xhr.setRequestHeader('content-type', 'application/json');
|
2025-03-26 17:10:39 +08:00
|
|
|
|
xhr.send(send_string);
|
2024-11-13 11:26:59 +08:00
|
|
|
|
xhr.onreadystatechange = function () {
|
|
|
|
|
if (xhr.readyState == 4) {
|
|
|
|
|
if (xhr.status == 200) {
|
|
|
|
|
screen_par_reply_parse(xhr.responseText);
|
|
|
|
|
} else {
|
|
|
|
|
result_prompt_display(2, "设置失败");
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
MQTT_send(str);
|
|
|
|
|
}
|
|
|
|
|
json_id++;
|
|
|
|
|
localStorage.setItem("json_id", json_id);
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|