ocanvas time

by dirkk0

HTML

<script src="http://ocanvas.org/source/ocanvas-2.0.0.min.js"></script>
<canvas id="can" width="500" height="500">
</canvas>

JavaScript

var canvas = oCanvas.create({
    canvas: "#can"
});

var text = canvas.display.text({
    x: 177,
    y: 107,
    align: "center",
    font: "bold 42pt LeagueGothicRegular, serif; font-stretch: condensed",
    text: "Hello World!",
    fill: "#0aa"
});

canvas.addChild(text);

var timer = null;

function start(){
    time = new Date()
    var hours = time.getHours()
    var minutes = time.getMinutes()
    minutes=((minutes < 10) ? "0" : "") + minutes
    var seconds = time.getSeconds()
    seconds=((seconds < 10) ? "0" : "") + seconds
    var clock = hours + ":" + minutes + ":" + seconds
    text.text = clock;
    timer = setTimeout(start,1000);
    console.log(clock);
    }
 

canvas.setLoop(function () {
    var time = new Date()
    var hours = time.getHours()
    var minutes = time.getMinutes()
    minutes=((minutes < 10) ? "0" : "") + minutes
    var seconds = time.getSeconds()
    seconds=((seconds < 10) ? "0" : "") + seconds
    var clock = hours + ":" + minutes + ":" + seconds
    text.text = clock;
}).start();