//AUTOR: JSR JR.0[at]poczta.fm //skrypt pokazujacy kalendarz, moze przekazywac do inputa kliknieta date /* parametry: DIV - ramka w ktorej bedzie sie pojawial kalendarz, nazwa ID miesiac - tablica z tekstem reprezentujacym miesiace roku dzienTyg - tablica z tekstem reprezentujacym dni tygodnia(skroty) cStrz - kolor tla komorki ze strzalkami do przesowania miesiecy cFStrz - kolor fonta cMies - kolor tla komorki dla nazw miesiecy cTydz - naglowki dni tygodnia, kolor tla cTydzN - naglwek dni tygodnia, niedziela, kolor tla cDzien - kolor komorki z dniami miesiaca cDzienN - kolor komorki z dniami miesiaca (niedziele) M - przekazuje miesiac do wyswietlenia R - przekazuje rok do wyswietlenia year - gdy 1 to wyswietla dodatkowy pasek do przewijania roku, gdy 0 to tylko miesiac clk - jest to ID inputa, do ktorego przekazemy date (opcjonalne) visible - czy kalendarz jest widzialny od poczatku i czy znika po klknieciu w dzien (0 - znika, 1 caly czas widac) - zalezy od opcji clk */ function Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M,R,year,clk,visible){ //sprawdzamy czy przegladarka obsluguje skrypty na potrzebnym poziomie if(!document.getElementById||!document.body.appendChild) return; //gdy przechodzimy z grudnia w przod lub stycznia w tyl nalezy odjac rok i to tu robimy if(M>11){M-=12; R++;} if(M<0){M+=12; R--;} //tworzy nowe dziecko i przypisuje go do rodzica function tworzEl(nazwa, rodzic){ rodzic.appendChild(dziecko=document.createElement(nazwa)); return dziecko; } //tworzy nowe dziecko i przypisuje je do rodzica oraz nadaje mu szerokosc 20px (:?) function tworzEl2(nazwa, rodzic){ rodzic.appendChild(dziecko=document.createElement(nazwa)); dziecko.style.width='20px'; return dziecko; } //wybieramy ramke zewnetrzna po ID box=document.getElementById(DIV); //gdy kalendarz ma znikac to niech najpierw sie pojawi if(clk && visible==0) box.style.display='block'; //usuwamy potomki ramki while(box.childNodes.length) box.removeChild(box.firstChild); //tworzymy tabelke kalendarza tBody=tworzEl('tBody', tworzEl('table', box)); //dodajemy krzyzyk do zamykania tr=tworzEl('tr', tBody); td=tworzEl('td', tr); td.colSpan='2'; td=tworzEl('th', tr); td.innerHTML='X'; td.onmousedown=function(){ box.style.display='none'; inp=document.getElementById(clk); inp.focus(); } //gdy mamy tylko miesiac do przewijania lub gdy mamy miesiac i rok if(year==0){ //pierwszy wiersz tr=tworzEl('tr', tBody); //pierwsza kolumne, ta ze strzalka w lewo do miesiaca td=tworzEl('th', tr); td.innerHTML='«'; //nadajemy tej komorce kolor (strzalka w lewo) td.style.backgroundColor=cStrz; td.style.color=cFStrz; //oprogramowujemy klikniecie w strzalke, tzn gdy klikamy przeladuj kalendarz dla nowych dat (odpowiednio o miesiac mniejszych) /* TODO odpowiednie opcje dodac ;) */ td.onmousedown=function(){ if(clk) Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M-1,R,year,clk,visible); else Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M-1,R,year); } //tworzymy druga kolumne pierwszego wiersza td=tworzEl('th', tr); //wyswietl napis o aktualnie wyswietlanym miesiacu i roku td.innerHTML=miesiac[M]+' '+R; //nadaj tej komorce odpowiedni kolor td.style.backgroundColor=cMies; td.style.color=cFMies; //tworzymy strzalka w prawo do zwiekszania miesiecy (caly opis jak przy strzalce w lewo) td=tworzEl('th', tr); td.innerHTML='»'; td.style.backgroundColor=cStrz; td.style.color=cFStrz; //oprogramowujemy klikniecie w strzalke, tzn gdy klikamy przeladuj kalendarz dla nowych dat (odpowiednio o miesiac mniejszych) /* TODO odpowiednie opcje dodac ;) */ td.onmousedown=function(){ if(clk) Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M+1,R,year,clk,visible); else Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M+1,year,R); } //gdy mamy mies przewijany rok - opisy j.w. }else{ tr=tworzEl('tr', tBody); td=tworzEl('th', tr); td.innerHTML='«'; td.style.backgroundColor=cStrz; td.style.color=cFStrz; /* TODO odpowiednie opcje dodac ;) */ td.onmousedown=function(){ if(clk) Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M-1,R,year,clk,visible); else Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M-1,R,year); } td=tworzEl('th', tr); td.innerHTML=miesiac[M]; td.style.backgroundColor=cMies; td.style.color=cFMies; td=tworzEl('th', tr); td.innerHTML='»'; td.style.backgroundColor=cStrz; td.style.color=cFStrz; /* TODO odpowiednie opcje dodac ;) */ td.onmousedown=function(){ if(clk) Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M+1,R,year,clk,visible); else Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M+1,R,year); } tr=tworzEl('tr', tBody); td=tworzEl('th', tr); td.innerHTML='«'; td.style.backgroundColor=cStrz; td.style.color=cFStrz; /* TODO odpowiednie opcje dodac ;) */ td.onmousedown=function(){ if(clk) Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M,R-1,year,clk,visible); else Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M,R-1,year); } td=tworzEl('th', tr); td.innerHTML=R; td.style.backgroundColor=cMies; td.style.color=cFMies; td=tworzEl('th', tr); td.innerHTML='»'; td.style.backgroundColor=cStrz; td.style.color=cFStrz; /* TODO odpowiednie opcje dodac ;) */ td.onmousedown=function(){ if(clk) Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M,R+1,year,clk,visible); else Kalendarz(DIV,miesiac,dzienTyg,cStrz,cFStrz,cMies,cFMies,cTydz,cFTydz,cTydzN,cFTydzN,cDzien,cFDzien,cDzienN,cFDzienN,M,R+1,year); } } //tworzymy wiersz z nazwami dni tygodnia tBody=tworzEl('tBody', tworzEl('table', box)); tr=tworzEl('tr', tBody); for(i=0;i<7;i++) with(tworzEl2('th',tr)){ innerHTML=dzienTyg[i]; //przypisujemy kolor tla dla nagowka dni tygodnia (niedziela moze byc wyrozniona) style.backgroundColor=cTydz; style.color=cFTydz; if(i==6){ style.backgroundColor=cTydzN; style.color=cFTydzN; } } //dla kazdego dnia aktualnego miesiaca wykonaj w petli for ... :) dzien1=Date.UTC(R,M,1); dzien2=Date.UTC(R,M+1,1); for(i=dzien1;i