index_dongri.html 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>yys Display</title>
  7. <style>
  8. .monitor-container {
  9. display: flex;
  10. flex-direction: row;
  11. }
  12. .checkbox-container {
  13. display: flex;
  14. flex-direction: column;
  15. }
  16. .operate-container {
  17. display: flex;
  18. flex-direction: column;
  19. }
  20. .status-container {
  21. display: flex;
  22. flex-direction: row;
  23. }
  24. #hint_message p {
  25. font-size: 10px; /* 设置为较小的字体大小 */
  26. }
  27. </style>
  28. </head>
  29. <body>
  30. <h2 id="title_message">Monitor Display</h2>
  31. <div class="monitor-container">
  32. <h3>请选择时间间隔:</h3>
  33. <select id="timeInterval">
  34. <option value="500">0.5 秒</option>
  35. <option value="1000" selected>1 秒</option>
  36. <option value="2000">2 秒</option>
  37. <option value="5000">5 秒</option>
  38. <option value="0">停止</option>
  39. </select>
  40. <canvas id="canvas" width="300" height="400"></canvas>
  41. <h3>待办列表:</h3>
  42. <div id="task_message" style="border: 1px solid #ccc; padding: 10px; margin-top: 10px;"></div>
  43. </div>
  44. <div class="status-container">
  45. <h3>状态:</h3>
  46. <div id="status_message" style="border: 1px solid #ccc; padding: 10px; margin-top: 10px;"></div>
  47. <h3>任务列表:</h3>
  48. <div id="hint_message"></div>
  49. <div class="checkbox-container">
  50. <label>
  51. 是否最大收集:
  52. <input type="text" id="maxCollectCheckbox" value="4,4,3,3,3,2,2,2,1,1">
  53. </label>
  54. <label>
  55. 打怪:
  56. <select id="JiNaCheckbox">
  57. <option value="None">None</option>
  58. <option value="monster">monster</option>
  59. <option value="big_monster">big_monster</option>
  60. <option value="yongbing">yongbing</option>
  61. <option value="jina" selected>jina</option>
  62. </select>
  63. </label>
  64. <label>
  65. 活动:
  66. <select id="AcitivityCheckbox">
  67. <option value="None" selected>None</option>
  68. <option value="lianmeng">lianmeng</option>
  69. <option value="cure">cure</option>
  70. </select>
  71. </label>
  72. <label>
  73. 训练方式:
  74. <select id="trainCheckbox">
  75. <option value="None">None</option>
  76. <option value="default" selected>default</option>
  77. <option value="lv1">优先lv1</option>
  78. <option value="lv8">优先lv8</option>
  79. <option value="lv9">优先lv9</option>
  80. </select>
  81. </label>
  82. <label><input type="checkbox" id="SimpleCheckbox"> 是否小号</label>
  83. <label><input type="checkbox" id="AddStrenghCheckbox"> 是否添加体力</label>
  84. <label><input type="checkbox" id="participateJijieCheckbox"> 是否参与集结</label>
  85. <label><input type="checkbox" id="autoDaily_checkbox"> 自动每日</label>
  86. <label><input type="checkbox" id="always_checkbox"> 无尽运行</label>
  87. </div>
  88. <div class="operate-container">
  89. <button class="custom-button" id="atuo_btn" onclick="begin_paticipate()">自动打熊</button>
  90. <button class="custom-button" id="resetScript_btn" onclick="reset_script()">重置脚本</button>
  91. <button class="custom-button" id="closegame_btn" onclick="close_game()">关闭游戏</button>
  92. <button class="custom-button" id="restartgame_btn" onclick="restart_game()">重新关闭并自动游戏</button>
  93. <button class="custom-button" id="atuoRun_btn" onclick="begin_auto()">自动模式</button>
  94. </div>
  95. </div>
  96. <script src="https://cdnjs.loli.net/ajax/libs/socket.io/4.2.0/socket.io.js"></script>
  97. <script>
  98. const socket = io();
  99. socket.on('connect', () => {
  100. console.log('Connected to server');
  101. });
  102. socket.on('disconnect', () => {
  103. console.log('Disconnected from server');
  104. });
  105. socket.on('image_data', (image_data_base64) => {
  106. const canvas = document.getElementById('canvas');
  107. const ctx = canvas.getContext('2d');
  108. const image = new Image();
  109. image.onload = () => {
  110. ctx.drawImage(image, 0, 0, canvas.width, canvas.height);
  111. };
  112. image.src = 'data:image/jpeg;base64,' + image_data_base64;
  113. });
  114. socket.on('processing_status', (msg) => {
  115. var messageBox = document.getElementById('status_message');
  116. messageBox.innerHTML = msg;
  117. console.log(msg);
  118. });
  119. socket.on('processing_todo', (msg) => {
  120. var messageBox = document.getElementById('task_message');
  121. messageBox.innerHTML = msg;
  122. console.log(msg);
  123. });
  124. socket.on('processing_title', (msg) => {
  125. var messageBox = document.getElementById('title_message');
  126. messageBox.innerHTML = msg;
  127. });
  128. socket.on('processing_cfg', (msg) => {
  129. console.log(msg);
  130. // 获取元素
  131. const maxCollectInput = document.getElementById('maxCollectCheckbox'); // 文本输入框
  132. const jiNaSelect = document.getElementById('JiNaCheckbox'); // 下拉列表
  133. const simpleCheckbox = document.getElementById('SimpleCheckbox'); // 复选框
  134. const AddStrenghCheckbox = document.getElementById('AddStrenghCheckbox'); // 复选框
  135. const participateJijieCheckbox = document.getElementById('participateJijieCheckbox'); // 复选框
  136. const AcitivitySelect = document.getElementById('AcitivityCheckbox'); // 下拉列表
  137. const autoDaily_checkbox = document.getElementById('autoDaily_checkbox'); // 复选框
  138. const trainSelect = document.getElementById('trainCheckbox'); // 下拉列表
  139. const always_checkbox = document.getElementById('always_checkbox'); // 复选框
  140. // 设置值
  141. maxCollectInput.value = msg['maxCollect']; // 设置文本输入框的值
  142. jiNaSelect.value = msg['jina']; // 设置下拉列表的值
  143. simpleCheckbox.checked = msg['simple']; // 设置复选框的状态
  144. AddStrenghCheckbox.checked = msg['add_strength']; // 设置复选框的状态
  145. AcitivitySelect.value = msg['activity']; // 设置下拉列表的值
  146. participateJijieCheckbox.checked = msg['participate_jijie']; // 设置复选框的状态
  147. autoDaily_checkbox.checked = msg['auto_daily']; // 设置复选框的状态
  148. trainSelect.value = msg['train']; // 设置下拉列表的值
  149. always_checkbox.checked = msg['always']; // 设置复选框的状态
  150. // 如果需要显示消息,可以取消注释以下代码
  151. // var messageBox = document.getElementById('title_message');
  152. // messageBox.innerHTML = msg;
  153. });
  154. socket.on('processing_hint', (msg) => {
  155. var messageBox = document.getElementById('hint_message');
  156. var data = JSON.parse(msg);
  157. var listDiv = document.createElement("div");
  158. for (var i = 0; i < data.length; i++) {
  159. var listItem = document.createElement("p");
  160. listItem.textContent = data[i];
  161. listDiv.appendChild(listItem);
  162. }
  163. messageBox.innerHTML = "";
  164. messageBox.appendChild(listDiv)
  165. });
  166. var timerId;
  167. function executeTask() {
  168. var selectElement = document.getElementById("timeInterval");
  169. var selectedValue = selectElement.value;
  170. if (selectedValue == '0'){
  171. clearInterval(timerId)
  172. var canvas = document.getElementById("canvas");
  173. var ctx = canvas.getContext("2d");
  174. ctx.clearRect(0, 0, canvas.width, canvas.height);
  175. timerId = setInterval(executeTask, 1000);
  176. }
  177. else
  178. {
  179. socket.emit('monitor_begin');
  180. clearInterval(timerId)
  181. timerId = setInterval(executeTask, parseInt(selectedValue));
  182. }
  183. }
  184. function begin_auto() {
  185. const maxCollectValue = document.getElementById('maxCollectCheckbox').value; // 获取文本输入框的值
  186. const jiNaValue = document.getElementById('JiNaCheckbox').value; // 获取下拉列表的值
  187. const isSimple = document.getElementById('SimpleCheckbox').checked; // 获取复选框的状态
  188. const isAddStrengh = document.getElementById('AddStrenghCheckbox').checked; // 获取复选框的状态
  189. const activityValue = document.getElementById('AcitivityCheckbox').value; // 获取下拉列表的值
  190. const participateJijie = document.getElementById('participateJijieCheckbox').checked; // 获取复选框的状态
  191. const autoDaily = document.getElementById('autoDaily_checkbox').checked; // 获取复选框的状态
  192. const trainValue = document.getElementById('trainCheckbox').value; // 获取下拉列表的值
  193. const always = document.getElementById('always_checkbox').checked; // 获取复选框的状态
  194. // 发出数据
  195. socket.emit('begin_auto', {
  196. maxCollect: maxCollectValue, // 发送文本输入框的值
  197. jina: jiNaValue, // 发送下拉列表的值
  198. simple: isSimple // 发送复选框的状态
  199. ,add_strength:isAddStrengh
  200. ,activity:activityValue
  201. ,participate_jijie:participateJijie
  202. ,auto_daily:autoDaily
  203. ,train:trainValue
  204. ,always:always
  205. });
  206. }
  207. function begin_paticipate(){
  208. socket.emit('begin_auto_participate');
  209. }
  210. function restart_game()
  211. {
  212. socket.emit('restart_game');
  213. }
  214. function close_game()
  215. {
  216. socket.emit('close_game');
  217. }
  218. function get_title()
  219. {
  220. socket.emit('get_title');
  221. }
  222. function read_cfg()
  223. {
  224. socket.emit('read_cfg');
  225. }
  226. function reset_script(){
  227. socket.emit('reset_script');
  228. }
  229. function isWorkingHours() {
  230. return false;
  231. const now = new Date();
  232. const day = now.getDay(); // 0是周日,1是周一,...,6是周六
  233. const hours = now.getHours();
  234. const minutes = now.getMinutes();
  235. // 将当前时间转换为分钟数,方便比较
  236. const currentTime = hours * 60 + minutes;
  237. // 工作日检查(周一到周五)
  238. const isWeekday = day >= 1 && day <= 5;
  239. // 工作时间段1: 9:00-11:30 (480-690分钟)
  240. const morningStart = 9 * 60; // 8:00
  241. const morningEnd = 11 * 60 + 30; // 11:30
  242. // 工作时间段2: 14:00-17:30 (840-1050分钟)
  243. const afternoonStart = 14 * 60; // 14:00
  244. const afternoonEnd = 17 * 60 + 30; // 17:30
  245. // 检查是否在工作时间段内
  246. const isWorkingTime = isWeekday &&
  247. ((currentTime >= morningStart && currentTime <= morningEnd) ||
  248. (currentTime >= afternoonStart && currentTime <= afternoonEnd));
  249. return isWorkingTime;
  250. }
  251. function updateButtonStatus() {
  252. const buttons = document.querySelectorAll('.custom-button');
  253. const isDisabled = isWorkingHours();
  254. console.log("isDisabled:", isDisabled);
  255. buttons.forEach(button => {
  256. // 排除restartgame_btn按钮
  257. if(button.id !== 'restartgame_btn') {
  258. button.disabled = isDisabled;
  259. }
  260. });
  261. }
  262. function stopPageAndCloseSocket() {
  263. // 获取当前连接的 WebSocket URL
  264. const socketUrl = socket.io.uri;
  265. // 检查是否为本地连接
  266. if (!socketUrl.includes("127.0.0.1")) {
  267. // 停止定时器
  268. clearInterval(timerId);
  269. // 关闭 WebSocket 连接
  270. socket.disconnect();
  271. // 清除画布内容(可选)
  272. var canvas = document.getElementById("canvas");
  273. var ctx = canvas.getContext("2d");
  274. ctx.clearRect(0, 0, canvas.width, canvas.height);
  275. // 可以添加其他停止页面运行的逻辑...
  276. }
  277. }
  278. document.addEventListener('DOMContentLoaded', function() {
  279. updateButtonStatus();
  280. // 每分钟检查一次时间变化
  281. setInterval(updateButtonStatus, 60000);
  282. });
  283. // 页面加载时设置5分钟后的定时器
  284. window.onload = function() {
  285. get_title();
  286. read_cfg();
  287. executeTask();
  288. setTimeout(stopPageAndCloseSocket, 600000); // 1分钟 = 60000毫秒
  289. };
  290. </script>
  291. </body>
  292. </html>