sxlixiaoyang 发表于 2024-7-1 18:16

抖音直播尾号评分工具-html版

本帖最后由 sxlixiaoyang 于 2024-7-10 10:25 编辑

分享一个自己之前写的小公举
1、可以预设分数,将指定的尾号设置固定的分数,比如6666:100,前面是尾号,后面是分数,一行一个,先编辑好在粘贴在提示框里即可。
2、可以通过ws通信对接弹幕工具,实现点赞插队,也就是直播间点赞之后发送四位数字自动计算。
3、固定分数,避免相同尾号出现不同分数
欢迎二开…………
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>手机尾号评分系统</title>
    <style>
      body {
            font-family: Arial, sans-serif;
            margin: 0;
            padding: 20px;
            background-color: #f5f5f5;
      }
      h1 {
            color: #ff0b0b;
            text-align: center;
      }
      .container {
            max-width: 500px;
            margin: 0 auto;
            background: #11c796a3;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
      }
      label, input, button {
            display: block;
            width: 100%;
            margin-bottom: 10px;
      }
      label {
            margin-bottom: 5px;
            color: #666;
      }
      input {
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 5px;
            font-size: 16px;
      }
      button {
            padding: 10px;
            border: none;
            border-radius: 5px;
            background-color: #007bff;
            color: white;
            font-size: 16px;
            cursor: pointer;
      }
      button:hover {
            background-color: #0056b3;
      }
      #result {
            margin-top: 20px;
      }
      table {
            width: 100%;
            border-collapse: collapse;
            margin-top: 20px;
            text-align: center;
      }
      th, td {
            padding: 8px;
            border-bottom: 1px solid #c9990b;
      }
      th {
            background-color: #edff00a6;
      }
      td {
            text-align: center;
      }
      .high-score {
            color: red;
      }
      .thumb-up {
            width: 1em;
            height: 1em;
            vertical-align: middle;
            margin-left: 5px;
      }
    </style>
</head>
<body>
<div class="container">
    <h1>测一测你的手机号多少分</h1>
    <div id="notificationBanner" class="banner"></div>
    <label for="phoneTail">输入手机尾号(后四位):</label>
    <input type="text" id="phoneTail" maxlength="4" placeholder="例如: 1234">
    <button>评分</button>
    <table id="result">
      <thead>
      <tr>
            <th>尾号</th>
            <th>分数</th>
            <th>优秀程度</th>
      </tr>
      </thead>
      <tbody>
      </tbody>
    </table>
</div>
<script>
    let predefinedScores = {};
    let giftUserIds = [];
      let zanUserIds = [];

    function getRandomScore() {
      let random = Math.random();
      if (random < 0.10) {
            return Math.floor(Math.random() * 6) + 60; // 60-65
      } else if (random > 0.90) {
            return Math.floor(Math.random() * 5) + 96; // 96-100
      } else {
            return Math.floor(Math.random() * 31) + 66; // 66-95
      }
    }

    function evaluateValue() {
      const phoneTail = document.getElementById('phoneTail').value;

      if (phoneTail.length !== 4 || isNaN(phoneTail)) {
            alert('请输入有效的4位数字手机尾号');
            return;
      }

      let value;
      if (predefinedScores.hasOwnProperty(phoneTail)) {
            value = predefinedScores;
      } else {
            value = getRandomScore();
            predefinedScores = value;
      }

      addToResultTable(phoneTail, value);
    }

    function addToResultTable(phoneTail, value) {
      const table = document.getElementById('result');
      const tbody = table.querySelector('tbody');
      const newRow = document.createElement('tr');
      const scoreClass = value >= 90 ? 'high-score' : '';
      newRow.innerHTML = `
            <td class="${scoreClass}">${phoneTail}</td>
            <td class="${scoreClass}">${value}分</td>
            <td class="${scoreClass}">${getExcellenceLevel(value)}</td>
      `;
      tbody.insertBefore(newRow, tbody.firstChild);
      if (tbody.children.length > 5) {
            tbody.removeChild(tbody.lastChild);
      }
    }

    function getExcellenceLevel(value) {
      if (value < 70) {
            return '一般';
      } else if (value < 80) {
            return '中上';
      } else if (value < 90) {
            return '优秀';
      } else {
            return `超级棒 <img src="zan.png" style="width: 25px;" />`;
      }
    }

    function showNotificationInBanner(nickname, headImgUrl) {
      const banner = document.getElementById('notificationBanner');
      banner.innerHTML = `
            <img class="avatar-banner" src="${headImgUrl}" alt="${nickname}的头像">
            <span>${nickname},您还没有点赞,请点赞后再发身高数据哦</span>
      `;
      banner.classList.add("notification-active");

      setTimeout(() => {
            banner.innerHTML = '';
            banner.classList.remove("notification-active");
      }, 4000);
    }

    function initWebSocket() {
      const ip = prompt("请输入弹幕监测服务器的IP地址(支持IPV6需要带[]):", "127.0.0.1");
      const port = prompt("请输入弹幕监测服务器的端口:", "2019");
      const predefinedScoresInput = prompt("请输入预设的分数,格式为8888:60,每行一个。", "");

      parsePredefinedScores(predefinedScoresInput);

      socket = new WebSocket(`ws://${ip}:${port}`);
      socket.onopen = function(event) {
            console.log('WebSocket connection opened:', event);
      };
      socket.onmessage = function(event) {
            console.log('Message from server:', event.data);
            try {
                const data = JSON.parse(event.data);
                handleMessage(data);
            } catch (error) {
                console.error('Error parsing JSON:', error);
            }
      };
      socket.onclose = function(event) {
            console.log('WebSocket connection closed:', event);
      };
      socket.onerror = function(event) {
            console.error('WebSocket error:', event);
      };
    }

    function parsePredefinedScores(input) {
      if (!input) return;
      const lines = input.split('\n');
      lines.forEach(line => {
            const = line.split(':');
            if (number && score) {
                predefinedScores = parseInt(score.trim());
            }
      });
    }

    function handleMessage(data) {
      let message = '';
      switch (data.message_type) {
            case 'gift':
                message = `${data.user_id} 送出 ${data.gift_name} x ${data.gift_total_count}`;
                giftUserIds.push(data.user_id);
                break;
            case 'like':
                message = `抖音ID:${data.user_id} 的昵称:${data.user_nickName} 为主播点赞`;
                              zanUserIds.push(data.user_id);
                break;
            case 'join':
                message = `抖音ID:${data.user_id} 的昵称:${data.user_nickName} 进入了直播间`;
                break;
            case 'text':
                message = `${data.user_nickName}: ${data.content}`;
                                        //if (giftUserIds.includes(data.user_id) && /^\d{4}$/.test(data.content)) {
                                        //      document.getElementById('phoneTail').value = data.content;
                                        //      evaluateValue();
                                        //      giftUserIds = giftUserIds.filter(id => id !== data.user_id);
                                        //}
                                        if (zanUserIds.includes(data.user_id) && /^\d{4}$/.test(data.content)) {
                                                document.getElementById('phoneTail').value = data.content;
                                                evaluateValue();
                                                zanUserIds = zanUserIds.filter(id => id !== data.user_id);
                                        }

                break;
            default:
                message = 'Unknown message type';
      }
      //addMessage(`Server: ${message}`);
    }

    function addMessage(message) {
      const banner = document.getElementById('notificationBanner');
      banner.innerHTML = message;
      banner.classList.add("notification-active");

      setTimeout(() => {
            banner.innerHTML = '';
            banner.classList.remove("notification-active");
      }, 4000);
    }

    window.onload = initWebSocket;
</script>
</body>
</html>


示例:https://w.jisuan.link/weihao/weihaozanchadui.html
运行效果:

tomjin 发表于 2024-7-1 18:22

先赞后看支持下

sxlixiaoyang 发表于 2024-7-2 12:59

风在这里停 发表于 2024-7-2 08:05
可以做好以后发出来吗

已经做好了 老铁

fan37257978 发表于 2024-7-1 18:39

赞,有意思的程序

zhu2023 发表于 2024-7-1 18:47

我运行后,没反应

PMRanger 发表于 2024-7-1 21:57

非常赞的分享

rank1987 发表于 2024-7-2 00:28

正好需要这个

风在这里停 发表于 2024-7-2 08:05

可以做好以后发出来吗{:1_926:}

kiwo 发表于 2024-7-2 09:06

还可以这样操作呢

sxlixiaoyang 发表于 2024-7-2 13:00

kiwo 发表于 2024-7-2 09:06
还可以这样操作呢

哈哈哈,闲来无事,瞎玩的
页: [1] 2 3
查看完整版本: 抖音直播尾号评分工具-html版