API tools faq
paste
xiaose

calculator of how much is left of this life

xiaose
Oct 16th, 2014
291
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
JavaScript 4.64 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <meta charset="utf-8">
  5. <title>Calculator</title>
  6.  
  7. <h1>Tollite iugum meum super vos et discite a me, quia mitis sum et humilis corde, et invenietis requiem animabus vestris.</h1>
  8. <h2>Evangelium secundum Matthaeum</h2>
  9.  
  10. <div class="tetris"></div>
  11.  
  12. <div class="loader"><img src="//www.brd24.com/images/ajax-loader_dark.gif"></div>
  13.  
  14. <div id="datepickerTemplate" class="tplDatepicker hidden">
  15.     Wedić svoų datu naroǯeńa budłaska:<br><br>
  16.     <input type="text">
  17. </div>
  18.  
  19. <style>
  20. h1, h2 {
  21.     font-family: Inder;
  22.     text-align: center;
  23.     color: gray;
  24.     width: 600px;
  25.     margin: auto;
  26.     font-size: 22pt;
  27. }
  28. h2 {
  29.     color: silver;
  30.     font-size: 15pt;
  31. }
  32. .loader {
  33.     text-align: center;
  34. }
  35. .tetris {
  36.     width: 745px;
  37.     margin: auto;
  38. }
  39. .tetris div {
  40.     width: 10px;
  41.     height: 10px;
  42.     float: left;
  43.     margin: 1px;
  44.     font-size: 1px;
  45. }
  46. .last {
  47.     color: white;
  48.     border: 1px solid silver;
  49.     background-color: white;
  50. }
  51. .done {
  52.     color: red;
  53.     border: 1px solid red;
  54.     background-color: red;
  55. }
  56. .work {
  57.     color: gray;
  58.     border: 1px solid gray;
  59.     background-color: gray;
  60. }
  61. .hidden {
  62.     display:none;
  63. }
  64. .tplDatepicker {
  65.     font-family: Inder;
  66.     font-size: 16pt;
  67. }
  68. .tplDatepicker input {
  69.     width: 200px;
  70.     padding: 5px 2px;
  71.     font-family: Arial;
  72.     font-size: 15pt;
  73.     border: 1px solid silver;
  74.     text-align: center;
  75. }
  76. </style>
  77.  
  78. <link rel="stylesheet" href="//v4.songsurgeon.com/views/css/alertify/alertify.core.css">
  79. <link rel="stylesheet" href="//v4.songsurgeon.com/views/css/alertify/alertify.default.css">
  80. <link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css">
  81. <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Inder">
  82.  
  83. <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  84. <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
  85. <script src="http://cdn.jsdelivr.net/alertify.js/0.3.11/alertify.min.js"></script>
  86.  
  87. <script>
  88.  
  89.     var birthDate, formConfirm;
  90.  
  91.     $(document).ready(function() {
  92.         formConfirm = '<div id="datepicker" class="tplDatepicker">' + $('#datepickerTemplate').html() + '</div>';
  93.         setTimeout('showDateRequest()', 1000);
  94.     });
  95.  
  96.     function getDate(e) {
  97.         if(!e) {
  98.             return showWarningAboutDate();
  99.         }
  100.         alertify.log('Pepevirka...');
  101.         birthDate = $('#datepicker input').val();
  102.         if(birthDate == '') {
  103.             return showWarningAboutDate();
  104.         }
  105.         alertify.log('Občısłeńa...');
  106.         $('.loader').removeClass('hidden');
  107.         setTimeout('processing()', 2000);
  108.     }
  109.    
  110.     function processing() {
  111.         var currentTime  = new Date();
  112.         var day   = currentTime.getDate();
  113.         var month = currentTime.getMonth() + 1;
  114.         var year  = currentTime.getFullYear();
  115.  
  116.         var parts = birthDate.split('/');
  117.         var birth = new Date(year + '/' + month + '/' + day);
  118.  
  119.         var birthYear = year - parseInt(parts[2]);
  120.         var birthWeek = getWeekNumber(birth);
  121.  
  122.         var year, week, type = 'last', bars = '';
  123.         $('h1, h2').remove();
  124.         for(year = 0; year < 68; year++) {
  125.             for(week = 0; week < 53; week++) {
  126.                 type = ((year > 62) ? 'last' : 'work');
  127.                 if((year < birthYear) || (year == birthYear && week <= birthWeek)) type = 'done';
  128.                 bars += '<div class="' + type + '">.</div>';
  129.             }
  130.         }
  131.         $('.tetris').html(bars);
  132.         alertify.set({ labels: { ok : 'ZGODEN' } });
  133.         alertify.success('Tvoї dni porahovani');
  134.         alertify.alert('Vorušy poršńami čuvak! )))');
  135.         $('.loader').addClass('hidden');
  136.     }
  137.  
  138.     function getWeekNumber(d) {
  139.         d = new Date(+d);
  140.         d.setHours(0,0,0);
  141.         d.setDate(d.getDate() + 4 - (d.getDay()||7));
  142.         var yearStart = new Date(d.getFullYear(),0,1);
  143.         var weekNo = Math.ceil(( ( (d - yearStart) / 86400000) + 1)/7)
  144.         return weekNo;
  145.     }
  146.  
  147.     function showWarningAboutDate() {
  148.         alertify.set({ labels: { ok : 'Zgoden' } });
  149.         alertify.alert('Vı povıńi westı ãku nebuć datu šob občısłeńa si počało', showDateRequest);
  150.         alertify.error('Nemā datı naroǯeńa');
  151.         return false;
  152.     }
  153.  
  154.     function showDateRequest() {
  155.         alertify.set({ labels: { ok : 'Porahuvatı', cancel : 'Danunafig' } });
  156.         alertify.confirm(formConfirm, getDate);
  157.         $('.tplDatepicker input').datepicker();
  158.         $('.loader').addClass('hidden');
  159.     }
  160.  
  161. </script>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!