<div class="container-fluid" style="min-height:30px; padding-left:0px !important; padding-right:0px !important; background:#54A5AF; margin-bottom:5px">
    <div style="padding-top:5px;padding-bottom:5px;margin-left:15px; margin-right:15px;">
      <div style="float:left;margin-top:3px;text-align:left;color:#ffffff">
         <strong>Cashier Station 1 - <span id="clockbox"></span></strong>
      </div>
      <div style="float:right; margin-top:3px; text-align:right;width:200px;color:#ffffff">
        <% if current_login_employee %>
        <%= current_login_employee.name %>  | <%= link_to 'Logout', logout_path, method: :delete, data: { confirm: 'Are you sure?' } %>
         <% end %>
      </div>
   </div>
</div>
<script type="text/javascript">
tday=new Array("Sun","Mon","Tue","Wed","Thu","Fri","Sat");
tmonth=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec");

function GetClock(){
var d=new Date();
var nday=d.getDay(),nmonth=d.getMonth(),ndate=d.getDate(),nyear=d.getFullYear();
var nhour=d.getHours(),nmin=d.getMinutes(),nsec=d.getSeconds(),ap;

if(nhour==0){ap=" AM";nhour=12;}
else if(nhour<12){ap=" AM";}
else if(nhour==12){ap=" PM";}
else if(nhour>12){ap=" PM";nhour-=12;}

if(nmin<=9) nmin="0"+nmin;
if(nsec<=9) nsec="0"+nsec;

document.getElementById('clockbox').innerHTML=""+tday[nday]+", "+tmonth[nmonth]+" "+ndate+", "+nyear+" "+nhour+":"+nmin+":"+nsec+ap+"";
}

window.onload=function(){
GetClock();
setInterval(GetClock,1000);
}
</script>
<div id="clockbox"></div>
