バイナリクロック in JavaScript DouKaku?

　時刻を二進数相当の表現で出力する時計アプリケーションを書いてください。
　20:18の場合，例えば以下の様な出力をするイメージです。

出力例:
　■□■□□
□■□□■□

#! c:\ruby\bin\ruby.exe -Ks

String.class_eval do |string|
    def words
        self.split(//)
    end
    def fix_width(width, padding)
        (self.words.size > width) ? self : (padding * (width - self.words.size) + self)
    end
end

Fixnum.class_eval do |fixnum|
    alias :to_s_orig :to_s
    def to_s(base, width)
        binary = self.to_s_orig(base).fix_width(width, "0")
    end
end

class BinaryClock
    attr_accessor :now
    def initialize
        self.now = Time.now
    end
    def print
        output(self.now.hour.to_s(2, 5))
        output(self.now.min.to_s(2, 6))
    end
private
    def output(binary)
        puts binary.words.map { |f| f == "0" ? "□" : "■" }.join.fix_width(6, "　")
    end
end

BinaryClock.new.print

強引な1linerで

javascript:{String.prototype.pad=function(l,c){var v=this; while(v.length<l){v=c+v;}return v;};d=new Date();alert((d.getHours().toString(2).pad(6,'　')+"\n"+d.getMinutes().toString(2).pad(6,'0')+"\n"+d.getSeconds().toString(2).pad(6,'0')).replace(/0/g,'□').replace(/1/g,'■'))};

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
       <meta http-equiv="content-type" content="text/html;charset=utf-8">
       <meta http-equiv="content-script-type" content="text/javascript">
       <meta http-equiv="content-style-type" content="text/css">
       <title>Binary Clock</title>
<style type="text/css">
#clock span{
    display: block;
}
</style>
<script type="text/javascript">
var $ = function(id){ return document.getElementById(id); };

var getBinary = function(num){
    var bNum = '';
    while(num >= 2){
        var mod = num % 2;
        num = (num - mod) / 2;
        bNum = mod + '' + bNum;
    }
    bNum = num + '' + bNum;
    return bNum;
};

var getBinaryClockStr = function(num, length){
    var result = '';
    var bNum = getBinary(num);
    while((bNum + '').length < length){
        bNum = '0' + bNum;
    }
    for(var i=0; i<(bNum+'').length; i++){
        result += bNum.substr(i,1) == '1' ? '■' : '□';
    }
    return result;
};

window.onload = function(){
    var setTime = function(){
        var d = new Date();
        $('hour').innerHTML   = getBinaryClockStr(d.getHours(),5);
        $('minute').innerHTML = getBinaryClockStr(d.getMinutes(),6);
        $('second').innerHTML = getBinaryClockStr(d.getSeconds(),6);
    }
    setInterval(setTime, 1000);
};
</script>
</head>
<body>
<p id="clock"><span id="hour"></span><span id="minute"></span><span id="second"></span></p>
</body>
</html>

誤差が出ないように修正。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
       <meta http-equiv="content-type" content="text/html;charset=utf-8">
       <meta http-equiv="content-script-type" content="text/javascript">
       <meta http-equiv="content-style-type" content="text/css">
       <title>Binary Clock</title>
<style type="text/css">
#clock span{
    display: block;
}
</style>
<script type="text/javascript">
var $ = function(id){ return document.getElementById(id); };

var getBinary = function(num){
    var bNum = '';
    while(num >= 2){
        var mod = num % 2;
        num = (num - mod) / 2;
        bNum = mod + '' + bNum;
    }
    bNum = num + '' + bNum;
    return bNum;
};

var getBinaryClockStr = function(num, length){
    var result = '';
    var bNum = getBinary(num);
    while((bNum + '').length < length){
        bNum = '0' + bNum;
    }
    for(var i=0; i<(bNum+'').length; i++){
        result += bNum.substr(i,1) == '1' ? '■' : '□';
    }
    return result;
};

var fixTime = function(miliSec){
    return miliSec < 501 ? miliSec : -(1000-miliSec);
};

window.onload = function(){
    var g = new Date();
    var setTime = function(){
        var d = new Date();
        g = new Date(g.getTime()+1000);
        $('hour').innerHTML   = getBinaryClockStr(g.getHours(),5);
        $('minute').innerHTML = getBinaryClockStr(g.getMinutes(),6);
        $('second').innerHTML = getBinaryClockStr(g.getSeconds(),6);
        
        setTimeout(setTime, 1000-fixTime(d%1000));
    }
    setTime();
};
</script>
</head>
<body>
<p id="clock"><span id="hour"></span><span id="minute"></span><span id="second"></span></p>
</body>
</html>

javascript:alert(function(t){return t>0?arguments.callee(t/60|0)+'\n'+('00000'+(t%2560).toString(2)).slice(-6).replace(/1/g,'■').replace(/0/g,'□'):''}(((new Date().getTime()/1000|0)+32400)%2586400))

DouKaku?

バイナリクロック

Posted feedbacks - JavaScript

Index

Feed

Other

Link

Pathtraq