popo factory blog

JavaScriptとActionScriptでBig Clockを作ってみた

   

前回同様まだActionScriptに慣れていないのと、

プログラムを書く上で同じことを違う種類の言語で書くのは楽しいので

 

またJSとASでのサンプルになります。

 

というわけでBig Clockみたいなものを作りました。

 

 

Big Clockとはhttp://www.bigclock.de/#screenshots

 

Palmのソフトで画面いっぱいに時計が表示されるわかりやすい便利なソフトです。

 

 

以下サンプルになります。

Big Clockと言いながらも単に時間だけが表示される時計です。

 

Javsasript版

 

サンプルページ

 

<div id=”time”>
<script>
(function (){
 var d = document;
 var $ = function (i){return d.getElementById(i);};
 $(“time”).style.fontSize = 120 + “px”;
 $(“time”).style.fontFamily = “tahoma”;
 $(“time”).style.fontWright = “bold”;

 setInterval(
  function(){
   var t = new Date();
   var h = t.getHours();
   var m = t.getMinutes();
   var s = t.getSeconds();
   var ms = t.getMilliseconds();
   if(m < 9) m = “0″ + m ;
   var str = ” ” + h + “:” + m + “:” + s + “:” + ms;
   d.getElementById(“time”).innerHTML = str;
  }, 50);
})();
</script>

 

AS3版

 

サンプルページ

 

package {
 /* big clock */
 import flash.display.*;
 import flash.text.*;
 import flash.events.*;

 public class bc extends Sprite{
  public function bc():void{
   var t = new TextField();
   var f = new TextFormat();
   f.size = 80;
   f.bold = true;
   f.font = “tahoma”;
   t.defaultTextFormat = f;
   t.width = 570;

   addEventListener(Event.ENTER_FRAME, tick);
      function tick( event:Event ):void {
    var d = new Date();
    var h = d.getHours();
    var m = d.getMinutes();
    var s = d.getSeconds();
    var ms = d.getMilliseconds();
    if(m < 9) m = “0″ + m ;
    var str = ” ” + h + “:” + m + “:” + s + “:” + ms;
    t.text = str;
    addChild(t);
      }
  }
 }
}

 

フォントの指定と表示が結構違うものになります。

 

ご意見、ご感想をお待ちしております。

 

 - ActionScript, BigClock, JavaScript