Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="Fitbit LCD Clock">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  
  <svg id="page" class="portrait-view">
    <!- <image id="background" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAVwAAAD6CAIAAABiRmg8AAAAK3RFWHRDcmVhdGlvbiBUaW1lAFN1biAzIFNlcCAyMDE3IDIxOjIwOjIyIC0wMDAw2RqqTAAAAAd0SU1FB+EJAxUECpA94pkAAAAJcEhZcwAACxEAAAsRAX9kX5EAAAAEZ0FNQQAAsY8L/GEFAAAEeUlEQVR42u3cPUtcaxiG0RO1iNMLKYVgYR0Qf7N/yGIIWAbEdkwRNa9mZ5sriUWKk/dwXKvyo7mneC5mj+Cbh4eHfwC+25s9APhvOXjpF/f399vt9urJbre7vb29vLy8vr6ePRj4Y0dHR6enp4eHh5vN5vjJycnJ3t4L7wkefnFxcXF2dra/vz/7hQD/lnHg48zHsf9agETh5ubm/Px89lrg7xknPw7/xSgoArxC4/B/H4XxRmL2NmCOH58jnqMwHjBmDwPmGOf/cxTu7u58sgiv1jj/EYFvNVj+JrHdbsePZg8D5hjnPyLw7eslCldXV7NXATOtERAF4NHPUdjtdrMnATOtEVii8Pnz59mTgJnWCCxR+Pjx4+xJwExrBJYofPr0afYkYKY1AksUvnz5MnsSMNMaAf9PAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAQhRAEIUgBAFIEQBCFEAQhSAEAUgRAEIUQBCFIAQBSBEAYglCgcHB7OXADOtEVii8O7du9mTgJnWCCxReP/+/exJwExrBJYovH37dvYkYKY1AksUNpvN7EnATGsEligcHx/PngTMtEZAFIBHzxF4eHJ3d7e/vz97FTDHOP8RgW81WN4p7O3tffjwYfYwYI5x/iMCyzcP311cXMweBswxzn9NwXMUhvPz89nbgL9tHP6PHUgUbm5udAFelXHy4/BfjML6HHF2duZzR/gfGwc+zvzHp4bVm8cw/M79/f12u716stvtbm9vLy8vr6+vZ78W4I8dHR2dnp4eHh5uNpvjJycnJ8+fLNaLUQBeJ/9PAYivKSqWeGAPjrwAAAAASUVORK5CYII=" x="0" y="0" width="100%" height="100%" fill="#000000" class="background" /> ->
    <rect x="0" y="0" width="100%" height="100%" fill="black"/>
  
    <image id="day" x="192" y="75" width="68" height="30" fill="#FFFFFF" class="foreground" />
    
    <image id="date1" x="292" y="75" width="20" height="30" fill="#FFFFFF" class="foreground" />
    <image id="date2" x="319" y="75" width="20" height="30" fill="#FFFFFF" class="foreground" />
    
  
    <svg>
    
      <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAABHCAQAAACghN+YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QgODSYPmtpTkwAAACpJREFUSMdj/P+fgSBgYmAYVTSqiGqKRsEoGAWjYBRQGTCO1uajiuitCACxdwQ/SVB8ogAAAABJRU5ErkJggg==" x="166" y="137" width="18" height="71" opacity=".1" fill="#FFFFFF" class="foreground" />
      <image id="separator" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAABHCAQAAACghN+YAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QgODSYPmtpTkwAAACpJREFUSMdj/P+fgSBgYmAYVTSqiGqKRsEoGAWjYBRQGTCO1uajiuitCACxdwQ/SVB8ogAAAABJRU5ErkJggg==" x="166" y="137" width="18" height="71" fill="#FFFFFF" class="foreground" />
      
      <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="7" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" />
      <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="87" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" />
      <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="194" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" />
      <image href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==" x="272" y="118" width="69" height="108" fill="#FFFFFF" opacity=".1" class="foreground" />
      
      <image id="hours1" x="7" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" />
      <image id="hours2" x="87" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" />
      <image id="mins1"  x="194" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" />
      <image id="mins2"  x="272" y="118" width="69" height="108" fill="#FFFFFF" class="foreground" />
    </svg>
    
  </svg>
  
  
  
</body>
</html>
 
text     {
  font-size: 32;
  font-family: System-Regular;
  font-weight: regular;
  y: 12;
  text-length: 32;
}
​
textarea {
  font-size: 32;
  font-family: System-Regular;
  font-weight: regular;
  y: 12;
  text-length: 1024;
}
​
#page {
  background: url(https://nivz78.github.io/Fitbit/IonicSlate.png) no-repeat;
  padding: 279px 50px;
  fill: black;
  overflow: visible;
  width: 348px;
  height: 250px;
}
 
​
//Get the SVG placeholders
var day = document.getElementById("day");
var date1 = document.getElementById("date1");
var date2 = document.getElementById("date2");
​
var hours1 = document.getElementById("hours1");
var hours2 = document.getElementById("hours2");
var mins1 = document.getElementById("mins1");
var mins2 = document.getElementById("mins2");
​
var separator = document.getElementById("separator");
​
var days = [
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DDxReZyieAAACmklEQVRYw+2XS2gTURSG/xljVKwYH8WN0WIFUdpFrRVrwJZUiyISWsRFcSHqIlslG1eusrEilIIgxQeKC5fNwidYshPTCsWItTRFfKFGCtIYaxv9XXSczmTOHadJbRU8s5l77jc//5y5c+YOYAR19vC9eHRTgxk8wtX4TXAjD1j4KvZZ1Dpdeeq8SnVcnLHCOJ9wlauNDRxl1MZv4wuL2lkXnnX85mIkz60WYbKfAaWNIDOkzQjZzxqOWPROOXkdoM5zGMdhTCm0JxDRntsy9bjPlaKN9ejDJke6HlfQjpfm+AJPFvM+6riMY+hAM9qwXzSS0B44cg1IoMlhw4eHqBY1GtCNMJIIGuNLHNdu2XieNso1BE/BuMF/EuaWmcWPSjw3861JTPKgldexxrhiLf54aCNowQdjsBjXrHM65jW0IbQga1pZOCOA9gz7MObM+zDvoQ2yCSEAkwtsBNDSSE8vbunRpGepJvFTGC6V9+ENACCFCLfAXwTmtYzjYpMX7rTAMJKoNqnZ8eziAAOMCa39B08I3aKLA64tfpSxEnlWiDbUVipcW96KUngdALQc1qnWFSrpfMXzrqvnS1k8O8WKnGGAj9hhI2O8zSXK+yubB/dwb9HRyABTJAsMm9RRkuQdWbp8Xna7iCnlR6x3bnn3Fu/HDuVcaG55HX9J/Dfyjxr5jgnjLOdoPzmPvMfwAQBD2CnO3kMEvViKHtw0c+exC4cwhjZud2yfJf5XvBP0C8iicuZtbuVXxZcmy1q22v/0APp5nXVs5GcvvNFHMgyKnaqWH42+w91KG9PSVaJAjWBD5BlX27BYieoYxGOXR3cXr8T8MJKe+VE0a6+Vu7Wn5naay5lU1OMGlYuZfia88DyuroalKu0/AdpbCffJVq0OAAAAAElFTkSuQmCC",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DDiRhpSlzAAAC80lEQVRYw+2XS0gWURTHfzOZZhRJj0WYvXST2MJKSIR8UQRpolSEtYhoYctCVwWt3EQE4UqijCyoRYsieiCkLmqRFYQWFSpRFqQRRX5WZvxbON5vvrkzJj4qorOae87vnvnPvXPPvdcB5XOJFKJtkEqnM+iUSyPlAecFp9bidnGfJtYYR7NTZzEryEYHlaUyfVOUDWqT8rQ7KENNofRJ6yX1eqRsPfcxxwLEcvWqBtWrT1naruHQxDEVKk8fVRPonBshfVCZlhDpgXLU7aMO+eIZ6pFU4wLptPGUnXy3JuULZQzRwoLAaBznMztC+CG2sVBHLP96zlLFS9M+qQNermW0shogCTwpRVSyNZDgCjFbBmfYR3UEP0QLC5TqHA1E8mighHYyvHajPjuXlcQdMv1DJ0nPzKtStcJ7StZHL2qmRoeDvE9knN9BMP97UJbemOkZ1jalmlaNa7Is9jrO5Tp3lQXArMTRAGBRIp9gcT4sitNNKe+8xmzO+WNu4JvmcIMS0mnTSmbAnGeUMmCkRAthKYXeX1PAjJjzhM18sP1J/HZzHquQAmD4DwsBp4uu0WURNjVdIT2+8yIy2zTzLn0AdFARonyEEnoAPCr+NBO8Tumh0rxVs8qs7D2mBPcqYSvz8yG1ZCq85hm3JQQ03+o8b7w/YHK86+0R41ksZE+Zdt4F1XJdKebsMdap39Obxj1VJ3yBn7e/b7K89kqSbo6hKlZMUt0Ypg5JIyoxHQN8MO2kebMpXTXBYiNjljqsTc/ifWmnwMcLminpTiut3mMyGyJnNmwLmALv8pfYfyH/kJCYqTi2/eDrONFxLb5q3oZERxhgScB3go2U84FKrfMOUXG7TQVXmcNpLlq5fpXfW+c9yggtOGvVn1gXQMk6r1zl65N1qxnQWm1Rg5zAvWYi+VUfjfnQ4AUrJ0TGqJSVIResCeR3gV6KnNeRp6lO33E3bi9oD8Vv8cryTSy/9ker9amuCrnDXLPGo1nWzz/R/D8BUXvLNWphoLEAAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DDzqCsSVRAAACiklEQVRYw+2XzUtUURjGn2vTZGBk0AdhH6JGkInYB2hB6qARYYlILSLatLFdkJv+AFe1kTZBm9AKg6CcRVL0YbvAalEhESkobmRUiNQ0zV+Lxovee865M4HYwnc2c877vIffPfPyvHc8YupQQu54qKsef79yXi+8CbecvTrg9firKnVpg7NgSA3iEZnEbbz0sW18YIsTYw+DtPirK5TQwKzj7CEKJTGfEchPynwQeEe+FWM3A7AEpI0RSjjLL8vJwxRJUo4uaUFRMaNG79OS9WE9Z7MRY5deqyiwWaBe9euc5gwFI6r1BiUp5j1gVjURIE+8l4Gdo0qqOoQR0ysVG+oL1KsaNelUKNPuDdh/41xijg5oS1/pmCG30b/wlpD+i/tZc8IYSqrLhfKPsTUrEHKVVL2aVwQlqxs5pnpJUrNKVxdk1eK/BRnWjwwrPxv25vQ1K/2SCLSk943T6lGepmWbJyOSpD41hlPePAm9UbGvWqZnv+KBgmmHi0hUM0adI9/Oe6fFD9Ia1tNqsPcFLrun56aI6ZqXXTV5RoxlKOZmnYroj2lndsqg32HRetpmf6JS+qlwPHErT7G+X5DPWy6E9dww3sh1F8YoMM5OS/4iAD1mFPLpA+ZJhPWcoC7wqZKj1UbTrOURQ6/bkFtHn3XodWfnI/u0PUMfOW7Yi+tIVvo1i18DWVGQRbuaNOR+a8aancxq6GUQN1WpM5pQE4dCr8/P1Khu5eqO7gcyZr10z0uZXSLhe1651WvidFBBFd9DPpmijJPcWvwz5vvIOBVUGvTwEbPFUxsNIkkcNB4LKQpDBmjHsKOwnscA3MXZPcRJGo/tDNZxzYkRgRKBYUXpDNeRE4GRRvkDZgHy5Yc21l8AAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DEA8ZWO/sAAACw0lEQVRYw+2XT0gUYRjGn29ddhPWXMWlg1aaQRB4sD+QSOU/KMgUoTpUEBGEXeqyl6irpyDw3CWooEsHPSimpt2CzaBYSoqWLA+hJSXbZqg9HZz5Zpx953NWpAh89zLzfc/7fL+Z+eZ9ZxXPYETNwRjcib1qUJ814CGixoQptKvZAPr7Kuks0sMXLDNi7GCG3frsCneznb/oH1OsdmWb9bdtXQhAPYYZ98XYjjHUuAaqMI5JnMaiT8InNKsPgfWXWeuAAPvxmKUiRhXGsMszWIlxvPaxnkazygTW53AC5bwBAGFr6CD6cTQPI4wnqBWWq8Q4mtCF43kzvep9AfpHyGEYpSxWN8Ee62l9Ee5HsX6W3a49tRKTCBQmPSP8Zs2eCmG9UbEB+iLYG6Ji/SAbHJsg/wFIWu/lel6wDhfx1jczXeBKkt7lH8Y0ACCFThsDIyijUncBtcQWPEUtYKmgj1Lo5B5EvAVKqCIef3d4/NnLCbvEs5xfSZLLPGyXeGaYXPX293KCcSaFzvGbl4Rq4fKXWojLnzE9XKNNz+mxkrzkmIjhjxIzlrwSZ4/kjE/3h9AjtvloFRLCaDB/JjnAqN8dYZzPeHbVFSQ5wChviXfkunDFLn9h1vbneZLk4IrUC8I4UySX2KITtZ5H2Ob5NQgLrfIXMGx/3ZT68kFYxJRv0+srsOkJere/U0caBZcIDviu0FhgHVnDf7PErwUyizcAgHm8/KcgKosmpDGPYyr9d0HC+ihrocywGdXqOQBgGQvY4pOZLXAlSe/4Z22QOXRxn/P5bHWaIXSgX0Tx6F1/mWZFDFlv+9/Bg7Ala0MUQ9iat2NaRRQ/PXCRrQKK2f8krimGjLYJjOIzOrAQEAOowygTgbETGMU7dVURCBltHZSfgTAkFLN+CB/t3RDiIX6nKWZYR/12BdCTrxwUo/6e4/sHoKaTsfLotS4AAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DDyfht0mIAAACfklEQVRYw+1XS2sTURg9N07TLBqMi1YE46sUwbZIfIBVsDW2LgSJWnAhomA3WbrIxh/QlW7EjeBGK4pCi20WxncpuBCCbiIuimZRRajRgqihxWlPF81jch8z0yxSF72zmTnn3G/O/eab784IWhhBHO7jEa4IrpzyHF6KOXc5t2OPyKxOD47Sz7hFUZo0zPfc5Bp2G/NMVq586gM4DT/jEroq5zG8YMQYNopJ7KyBfOkDuIglTxvzSIic43o/nnOjNuxWTGKXAvvQW+IBF9DnYWRcvJKQg0ijVwlr4TXatRE89RYgxjBWQ4dgC9szS50arAkd9eoDissQ0nhICw0eAY2NAQw23oqckcMYAAAMalPZQCNrNv5bIzP47XPmBw32D9P16qWSFJ94Ehm0oAjT/vAVAJBFgrsRlLgi4phCe0VVo1dDCZuq3vHm9PIH+132hht8xwhTmh1piUOMMs+Uqje3eFnvJMMeu2WL1kbZSljVu0YLm4v1r0d9FLHZwAi0amYXXaOZ7sZOfmTMZQUpPmEzr2kzcpURvuV5VW+MpuirNmZJ/uQWw8QLJMkMm3mU/dLRwwizJG3GVb3BhqSvls5saW17DUaGS/yEhtvAbIlNrlYv10gH2nz2kSMaLIgD9erXW/y6kbU3Um5XfzTcIubLbP3fYd80mI0CWiXsOg7hFOZwhvuUz+dnSGACIdzGffnNjld6pHsf+cyolu3m99o+AjDIEcbYw19KHy6wmyd4s/zz5gx0zJcRgw2HlaSEdmlsrFjZoa+RNxgHANxFzvhQ8ugTX0ykyOE4Cgo8jSmt/ClmTCtq4mPeobGIedmcDUdWzipYkGklH/eq91kGn44Sp+aRINkAAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DDgRaywm7AAACRklEQVRYw+2WP2hTURTGv5PEhkJDiyhFakFMwdmpSJZYCoqG2oKCgkatk5MgERELDqWLxUBdnPxT2qFLCx1SCl3qooKIi4oICdQEHcQg2MY/FT+HvsS8vnvve5dIo+BZwrvne+f+3nn3fScCZfAAZhCFKVaQkg8B9NOSMZXhRbljSLKHKX6jPla4J7A+a8C4yrKJcowl9nCA3zWl33KvhX6Vcc0+V8gqSEjD0oVlvMIJrCtyJRyUQmB9BUexndcVGJdx8/dVRNuWLiwjiSEc9mQmJG+hn0UFS2hnq4y4ME7hFvyCY05TXyNQmPRs4Scne9y1Puqs+ryajdgBu1Dpw2gPUi2EvyT+g/yjIC8sq6n063ij1L50X6p9pAQAeIpj3IeWzQalcBGjHn14iHhN5YTMcBeyAIpmZ5jgM3YwozDsn7xgq2c3C8woLT7P3X4m1aYsq0cx6hnT7BLzPyMVdGoygp22evmsya359SPDBUY5rnzCa43rq/OGT9hRpVUJTmMKwCIG0es5fGvyuFF9bexNIYxHkvAfYvOWQ28eYBtzzDHHkz73pPijfuhFjOqEpY8kAGzDEQDAIUZk2qDtRXhrnDWMSZ5ppsV/qRlXCA+YbhqIfEWyDuU+zzZt6EnehXKP5xoHWf0jKHd5vjGQMoYsCd5pUYY92vdBfeEj9wfd3/GRPLtdq3EW6+ZNWjEo63xEV9gCwwHZhOFBmVPObJ9/8WX0y3Orl1JAUorGs6I6S5dw2/yElt8Sh73d8HRlTpO/sfH7C3sxPYn5gLUOAAAAAElFTkSuQmCC",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEQAAAAeCAQAAAA/D3CoAAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA4DDwBEvfzjAAACrElEQVRYw+2XzUtUURjGf2eadCAlobSFCEFGREUIVlSkZiVR1lQWhEREbWwTEW76A9zUqk0UEX1RGBWpizJEKWoRSYswNCJdlBSliJAzappPi8ZJ55x7Z0boQ+hZ3Xve33nvc1/Ofc89hpgU4CK7cOkOJ4x+3Wo99WTirSH2mo44HeQ65fjrNifjNnRF3jovE098XIWq1KgnO6QSrdHBSRu6q1R0YTJ9kU9qKarlcSN16lWhduubk4yoVGs0qJoYvUnjKRkZDoACOsNX9jPmUbgRwqZryn0+j+nkgIMfppIoLcyfHDBPOcwEyTRCOKgAlzlCNWXsZbsTazItCSP5PHby94hMtQFgbmmUsiRGGkwrOhUrzhtSkuq8eWVoMBat8ckQUtAeDbAgdrWQ9OTi50yvhtsGTdTbVgL8USlEE9uosq38YSNsYBsAVaz4u0Y89Q8aeZ3mTBc/xtsks97z1R0I0gtAO2EtIyMhGjXd1gxfnnKesCROWTLvtIOHZBFlwF7J5/RSOap1NN4JHSNNXgXqUa3vl1Oqfm11h7Kcab2t+PLKTvoRZ3usETPEIo85hlzZCzrqxxNJur78CJ11vuFp5ei5qqeRtXqgzNR560kr1Kki+w1+ASXW4ovQRQvFfKfCtMWoQ9wAmtnDulR42wZt5DHASvMp9YY8R+2Jm1h802tMjU8gCvQ5RqxOp6FlUOwZ25gm/1NLyZs1nfW/kVll5Dsj8bPKb1YQQBtZ64w+IkwjIS5x04p9dPDj9JE7YyOqoJGQM9pPOWF2TT/pAdDDTkd/H9MWWmdoRRs07HPw6dNix198two8863SF5+Gtjme2Wpor3jh47OZ99ZYD2Xmg9cE08EW+jzzPaMBgGt02C7n6YlHPW7YO6+OeldjSlX2ecbm6r6u2nl/AA6ZrxAMAUH4AAAAAElFTkSuQmCC"
];
​
var digits = [
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKgHDYp52AAAC20lEQVRo3u3aTWsUMRzH8YwXuz7UatXWokWKiKee+x5ERKSoKD6Wgk8HFcHLXrzrW/CiL6EHBVEQsSiiVSy1oCKKF09eim135+uhu7OTmSQz7iaZHvK7zjL5kMlkkvxXiFY4zDLV5AVbhByOVIJ5yVaRD0dZ8Qx5lYJQ414Kc8wrZpb+pOUJQQ0kzHFWPUFes60D4c8aRcZMesG8YSANgTZFxpyg4Rjylu0yJE2RMaecYt6xIwuRKTLmNE1HkPcM5iFZiow56wTzgZ0qSJ4iY85bx3xklxqiosiYi8QWIZ/YrYOoKTJmyhpmniE9REeRMdNWMAsMmyB6ioy53DPmM3vMEBNFxlztCbLISBEEImpiSehyP7qV3GKTiES3WYlWk4/eY9Gv+ZWhVzI903v0PVL0gCxjzJAyFKhZojwyN7NBrJsESqAESqAESqAESqAESqA4pjREbKmt5aJ1uHnF32DS2uZjiPnuNx8NTlrdkg2z0B2lyRnb44ERFvWUjZoDwCbnXAxO9vJFQ9EcAMZccvWmMMo3hWSmfeYWZyDTLl9b9vM9A3lCn/pk6YrrOYQxfqTaeybty7mWXLjuY0LjAD+TetDm7MWbANzwNbtykF/ArLoedIfbPqd6DjHTqX6EhITYe7nuUvfa3jhPO9UhGQL4wzDOb2Auh2lBvGFaEHKYFMQLJgWRMRmIc0wG0sEoIE4xCgjAnGltW/cIKVzx1/1BiisfdV+QMkWYuh+I33rQw/VTD4rCoUagBEqgBEqgBEqgBEqgVEqJrdWDGkXrcPOKv8kFa5uPfbpCQ5nNh0VIMcb0x8VYTEUPktsM9DCulqK/bYx4Lsb+9wFJPdI6dO82Xxkt7hkdxSakJEZNsQ0phVFRXEBKYPIUV5BCTJbiElKAkSmuIUZMmuIDYsB0KL4gWkyb4hOiwaxRfEOUGEGtEogCI+irCJLDyJ9Gv5AMplqIGlMRRN8zVeYfvmsiRe8b5YYAAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH4QgODSIZCmIjxgAAAU1JREFUaN7t2UFKA0EQheFSUfAkIoIJBEEEV17A87nKxo1uQtbZepZIUFQEFwH53UQyjjNNVl1v4L0TfDPTXdU1HeE4u4RbGQhrGQjIQAQov5B0yhaSTGlCUil/IYmUNiSN8h+SROmCpFC6IQmUPkh1Sj+kMqUEqUopQ+pSnihmX+fwZIoppphiiimmmGKKKYOhrGWemhOWIsNHBKc8i1AiOGMlQongnBcRSgRjXjskdzkLeMJbCzJlL2s3XfDegNynDsxc8rGBPHKQXWeu+ARmHCoUvWseOArHcYYebphzrAH5AhbpmA2EdEwDkotpQfIwHRCAhQok4ZjdC6k9fBQgdS9hihDfB/lPgimmmGKKKaaYYoopA6d8yzw1o76LhoyRrIgRejNCn0lozQgtYKHdJLS1heqMUNETqsBC7UCoNwk1SqGuLXSECMfZMT9J+sruENtpcAAAAABJRU5ErkJggg==",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NLCI3X0iCAAACmklEQVRo3u3Zz2vUQBQH8O+Ih6ZqrVZtLVKK+OtP6L8gIiIiIoioFES8eV+R+ld48uSfoGAvIiIWURTFtSoKoqwXwXqptnX368GS3U0yk9km8xLhveNOyH7y5iWZyQPWg8e4wmriEbeiP3i8EsxjbkM6eIKrwpAnmRAA4ElRzAJH4n+eSWNOcU0I8pTbuxD+zMrMaRHMM472QsjsaTrDP4Ehz7mjH2KhADwbFPOCO5MQKwXgObYDQV5yLA1xUACeD4J5xV1ZECcF4IXSMa+5OxuSQwF4iZ0SIW+4xwbJpQCcLQ3T5Lgd4kEBeLkUzCInXBAvCsArhTHvuNcN8aQAvFoI8p6TeRDSwBczDO9jU7Fq1uKX3n2MoPqwZ2SACQoPkaXccRfUJtQmlKIUpShFKUpRilKUopT/hrJSm6vmOJs12XwAnOBiTSgAJ/mhJhSA+/ixwPadUyWU95JZis/2ENOp8Xs+kLlSvjm1eDg+4zQ/J0bnOSQFSWL280vPyANGkpAk5gC/xv2gLdKQJOYQWyQXrG2YoJAk5gjvdrsf0pAERu6uKY7hjeDdoBYP+r2Z36Id+KH7Dd998xK2OdXTmKoW4wPhHBvBMZ4QkoExA0DCYgaEhMPkQMw/CBqJ36+bm10MbpWwXmniqPmxsSdrQ36BF1kT2qgPRRrjpMhiciiCGMMIyznHDJtfun1XilKUohSlKEUpSlGKUsqkdNCpB6WDWSPVUnLug9q8KDdBm3Mycjsmjxaoq2Xzu0hW+jLCa4W+rHzi1MYpZUJ8MZmUsiF+mAxKCIgPJkUJBcnHJCghIXmYPkpoiBvTQ5GAuDAxRQpix6xTJCE2DKMKINkYRpVAsjAcqgiSczfJQhwFLA+x1Ew1EP8lhGT8BZke0cmIdnEWAAAAAElFTkSuQmCC",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NLBGIjymUAAACfklEQVRo3u3ay2oUQRQG4L9deY3xmhg0hOAlK9fuXYmIBAkiSBARRNz5BOJb+AA+goJCUAliEEWNOCaKAVHGhULiRszNP5ukZ7q7qrpCd53qwDnbGnq+PtUz3VV/A+vF81xknJrkbmSLF6JgXnAPisWLXBKGvDRCAICjopgp9qTffKaIucRlIcgr7u1A+MfUmTERzGv2dkNI8zRd5kpgyBvuy0IsFIBXgmLecn8eYqUAvMrVQJB3PFCEOCgAx4NgpnnQBHFSAF6rHfOBh8yQEgrA6/xfI+QjD9sgpRSAN2rDtNhnh3hQAN6sBTPDfhfEiwLwVmXMLI+4IZ4UgLcrQT5zoAxCJvDF7IT3Zwu1lCynN73H6EH8sndkExMUHiJLeeC+oLahMaUUpShFKUpRilKUohSlbBnKYmPOmn1sNWTxAbCfMw2hABzgl4ZQAB7l1wrLdw7WcHkvJAvp0Z5jqDD+yAdyr5Y9pzZPpUcc4rfc6BNul4LkMcP83jXylDskIXnMcf5I86Bd0pA85iTbJKesMUxQSB4zwoed9EMaksPI/WqqY3g3eBrU5gm/O/MnrAb+0/2J3759CRtOdQVTcTGbgwTEdEd1pznRSYekMVnIL5Lv42CKEMbBmCEpJvHB4H4NzystnEvmNyCYQLYT0zgb43E725G0M02BRHjMtkKkFx8OiGwI44RoHqQ7CUpRilKUohSlKEUpStnilJXGnDWP2YKGGEsyJ8b/xcXeCpP5N/m3gcEzDFc7nzuVdlbmOFjeGQmIJ0YG4oWRgnhg5CClGElICUYW4sRIQxwYeYgVEwNiwcSBGDGxIAZMPEgBExOSw8SFmDGRIPbOxKw1Z+v0TS+KHrMAAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NLAN7NljcAAACNUlEQVRo3u3ZvUrEQBAH8ImNHiIiCIqoiPhVWV9v5QOIgoI2WogWCoKl2PsAFjaCj6CFcIjY2FhooSJYiHIWCmop5O5vcV5MNsleTnazU8x0dwPJ7/ZmMzuESIJ3oIA9Fo4ioQC4x6CIrxrFMQZFfAF1ikNMDRKmOMLUIVGKA8wfRKXkjAlD4pQcMVFIEiUnjApJpuSAiUPSKJYxSZB0ikVMMkRHsYRJg+gpFjDpkEYUwxgdpDHFIEYPyUIBCoYoR/rbtPA5xAlFKEIRilCEIhShCEUolik+VQ3d67vROVx/4vcxY2z46MHt/4cPH3NGR7Je3P+PUsGC8UG1Dw/plFb4KZBFK+N7Px6TKR4R5ukwVr6gZe8g+DBoYKd9ep/B1c5pKJY/qSWXUI0Aq1gJqXZhIsoYD644hCcle4q2enIlglk1DlExw3gOZc4icznWgsS6FYiKGcHL77cXaFfLYxMAsGENomLGUAZwiY6k6t7GllWIipnAMTobbzo7EAWTZffbgzSHwQ5sRxmj2TrzHVUsnwhe6T3rusymtAMzcYWuZqrFHqY5iEVMCIJJlNDtChOFvAG4doOJQ+AGkwwJMF4WDO0bOK/c0rT3UYdQiaIrcUNTDoYMZUWCleECAcAGkjNFB8mVoofkS5H3QUIRilCEIhShCEUoQhGK8fDZ/GoMpL1ocDGSaTGMVobR38SoZhgVMKPdxGhrM3rOMHroMXoCM2oHjHoTo0bJqGszOkKQhETG+AGgNUwoHbHM9wAAAABJRU5ErkJggg==",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKy8Gr6L4AAACi0lEQVRo3u3aO2sVQRQH8P/YyAYf8RkVTCGInV/CSkRERIxGNIgGTLQwIliKvfYWaQQ/RkAQURRRI8YHaBkLBVNFk9y9fwuTZWefM3d3ZrY4p1tmL/z2zJm9d85cYD14gisME8+4BXrwZBDMc25FPniKq54hL1IQRnyQwpz2innJbelMRKSGOcM1T5BX3K5PSkRmMGe9YF5zOFsf0fpQGnOOPceQN9yRL9UoGU5jzjvFvOXOolUTpW5JY8YZO4K84y6gjqJjLjnBzHM3YELRMROtYz5wD2BK0TFX2G8R8pF7ARuKjrnaGmaBI4AtRcdMtoL5zH3AIBQdc70x5gv3A4NSdMx0I8hXHqiFQDHCcunoQ3U7wQxBYdBYVWsGd1VkJZMZ51FD8YipnqD/MaT++KBsQmdCKEIRilCEIhShCEUoQnFM6aHfDUqMC2qlC/ugHse6sSWLedFrsXBzSQMw5mW/ZasAjuNxrmaIa2o2uRhtYaUtqSWTzExk+id9TqZG77fSc1rkEbNp0jtLU61DrDA3ko/cdAKxwsyQJG85g1hh7vKOU4gNxjnEHuMQYofhPeenQYs8bPZ1+Amx41frD/wyzYvbw6mig6kgGDuIQ0wKwqOcKz0dco7RIT9Jvg+DyUMYBlMMSTDKBINHLfxeWcBx9XsDgjnomZjHsQCbjExGksx0BUKyMxDPlCqIV0o1xC/lSfVal06CUIQiFKEIRShCEYpQhGIfvc48NQ/yW0c2H3UY4z8jcrjBZC6rvxsYPMWhZs8z06iz8p2j9ZnxATHE+IEYYXxBDDD+ILUYn5AajF9IJcY3pALjH1KKCQEpwYSBFGJCQQow4SA5TEhIBhMWUowJBCnPTMj4Byjt0xcEnc0bAAAAAElFTkSuQmCC",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKx5XcaLCAAAC50lEQVRo3u3aSWsUQRQH8FdetINL1LiCOQjizS/hSUSCiLhENEoMuB1UBC8tEs969yCC+DUCgoiiiBoxLqDHeFAwp2iS6f57mJlOVS9V1TP1qudQ7zZUz8yPV6+6a2miTuAwltBMPMd6UgNHGsG8wAYqBsaw7BnyUoIgwn0Jc9Qr5hU2ypmIAAVzDCueIK+xSe2UCMhhjnvBvMFwvj6iTpOMOYEWM+QtNhdLNcqaZcwpVsw7bCkbNZF0iYwZR8IEeY+tRCaKijnLgpnFCJENRcVMOMd8xDYiW4qKuYDUIeQTthPVoaiYSWeYOewgqktRMVNOMF+wk6gXioq51DfmK3YR9UpRMVf6gnzDbiOEBCJarGx9IG5mmCES1GssixWLqzRZyWWGPQwUjxh9B7VjSPz1QVlDAxOBEiiBEiiBEiiBEiiBEijMlBalg0FJ6LRYGoR1UAsnB2NJluCM12LB2ooNwATn/JatIMI4PSnUDOiieJR9GHUw0hbEgk1mJnL7JymmpNZpJ3tO89hv103qztJl55BamKvZV66xQGphbgAArrNBamFu4xYrpA6GHVIfwwiph8Fd9tOgeeyzexx+poT51vqTftvmhfdwquxgqhGMDQTTiNkxEgQHMFN6OtQZNbwYFfILwIcCRhq+fJgiBAVM7j7CgymHZBjRhlCcS9IdcW8VQw8dzFfm6JD404XQDKndMksHq++sMdu8Uc1Ilhnd3Db2CAGgn/HH/iAmimOMDmKmOMToITYUIHJEear/G5/LdxE2NQIlUAIlUAIlUAIlUAKlUUrq7DyoZZqH62f8Cc47W3zswffeFx8OIWaM7r24lCbF4+xnhvuoq0Xxr4uhZ7S3bgcpGelsuvcaPzBqzkwVxSXEElNOcQ2xwpRROCAWmCKFC2LE5CmcEANGpXBDtBiZ4gOiwaxSfEEqMV2KT0gFpk3xDSnFEKJGICUYwrqGIAWM+mj0C8lhmoWUYxqCVGemyfgPOdGnr0ogSbMAAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKxCwyY/FAAAB9ElEQVRo3u3ZS0sbYRTG8ceuWttaL7VR0VJExJVrv4MUKUWKICIiiPi5/AguKhQXIooorYqillKK4qYrl/H2dyNJTGYmI2bmPYHzrAfym/d25s2RHsI4RcJknTd6HD4HwWzwVrVhgqucIZuREEniS66YLdpKvzxWi/nKdU6Qbd6VIVxGjcxkLpgd2ishED1N37jJGLJLx2NIDEViKlPMTzqrIbEUiWluM4L8oqsWkkCRmMkEs8/7KEgiRWK24ZgDuqMhdSgSc9w1EHLIhzhIXYrEfMMwRxTiISkoEgsNwRzTkwRJRZFYfDbmhN5kSEqKxNKzIKf01YNAi9JiWpX62ZpctVyXit53tSl84kfkCROUPSRfynLygnohM3GKU5ziFKc4xSlOcYpTmoZSNPPWFDgycvmQ6OHYCEWij99GKBL9/DFCkfjI3wjJSpgF/Il/VZBVXobaTYOcVUDWeBVyaw9xXuoHvQ59zgxzAWzFtmFyxYywUu5+eDyepg2j/Ch3h8JC/gN7wTEPEIJjKiBhMVWQcJgICMCeFUiAz+xYSN6XjwRIvk2YRIj3g/yfBKc4xSlOcYpTnOIUpzQ55cbMWzMQ12gIcSVLxBgaGUPTZGjNGFrAhnaToa1t6JwxdOgZOoENlQNDtclQoTRUtQ19QsjjSZl7rcaNpbk8RB4AAAAASUVORK5CYII=",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKjnrYCboAAADPUlEQVRo3u3au2sUQRwH8N/YmPMR4zMxaAjBV2VtbyUiIhJUIr6IAV+FBsFmRWKtvYUIon+CgkJQETEookY8Y0BBlLNQMDbBJHf3tbjc3s5zN3czsynm14UNsx9+O7P7m/kd0XxgL2aQTzzHCuID+3LBvMBKkgP7MesZ8jIBQQE3EpgDXjFjaI/vvItQADjMQcx5grzCqgYEf2sUHtPvBfMaHUkIUKfwmEMoO4a8wWoekqTwmCNOMW+xRoTwFB4zgIojyDuslSEihcccc4IZxzoVRKbwmBPWMR+wXg1RUXjMKVQtQj5igw6ipvCYQWuYIjr1EB2FxwxZwUygywTRU3jMmZYxn7HRDDFReMy5liCT6E6DAAwFmiZd3GTD8RDLiFGzMcvm4o/eI2rX/JchK0JmWg99RtIekGWMGZKFAhQsUe6bb7OEFk0ESqAESqAESqAESqAESqA4ppSpauleM2l1uLniL6Pf2uajE8XmNx9lHLa6JevCRHOUCo7ang/oxqSeslRzAFjBcReTE5vwRbN9J8IA3ZWmL+g0ux3/0WNhpU2xqXi0Z9QrXX9YP3Pjz0+qGEqoRqycOZWwPR6xF9+Eq4/Rpj5ZOmsdImL68D1x5Qm3L8f5+MIFJxARswU/4n7QcnF6XAIAXHQGETHbUAIwpu4HXcFlpxARswMPGt0P/aJzAxEwWVa/O8jCMLjmvBtUwtZsX+ZPVHFcEfyk31nz4rY5lWhM5YvJAsEIIueYZKtuJ0Yb3SF51bjF8JBfAN5LmMTydYeRIZAwwnvEDUYNiTGsBqFISNJVdr2BoVsW6pUi7WF/6hAaJf6xjNNu/Zs1cvVKETISZ8ZU20YeIakVf+QPkt75iHxBsjRhIj8Qv/2ge4unH8TCoUagBEqgBEqgBEqgBEqg5EqpWusHldPqcHPFX8FJa5uPzbpGQ5bNh0VIOsb0w8UqDbI78TAdLcyrafavjqGn1LfQB8RlZP7Qvdn4ip70zOgoNiEZMWqKbUgmjIriApIBI1NcQVIxIsUlJAXDU1xDjJgkxQfEgGlQfEG0mDrFJ0SDqVF8Q5QYQiEXiAJDaMsJImH4T6NfiIDJF6LG5ATRZybP+A9tnJrSa1cBQQAAAABJRU5ErkJggg==",
  "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEUAAABtCAQAAABde2T5AAAAAmJLR0QA/4ePzL8AAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfhCA0NKiSIZkoxAAAC5klEQVRo3u3av2sUQRQH8Lc2ev6I0aiJQUMI/qqs7a1ERESCSkRFNOCvwohgKfaxt7AR/BMUFIKKiEERNeIZAwqinIWCsQkm2buvhd7ezuzM7OZ2flzxXnfMsfvZt7PsvHlL9D+wH/MIE0+xmsTAgSCYZ1hD2cBBLHiGPE9BUMF4CnPIK2YSXcmZ9xAqgIA5jEVPkBdY24Lg9z+KiBn2gnmJ7jQEaFJEzBHEjiGvsE6EpCki5phTzGuslyEiRcSMoO4I8gY9WYhMETEnnGCmsEEFyVJEzCnrmHfYqIaoKCLmNBoWIe+xSQdRU0TMGWuYKnr1EB1FxIxawUyjzwTRU0TMudKYj9hshpgoIuZCKcgM+vMgQIQKzZEubkZXkkOspIjajYVoMXnpPaAuzb8MWZEyUz70Gcm7QZYxZkgRClCxRLlrPs0y6phgClOYwhSmMIUpTGEKUxxTYmpYOtd83jrcvOKPMWyt+OhFtf3iI8ZRqyVZH6bbo9Rx3PZ8QD9m9JTlmg3AOk66mJzYgk+a8p0II3QnM31BZ6PbyY8BC0/abDSbHO0JDWbG7zf33MT9kwZGU6obVvacatiZHHEQX6TRh1ih3lk6bx0iY4bwNTXySKjLcTEZuOQEImO24VvSD1olT48xAMBlZxAZswM1AJPqftA1XHUKkTG7cK/V/dA/dG4gEqbI0+8OsjQMrjvvBtWwvdib+QPVHa8IvtPPonlx25xKNabCYpYGcYhJt+p2Y6LVHfKNESE/ALwNg8lCEAajhiSYqAiGbllYr1RpX/SrCaEJEjMxRXsDFBlSRpLMdAoEQMdAPFNMEK8UM8QvhftBTGEKU5jCFKYwhSlMYYr1iDvmqrFV12gIUZIZMYU/RkR3iZs5F/1pYugxDZW7nrFSOyufMZCfGR+Qghg/kEIYX5ACGH+QXIxPSA7GL8SI8Q0xYPxDtJgQEA0mDESJCQVRYMJBMpiQEAkTFqLGBILoMxMy/gJcuMY6TDZCswAAAABJRU5ErkJggg=="
];
​
​
function setDay(val){
  day.setAttributeNS("http://www.w3.org/1999/xlink", 'href', days[val]);
}
​
​
function drawDigits(val, place1, place2){
  place1.setAttributeNS("http://www.w3.org/1999/xlink", 'href', digits[Math.floor(val/10)]);
  place2.setAttributeNS("http://www.w3.org/1999/xlink", 'href', digits[Math.floor(val%10)]);
}
​
​
function setSeparator(val){
  separator.style.display = (val % 2 === 0 ? "inline" : "none");
}
​
​
function setDate(val){
  drawDigits(val, date1, date2);
}
​
function setHours(val){
  drawDigits(val, hours1, hours2);
}
​
​
function setMins(val){
  drawDigits(val, mins1, mins2);  
}
​
​
function clocker(){
  
  // Get the date/time
  var d = new Date();
  
   // DATE
  setDate(d.getDate());
​
  // DAY NAME
  setDay(d.getDay());
​
  // HOURS
  var hour = ("0" + d.getHours()).slice(-2);
  setHours(hour);
​
  // MINUTES
  var minute = ("0" + d.getMinutes()).slice(-2);
  setMins(minute);
​
  // BLINK SEPARATOR
  setSeparator(d.getSeconds());
}
​
​
clocker();
setInterval(clocker, 1000);
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
NiVZ78pro
0viewers