sixTimer

SHOW A STATUS BAR EVERY SIX MINUTES

by edwardsharp

HTML

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
<div id="sixr" style="display:none">
    <div id="time"> <span class="hour"></span>  <span class="minute"></span>  <span class="second"></span>

    </div>
</div>
<div id="progressbar">
    <div class="progress-label"></div>
</div>
<div id="dTxt"></div>

CSS

.ui-progressbar {
    position: relative;
}
.progress-label {
    color:#fff;
    position: absolute;
    left: 50%;
    top: 4px;
    font-weight: bold;
    text-shadow: 0px 0px 10px #000;
}
.ui-widget-header {
    background: gray;
    border-color: gray;
}
#sixr {
}

JavaScript

var boolCycle = true;
var secToNextCycle = 0;
var arr6 = [0, 6, 12, 18, 24, 30, 36, 42, 48, 54];
var arr = [];
var timez = {};
//init the time schedule as an array of objz
for (var h = 1; h < 13; h++) {
   for (var m = 0; m < 10; m++) {
       arr.push(zPad(h.toString())+':'+zPad(arr6[m].toString()));
   }
   
}

console.log(arr);
console.log(arr.length);


//zero-zero-based");
displayTxtItems = 120;
displayTxt = [];

$(function () {
    $("#progressbar").progressbar({
        value: 0
    });
});

function zPad(num) {
    if (num < 10) {
        return "0" + num;
    }
    return num;
}
(function ($) {
    $.fn.sixTimer = function () {

        function getTime() {
            var date = new Date();
            return {
                zPhour: twelveHr(date.getHours()),
                zPminute: zeroPad(date.getMinutes()),
                zPsecond: zeroPad(date.getSeconds()),
                hour: twelveHr(date.getHours()),
                minute: date.getMinutes(),
                second: date.getSeconds()
            };
        }
        function twelveHr(h) {
            if (h > 12) {
                h = h-12;
            }
            if (h === 0) {
                h = 12;
            }
            return h;
        }
        function zeroPad(num) {
            if (num < 10) {
                return "_0" + num;
            }
            return "_" + num;
        }

        function timeInterval() {
            var now = getTime();
            

            var progVal = (((now.minute % 6) * 60 + now.second) / (360)) * 100;
            
            var minutes = Math.floor((360 * (progVal / 100)) / 60);
            var seconds = (360 * (progVal / 100)) - minutes * 60;
            var pLabel = Math.abs(minutes.toFixed(0)-5) + ':' + zPad(Math.abs(seconds.toFixed(0)-60));
            //BLAM! magic nearest MOD 
            var pLabelR = arr6.reduce(function (prev, curr) {return (Math.abs(now.minute%6) < Math.abs(prev - now.minute) ? curr : prev);});
            
...