Izdelava spletnih strani, programiranje

Imamo dva DateField gradnika, vsak ima izbran datum, zanima pa nas kakšna je razlika v dnevih med obema datumoma.

V spodnji aplikaciji Flex izračuna razliko med poljem Datum 1 ter Datum 2. Razliko vpiše v gradnik Label pod obema datumoma.

Najprej si oglejmo funkcijo, ki izračuna razliko v dnevih med dvema poljubnima datumoma.

private function differenceBetweenDates(date1:Date, date2:Date):Number{
	var MS_PER_DAY:uint = 1000 * 60 * 60 * 24;
	var tempDate:Date = new Date(date2.time - date1.time);
        var difference:Number = 
        Math.abs(Math.round((tempDate.time / MS_PER_DAY)));
	return difference;
}

Funkcija differenceBetweenDates potrebuje dva argumenta oz. datuma, vrne pa nam rezultat v obliki števila. Najprej si v spremenljivko MS_PER_DAY zapišemo število milisekund v enem dnevu (1 dan v sekundah = 60 sek * 60 minut * 24 ur, če rezultat pomnožimo s 1000 dobimo število milisekund v enem dnevu).

V spremenljivki tempDate si ustvarimo nov datum, ki je enak razliki prvega in drugega datuma. Na koncu v spremenljivko difference vpišemo količnik razlike med obema datumoma, ki ga predhodno zapišemo v obliki milisekund s številom milisekund v enem dnevu (tempDate.time / MS_PER_DAY). Dobljeno razliko z Math.round zaokrožimo na koncu pa zahtevamo še absolutno vrednost rezultata – z Math.abs, s tem se izognemo negativnemi razliki v primeru, da je date 1 večji kot date 2.

Celotno kodo aplikacije si lahko ogledate spodaj. Poudariti je potrebno, da aplikacija za vsako spremembo datuma pokliče funkcijo change(), ki nam izračuna razliko v dnevih ter razliko zapiše v Label z id-jem diff. Funkcijo change pokličemo tudi, ko se aplikacija prvič naloži preko initialize=”change()” v application MX tagu.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" 
	backgroundColor="#FFFFFF" initialize="change()" 
	width="615" height="285">
<mx:Script>
	<![CDATA[
private function differenceBetweenDates(date1:Date, date2:Date):Number{
	var MS_PER_DAY:uint = 1000 * 60 * 60 * 24;
	var tempDate:Date = new Date(date2.time - date1.time);
    var difference:Number = Math.abs(Math.round((tempDate.time / MS_PER_DAY)));
	return difference;
}
private function change():void{
	diff.text = 'Razlika v dnevih med datumom 1 in 2 je: ' + 
	differenceBetweenDates(date1.selectedDate, date2.selectedDate).toString();
}
	]]>
</mx:Script>
<mx:HBox>
	<mx:VBox>
		<mx:Label text="Datum 1"/>
		<mx:DateField id="date1" 
			selectedDate="{new Date('11/8/2009')}" 
			change="change()"/>
	</mx:VBox>
	<mx:VBox>
		<mx:Label text="Datum 2"/>
		<mx:DateField id="date2" 
			selectedDate="{new Date('11/8/2010')}" 
			change="change()"/>
	</mx:VBox>
</mx:HBox>
	<mx:Label fontSize="14" fontWeight="bold" id="diff"/>
</mx:Application>

Kako bi izračunali razliko med datumoma v urah? Spremenljivko MS_PER_DAY bi zapisali število milisekund v eni uri = 1000*60*60.

V LaTeXu bom prikazal kako se zapiše spodnja funkcija.

\[
f(x) = \left\{
\begin{array}{ll}
e^{-1/x^{2}}, & x \neq 0,\\
0, & x=0.
\end{array}
\right.
\]

Funkcijo lahko zapišemo po mojem okusu se malce lepše, in sicer bomo zmanjšali razmak med zavitim oklepajem ter začetkom definicij (uporabili bomo razmak, ki ga LaTeX uporabi med naprimer pri a+b, razmak je malce manjši kot pri a=b – @{\>}), med definicijami ter odseki pa bomo povečali razmak z ukazom @{\quad}.

\[
f(x) = \left\{
\begin{array}{@{\>}l@{\quad}l}
e^{-1/x^{2}}, & x \neq 0,\\
0, & x=0.
\end{array}
\right.
\]

Razliko med razmaki lahko vidimo na spodnji sliki.

Danes sem ob poslušanju podacasta This week in Google slišal za zanimivo stran kickstarter.com. Na strani lahko dobi vsakdo pomoč pri začetku zanimivega projekta (ki je lahko pravzaprav karkoli). Uporabnik določi koliko denarja bi potreboval, da bi projekt zaključil. Ostali uporabniki strani se lahko za projekt zavežejo, da bodo v projekt vložili recimo 10 dolarjev. Če se zbere dovolj denarja, potem se projekt zaključi, vsi ki so za projekt denar naložili pa dobijo neko vrsto povračilo.

Kot primer lahko pogledamo Joseph Wain-a iz New Yorka. Zavezal se je da, če se zbere 500 $, potem bo ikone katere je naredil za iPhone aplikacije delil z vsemi brezplačno. Uspelo mu je zbrati 1820$, ikone pa je postavil za brezplačno dovleko na spletno stran http://glyphish.com/.

Dobra ideja, ni kaj, edini problem, za nas Evropejce pa je, da moraš za svoj projetk na kickstarterju imeti ameriški naslov in ameriški bančni račun.

Funkcijo trim poznamo naprimer iz PHP ali Javascripta, funkcija pa nam vrne spremenljivko od katere odstrani presledke (whitespace) na začtku spremenljivke in na koncu. V Actionscriptu 3.0 lahko to funckcijo uporabimo preko StringUtil-a. Primer, če bi imeli spremenljivko ” 12, 14 FS, 17 “, z uporabo trim funkcije bi dobili spremenljivko “12, 14 FS, 17″.

Najprej moramo v projektu uvoziti StringUtil, kar naredimo z import mx.utils.StringUtil;. Funkcijo trim pa lahko uporabimo z StringUtil.trim($spremenljivka).

Če ste kdaj uporabili Flexov gradnik comboBox, ste opazili, da dropdown meni prikaže naenkrat 5 vrstic, za vse ostale vrstice je potrebno uporabiti drsnik. V kolikor nebi želeli, da se prikaže drsnik, lahko z rowCount ukazom znotraj comboBoxa določimo število vrstic, ki jih bo comboBox prikazal brez drsnika.

V spodnjem primeru imamo v spremenljivki mesta vpisanih 8 slovenskih mest, brez rowCount ukaza nam prikaže comboBox prvih pet vrstic, do Ljubljane. Da bi prišli do Maribora ali Murske Sobote pa moramo uporabiti drsnik. Pri drugem comboBoxu pa smo nastavili rowCount na število vnosov v spremenljivki mesta – rowCount=”{mesta.lenght}”. Tako pri drugem comboBoxu ni drsnika, saj so prikazane vse vrstice oz. vnosi.

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" 
	backgroundColor="#FFFFFF" width="590" height="299">
<mx:Script>
	<![CDATA[
		private var mesta:Array = new Array('Ajdovščina' ,'Brežice', 'Celje', 
		'Domžale', 'Kranj', 'Ljubljana', 'Maribor', 'Murska Sobota');
	]]>
</mx:Script>
	<mx:HBox>
		<mx:Label text="comboBox - dropdown prikaže 5 elementov"/> 
		<mx:ComboBox dataProvider="{mesta}"/>
	</mx:HBox>
	<mx:HRule/>
	<mx:HBox>
		<mx:Label text="comboBox - dropdown prikaže vse elemente brez drsnika"/> 
		<mx:ComboBox dataProvider="{mesta}" rowCount="{mesta.length}"/>
	</mx:HBox>
</mx:Application>