repeater.ham.upall.cn/index.html at master · git4coder/repeater.ham.upall.cn · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>国内中继地图 - BI6LAL整理，数据来自公众号ZJPLCX</title>
    <script
      type="text/javascript"
      src="https://webapi.amap.com/maps?v=1.4.15&key=d55ca0e5056bc1ea0230557cb9ef99fa&plugin=AMap.RangingTool"
    ></script>
    <script src="js/jquery.min.js"></script>
    <link rel="stylesheet" href="css/style.css" />
    <script src="js/sql-wasm.js"></script>
    <script>
      var db = null;
      const sqlPromise = initSqlJs({
        locateFile: (file) => `./js/${file}`,
      });
      const dataPromise = fetch("./ham_rpt.sqlite")
        .then((res) => {
          // https://developer.mozilla.org/en-US/docs/Web/API/Response/body
          const body = res.body;
          const reader = body.getReader();
          var bytesReceived = 0;
          var contentLength = +res.headers.get("Content-Length");
          return new ReadableStream({
            start(controller) {
              return pump();
              function pump() {
                return reader.read().then(({ done, value }) => {
                  if (done) {
                    controller.close();
                    return;
                  }
                  bytesReceived += value.length;
                  $("#loading span").text(Math.floor(bytesReceived / contentLength * 100) + '%');
                  controller.enqueue(value);
                  return pump();
                });
              }
            },
          });
        })
        .then((stream) => new Response(stream))
        .then((res) => res.arrayBuffer());
      Promise.all([sqlPromise, dataPromise]).then((data) => {
        const [SQL, buf] = data;
        db = new SQL.Database(new Uint8Array(buf));
        $('#loading').text('数据库已加载').css('background', '#35b500').delay(2000).fadeOut();
      });
    </script>
  </head>
  <body>
    <div id="container"></div>
    <div class="plugins"></div>
    <div id="warning">
      提示：标注点并非中继的真实地址。
      <a href="https://github.com/git4coder/repeater.ham.upall.cn">Github</a>
    </div>
    <div id="loading">数据库加载中…<span>0%</span></div>
    <script src="js/map.js"></script>
    <script>
      document.body.addEventListener(
        "touchmove",
        function (e) {
          e.preventDefault(); //阻止默认的处理方式(阻止下拉页面)
        },
        { passive: false }
      ); //passive 参数不能省略，用来兼容ios和android
    </script>
  </body>
</html>