JavaScript  

Rok 2000 aka Y2K straszy programistów już od dłuższego czasu. Ty też możesz na swojej stronie umieścić licznik wskazujący czas pozostały do tej daty. Licznik jest w wysokim stopniu konfigurowalny, potrafi przeliczyć sekundy na lata, miesiące itp, może też wskazywać czas pozostały do XXI wieku.

W nagłówku umieszczany następujący kod:

<script type="text/javascript" language="JavaScript">                 
<!--                                                                  
// Niniejszy skrypt pochodzi z serwisu "JavaScript w przykladach"     
// Copyright (C) 1999 Maciej Szczepaniak <maciek@wls1.ch.pwr.wroc.pl> 
                                                                      
// Skrypt objety jest licencja GNU General Public License.            
// Koniecznie przeczytaj pelna informacje o licencji pod adresem:     
//     http://javascript.jest.o.k.pl/archiwum.html#l                  
                                                                      
                                                                      
// String do wyświetlenia                                             
var OutStr = "";                                                      
                                                                      
// Policz ile dni jest w każdym miesiącu                              
// (to będzie potrzebne w tickNorm()):                                
   CurrDate = new Date();                                             
   var DaysInMonth = new Array(12);                                   
   DaysInMonth[0] = 31;                                               
   DaysInMonth[1] = 28;                                               
   DaysInMonth[2] = 31;                                               
   DaysInMonth[3] = 30;                                               
   DaysInMonth[4] = 31;                                               
   DaysInMonth[5] = 30;                                               
   DaysInMonth[6] = 31;                                               
   DaysInMonth[7] = 31;                                               
   DaysInMonth[8] = 30;                                               
   DaysInMonth[9] = 31;                                               
   DaysInMonth[10] = 30;                                              
   DaysInMonth[11] = 31;                                              
   if (CurrDate.getYear() == 2000) DaysInMonth[1] = 29;               
// Taki sposób sprawdzenia przestępności roku (na początku skryptu)   
// powoduje, że jeżeli skrypt zostanie uruchomiony w 1999 roku i nie  
// zostanie zrestartowany do lutego 2000 roku, nie zostanie           
// uwzględniony dzień 29.2.2000. Jeśli komuś uda się tak długo        
// utrzymać Windowsa bez restartu, niech zgłosi się do ksiegi         
// Guinessa :). Dodatkowo, skrypt nie rozpoznaje lat przestępnych     
// przed 1996 rokiem. Tylko po co cofać zegar o kilka lat ???         
                                                                      
// Ta funkcja ujednolica zapis roku (JS: 2 cyfry przed Y2K a 4 po)    
function unBug(YearIn) {                                              
   if (YearIn < 1900) YearIn += 1900;                                 
   return YearIn;                                                     
}                                                                     
                                                                      
// Jedno 'tyknięcie' zegara.                                          
function tick() {                                                     
   CurrDate = new Date();                                             
   if ( CurrDate.getTime() < BigDate.getTime() )                      
      {                                                               
         if ( CountSecOnly ) tickSec(); else tickNorm();              
         TimerID = setTimeout("tick()", 975);                         
      }                                                               
   else OutStr = "Koniec świata już nastąpił";                        
   document.forms[0].cntdwn_fld.value = OutStr;                       
}                                                                     
                                                                      
// Wyświetlenie czasu przy widoku "tylko sekundy".                    
function tickSec() {                                                  
   var SecondsLeft=                                                   
      Math.round((BigDate.getTime()-CurrDate.getTime())/1000);        
   // Dodajemy zera na początku jeśli jest mniej niż 8 cyfr:          
   SecondsLeft = "" + SecondsLeft;      // liczba na string           
   SLL = SecondsLeft.length;                                          
   for (var i=8; i>SLL; i--)                                          
   {                                                                  
      SecondsLeft = "0" + SecondsLeft;                                
   };                                                                 
   OutStr = "Do końca świata zostało " + SecondsLeft + " sekund.";    
}                                                                     
                                                                      
// Wyświetlenie czasu w trybie "peły widok".                          
function tickNorm() {                                                 
   // Policz wszystko, co trzeba...                                   
   var YearsLeft = RokPrzed - unBug(CurrDate.getYear());              
   var MonthsLeft = 11 - CurrDate.getMonth();                         
   var DaysLeft = DaysInMonth[CurrDate.getMonth()]-CurrDate.getDate();
   var HoursLeft = 23 - CurrDate.getHours();                          
   var MinutesLeft = 59 - CurrDate.getMinutes();                      
   var SecondsLeft = 59 - CurrDate.getSeconds();                      
   // ... i wyświel:                                                  
   OutStr = "";                                                       
   OutStr += "lata: " + YearsLeft;                                    
   OutStr += " miesiące: " + MonthsLeft;                              
   OutStr += " dni: " + DaysLeft;                                     
   // Tym wartościom dodaj zero na początku, jeśli trzeba:            
   OutStr += " godziny: " + pad(HoursLeft);                           
   OutStr += " minuty: " + pad(MinutesLeft);                          
   OutStr += " sekundy: " + pad(SecondsLeft);                         
}                                                                     
                                                                      
// Funkcja dodająca zera (patrz wyżej).                               
function pad(toto) {                                                  
   if (toto < 10) {toto = "0" + toto};                                
   return toto;                                                       
}                                                                     
                                                                      
function setMode() {                                                  
   CountSecOnly = (document.forms[0].jaki_lst.selectedIndex == 0);    
   if (document.forms[0].data_lst.selectedIndex == 0) {               
      BigDate = new Date(2000,0,1,0,0,0);                             
      RokPrzed = 1999;                                                
   } else {                                                           
      BigDate = new Date(2001,0,1,0,0,0);                             
      RokPrzed = 2000;                                                
   }                                                                  
}                                                                     
                                                                      
// -->                                                                
</script>                                                             

Teraz musimy umieścić na stronie okienko, w którym będzie wyświetlany czas. Oznacza to konieczność wklejenia takiego kodu HTML:

<form action="">                                                      
<input name="cntdwn_fld" type=text size=65><BR>                       
Koniec świata nastąpi:                                                
<SELECT NAME="data_lst" onchange="setMode()">                         
  <option value="y2k" selected>1.1.2000</option>                      
  <option value="c20">1.1.2001</option>                               
</SELECT><BR>                                                         
Czas pokazuj                                                          
<SELECT NAME="jaki_lst" onchange="setMode()">                         
  <option value="sec" selected>w sekundach</option>                   
  <option value="full">w długiej formie</option>                      
</SELECT>                                                             
</form>                                                               

Domyślne ustawienia możesz zmienić wstawiając atrybut selected w odpowiednim polu formularza.

Jeśli na stronie znajdują się jeszcze inne formularze, konieczna może być modyfikacja kodu skryptu: możliwe, że trzeba będzie dostosować indeks formularza w wyrażeniu document.forms[0]. Dlatego nie stosuj takiego rozwiązania, jeśli nie masz wystarczającego doświadczenia z JS i HTML, aby to zrobić.

Następnie uruchamiamy skrypt. Aby odbywało się to automatycznie, przy załadowaniu strony, modyfikujemy tak znacznik <body>:

<body onLoad="setMode(); tick()">                                     

Jeśli znasz JS i HTML zapewne nie będzie dla Ciebie problemem zmodyfikowanie tego skryptu tak, aby pasował on do Twoich potrzeb.

[ Powrót na górę ]

[ Powrót na górę ]