Calendar control je vestavěný ovládací prvek v ASP.NET, jehož prostřednictvím lze pracovat s kalendářem. V ukázce jej využijeme jako ukazatele data Velké noci v daném roce, které se naučíme vypočítat.

Nejprve k ovládacímu prvku – kalendář musí být vložen ve formuláři, nemůže být ve stránce samostatně, do stránky jej proto vkládáme následovně:

<form runat=“server“>
  <asp:Calendar id=“Calendar1″ runat=“server“ />
</form>

Tento kalendář má opravdu hodně nastavitelných vlastností, které jsou přístupné pomocí řady atributů. Atributy (vlastnosti) jsou popsány na stránkách MSDN, vzhledem k jejich množství se vám ale určitě bude prvek nastavovat lépe v nějakém vizuálním prostředí, jako je třeba WebMatrix nebo Visual Studio.

Primárně slouží tento ovládací prvek pro pohodlné zadávání data uživatelem, dovede však v zobrazeném kalendáři vyznačit i aktuální datum a také ukázat zadané datum. Právě toho využijeme v naší ukázce – vypočítané datum Velikonoc nastavíme do atributu SelectedDate, čímž se kalendář „přepne“ na daný rok a měsíc a zvlášť vyznačí zvolený den. Aby bylo zvolené datum také vidět, je potřeba ještě pomocí atributu VisibleDate kalendář „narolovat“ do pozice měsíce, ve kterém se náš den nachází. Jinak by sice datum bylo zvoleno, ale nebylo by vidět, kalendář totiž bez určení VisibleDate ukazuje vždy aktuální měsíc.

Protože chceme kalendář využít jen jako indikátor, zakážeme možnost vybírat datum (v této aplikaci by to bylo pro uživatele matoucí, datum z kalendáře zde nijak nezpracováváme) nastavením atributu SelectionMode na hodnotu none. Celá naše aplikace je tak i ukázkou práce s webovým formulářem – od ověření, zda jde o první zobrazení stránky, zpracování událostí, ošetření výjimek až po využití tzv. VIEWSTATE pro udržování stavu aplikace. Prohlédněte si ukázku (zdrojové soubory).

K výpočtu data Velikonoc je zapotřebí znát nejprve trochu historie. Na začátku našeho letopočtu byl prý ukřižován Ježíš Kristus a v noci ze soboty na neděli se odehrál zázrak zmrtvýchvstání. Proto se ta noc nazývá Velkou nocí. O tom, co se tehdy odehrálo, se zachovalo velmi málo historických pramenů a žádný z nich neudává přesné datum. Tradice klade neděli po „Velké noci“ na první jarní úplněk, kdy slaví svůj velký svátek Pesach (přechod Rudým mořem) i Židé. Datum Velikonoc tedy připadá na neděli po prvním jarním úplňku.

Jak vidíte, náš algoritmus musí vědět, kdy začíná jaro a kdy je úplněk. Algoritmů pro výpočet existuje několik. Pro ukázku jsem použil tzv. algorythm of Oudin, který stačí jen upravit do jazyka C# ASP.NET aplikace.

C = Y/100
N = Y – 19*(Y/19)
K = (C – 17)/25
I = C – C/4 – (C – K)/3 + 19*N + 15
I = I – 30*(I/30)
I = I – (I/28)*(1 – (I/28)*(29/(I + 1))*((21 – N)/11))
J = Y + Y/4 + I + 2 – C + C/4
J = J – 7*(J/7)
L = I – J
M = 3 + (L + 40)/44
D = L + 28 – 31*(M/4)

Pokud se podíváte na funkční algoritmus, vidíte, že jej připravoval erudovaný vědec, který precizně ovládal matematiku, ale chyběl mu programátorský operátor modulo – zbytek po dělení. C# samozřejmě tento operátor má také (%), a tak by byla škoda jej nepoužít pro zjednodušení výpočtu. Metoda, která pro zadaný rok vypočítá datum Velikonoc, bude vypadat takto:

System.DateTime EasterDay(int EYear)
{
  int G,C,H,i,j,L,EMonth,EDay;
  G = EYear % 19;
  C = EYear / 100;
  H = ((C – (C / 4) – ((8 * C + 13) / 25) + (19 * G) + 15) % 30);
  i = H – ((H / 28) * (1 – (H / 28) * (29 / (H + 1)) * ((21 – G) / 11)));
  j = ((EYear + (EYear / 4) + i + 2 – C + (C / 4)) % 7);
  L = i – j;
  EMonth = 3 + ((L + 40) / 44);
  EDay = L + 28 – (31 * (EMonth / 4));
  System.DateTime EDateTime = new System.DateTime(EYear, EMonth, EDay,0,0,0,0);
  return EDateTime;
}

Do stránky s formulářem pak už jen stačí přidat textové pole pro zadávání roku a tlačítko pro odeslání. Ve skriptu převezmeme od uživatele rok, pokusíme se zjistit datum velikonoc a zobrazíme výsledné datum, nejen jako text, ale také názorně pomocí prvku kalendáře. Pokud bude rok zadán nekorektně, zachytíme vzniklou výjimku, vypíšeme zprávu o chybě a zneviditelníme prvek kalendáře – ten se pak ve stránce vůbec neobjeví (nebude renderován).

<%@ Page Language=“C#“ %>
<script language=“C#“ runat=“server“>
System.DateTime EasterDay(int EYear)
{ // implementace algoritmu Oudina do metody v C#
  int G,C,H,i,j,L,EMonth,EDay;
  G = EYear % 19; // použití operátoru modulo pro získání zbytku po dělení
  C = EYear / 100;
  H = ((C – (C / 4) – ((8 * C + 13) / 25) + (19 * G) + 15) % 30);
  i = H – ((H / 28) * (1 – (H / 28) * (29 / (H + 1)) * ((21 – G) / 11)));
  j = ((EYear + (EYear / 4) + i + 2 – C + (C / 4)) % 7);
  L = i – j;
  EMonth = 3 + ((L + 40) / 44);
  EDay = L + 28 – (31 * (EMonth / 4));
  System.DateTime EDateTime = new System.DateTime(EYear, EMonth, EDay,0,0,0,0); // vytvoření instance vypočítaného data velikonoc
  return EDateTime; // předat jako výsledek metody
}
DateTime EasterDate; // pomocná proměnná pro práci s datem velikonoc
void Page_Load(object sender, System.EventArgs e)
{ // při načítání stránky provést
  if (!IsPostBack)
  { // pokud není webový formulář ještě odeslán (jde o první zobrazení stránky)
    txtYear.Text=System.DateTime.Today.Year.ToString(); // nastavit pole pro zadání roku na současný rok
  }
  try
  { // pokusit se
    EasterDate = EasterDay(Convert.ToInt32(txtYear.Text)); // vypočítet datum velikonoc
    lblEasterDay.Text=“Velká noc je v nedìli “ + EasterDate.ToShortDateString()+ „.“; // vypsat datum velikonoc převedené na ShortDate (bez hodin,minut, sekund)
    Calendar1.SelectedDate=EasterDate; // nastavit v kalendáři datum velikonoc
    Calendar1.VisibleDate=Calendar1.SelectedDate; // přepnout kalendář tak, aby zobrazoval měsíc, v kterém je zvolené datum
    Calendar1.Visible=true; // zviditelnit kalendář
  }
  catch
  { // došlo k výjimce
    lblEasterDay.Text=“Chybně zadaný rok!“; // nastavit chybovou zprávu
    Calendar1.Visible=false; // kalendář nebude zobrazen
  }
}
</script>
<html>
<head>
<title>Web Control Kalendář a datum velikonoc</title>
</head>
<body>
<form runat=“server“>
  Datum velikonoc v roce <asp:TextBox AutoPostBack=“true“ id=“txtYear“ size=“4″ maxlength=“4″ runat=“server“ />
  <asp:Button runat=“server“ Text=“?“ />
  <br /><br />
  <strong><asp:Label id=“lblEasterDay“ runat=“server“ /></strong>
  <br /><br />
  <asp:Calendar id=“Calendar1″ Visible=“false“ runat=“server“ SelectionMode=“None“ BackColor=“White“ Width=“200px“ DayNameFormat=“FirstLetter“ ForeColor=“Black“ Height=“180px“ Font-Size=“8pt“ Font-Names=“Verdana“ BorderColor=“#999999″ CellPadding=“4″>
  <TodayDayStyle forecolor=“Black“ backcolor=“#CCCCCC“ />
  <SelectorStyle backcolor=“#CCCCCC“></SelectorStyle>
  <NextPrevStyle verticalalign=“Bottom“ />
  <DayHeaderStyle font-size=“7pt“ font-bold=“True“ backcolor=“#CCCCCC“ />
  <SelectedDayStyle font-bold=“True“ forecolor=“White“ backcolor=“#666666″ />
  <TitleStyle font-bold=“True“ bordercolor=“Black“ backcolor=“#999999″ />
  <WeekendDayStyle backcolor=“#FFFFCC“ />
  <OtherMonthDayStyle forecolor=“#808080″ />
  </asp:Calendar>
</form>
</body>
</html> 

V tomto webovém formuláři vidíme textové pole, má nastaveno AutoPostBack="true", což znamená, že k odeslání formuláře (a tedy vystavení nových hodnot) dojde automaticky při změně textu v tomto poli stejně jako při stisku klávesy Enter (pokud se podíváte do zdroje ukázky, vidíte, že systém ASP.NET vygeneroval část JavaScriptu, který toto zajistí). Dále je obsaženo odesílací tlačítko, které není svázáno s žádnou událostí, slouží k prostému odeslání formuláře. Pomocí návěští (label) vypisujeme text s datem Velikonoc nebo zprávu o chybě.

Posledním prvkem stránky je již zmíněný kalendář, kde vidíte i nastavení některých atributů a parametrů (zejména výše zmíněný zákaz výběru data SelectionMode="none"), které slouží pro nastavení vzhledu a stylu kalendáře ve stránce.

Pokud se vám aplikace líbí, jistě zvládnete upravit obslužný skript tak, aby bylo možno vybírat rok i pomocí kalendáře. Uvedenou metodu EasterDay() je vhodné zakomponovat do nějaké vlastní třídy nebo namespace, zde slouží hlavně pro demonstraci možností kalendáře, proto je vepsána rovnou do části skriptu stránky.

Starší komentáře ke článku

Pokud máte zájem o starší komentáře k tomuto článku, naleznete je zde.

Žádný příspěvek v diskuzi

Odpovědět