高橋名人の速度を再現してみる。

高橋名人の速度を視覚的に再現してみました。
https://cloned.jp/tmejin16/
速度は16連射に合わせてコーディングしたつもりですが、JavaScriptのタイマーなどで使うsetTimeoutが小数点を受け付けるか知りませんので、速度の正確性は定かではありません。
GeoCities広告なしのオリジナルソースGeoCitiesは閉鎖することになったので移動しました) を一応貼っておきますので、何かに利用できそうならご自由にどうぞ。(利用の仕方は思いつきませんが)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-JP">
<meta http-equiv="Content-Style-Type" content="text/css">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<style type="text/css">
<!--
* {
    font-family:"Georgia","MS Pゴシック",serif;
}
body {
    background-color:white;
}
div#counter {
    width:50px;
    height:25px;
    text-align:right;
    border-style:solid;
    border-width:1px;
    color:orange;
    background-color:black;
}
td#bar {
    width:50px;
    border-top-style:solid;
    border-top-width:15px;
    border-top-color:#A72D21;
}
.side {
    width:15px;
}
td#center {
    width:20px;
    height:26px;
    border-bottom-style:solid;
    border-bottom-width:5px;
    border-bottom-color:black;
    text-align:center;
    vertical-align:top;
}
input#exec {
    border-style:solid;
    border-width:1px;
    color:white;
    background-color:#444;
    border-color:black;
}
-->
</style>
<script type="text/javascript">
<!--
var appName = window.navigator.appName.charAt(0);
var meijin = null;
onload = function () {
    meijin = new TakahashiMeijin();
}

function TakahashiMeijin() {
    this.active = false;
    this.finger = false;
    this.icon = "▽";
    this.pushCount = 0;
    this.pushSpeed = 1000 / 2 / 16;
    this.push = function () {
        if (this.active) {
            if (this.finger) {
                this.finger = false;
                this.pushCount++;
            } else {
                this.finger = true;
            }
            return true;
        }
        return false;
    }
}

function main() {
    if (!meijin.push()) {
        return;
    }
    write();
    setTimeout("main()", meijin.pushSpeed);
}

function write() {
    document.getElementById("counter").innerHTML = meijin.pushCount;
    if (meijin.finger) {
        document.getElementById("center").style.verticalAlign = "top";
        document.getElementById("center").style.borderWidth = "5px";
        if (appName == "M") {
            document.getElementById("center").style.height = "26px";
        }
    } else {
        document.getElementById("center").style.verticalAlign = "bottom";
        document.getElementById("center").style.borderWidth = "2px";
        if (appName == "M") {
            document.getElementById("center").style.height = "29px";
        }
    }
}

function run() {
    meijin.active = true;
    document.getElementById("center").innerHTML = meijin.icon;
    document.forms[0].elements[0].value = "Stop";
    document.forms[0].elements[0].onclick = stop;
    main();
}

function stop() {
    meijin.active = false;
    document.getElementById("center").innerHTML = "&nbsp;";
    document.forms[0].elements[0].value = "Start";
    document.forms[0].elements[0].onclick = run;
}
//-->
</script>
<title>高橋名人の速度を再現してみる。</title>
</head>
<body>
<h1>高橋名人の速度を再現してみる。</h1>
<form action="./">
  <div id="counter">0</div>
  <table cellspacing="0" cellpadding="0" style="margin-top:14px;">
    <tr>
      <td class="side">&nbsp;</td>
      <td id="center">&nbsp;</td>
      <td class="side">&nbsp;</td>
    </tr>
    <tr>
      <td id="bar" colspan="3">&nbsp;</td>
    </tr>
  </table>
  <div>
    <input id="exec" type="button" value="Start" onclick="run();" style="width:50px;">
  </div>
  <div style="margin-top:20px">
    <a href="http://d.hatena.ne.jp/cloned/">作者</a>
  </div>
</form>
</body>
</html>