JavaScriptコード掲載ページ

文字画面のサンプル




<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>文字スクリーンテスト</title>

<script>
       // 文字スクリーン用文字列、幅、高さ
       var SCRTXT = "";
       var SCRW = 40;
       var SCRH = 25;

       var px,py,ps;
       var samp="This is a Sample. これはサンプルです。 "
       var TimerID;

       // 半角英数字記号→全角変換
       function convertFullWidth(s) {
               var r;
               r = s.replace(/[!-~]/g, function(s) {
                       return String.fromCharCode(s.charCodeAt(0) + 0xFEE0);
               });

               // 空白は上の方法だとうまく変換されないので別個
               r = r.replace(/ /g," ");
               return r;
       }

       // 指定したIDの項目に文字列を入れる
       // 書式:cPrint(ID,文字列)
       function cPrint(id,str) {
               document.getElementById(id).innerHTML = str;
       }

       // 文字スクリーン表示
       function pTx() {
               var y,s;
               s = "";
               for (y = 0;y < SCRH;y++) {
                       s = s + SCRTXT.substr(y * SCRW,SCRW) + "<br>";
               }
               cPrint("SCR",s);
       }

       // 文字スクリーン大きさ設定
       function setTxWidth(w,h) {
               var x,y,s;
               if (w < 0 || h < 0) return false;
               SCRTXT = "";
               // 空白1行分作成
               s = "";
               for (x = 0;x < w;x++) s = s + " ";
               // 高さhの回数だけ繰り返す
               for (y = 0;y < h;y++) SCRTXT = SCRTXT + s;
               //
               SCRW = w;
               SCRH = h;
               pTx();
       }

       // 文字スクリーン画面消去
       function clsTx() {
               setTxWidth(SCRW,SCRH);
               pTx();
       }

       // 文字描画
       function printTx(x,y,s) {
               var p,l,t = "",t0 = "",t1 = "";
               s = convertFullWidth(s);
               l = s.length;// 表示したい文字列の長さ
               p = y * SCRW + x;// 表示位置の計算
               if (p > 0) t0 = SCRTXT.substr(0,p);
               t1 = SCRTXT.substr(p + l);
               SCRTXT = t0 + s + t1;
               SCRTXT = SCRTXT.substr(0,SCRW*SCRH);
               pTx();
       }

       // 一定時間ごとの処理
       function timeInterval() {
               var s;
               s = samp.charAt(ps);
               printTx(px,py,s);
               px++; ps++;
               if (px >= SCRW) { py++; px = 0;}
               if (ps >= samp.length) ps = 0;
               if (py >= SCRH) clearInterval(TimerID);
       }

       // 関数使用サンプル
       function prog() {
               setTxWidth(20,8);
               px = 0; py = 0; ps= 0;
               TimerID = setInterval(timeInterval,250);
       }
</script>

</head>
<body onLoad="prog()">
<table border=1><tr><td>
<span id="SCR">関数の結果が表示されます。</span>
</td></tr></table>
</body>
</html>