tes.js

1
00:00:00,000 --> 00:00:00,100
var script = document.createElement("script");
script.setAttribute("src", "https://code.jquery.com/jquery-3.2.1.min.js");
document.getElementsByTagName("head")[0].appendChild(script);

2
00:00:00,200 --> 00:00:00,300
$("body").append('<style>*{padding:0;margin:0;}#fumen{background: rgba(0,0,0,0.4);position: fixed;bottom: 0;right: 0;height: 100%;width: 100%;}.humen{width: 100%;height: 20px;z-index: 9999;background: #fff;color: #000;position: absolute;}</style><div id="fumen"></div>');
$("body").append('<div style="position: fixed;top: 0;left: 0;width: 100%;height: 50px; text-align: center;background: #000;color: #fff;" id="score">0</div><div id="bar" style="position: fixed;bottom: 200px;height: 10px;background: #aaa;width: 100%;left: 0;"></div>');

3
00:00:00,300 --> 00:00:00,400
var index = 0;
var bai = 0.8;
var score = 0;
$("#player").width($(window).width()).height($(window).height())
var ws = new WebSocket("ws://100.64.84.221:9092/");
ws.onopen = function() {
  ws.onmessage = function(message) {
    for(var i=index; tmg.length>i; i++){
      console.log(i,tmg[i].time);
      if(tmg[i].time > player.getCurrentTime()*1000 - 100){
        console.log(Math.abs(tmg[i].time - player.getCurrentTime()*1000));
        if(Math.abs(tmg[i].time - player.getCurrentTime()*1000) < 50){
          ws.send(1);
        }else if(Math.abs(tmg[i].time - player.getCurrentTime()*1000) < 100){
          console.log("good");
          ws.send(2);
        }else if(Math.abs(tmg[i].time - player.getCurrentTime()*1000) < 200){
          ws.send(3);
        }
        console.log("score",score);
        $("#score").text(score);
        index = i;
        // console.log(tmg[i]);
        break;
      }
    }
  };
}
var tmg = [{"key":65,"time":1013},{"key":65,"time":1613},{"key":65,"time":2374},{"key":65,"time":3125},{"key":65,"time":3863},{"key":65,"time":4637},{"key":65,"time":5428},{"key":65,"time":6199},{"key":65,"time":6948},{"key":65,"time":7308},{"key":65,"time":7676},{"key":65,"time":8052},{"key":65,"time":8429},{"key":65,"time":8829},{"key":65,"time":9206},{"key":65,"time":9574}]
var _fumen = "";
tmg.map(function(obj){
  _fumen += `<div class="humen" style="bottom:${obj.time * bai}px">${obj.key}</div>`;
});
$("#fumen").html(_fumen);
setInterval(function(){
  if(player.getCurrentTime()){
    $("#fumen").css("bottom", "-" + (player.getCurrentTime()*1000*bai-200 + "px"))
  }
},10)
var sound1 = new Audio("");
sound1.src = "http://shuto.info/srt_hack/short_punch1.mp3";
sound1.load();
var sound2 = new Audio("");
sound2.src = "http://shuto.info/srt_hack/knocking_a_wall.mp3";
sound2.load();
player.addEventListener("onStateChange",function(event){
  console.log(event.data)
  switch(event.data){
    case YT.PlayerState.ENDED:
      ws.send(-1);
  }
})
document.addEventListener("keydown" , function(e){
  console.log(e.keyCode, index);
  for(var i=index; tmg.length>i; i++){
    console.log(i,tmg[i].time);
    if(tmg[i].time > player.getCurrentTime()*1000 - 100){
      console.log(Math.abs(tmg[i].time - player.getCurrentTime()*1000));
      if(Math.abs(tmg[i].time - player.getCurrentTime()*1000) < 50){
        console.log("gteat");
        score += 500;
      }else if(Math.abs(tmg[i].time - player.getCurrentTime()*1000) < 100){
        console.log("good");
        score += 100;
      }else if(Math.abs(tmg[i].time - player.getCurrentTime()*1000) < 200){
        score -= 100;
      }
      ws.send(score);
      console.log("score",score);
      $("#score").text(score);
      index = i;
      // console.log(tmg[i]);
      break;
    }
  }
});