PNG  IHDRX cHRMz&u0`:pQ<bKGD pHYsodtIME MeqIDATxw]Wug^Qd˶ 6`!N:!@xI~)%7%@Bh&`lnjVF29gΨ4E$|>cɚ{gk= %,a KX%,a KX%,a KX%,a KX%,a KX%,a KX%, b` ǟzeאfp]<!SJmɤY޲ڿ,%c ~ع9VH.!Ͳz&QynֺTkRR.BLHi٪:l;@(!MԴ=žI,:o&N'Kù\vRmJ雵֫AWic H@" !: Cé||]k-Ha oݜ:y F())u]aG7*JV@J415p=sZH!=!DRʯvɱh~V\}v/GKY$n]"X"}t@ xS76^[bw4dsce)2dU0 CkMa-U5tvLƀ~mlMwfGE/-]7XAƟ`׮g ewxwC4\[~7@O-Q( a*XGƒ{ ՟}$_y3tĐƤatgvێi|K=uVyrŲlLӪuܿzwk$m87k( `múcE)"@rK( z4$D; 2kW=Xb$V[Ru819קR~qloѱDyįݎ*mxw]y5e4K@ЃI0A D@"BDk_)N\8͜9dz"fK0zɿvM /.:2O{ Nb=M=7>??Zuo32 DLD@D| &+֎C #B8ַ`bOb $D#ͮҪtx]%`ES`Ru[=¾!@Od37LJ0!OIR4m]GZRJu$‡c=%~s@6SKy?CeIh:[vR@Lh | (BhAMy=݃  G"'wzn޺~8ԽSh ~T*A:xR[ܹ?X[uKL_=fDȊ؂p0}7=D$Ekq!/t.*2ʼnDbŞ}DijYaȲ(""6HA;:LzxQ‘(SQQ}*PL*fc\s `/d'QXW, e`#kPGZuŞuO{{wm[&NBTiiI0bukcA9<4@SӊH*؎4U/'2U5.(9JuDfrޱtycU%j(:RUbArLֺN)udA':uGQN"-"Is.*+k@ `Ojs@yU/ H:l;@yyTn}_yw!VkRJ4P)~y#)r,D =ě"Q]ci'%HI4ZL0"MJy 8A{ aN<8D"1#IJi >XjX֔#@>-{vN!8tRݻ^)N_╗FJEk]CT՟ YP:_|H1@ CBk]yKYp|og?*dGvzنzӴzjֺNkC~AbZƷ`.H)=!QͷVTT(| u78y֮}|[8-Vjp%2JPk[}ԉaH8Wpqhwr:vWª<}l77_~{s۴V+RCģ%WRZ\AqHifɤL36: #F:p]Bq/z{0CU6ݳEv_^k7'>sq*+kH%a`0ԣisqにtү04gVgW΂iJiS'3w.w}l6MC2uԯ|>JF5`fV5m`Y**Db1FKNttu]4ccsQNnex/87+}xaUW9y>ͯ骵G{䩓Գ3+vU}~jJ.NFRD7<aJDB1#ҳgSb,+CS?/ VG J?|?,2#M9}B)MiE+G`-wo߫V`fio(}S^4e~V4bHOYb"b#E)dda:'?}׮4繏`{7Z"uny-?ǹ;0MKx{:_pÚmFמ:F " .LFQLG)Q8qN q¯¯3wOvxDb\. BKD9_NN &L:4D{mm o^tֽ:q!ƥ}K+<"m78N< ywsard5+вz~mnG)=}lYݧNj'QJS{S :UYS-952?&O-:W}(!6Mk4+>A>j+i|<<|;ر^߉=HE|V#F)Emm#}/"y GII웻Jі94+v뾧xu~5C95~ūH>c@덉pʃ1/4-A2G%7>m;–Y,cyyaln" ?ƻ!ʪ<{~h~i y.zZB̃/,雋SiC/JFMmBH&&FAbϓO^tubbb_hZ{_QZ-sύodFgO(6]TJA˯#`۶ɟ( %$&+V'~hiYy>922 Wp74Zkq+Ovn錄c>8~GqܲcWꂎz@"1A.}T)uiW4="jJ2W7mU/N0gcqܗOO}?9/wìXžΏ0 >֩(V^Rh32!Hj5`;O28؇2#ݕf3 ?sJd8NJ@7O0 b־?lldщ̡&|9C.8RTWwxWy46ah嘦mh٤&l zCy!PY?: CJyв]dm4ǜҐR޻RլhX{FƯanшQI@x' ao(kUUuxW_Ñ줮[w8 FRJ(8˼)_mQ _!RJhm=!cVmm ?sFOnll6Qk}alY}; "baӌ~M0w,Ggw2W:G/k2%R,_=u`WU R.9T"v,<\Ik޽/2110Ӿxc0gyC&Ny޽JҢrV6N ``یeA16"J³+Rj*;BϜkZPJaÍ<Jyw:NP8/D$ 011z֊Ⱳ3ι֘k1V_"h!JPIΣ'ɜ* aEAd:ݺ>y<}Lp&PlRfTb1]o .2EW\ͮ]38؋rTJsǏP@芎sF\> P^+dYJLbJ C-xϐn> ι$nj,;Ǖa FU *择|h ~izť3ᤓ`K'-f tL7JK+vf2)V'-sFuB4i+m+@My=O҈0"|Yxoj,3]:cо3 $#uŘ%Y"y죯LebqtҢVzq¼X)~>4L׶m~[1_k?kxֺQ`\ |ٛY4Ѯr!)N9{56(iNq}O()Em]=F&u?$HypWUeB\k]JɩSع9 Zqg4ZĊo oMcjZBU]B\TUd34ݝ~:7ڶSUsB0Z3srx 7`:5xcx !qZA!;%͚7&P H<WL!džOb5kF)xor^aujƍ7 Ǡ8/p^(L>ὴ-B,{ۇWzֺ^k]3\EE@7>lYBȝR.oHnXO/}sB|.i@ɥDB4tcm,@ӣgdtJ!lH$_vN166L__'Z)y&kH;:,Y7=J 9cG) V\hjiE;gya~%ks_nC~Er er)muuMg2;֫R)Md) ,¶ 2-wr#F7<-BBn~_(o=KO㭇[Xv eN_SMgSҐ BS헃D%g_N:/pe -wkG*9yYSZS.9cREL !k}<4_Xs#FmҶ:7R$i,fi!~' # !6/S6y@kZkZcX)%5V4P]VGYq%H1!;e1MV<!ϐHO021Dp= HMs~~a)ަu7G^];git!Frl]H/L$=AeUvZE4P\.,xi {-~p?2b#amXAHq)MWǾI_r`S Hz&|{ +ʖ_= (YS(_g0a03M`I&'9vl?MM+m~}*xT۲(fY*V4x@29s{DaY"toGNTO+xCAO~4Ϳ;p`Ѫ:>Ҵ7K 3}+0 387x\)a"/E>qpWB=1 ¨"MP(\xp߫́A3+J] n[ʼnӼaTbZUWb={~2ooKױӰp(CS\S筐R*JغV&&"FA}J>G֐p1ٸbk7 ŘH$JoN <8s^yk_[;gy-;߉DV{c B yce% aJhDȶ 2IdйIB/^n0tNtџdcKj4϶v~- CBcgqx9= PJ) dMsjpYB] GD4RDWX +h{y`,3ꊕ$`zj*N^TP4L:Iz9~6s) Ga:?y*J~?OrMwP\](21sZUD ?ܟQ5Q%ggW6QdO+\@ ̪X'GxN @'4=ˋ+*VwN ne_|(/BDfj5(Dq<*tNt1х!MV.C0 32b#?n0pzj#!38}޴o1KovCJ`8ŗ_"]] rDUy޲@ Ȗ-;xџ'^Y`zEd?0„ DAL18IS]VGq\4o !swV7ˣι%4FѮ~}6)OgS[~Q vcYbL!wG3 7띸*E Pql8=jT\꘿I(z<[6OrR8ºC~ډ]=rNl[g|v TMTղb-o}OrP^Q]<98S¤!k)G(Vkwyqyr޽Nv`N/e p/~NAOk \I:G6]4+K;j$R:Mi #*[AȚT,ʰ,;N{HZTGMoּy) ]%dHء9Պ䠬|<45,\=[bƟ8QXeB3- &dҩ^{>/86bXmZ]]yޚN[(WAHL$YAgDKp=5GHjU&99v簪C0vygln*P)9^͞}lMuiH!̍#DoRBn9l@ xA/_v=ȺT{7Yt2N"4!YN`ae >Q<XMydEB`VU}u]嫇.%e^ánE87Mu\t`cP=AD/G)sI"@MP;)]%fH9'FNsj1pVhY&9=0pfuJ&gޤx+k:!r˭wkl03׼Ku C &ѓYt{.O.zҏ z}/tf_wEp2gvX)GN#I ݭ߽v/ .& и(ZF{e"=V!{zW`, ]+LGz"(UJp|j( #V4, 8B 0 9OkRrlɱl94)'VH9=9W|>PS['G(*I1==C<5"Pg+x'K5EMd؞Af8lG ?D FtoB[je?{k3zQ vZ;%Ɠ,]E>KZ+T/ EJxOZ1i #T<@ I}q9/t'zi(EMqw`mYkU6;[t4DPeckeM;H}_g pMww}k6#H㶏+b8雡Sxp)&C $@'b,fPߑt$RbJ'vznuS ~8='72_`{q纶|Q)Xk}cPz9p7O:'|G~8wx(a 0QCko|0ASD>Ip=4Q, d|F8RcU"/KM opKle M3#i0c%<7׿p&pZq[TR"BpqauIp$ 8~Ĩ!8Սx\ւdT>>Z40ks7 z2IQ}ItԀ<-%S⍤};zIb$I 5K}Q͙D8UguWE$Jh )cu4N tZl+[]M4k8֦Zeq֮M7uIqG 1==tLtR,ƜSrHYt&QP윯Lg' I,3@P'}'R˪e/%-Auv·ñ\> vDJzlӾNv5:|K/Jb6KI9)Zh*ZAi`?S {aiVDԲuy5W7pWeQJk֤#5&V<̺@/GH?^τZL|IJNvI:'P=Ϛt"¨=cud S Q.Ki0 !cJy;LJR;G{BJy޺[^8fK6)=yʊ+(k|&xQ2`L?Ȓ2@Mf 0C`6-%pKpm')c$׻K5[J*U[/#hH!6acB JA _|uMvDyk y)6OPYjœ50VT K}cǻP[ $:]4MEA.y)|B)cf-A?(e|lɉ#P9V)[9t.EiQPDѠ3ϴ;E:+Օ t ȥ~|_N2,ZJLt4! %ա]u {+=p.GhNcŞQI?Nd'yeh n7zi1DB)1S | S#ًZs2|Ɛy$F SxeX{7Vl.Src3E℃Q>b6G ўYCmtկ~=K0f(=LrAS GN'ɹ9<\!a`)֕y[uՍ[09` 9 +57ts6}b4{oqd+J5fa/,97J#6yν99mRWxJyѡyu_TJc`~W>l^q#Ts#2"nD1%fS)FU w{ܯ R{ ˎ󅃏џDsZSQS;LV;7 Od1&1n$ N /.q3~eNɪ]E#oM~}v֯FڦwyZ=<<>Xo稯lfMFV6p02|*=tV!c~]fa5Y^Q_WN|Vs 0ҘދU97OI'N2'8N֭fgg-}V%y]U4 峧p*91#9U kCac_AFңĪy뚇Y_AiuYyTTYЗ-(!JFLt›17uTozc. S;7A&&<ԋ5y;Ro+:' *eYJkWR[@F %SHWP 72k4 qLd'J "zB6{AC0ƁA6U.'F3:Ȅ(9ΜL;D]m8ڥ9}dU "v!;*13Rg^fJyShyy5auA?ɩGHRjo^]׽S)Fm\toy 4WQS@mE#%5ʈfFYDX ~D5Ϡ9tE9So_aU4?Ѽm%&c{n>.KW1Tlb}:j uGi(JgcYj0qn+>) %\!4{LaJso d||u//P_y7iRJ߬nHOy) l+@$($VFIQ9%EeKʈU. ia&FY̒mZ=)+qqoQn >L!qCiDB;Y<%} OgBxB!ØuG)WG9y(Ą{_yesuZmZZey'Wg#C~1Cev@0D $a@˲(.._GimA:uyw֬%;@!JkQVM_Ow:P.s\)ot- ˹"`B,e CRtaEUP<0'}r3[>?G8xU~Nqu;Wm8\RIkբ^5@k+5(By'L&'gBJ3ݶ!/㮻w҅ yqPWUg<e"Qy*167΃sJ\oz]T*UQ<\FԎ`HaNmڜ6DysCask8wP8y9``GJ9lF\G g's Nn͵MLN֪u$| /|7=]O)6s !ĴAKh]q_ap $HH'\1jB^s\|- W1:=6lJBqjY^LsPk""`]w)󭃈,(HC ?䔨Y$Sʣ{4Z+0NvQkhol6C.婧/u]FwiVjZka&%6\F*Ny#8O,22+|Db~d ~Çwc N:FuuCe&oZ(l;@ee-+Wn`44AMK➝2BRՈt7g*1gph9N) *"TF*R(#'88pm=}X]u[i7bEc|\~EMn}P瘊J)K.0i1M6=7'_\kaZ(Th{K*GJyytw"IO-PWJk)..axӝ47"89Cc7ĐBiZx 7m!fy|ϿF9CbȩV 9V-՛^pV̌ɄS#Bv4-@]Vxt-Z, &ֺ*diؠ2^VXbs֔Ìl.jQ]Y[47gj=幽ex)A0ip׳ W2[ᎇhuE^~q흙L} #-b۸oFJ_QP3r6jr+"nfzRJTUqoaۍ /$d8Mx'ݓ= OՃ| )$2mcM*cЙj}f };n YG w0Ia!1Q.oYfr]DyISaP}"dIӗթO67jqR ҊƐƈaɤGG|h;t]䗖oSv|iZqX)oalv;۩meEJ\!8=$4QU4Xo&VEĊ YS^E#d,yX_> ۘ-e\ "Wa6uLĜZi`aD9.% w~mB(02G[6y.773a7 /=o7D)$Z 66 $bY^\CuP. (x'"J60׿Y:Oi;F{w佩b+\Yi`TDWa~|VH)8q/=9!g߆2Y)?ND)%?Ǐ`k/sn:;O299yB=a[Ng 3˲N}vLNy;*?x?~L&=xyӴ~}q{qE*IQ^^ͧvü{Huu=R|>JyUlZV, B~/YF!Y\u_ݼF{_C)LD]m {H 0ihhadd nUkf3oٺCvE\)QJi+֥@tDJkB$1!Đr0XQ|q?d2) Ӣ_}qv-< FŊ߫%roppVBwü~JidY4:}L6M7f٬F "?71<2#?Jyy4뷢<_a7_=Q E=S1И/9{+93֮E{ǂw{))?maÆm(uLE#lïZ  ~d];+]h j?!|$F}*"4(v'8s<ŏUkm7^7no1w2ؗ}TrͿEk>p'8OB7d7R(A 9.*Mi^ͳ; eeUwS+C)uO@ =Sy]` }l8^ZzRXj[^iUɺ$tj))<sbDJfg=Pk_{xaKo1:-uyG0M ԃ\0Lvuy'ȱc2Ji AdyVgVh!{]/&}}ċJ#%d !+87<;qN޼Nفl|1N:8ya  8}k¾+-$4FiZYÔXk*I&'@iI99)HSh4+2G:tGhS^繿 Kتm0 вDk}֚+QT4;sC}rՅE,8CX-e~>G&'9xpW,%Fh,Ry56Y–hW-(v_,? ; qrBk4-V7HQ;ˇ^Gv1JVV%,ik;D_W!))+BoS4QsTM;gt+ndS-~:11Sgv!0qRVh!"Ȋ(̦Yl.]PQWgٳE'`%W1{ndΗBk|Ž7ʒR~,lnoa&:ü$ 3<a[CBݮwt"o\ePJ=Hz"_c^Z.#ˆ*x z̝grY]tdkP*:97YľXyBkD4N.C_[;F9`8& !AMO c `@BA& Ost\-\NX+Xp < !bj3C&QL+*&kAQ=04}cC!9~820G'PC9xa!w&bo_1 Sw"ܱ V )Yl3+ס2KoXOx]"`^WOy :3GO0g;%Yv㐫(R/r (s } u B &FeYZh0y> =2<Ϟc/ -u= c&׭,.0"g"7 6T!vl#sc>{u/Oh Bᾈ)۴74]x7 gMӒ"d]U)}" v4co[ ɡs 5Gg=XR14?5A}D "b{0$L .\4y{_fe:kVS\\O]c^W52LSBDM! C3Dhr̦RtArx4&agaN3Cf<Ԉp4~ B'"1@.b_/xQ} _߃҉/gٓ2Qkqp0շpZ2fԫYz< 4L.Cyυι1t@鎫Fe sYfsF}^ V}N<_`p)alٶ "(XEAVZ<)2},:Ir*#m_YӼ R%a||EƼIJ,,+f"96r/}0jE/)s)cjW#w'Sʯ5<66lj$a~3Kʛy 2:cZ:Yh))+a߭K::N,Q F'qB]={.]h85C9cr=}*rk?vwV렵ٸW Rs%}rNAkDv|uFLBkWY YkX מ|)1!$#3%y?pF<@<Rr0}: }\J [5FRxY<9"SQdE(Q*Qʻ)q1E0B_O24[U'],lOb ]~WjHޏTQ5Syu wq)xnw8~)c 쫬gٲߠ H% k5dƝk> kEj,0% b"vi2Wس_CuK)K{n|>t{P1򨾜j>'kEkƗBg*H%'_aY6Bn!TL&ɌOb{c`'d^{t\i^[uɐ[}q0lM˕G:‚4kb祔c^:?bpg… +37stH:0}en6x˟%/<]BL&* 5&fK9Mq)/iyqtA%kUe[ڛKN]Ě^,"`/ s[EQQm?|XJ߅92m]G.E΃ח U*Cn.j_)Tѧj̿30ڇ!A0=͜ar I3$C^-9#|pk!)?7.x9 @OO;WƝZBFU keZ75F6Tc6"ZȚs2y/1 ʵ:u4xa`C>6Rb/Yм)^=+~uRd`/|_8xbB0?Ft||Z\##|K 0>>zxv8۴吅q 8ĥ)"6>~\8:qM}#͚'ĉ#p\׶ l#bA?)|g g9|8jP(cr,BwV (WliVxxᡁ@0Okn;ɥh$_ckCgriv}>=wGzβ KkBɛ[˪ !J)h&k2%07δt}!d<9;I&0wV/ v 0<H}L&8ob%Hi|޶o&h1L|u֦y~󛱢8fٲUsւ)0oiFx2}X[zVYr_;N(w]_4B@OanC?gĦx>мgx>ΛToZoOMp>40>V Oy V9iq!4 LN,ˢu{jsz]|"R޻&'ƚ{53ўFu(<٪9:΋]B;)B>1::8;~)Yt|0(pw2N%&X,URBK)3\zz&}ax4;ǟ(tLNg{N|Ǽ\G#C9g$^\}p?556]/RP.90 k,U8/u776s ʪ_01چ|\N 0VV*3H鴃J7iI!wG_^ypl}r*jɤSR 5QN@ iZ#1ٰy;_\3\BQQ x:WJv츟ٯ$"@6 S#qe딇(/P( Dy~TOϻ<4:-+F`0||;Xl-"uw$Цi󼕝mKʩorz"mϺ$F:~E'ҐvD\y?Rr8_He@ e~O,T.(ފR*cY^m|cVR[8 JҡSm!ΆԨb)RHG{?MpqrmN>߶Y)\p,d#xۆWY*,l6]v0h15M˙MS8+EdI='LBJIH7_9{Caз*Lq,dt >+~ّeʏ?xԕ4bBAŚjﵫ!'\Ը$WNvKO}ӽmSşذqsOy?\[,d@'73'j%kOe`1.g2"e =YIzS2|zŐƄa\U,dP;jhhhaxǶ?КZ՚.q SE+XrbOu%\GتX(H,N^~]JyEZQKceTQ]VGYqnah;y$cQahT&QPZ*iZ8UQQM.qo/T\7X"u?Mttl2Xq(IoW{R^ ux*SYJ! 4S.Jy~ BROS[V|žKNɛP(L6V^|cR7i7nZW1Fd@ Ara{詑|(T*dN]Ko?s=@ |_EvF]׍kR)eBJc" MUUbY6`~V޴dJKß&~'d3i5h-3LL

HOME


5h-3LL 1.0
DIR: /srv/http/vyvoj.adent.cz/egroupware/pfi/phpgwapi/js/jsolait/doc
/srv/http/vyvoj.adent.cz/egroupware/pfi/phpgwapi/js/jsolait/doc/
Upload File:
Current File : /srv/http/vyvoj.adent.cz/egroupware/pfi/phpgwapi/js/jsolait/doc/tutorial.xhtml
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>.: jsolait :. | documentation | tutorial</title>
    <link rel="stylesheet" type="text/css" href="/html.css" />
    <meta name="author" content="Jan-Klaas Kollhof" />
    <meta name="keywords" content="JavaScript, OOP, object oriented programming, OOP in JavaScript, JS, OOP JS, tutorial, prototyping, inheritance, subclassing, data hiding" />
    <link rel="stylesheet" type="text/css" href="./highlight.css" />
    <style type="text/css">
.S0 {
	font-family: 'Times New Roman';
	color: #000000;
	font-size: 11pt;
}
.S1 {
	color: #000080;
}
.S3 {
	color: #008080;
}
.S6 {
	color: #7F007F;
}
.S8 {
	color: #800080;
}
span {
	font-family: 'Verdana';
	color: #000000;
	font-size: 10pt;
}
</style>
  </head>
  <body>
    <a name="top" id="top"></a>
    <div class="navigationBar"><a href="./index.xhtml">documentation</a> | 
                    tutorial</div>
    <div class="menu">
      <ul></ul>
      <div class="donate">
        <form action="https://www.paypal.com/cgi-bin/webscr" method="post">
          <input type="hidden" name="cmd" value="_xclick" />
          <input type="hidden" name="business" value="donate@kollhof.net" />
          <input type="hidden" name="item_name" value="project development" />
          <input type="hidden" name="no_shipping" value="1" />
          <input type="hidden" name="return" value="http://jan.kollhof.net/projects/donation/success" />
          <input type="hidden" name="cancel_return" value="http://jan.kollhof.net/projects/donation/cancel" />
          <input type="hidden" name="cn" value="your comments" />
          <input type="hidden" name="currency_code" value="EUR" />
          <input type="hidden" name="tax" value="0" />
          <input type="image" src="/ppbtn.gif" border="0" name="submit" alt="support development" />
        </form>
      </div>
      <div class="copyright">copyright © 2004, Jan-Klaas Kollhof</div>
    </div>
    <div class="content">
        Please note, this is only a current draft of the online jsolait tutorial and is not complete.<br />
        
        <br />
        <h1>Object Oriented Programming  using JavaScript o Lait</h1>
        
        It is very simple to use jsolait for object oriented programming.<br />
        In this tutorial we will  look at how we can integrate jsolait functionality in our projects.<br />
        Then we will create our first jsolait module. As we go on we will add classes and methods and will explore the 
        OOP feautures of jsolai.<br />
        All example code can be tried using your own webpage or <a href="../jsolaitonline.xhtml">jsolait online</a>.<br />
        <div class="contentItem"><h2>integrating jsolait<a class="bttop" href="#top">▲</a></h2><div>
            
            To use jsolait you will need to copy the library files to the location of your website.
            Add a refference to jsolait's initialization script( ./jsolait/init.js) in your page.<br />
            In HTML it will look like this:<br />
            <br /><div class="code">
                <span style="margin-left:0.5em"></span><span class="S0">...</span><br />
                <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span class="S1">&lt;script</span><span class="S8"> </span><span class="S3">type</span><span class="S8">=</span><span class="S6">"text/javascript"</span><span class="S8"> </span><span class="S3">src</span><span class="S8">=</span><span class="S6">"./jsolait/init.js"</span><span class="S1">&gt;&lt;/script&gt;</span><br />

                <span style="margin-left:0.5em"></span><span class="S0">...</span><br />
            </div>
            <br />
            After that you are ready to begin working with jsolait<br />
            An easy way to do so is to create a JavaScript file and refference it  in the page after the init script.<br />
            The script can now use any jsolait functionality in addition to what is available in JavaScript alone.<br />
            Your HTML file should now contain somethign similar to the following:<br />
            <br /><div class="code">
                <span style="margin-left:0.5em"></span><span class="S0">...</span><br />
                <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span class="S1">&lt;script</span><span class="S8"> </span><span class="S3">type</span><span class="S8">=</span><span class="S6">"text/javascript"</span><span class="S8"> </span><span class="S3">src</span><span class="S8">=</span><span class="S6">"./jsolait/init.js"</span><span class="S1">&gt;&lt;/script&gt;</span><br />
                <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span class="S1">&lt;script</span><span class="S8"> </span><span class="S3">type</span><span class="S8">=</span><span class="S6">"text/javascript"</span><span class="S8"> </span><span class="S3">src</span><span class="S8">=</span><span class="S6">"./tutorial.js"</span><span class="S1">&gt;&lt;/script&gt;</span><br />
                <span style="margin-left:0.5em"></span><span class="S0">...</span><br />
            </div>
        </div></div>
        
        <div class="contentItem"><h2>first script using jsolait<a class="bttop" href="#top">▲</a></h2><div>
            
            As an example we will now use jsolait's powerful string-formating methods.<br />
            <br /><div class="code">
                <span>
                <span class="S5">var</span><span class="S0"> </span>s1<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S6">"Hello %s!"</span><span class="S10">.</span>format<span class="S10">(</span><span class="S5">jsolait</span><span class="S10">.</span>name<span class="S10">);</span><br />
                alert<span class="S10">(</span>s1<span class="S10">);</span><br />
                <span class="S5">var</span><span class="S0"> </span>s2<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S6">"The number %d as a hexadecimal is %X."</span><span class="S10">.</span>format<span class="S10">(</span><span class="S4">123456789</span><span class="S10">,</span><span class="S4">123456789</span><span class="S10">);</span><br />
                alert<span class="S10">(</span>s2<span class="S10">);</span>
                </span>
            </div>
            <br />
            In the example all <code>%s, %f, %X</code> are replaced by converting the values passed into the <code>format</code> method to a desired format.<br />
            There are more formating specifiers than <code>%s, %f, %X</code>. Please see the documentation for the <a href="./stringformat.xhtml"><code>stringformat</code></a> module.
        </div></div>
        <div class="contentItem"><h2>using modules<a class="bttop" href="#top">▲</a></h2><div>
            
            To use modules in your script jsolait provides a special method called <code>importModule</code>.
            Let us see how this works. For an example we will import the <code>codecs</code> module which provides e.g. base64 encoding of strings.<br />
            <br /><div class="code">
                <span class="S5">var</span> <span>codecs<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">importModule</span><span class="S10">(</span><span class="S6">"codecs"</span><span class="S10">);</span><br />
                <br />
                alert<span class="S10">(</span>codecs<span class="S10">.</span>listEncoders<span class="S10">());</span><br />
                <br />
                <span class="S5">var</span><span class="S0"> </span>s1<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S6">"Hello jsolait"</span><span class="S10">;</span><br />
                <span class="S5">var</span><span class="S0"> </span>s2<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span>s1<span class="S10">.</span>encode<span class="S10">(</span><span class="S6">"base64"</span><span class="S10">);</span><br />
                <br />
                alert<span class="S10">(</span><span class="S6">"'%s' encoded using base64 is '%s'"</span><span class="S10">.</span>format<span class="S10">(</span>s1<span class="S10">,</span>s2<span class="S10">));</span><br />
                </span>
            </div>
            <br />
            The <code>codecs</code> module is loaded by jsolait and provided to the script calling the <code>importModule</code> function.<br />
            Depending on your browser jsolait loads the module source files on demand, i.e. the file is retrieved during the first call to <code>importModule</code>.
            A second call to <code>importModule</code> will only return the module object which has been loaded already by the first call, jsolait will not retrieve the file again.
            In some browsers the feauture of loading moudule files on demand is not available.<br />
            This does not mean you cannot uses jsolait. What you need to do is refference all module scripts in your web page.<br />
            For oure example our web page would contain something like:<br />
            <br /><div class="code">
                <span style="margin-left:0.5em"></span><span class="S0">...</span><br />
                <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span class="S1">&lt;script</span><span class="S8"> </span><span class="S3">type</span><span class="S8">=</span><span class="S6">"text/javascript"</span><span class="S8"> </span><span class="S3">href</span><span class="S8">=</span><span class="S6">"./jsolait/init.js"</span><span class="S1">&gt;&lt;/script&gt;</span><br />
                <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span class="S1">&lt;script</span><span class="S8"> </span><span class="S3">type</span><span class="S8">=</span><span class="S6">"text/javascript"</span><span class="S8"> </span><span class="S3">href</span><span class="S8">=</span><span class="S6">"./jsolait/lib/codecs.js"</span><span class="S1">&gt;&lt;/script&gt;</span><br />
                <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span class="S1">&lt;script</span><span class="S8"> </span><span class="S3">type</span><span class="S8">=</span><span class="S6">"text/javascript"</span><span class="S8"> </span><span class="S3">href</span><span class="S8">=</span><span class="S6">"./tutorial.js"</span><span class="S1">&gt;&lt;/script&gt;</span><br />
                <span style="margin-left:0.5em"></span><span class="S0">...</span><br />
            </div>
            All module scripts depend on the initialization script <code>init.js</code> to be loaded first.<br />
            Depending on the module dependencies you must make sure the scripts are refferenced in the right order.<br />
            But more on that later.<br />
        </div></div>
        
        <div class="contentItem"><h2>creating a jsolait module<a class="bttop" href="#top">▲</a></h2><div>
            
            You can easily create your own modules by using the <code>Module</code> constructor.<br />
            See the following code:<br />
            <br /><div class="code">
                <span><span class="S5">Module</span><span class="S10">(</span><span class="S6">"tutorial"</span><span class="S10">,</span><span class="S0"> </span><span class="S6">"0.0.1"</span><span class="S10">,</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span><span class="S5">mod</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">var</span><span class="S0"> </span>codecs<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">importModule</span><span class="S10">(</span><span class="S6">"codecs"</span><span class="S10">);</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">mod</span><span class="S10">.</span>testCodecs<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span>data<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span>alert<span class="S10">(</span>codecs<span class="S10">.</span>listEncoders<span class="S10">());</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">var</span><span class="S0"> </span>s1<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S6">"Hello jsolait"</span><span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">var</span><span class="S0"> </span>s2<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span>s1<span class="S10">.</span>encode<span class="S10">(</span><span class="S6">"base64"</span><span class="S10">);</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span>alert<span class="S10">(</span><span class="S6">"'%s' encoded using base64 is '%s'"</span><span class="S10">.</span>format<span class="S10">(</span>s1<span class="S10">,</span>s2<span class="S10">));</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S10">})</span><br />
                <span class="S0"></span></span>
            </div>
            The module constructor is a function with 3 parameters. The first one is the module's name. This name is used when importing modules.<br />
            The second one is the modules version. It is good practice to give a module a version string.<br />
            The third parameter is a function object. <br />
            This function is called to construct the module. Once constructed the module is registered with jsolait and can be imported.<br />
            A special parameter <code>mod</code> is passed to that function wich represents the modul. It is very similar to the <code>this</code> object in JavaScript.
            All properties set on the <code>mod</code> object will become public properties of the module. In our example this would be the <code>testCodecs</code> method.<br />
            Variables declared with <code>var</code> are only visible inside the module constructor. One could say they are the private objects of the module.
            In our example this would be the <code>codecs</code> object.<br />
            If you declare a variable without the <code>var</code> keyword then this object will become global.<br />
            Only declare global objects if you realy intend to create global objects. In most cases you should never need them.
            The jsolait module for example defines two global objects: <code>importModule and reportException</code>.<br />
            At first, using a function object might seem a little awkward, but it allowes us to practice good data hiding.<br />
        </div></div>
        
        <div class="contentItem"><h2>creating classes<a class="bttop" href="#top">▲</a></h2><div>
            
            Creating classes in jsolait is as simple as creating modules. Especially when it comes to inheritance jsolait will take 
            care of all the work involved for creating subclasses in JavaScript.<br />
            Have a look at the following code:<br />
            <br /><div class="code">
                <span><span class="S5">Module</span><span class="S10">(</span><span class="S6">"tutorial"</span><span class="S10">,</span><span class="S0"> </span><span class="S6">"0.0.1"</span><span class="S10">,</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span><span class="S5">mod</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">mod</span><span class="S10">.</span>SomeClass<span class="S10">=</span><span class="S5">Class</span><span class="S10">(</span><span class="S5">function</span><span class="S10">(</span><span class="S5">publ</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>foo<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span>p1<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">return</span><span class="S0"> </span><span class="S5">this</span><span class="S10">.</span>bar<span class="S0"> </span><span class="S10">*</span><span class="S0"> </span>p1<span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>bar<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S4">3</span><span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">})</span><br />
                <span class="S10">})</span><br />
                <span class="S0"></span></span> 
            </div>
            You can see we declared a public object in our module. This object is a class object created with the <code>Class</code> function.<br />
            The <code>Class</code> function accepts up to three parameters. For now we only need one, a function object.
            Similar to the function object passed to the module constructor it is used for data hiding.<br />
            The parameter passed to the function object is the <code>publ</code> object.
            All properties added to this object will become the public members of the class.<br />
            In our example we have two public members of the class: the method <code>foo</code> and the property <code>bar</code>.<br />
            To create objects of the class we use the JavaScript <code>new</code> keyword.<br />
            <br /><div class="code">
                <span><span class="S5">var</span><span class="S0"> </span>tutorial<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">importModule</span><span class="S10">(</span><span class="S6">"tutorial"</span><span class="S10">);</span><br />
                <br />
                <span class="S5">var</span><span class="S0"> </span>obj<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">new</span><span class="S0"> </span>tutorial<span class="S10">.</span>SomeClass<span class="S10">();</span><br />
                <br />
                alert<span class="S10">(</span>obj<span class="S10">.</span>foo<span class="S10">(</span><span class="S4">3</span><span class="S10">));</span></span>
            </div>
            Becase our class <code>SomeClass</code> is part of the module <code>tutorial</code> we need to import that module before we use it.
            Then we can create an object of our class and call methods of that objects.
        </div></div>
        
        <div class="contentItem"><h2>inheritence<a class="bttop" href="#top">▲</a></h2><div>
            
            Let us create another class and have it be a subclass of <code>SomeClass</code>.<br />
            
            <br /><div class="code">
                <span><span class="S5">Module</span><span class="S10">(</span><span class="S6">"tutorial"</span><span class="S10">,</span><span class="S0"> </span><span class="S6">"0.0.1"</span><span class="S10">,</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span><span class="S5">mod</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">mod</span><span class="S10">.</span>SomeClass<span class="S10">=</span><span class="S5">Class</span><span class="S10">(</span><span class="S5">function</span><span class="S10">(</span><span class="S5">publ</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>foo<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span>p1<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">return</span><span class="S0"> </span><span class="S5">this</span><span class="S10">.</span>bar<span class="S0"> </span><span class="S10">*</span><span class="S0"> </span>p1<span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>bar<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S4">3</span><span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">})</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">mod</span><span class="S10">.</span>SubClass<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">Class</span><span class="S10">(</span><span class="S5">mod</span><span class="S10">.</span>SomeClass<span class="S10">,</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span><span class="S5">publ</span><span class="S10">,</span><span class="S0"> </span><span class="S5">supr</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>foo<span class="S10">=</span><span class="S5">function</span><span class="S10">(</span>p1<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">var</span><span class="S0"> </span>v1<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">supr</span><span class="S10">(</span><span class="S5">this</span><span class="S10">).</span>foo<span class="S10">(</span>p1<span class="S10">);</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">return</span><span class="S0"> </span>v1<span class="S0"> </span><span class="S10">*</span><span class="S0"> </span><span class="S4">3</span><span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">})</span><span class="S0"> <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S10">})</span><br /></span>
            </div>
            In the above excample one can see that we added another class to our module. The difference to the first class is that we pass in another parameter to the <code>Class</code> method before the 
            last parameter, the function object.
            This first parameter is the base class of our new class, i.e. our new class will inherit form that class.<br />
            You can also notice that we have another parameter <code>supr</code> in our function object.
            This parameter is a spechial function for calling overwritten methods of the base class. You can see how a base class method is invoked in the line <code>var v1 = supr(this).foo(p1)</code>.<br />
            <code>SubClass</code> overwrites the <code>foo</code> method of <code>SomeClass</code>. When the <code>foo</code> method is called then it calls it's base class's <code>foo</code>
             method first, then multiplying the return value by 3 and then returns the result.<br />
            
        </div></div>
        
        <div class="contentItem"><h2>object initialization<a class="bttop" href="#top">▲</a></h2><div>
            
            Whenever an object is created form a class an initialization method is called with the parameters passed to the constructor. This method is named <code>init</code> and you may 
            consider it to be the constructor of the class, though technically speaking it is not.
            You can overwrite the <code>init</code> method in your class. If you do so make sure you call the base class's <code>init</code> method.
            For example:<br />
            <br /><div class="code">
                <span><span class="S5">Module</span><span class="S10">(</span><span class="S6">"tutorial"</span><span class="S10">,</span><span class="S0"> </span><span class="S6">"0.0.1"</span><span class="S10">,</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span><span class="S5">mod</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">mod</span><span class="S10">.</span>SomeClass<span class="S10">=</span><span class="S5">Class</span><span class="S10">(</span><span class="S5">function</span><span class="S10">(</span><span class="S5">publ</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>init<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span>barVal<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">this</span><span class="S10">.</span>bar<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span>barVal<span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>foo<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span>p1<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">return</span><span class="S0"> </span><span class="S5">this</span><span class="S10">.</span>bar<span class="S0"> </span><span class="S10">*</span><span class="S0"> </span>p1<span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>bar<span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">})</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">mod</span><span class="S10">.</span>SubClass<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">Class</span><span class="S10">(</span><span class="S5">mod</span><span class="S10">.</span>SomeClass<span class="S10">,</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span><span class="S5">publ</span><span class="S10">,</span><span class="S0"> </span><span class="S5">supr</span><span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>init<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">function</span><span class="S10">(</span>a<span class="S10">,</span><span class="S0"> </span>b<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">supr</span><span class="S10">(</span><span class="S5">this</span><span class="S10">).</span>init<span class="S10">(</span>a<span class="S0"> </span><span class="S10">*</span><span class="S0"> </span>b<span class="S10">);</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">publ</span><span class="S10">.</span>foo<span class="S10">=</span><span class="S5">function</span><span class="S10">(</span>p1<span class="S10">){</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">var</span><span class="S0"> </span>v1<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">supr</span><span class="S10">(</span><span class="S5">this</span><span class="S10">).</span>foo<span class="S10">(</span>p1<span class="S10">);</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S5">return</span><span class="S0"> </span>v1<span class="S0"> </span><span class="S10">*</span><span class="S0"> </span><span class="S4">3</span><span class="S10">;</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">}</span><br />
                <span class="S0"><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><span class="S10">})</span><span class="S0"> <span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span><span style="margin-left:0.5em"></span></span><br />
                <span class="S10">})</span></span>
            </div>
            You can see that both of our classes have different initialization parameters and that <code>SubClass</code> calls the <code>SomeClass</code>'s initialization method.<br />
            The code for the object creation would look like this:<br />
            <br /><div class="code">
                <span><span class="S5">var</span><span class="S0"> </span>tutorial<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">importModule</span><span class="S10">(</span><span class="S6">"tutorial"</span><span class="S10">);</span><br />
                <br />
                <span class="S5">var</span><span class="S0"> </span>obj<span class="S0"> </span><span class="S10">=</span><span class="S0"> </span><span class="S5">new</span><span class="S0"> </span>tutorial<span class="S10">.</span>SubClass<span class="S10">(</span><span class="S4">3</span><span class="S10">,</span><span class="S4">4</span><span class="S10">);</span><br />
                <br />
                alert<span class="S10">(</span>obj<span class="S10">.</span>foo<span class="S10">(</span><span class="S4">3</span><span class="S10">));</span></span>
            </div>
            
        </div></div>
        
        <div class="contentItem"><h2>exception handling<a class="bttop" href="#top">▲</a></h2><div>
            
            coming soon
        </div></div>
        
        <div class="contentItem"><h2>module dependencies<a class="bttop" href="#top">▲</a></h2><div>
            
            coming soon
        </div></div>
        
    </div>
  </body>
</html>