(function ($) {

    $.fn.Clock = function (opts) {
        var container = this.eq(0);
        
        setUp.call(container);

        return this;
    }

    function setUp() {
        var oldMinute;

        setInterval(function () {
            var currentTime = new Date();
            updateImage($("img"), currentTime, oldMinute);
            updateDisplay($("div.display"), currentTime);
            oldMinute = currentTime.getMinutes();
        }, 1000);
    }

    function updateImage(image, currentTime, previousMinute) {
        if (currentTime.getMinutes() != previousMinute) {
            var timeTag = currentTime.getHours() + 'h' + currentTime.getMinutes();
            $.ajaxSetup({ cache: false });
            $.getJSON("/Clock/GetClockImageData?timetag=" + timeTag, function (data) {
                image.attr('src', data.ImageUrl);
            });
        }
    }

    function updateDisplay(display, currentTime) {
        var hour = padLeft(currentTime.getHours());
        var minute = padLeft(currentTime.getMinutes());
        var sec = padLeft(currentTime.getSeconds());
        display.html(hour + ':' + minute + ':' + sec);
    }

    function padLeft(oldValue) {
        return oldValue < 10 ? '0' + oldValue : oldValue;
    }
})(jQuery)