Tuesday, March 15, 2011

Page Rank Checker


Check Page Rank of your Web site pages instantly:
This page rank checking tool is powered by Page Rank Checker service

PHP 10 — Hula Loops

Saat ini anda seharusnya sudah tahu mengenai operator apa saja yang bisa dimasukkan ke dalam tanda kurung pada if yaitu operator lohika dan operator perbandingan. Nah, sekarang kita akan mempelajari bagaimana operator-operator tersebut dapat digunakan pada hal-hal lain misalnya membuat looping. Dalam tutorial kali ini kita akan mempelajari penggunaan operator tersebut dalam while. Mari kita mulai….

Loop sangat bermanfaat dan praktis. Dengan loop, program anda dapat melakukan sebuah pekerjaan secara berulang secara otomatis (dan tentu saja menentukan berapa kali sebuah pekerjaan harus dilakukan sebelum berhenti). Loop memiliki instruksi untuk “tetap melakukan beberapa baris kode secara berulang sampai suatu kondisi tertentu terpenuhi”. Anda dapat menggunakan lebih dari satu jenis loop. Nah, dalam tutorial kali ini kita hanya akan membahas mengenai loop yang sangat dasar yaitu menggunakan “while”.

Loop while dapat digambarkan sebagai berikut:

while (sesuatu benar) (baca: saat suatu kondisi adalah benar…)

{

// lakukan sesuatu yang anda tentukan

}

Loop yang menggunakan While ini sering digunakan bersamaan dengan increment dan decrement sebuah variabel integer. Whalah, maksudnya apa tuh? Artinya…..bahwa anda dapat memiliki skrip penambahan (atau pengurangan) sebuah nomor (1,2,3, dst) dari dari bagian sebuah skrip yang dilewati, sampai angka-angka tersebut mencapai suatu nilai maksimum atau minimum yang anda tentukan.

Jadi, jika anda ingin sebuah skrip menampilkan angka 1 sampai dengan 10, anda dapat dapat mengatakan seperti ini:

a. Variabel $AngkaSaya = 1;

b. Tampilkan $AngkaSaya;

c. Tambahkan 1 ke $AngkaSaya;

d. Kembali ke langkah a. dan kerjakan skrip ini lagi dengan nilai $AngkaSaya yang baru;

d. Berhenti saat $AngkaSaya mencapai nilai 11;



Setelah mengetahui hal itu, mari kita coba membuat kode yang akan ssecara otomatis menampilkan angka 1 s.d 10:
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
   
$AngkaSaya = 1;

while ($AngkaSaya <= 10)

{

print ("$AngkaSaya");

$AngkaSaya++;

}

?>


baris 1: mulai kode PHP;
baris 3: Isi nilai variabel $AngkaSaya dengan 1;
baris 5: Awali loop "while": Ketika variabel $AngkaSaya kurang dari atau sama dengan 10, kerjakan hal di bawah ini, atau jika tidak keluar dari loop;
baris 9: tampilkan nilai $AngkaSaya saat ini;
baris 11: tambahkan 1 kepada nilai $AngkaSaya;
baris 15: Akhir kode PHP.

(Tentu saja anda dapat juga menampilkan angka 1 s.d 10 dengan melakukan print angka 1 hingga 10, tapi dengan loop ini jauh lebih praktis dan pendek. Coba aj banyangin kalo kita harus nulis program untuk menampilkan angka 1 s.d sejuta, bisa teler tuh)

Untuk membuat loop anda dapat menggunakan operator-operator yang pernah kita pelajari dalam bagian 9 terdahulu, sebagai batasan atau ketentuan kondisi yang harus dipenuhi untuk menghentikan sebuah loop. Gunakanlah secara kreatif untuk memperoleh hasil optimal.

PHP 9 : Operator Perbandingan dan logika

Untuk melengkapi ilmu kita tentang operator percabangan, kita perlu mengetahui di dalam if kita bisa memakai apa saja. Nah, untuk itu kita akan mempelajari tentang operator. Siap ?

Kita sudah melihat bagaimana penggunaan tanda “=” saat kita mengisi variabel dalam skrip yang sudah kita tulis (misalnya $WarnaFavorite=”biru”). Tanda sama dengan tersebut disebut dengan “assignment operator” dan merupakan operator paling sederhana yang sudah kita miliki: $a = b berarti “variabel a diisi dengan nilai b (untuk saat ini)”.

Tetapi anda dapat memperoleh lebih banyak dari PHP dengan apa yang disebut dengan “comparison operator” (operator perbandingan) , “logical operator” (operator logika) dan “arithmetic operator” (operator aritmatika). Berikut adalah operator-operator tersebut diambil dari PHP.net


PHP 8 - Operator If, Else dan Elsif

Sekedar mengingatkan, sampai saat ini anda sudah memiliki beberapa ketrampilan dasar dalam olah PHP yaitu cara membuat program PHP, Variabel dan Array. Dengan variabel anda sudah dapat menghubungkan antar halaman PHP, ditambah dengan array, maka nampaknya anda sudah memiliki semua pengetahuan tentang PHP, khan? Belum…. Masih banyak yang bisa kita pelajari. Salah satu bagian penting adalah mempelajari operator, yang dalam bagian ini operator yang akan dibahas adalah If dan else. Mengapa operator itu penting? Karena merekalah yang memungkinkan sebuah program dapat memutuskan dan “berpikir” (tentu saja sesuai yang telah kita tentukan).

Kemampuan sebuah program dalam mengambil keputusan inilah yang diperlukan dalam membuat sebuah web site yang dinamis dan pandai, yaitu membuat sebuah program yang dapat mengambil keputusan berdasarkan bermaca-macam input dari user, kondisi user (misalnya browser apa yang dipakai seorang pengunjung ?), maupun informasi yang anda tentukan sendiri. Contohnya bisa saja seperti ini:

Setelah seorang pengunjung memasukkan sebuah alamat email, mengecek apakah formatnya benar (mis.: siapa@dimana.com) dan jika tidak segera menampilkan sebuah halaman yang mengatakan “Maaf, mbok kalo memasukkan alamat email itu yang betul to”

Mengetahui apakah seorang pelanggan telah memasukkan login dan password yang tepat.

Dan masih banyak lagi, pokoknya kemungkinannya tidak terbatas lah.

Siap? Ayo kita mulai dengan mencoba berkenalan sama "if".

If

Cara untuk membuat halaman anda menjadi “pandai” adalah dengan menggunakan perintah If, Else dan Elseif yang disertai operator-operator logika dan perbandingan. Yang paling penting adalah perintah if, yang memungkinkan anda bisa membuat kode seperti ini:


Jika sebuah kondisi benar, maka kerjakan sesuatu;
Jika kondisi tersebut salah, maka abaikan saja;



Sintaks untuk pernyataan di atas adalah sebagai berikut:


if (kondisi) {
// Tulis kode yang ingin anda eksekusi jika kondisi benar di sini
}



Berikut adalah contoh yang lebih riil. Pertama kita akan mengeset variabel $WarnaKesukaan dengan biru (baris 3). Kemudian kita akan mengatakan ”Jika WarnaKesukaan adalah biru, maka tampilkan ’Saya juga suka warna biru lho!’”


<?php
$WarnaKesukaan = "biru";


if ($WarnaKesukaan == "biru") {
print ("Saya juga suka warna biru lho!");
}
?>



Else



Else merupakan bagian dari perintah if, untuk mengatakan hal sebagai berikut:




Jika sebuah kondisi benar, maka kerjakan sesuatu;
atau, jika kondisi pertama tidak benar, maka kerjakan hal yang lain ini.





Contoh:


if (kondisi) {
// Tulis kode yang ingin anda eksekusi jika kondisi benar di sini
} else {
// Tulis kode yang ingin anda eksekusi jika kondisi salah di sini
}



Berikut contoh riil kelanjutan dari yang tadi:


<?php
$WarnaKesukaan = "kuning";

if ($WarnaKesukaan == "biru") {
print ("Saya juga suka warna biru lho!");
} else {
print ("Anda tidak suka biru?! Dasar!");
}
?>





Apa yang anda lihat di atas adalah format umum dalam menulis pernyataan tersebut. Kuncinya adalah untuk melihat di mana tuh letak kurung keriting eh kurawal sehingga anda tidak bingung misalnya perintah mana yang merupakan bagian kode tertentu. Dalam kode di atas, pasangan { dan } pertama adalah milik ”if”, sedangkan { dan } kedua milik ”else”.

PHP 7: Array Asosiatif

Dalam tulisan sebelumnya, kita sudah belajar tentang array. Jika anda sudah siap untuk mempelajari array yang lebih rumit, silahkan baca tutorial ini. Array asosiatif mengindeks elemen di dalamnya menggunakan nama yang kita tentukan dan bukan menggunakan nomor seperti yang sudah pernah kita pelajari.





Cara membuatnya adalah menggunakan fungsi array. Dalam fungsi array, kita bisa mengeset sepasang atribut sebagai nama elemen dan nilai elemen itu sendiri menggunakan gabungan “=” dan “>”, misalnya: nama_elemen=>”nilai”. Contoh riilnya adalah sebagai berikut:
$pacarku = array (
nama=>"Juwita",
Sifat=>"Baik hati, tidak sombong dan rajin menabung",
rambut=>"panjang terurai",
umur=>17
);
Di sini, kita membuat array bernama pacarku, dengan nama elemen “nama”,”Sifat”,”rambut” dan “umur”; dan kita mengisi masing-masing nama elemen tersebut dengan nilai (nama diisi dengan “Juwita”, Sifat”Baik hati, tidak sombong dan rajin menabung”, dan seterusnya).
Setelah array kita buat, kita dapat mengambil bagian manapun dari array tersebut dengan menggunakan “nama elemen” yang sudah kita alokasikan, contoh:
print $pacarku[nama];
akan memberikan kita nilai Juwita. Kita dapat juga mengeset setiap nama elemen secara sendiri-sendiri, misalnya:
$pacarku[nama] = "Juwita";$pacarku[Sifat] = " Baik hati, tidak sombong dan rajin menabung ";$pacarku[rambut] = "panjang terurai";$pacarku[umur] = 17;
Sebelum topik array ini berakhir, mari kita buat sedikit lebih rumit. Kita akan menggunakan kekuatan array yang sebenarnya dengan membuat array multi dimensi (kali kayak dimensi ruang dan waktunya Einstein ya?). Sebuah array multi dimensi adalah array (misalnya pacar-pacar kita) yang terbuat dari array yang lain (yaitu array-array setiap pacar kita, berisi nama, sifat dan umurnya).
Kita membuat array multi dimensi dengan membuat sebuah array:


$hewan = array
(
);
...dan kemudian kita isi array tersebut dengan array-array hewan di rumah kita yang sudah kita definisikan nama elemennya seperti ini:




$pacarku = array (
array ( nama=>"Rosa",
sifat=>"Baik Hati",
umur=>17 ),
array ( nama=>"Ruby",
sifat=>"Tidak Sombong",
umur=>27 ),
array ( nama=>"Sri",
sifat=>"Rajin Menabung",
umur=>37 ),
array ( nama=>"Nety",
sifat=>"Pemalas",
umur=>15 )
);
Untuk menggunakannya, kita dapat mengambil setiap bagian informasi dari array kita tersebut dengan menyebut nama array ($pacar), nomor dari sub-array yang kita inginkan (Rosa adalah [0], Ruby dengan [1], dst) dan kemudian menyebut nama elemen untuk atribut yang kita inginkan (nama, sifat dan umur). Ngomong-omong, kalau melihat daftar pacarnya, pasti dia orang yang hobi berpetualang, dari yang daun muda sampai yang tua disamber semua. Payah.
Untuk mengetahui umur Nety, kita akan menuliskan seperti ini:
print $pacarku[3][umur];
Berikut ini adalah keseluruhan kode yang sudah kita buat tadi. Semua kita buat dalam satu halaman, namun perlu diingat bahwa anda dapat mengeset array di suatu tempat (katakanlah dalam kode atau fields di form yang berada di halaman lain atau dalam database) dan mengambil informasi yang ada di dalamnya dari tempat lain. Di dini kita akan meletakkan semua dalam satu halaman agar anda dapat melihat semuanya sekaligus.
<html>
<head>
<title>Array Pacar</title>
</head>
<body>


<?php


$pacarku = array (
array ( nama=>"Rosa",
sifat=>"Baik Hati",
umur=>17 ),
array ( nama=>"Ruby",
sifat=>"Tidak Sombong",
umur=>27 ),
array ( nama=>"Sri",
sifat=>"Rajin Menabung",
umur=>37 ),
array ( nama=>"Nety",
sifat=>"Pemalas",
umur=>15 )
);

print $pacarku[2]["sifat"];print ("<br>");print $pacarku[3]["umur"];


?>




</body></html>
akan menampilkan :
Rajin Menabung
15
Apa yang sudah kita lakukan adalah membuat array yang mengandung sub array untuk setiap pacar kita yang berisi informasi detil tentang mereka; kemudian menampilkan sebuah kalimat yang menggunakan sifat dan umur dari 2 pacar kita yang terakhir.
Sudah…sudah masalah array kita sudahi sampai di sini dulu yach. Kalau masih bingung kontak aja prothelord di prothelord@yahoo.co.id. Silahkan latihan dulu dan kembali lagi jika sudah lihai, OK?
Dalam bagian 8 kita akan membahas masalah operator. Ini merupakan topik yang penting karena merupakan inti sebuah program di mana kita bisa membuat percabangan yang membuat program kita bisa “berpikir dan mengambil keputusan” berdasarkan suatu input.

PHP 6 - PHP dan HTML

Hmmmm. Terima  kasih atas tanggapan dari pengunjung mengenai situs ini melalui e-mail kami (prothelord [ath} yahoo [dot] co [dot] id). Semoga apa yang sudah disampaikan pada kami akan makin menambah kualitas situs ini.
OK deh Prothelors (maksudnya anda), kita lanjutkan tutorial kita dengan melihat bagaimana caranya untuk menggabungkan form HTML dengan kode PHP.

Dalam contoh-contoh kita sampai saat ini, kita sudah berhasil mengisi variabel dan menggunakannya dalam satu kode yang sama. Kayaknya hal ini agak kurang bermanfaat ya? Emang sih. Lha gimana nggak, daripada repot-repot masukin nilai yang kita inginkan, dilanjutkan dengan menampilkan apa yang kita inginkan melalui variabel kita tadi, kan mendingan langsung aja tuh nampilin apa yang kita iningkan tanpa menggunakan variabel, lebih singkat, cepat dan mudah. Jadi, gimana dong? Tenang ..... di tutorial inilah anda akan melihat kekuatan variabel yang sesungguhnya.

Nah, sekarang ayo kita coba sesuatu yang lebih menarik, dan bisa menunjukkan kegunaan variabel kita tercinta dalam sebuah program.

Baiklah, tanpa membuang waktu lagi, sekarang saatnya untuk membuat sebuah halaman web yang akan kita gunakan untuk menginput nama kita dan nama orang yang kita sukai dan kemudian menampilkannya secara bersamaan di halaman lain. Apa …… halaman lain? Ya, di halaman lain, ini yang membedakan dengan kode-kode kita sebelumnya, untuk itulah, mohon konsentrasi di bagian ini, karena ini sangat penting bagi perkembangan PHP anda di masa datang. Pahami betul bagaimana cara kita mengirimkan variabel kita dari satu halaman ke halaman yang lain yach…

Sebelum membuatnya, bayangkan kembali skenario ini. Anda membuat sebuah halaman website di mana pengunjung bisa mengisi nama mereka dan nama kekasih mereka dalam sebuah form dan kemudian menampilkan kembali nama-nama tersebut di halaman web lainnya.

Untuk melakukan hal itu, kita perlu membuat 2 buah file PHP. File pertama adalah sebuah form HTML untuk mengumpulkan input dari user, mengisikan input tersebut ke dalam variabel dan kemudian mengirimkannya ke file kedua yang bertugas menampilkan kembali isi variabel tersebut ditambah dengan beberapa hal sederhana lainnya. Maaf kalau cara penyampaiannya payah ya, tapi saya berharap paling enggak bisa tetap fun deh buat Prothelors dalam mempelajari PHP.

Pertama-tama, kita buat dulu halaman formnya, halaman ini adalah halaman HTML biasa dengan FORM di dalamnya. Sesudah ini kita akan buat sebuah halaman lain (PHP) untuk memproses apa yang diinputkan dari halaman HTML kita ini. Kita namai dengan form_saya.html

<html>
<head>
<title>Form Saya</title>
</head>
<body>

<form action="hasil_form_saya.php" method=post>

Nama saya adalah:
<br> <input type="text" name="NamaAnda">

<p> Nama orang yang saya sukai: 
<br> <input type="text" name="NamaDia">
<p>

<input type="submit" name="submit" value="Cocokkan!">
</form>

</body>
</html>

Ini adalah sebuah form HTML biasa tapi mengandung beberapa hal penting yang perlu Prothelors semua pahami. Bagian-bagian pentingnya adalah:

Baris 7: HTML membaca action="hasil_form_saya.php" yang menunjukkan pada browser file PHP mana yang akan memproses hasil form kita. Implikasinya, beberapa saat lagi anda harus membuat sebuah file yang bernama hasil_form_saya.php yang merupakan mesin kecil yang bertugas untuk menampilkan hasil input di form kita. (Jangan khawatir, kita akan membahas method=post belakangan)

Baris 10: input type="text" menentukan jenis elemen form apa yang kita inginkan,dalam kasus kita ini adalah sebuah inputan teks atau text box (kita juga bisa mendefinisikannya sebagai radio button, check box, dll); name="NamaAnda" artinya adalah bahwa apapun yang kita ketikkan ke dalam text box kita tadi akan mengisi sebuah variabel yang bernama “NamaAnda”. Inilah yang menghubungkan antara form dan variabel – setiap field dalam sebuah form dapat digunakan untuk mengisi variabel untuk kemudian kita gunakan sesuka kita (asik ya?).

Baris 13: di baris ini, kita memiliki sebuah teks input yang akan kita gunakan untuk mengisi variabel lain yang kita beri nama “NamaDia” yang merupakan nama orang yang kita sukai.

Baris 16, 17: Kode ini membuat sebuah tombol submit dengan tulisan “Cocokkan!” (maksudnya adalah coba cocokkan nama anda dengan nama orang yang anda sukai).

Dan berakhirlah form kita.

Nah, tugas form kita itu adalah mengumpulkan informasi nama anda dan nama orang yang anda sukai (tentu saja saat praktek, anda harus memasukkan nama-nama tersebut ke dalam form) dan mengisikannya ke dalam variabel masing-masing. Setelah itu ngapain ya? Berikutnya tentu saja adalah membawa dan menampilkan variabel yang sudah terisi dengan nama-nama tersebut dalam bentuk yang berbeda di …… ya, di halaman lain.

Masih inget kan, bahwa pada baris 7 kode HTML di atas, kita memberitahu form kita agar menuju atau mengeksekusi file hasil_form_saya.php begitu kita klik tombol submit (yang bertuliskan Cocokkan! itu). Berikut ini kira-kira isi file hasil_form_saya.php:

<html>
<head>
<title>Sayang Sekali!</title>
</head><body bgcolor="#FFFFFF" text="#000000">
<p>Kayaknya <?php print $NamaAnda; ?>
<p>gak bakalan bisa jadian sama
<b> <?php print $NamaDia; ?> deh!?! </b>
<p>Cobalah berusaha lebih keras ya…siapa tahu ada kesempatan.
</body>
</html>

Gimana, udah ngerti ya bagaimana caranya form kita mengirimkan sebuah variabel dari form kita itu ke sebuah file PHP?

Cat: FIle hasil_form_saya.php di atas hanya bisa berjalan jika setting register global php server kamu on. Kalau kebetulan settingnya off, maka kamu harus tambah baris setelah seperti ini:

<?
$NamaAnda=$_POST['NamaAnda'];
$NamaDia=$_POST['NamaDia'];
?>

Perhatikan bahwa pada file hasil_form_saya.php kita sebuah variabel dipanggil dengan menambahkan tanda $ ($NamaAnda) di depan variabel yang kita definisikan pada file HTML form_saya.html sebelumnya (NamaAnda).
Get vs Post

Kita sudah menggunakan metode "Post" untuk mengirimkan data form dengan cara yang berbeda menggunakan metode lain yaitu “Get”. Ingat, ini merupakan bagian dari form kita di mana tertulis <form action="hasil_form_saya.php" method=post>. 

Perbedaan antara kedua metode ini adalah bahwa metode post secara transparan mengirimkan semua informasi yang sudah dikumpulkan oleh halaman form kita, sedangkan metode Get akan mengirimkan semua informasi itu sebagai bagian dari URL (dalam contoh form kita tadi, akan seperti ini: http://localhost/hasil_form_saya.php?NamaAnda=panjul&NamaDia=cinta&submit=Cocokkan! — Perhatikan bagaimana informasi yang sudah dimasukkan user mengenai namanya dan nama orang yang disukainya ditambahkan pada URL? Ini akan sangat membantu nanti jika anda sudah mempelajari cara pengiriman variabel antar halaman lebih lanjut).

Pengen belajar sambil praktek? klik di sini.

Baiklah untuk bagian ini kita akhiri dulu ya, dan akan kita lanjutkan lagi ke bagian 7 yang akan membahas mengenai senjata tambahan sebuah variabel, yaitu Array. Terima kasih atas kunjungannya dan kembalilah lagi jika kamu sudah sempat untuk mempelajari lebih lanjut mengenai PHP ini. Jangan lupa untuk mendaftar sebagai anggota, sehingga kamu akan bisa mendapat berbagai informasi penting dari saya. Kamu juga bisa belajar HTML lebih jauh untuk meningkatkan pengetahuan kamu tentang tag-tagnya.

PHP 5 - Variabel yang Fleksibel

Seperti yang sudah pernah saya sebutkan di bagian pertama, bahwa salah satu kemudahan menggunakan PHP adalah variabelnya itu lho! Sangat flexibel. Bagi yang sudah pernah belajar bahasa pemrograman sebelumnya, tentu tahu bahwa kita harus mendeklarasikan variabel yang akan kita gunakan dalam program kita di awal . Deklarasi meliputi nama variabel, jenisnya, panjangnya, global atau lokal, dll yang bikin pusiiiing. Nah kalau di PHP, kita tidak perlu mendeklarasikan variabel kita di awal program, perlu variabel, tinggal pakai. Gitu. Nah dalam bagian ini kita akan mempelajari mengapa kita perlu variabel, dan bagaimana cara menggunakannya di PHP. Percaya deh, gampang banget.



Baiklah, jika anda perhatikan, sampai saat ini, apa yang sudah kita lakukan hanyalah membuat PHP mencetak teks baik hasil output fungsi (akan kita bahas lebih detil nanti) serta menggunakan perintah echo dan print. Nah, apakah itu sudah cukup menjadikan kita sebagai programmer? Walah, ya belum. Untuk itu, mari sekarang kita masuk lebih dalam lagi dengan mencoba mengenal variabel.Variabel ini merupakan salah satu materi penting yang wajib anda pelajari dalam PHP, jadi.... perhatikan baik-baik ya.

Pengen belajar sambil praktek? klik di sini.

Untuk mudahnya, coba bayangkan sebuah variabel sebagai sebuah wadah. Nah, berbeda dengan wadah yang biasa kita gunakan, variabel ini akan digunakan untuk menampung satu atau beberapa nilai (bagi yang udah jago, skip aja nih paragraf). Dengan kata lain, variabel ini adalah tempat yang digunakan oleh PHP untuk menyimpan informasi dan meneruskannya ke berbagai tempat. Variabel ini bisa diteruskan ke dokumen lain, fungsi dan sebagainya.

Untuk memberikan gambaran lebih jelas, saya coba gunakan pendekatan yang mudah-mudahan lebih baik. Anda yang pernah belajar matematika tentu pernah mengingat variabel dalam persamaan kan? Anda tentu masih bisa mengingat persamaan sederhana ini  “ x+3=7”. x adalah variabel, dan dengan sangat mudah, Anda  bisa mengetahui bahwa isi variabel x adalah nilai 4. Nah...variabel dalam PHP kira-kira berfungsi seperti itu, menampung sebuah nilai, dengan sedikit penambahan kemampuan yaitu variabel dalam PHP dapat kita gunakan lagi dalam file atau fungsi lain. Jangan khawatir, anda akan merasa lebih jelas setelah mempelajari contoh yang akan saya sampaikan di bawah nanti.

Alasan mengapa variabel begitu penting dalam PHP adalah karena pada saat Anda membuat halaman web dinamis (halaman yang dapat merespon input dari user) maka anda akan bergantung pada data yang dikirimkan antara halaman web. Pada saat itulah Anda harus menggunakan variabel. Variabel merupakan mekanisme utama dalam pengiriman data seperti ini.

Kayaknya sih, cara paling mudah untuk menerangkan cara kerja variabel dalam PHP adalah dengan menunjukkan aksi mereka dalam contoh ya? Namun sebelum itu, perlu diingat ada 3 hal yang dapat anda lakukan dengan variabel:Menyimpan nilai dengan memberi nilai pada mereka. Kadang disebut juga dengan istilah inisialisasi variabel;Mengubah nilai dalam variabel, tentu saja jika sudah di isi sebelumnya;Mengakses variabel (artinya anda bisa membaca nilai dari variabel itu dan melakukan hal yang diperlukan terhadap mereka)Nah, setelah anda mengetahui tentang apa saja yang bisa anda lakukan dengan variabel, mari kita pelajari lebih dalam dengan menggunakan contoh.

Pertama, anda perlu mengetahui bahwa variabel dalam PHP dimulai dengan tanda dolar (“$”). Dalam kode di bawah ini , kita akan mengisi variabel, menggunakannya, kemudian mengupdate isinya untuk kemudian digunakan lagi. Nilai yang ada dalam variabel dapat diubah kapanpun kita mau.

Mari kita perhatikan script pendek berikut ini. Jangan khawatir, Saya akan coba jelaskan secara detil apa yang terjadi pada masing-masing baris.
1. <?php
2. $isi_variabel = "Ini isi awal variabel!";
3. print ("Menampilkan isi variabel awal : $isi_variabel");
4. print ("<p>");
5. $isi_variabel = "Ini isi Variabel setelah diupdate!";
6. print ("Isi variabel setelah diupdate : $isi_variabel");
7. ?>

Hasil dari kode tersebut adalah sebagai berikut:

Menampilkan isi variabel awal : Ini isi awal variabel!

Isi variabel setelah diupdate : Ini isi Variabel setelah diupdate!

Penjelasan kode tersebut adalah sebagai berikut. Pada baris kedua, saya memutuskan untuk membuat variabel yang bernama “isi_variabel”. Ingat, semua variabel dimulai dengan tanda dolar, sehingga variabel saya tadi ditulis menjadi “$isi_variabel”. Berikut ini adalah penjelasan rinci mengenai apa yang dikerjakan masing-masing baris.

Baris 1 memberitahu browser bahwa : “Kode PHP mulai di sini”.

Baris 2 buat variabel $isi_variabel sekaligus mengisinya dengan nilai awal berupa kalimat “Ini isi awal variabel!”.

Baris 3 tampilkan kalimat pengantar untuk variabel $isi_variabel dan sekaligus menampilkan nilai dari $isi_variabel

Baris 4 membuat tag <p> dalam HTML untuk membuat paragraf baru.

Baris 5 Mengupdate isi variabel $isi_variabel dan mengisinya dengan kalimat “Ini isi Variabel setelah diupdate!”.

Baris 6 tampilkan kalimat pengantara kedua dan nilai untuk isi variabel $isi_variabel yang baru.

Baris 7 ngasih tahu si Browser bahwa kode PHP sudah berakhir.

Anda sudah melihat bahwa variabel $isi_variabel digunakan sebagai semacam wadah yang dapat menampung nilai yang bermacam-macam (Kita juga bisa mengisi berbagai jenis variabel ke dalam variabel yang sama, misalnya setelah kita isi dengan variabel numeric, langsung bisa kita update isinya menjadi varaibel karakter. Hal ini umumnya tidak bisa dilakukan bahasa pemrograman lain). Kita baru saja mengisi variabel dan memanggil isinya dalam sebuah skrip yang sama, namun kekuatan PHP yang masih tersembunyi adalah bahwa kita dapat mengisi variabel kita di suatu halaman web, misalnya sebuah form isian yang harus diisi pelanggan kita dan kemudian menggunakan variabel tersebut kemudian di halaman web lain.

Sintaks untuk mengeset variabel adalah dengan:
Mendefinisikannya dengan tanda = ($isi_variabel=”Ini isi awal variabel!”);
Menggunakan tanda kutip jika megisinya dengan string atau huruf ("Ini isi awal variabel!”; angka tidak memerlukan tanda kutip);
Akhiri setiap baris dengan titik koma.

Kemudian anda dapat memanggilnya denagn mengacu pada nama variabel ($isi_variabel pada baris 3 dan 6 – perhatikan bahwa saat memanggil variabel kita tidak menggunakan tanda kutip).

Pengen belajar sambil praktek? klik di sini.
Penamaan Variabel

Anda dapat menamai sebuah variabel dengan nama apapun selama mengikuti aturan berikut ini:
Dimulai dengan huruf;
Terdiri dari huruf, angka dan karakter garis bawah (karakter _ seperti dalam $isi_variabel");
Bukan merupakan kata kunci PHP (misalnya print).

Hati-hati: nama variabel adalah case sensitif (sehingga variabel $prothelon akan berbeda dengan $PROthelon. Sebagai tips, anda sebaiknya membuat nama variabel yang memiliki arti tertentu sehingga anda lebih mudah memahaminya seandainya beberapa tahun kemudian terpaksa harus membaca kode tersebut.

Dalam contoh-contoh kita tadi, kita mengisi variabel dengan teks alias string. Variabel juga dapat menampung nilai berupa angka dan lainnya (obyek, array, booleans).

Catatan akhir: Satu hal yang biasanya menjadi pertanyaan adalah penggunaan tanda kutip. Kita bisa menggunakan tanda kutip tunggal maupun ganda untuk mengisi teks, misalnya:

print ("Saya berada di situs Prothelon!");

Baris ini akan mencetak teks Saya berasa di situs Prothelon.

Jika anda ingin agar tanda kutip yang kita sayangi itu ikut tampil, anda harus menambahkan karakter “\” di depannya yang memberitahukan PHP bahwa tanda kutip sesudahnya bukan merupakan bagian dari kode, melainkan bagian dari kalimat. Cara ini dikenal dengan istilah escape characters, Dengan demikian, jika anda ingin menampilkan tulisan “Saya berada di situs Prothelon!” (lengkap dengan tanda kutipnya juga), kode anda akan seperti ini:

print (" \"Saya berada di situs Prothelon!\"" );

Gitu.

Baiklah, cukup sampai di sini dulu yach. Sampai ketemu di bagian selanjutnya.

PHP 4 - Contoh Script PHP Sederhana

OK deh, sekarang kita coba menulis kode pertama kita. Tolong salin kode berikut ke sebuah file (pakai notepad aja bisa), dan tuliskan apa yang ingin anda tampilkan pada browser di antara tanda kutip.

"Echo" dalam kode dibawah ini artinya tampilkan pada layar web browser saat anda membuka file tersebut:


<?php
echo ("Anda berada di situs Prothelon");
?>


Simpan file tersebut dengan nama apa saja tanpa spasi dan diakhiri dengan .php (perhatian para pengguna notepad:saat menulis nama file apitlah dengan tanda kutip), dan jika anda sudah menginstal server di komputer anda sendiri, anda harus menyimpannya di directory khusus tempat root web server anda (jika anda menggunakan phptriad lokasinya adalah c:\apache\htdocs).
Langkah berikutnya adalah membuka file pertama anda di browser. Ketik http://localhost/namafile.php untuk melihat hasil karya besar anda, dan ya, anda seharusnya melihat tulisan "Anda berada di situs Prothelon" (jangan gunakan file -> open, dan jangan lupa menyalakan server web anda. Untuk phptriad klik phptriad ->start apache). 
Jika anda mencoba kode di server web di internet, FTP file anda ke root server web anda.
Ayo, sekarang coba dulu dan buat kode pertama anda bekerja. Kalau sudah berhasil, kembali lagi ke sini dan kita akan bermain-main lagi. (kalau belum berhasil, kontak kami saja).

Perhatikan Error
Asyik kan? Pasti ..... kalau sukses, kalau tidak bete nih pasti. Apalagi ketemu error di skrip. Anda sangat mungkin akan mendapat error mirip seperti ini (habis, sering sih....dapat error model gini.):

Parse error: parse error in http://localhost/namafile.php on line 12

Pesan error ini sangat bermanfaat dan anda akan banyak bertemu dengan pesan tersebut, pesan error tuh mirip sama orang yang gak suka sama kita, hobinya ngritik terus, tapi kalau kritik itu kita manfaatkan untuk perbaikan, kita bisa mendapat manfaat. Sukurin tuh, orang yang ngritik kita, niat mencela, malah kia manfaatin. Anda akan memperoleh pesan seperti itu untuk tiap baris kode kita yang salah. Untuk kebutuhan kita, sebetulnya yg perlu kita ketahui adalah bahwa ada yg salah pada kode kita di baris 12. Langkah berikutnya tentu saja mengecek kode kita. Saat inilah mulai terasa repotnya pakai notepad. Harus ngitung baris. Makanya coba pakai editor lain, saya sendiri menyukai crimson editor. Untuk kebutuhan kita, kita hanya perlu tahu bahwa ada sesuatu yang salah dengan kode kita di baris 12, jadi mari segera kita lihat baris tsb, dan siapa tahu bisa mengetahui penyebabnya.  Saya selalu mulai dengan melihat apakah sintaks dasar saya sudah benar, misalnya apakah saya sudah menuliskan ; di akhir baris, tag penutup, tanda kurung ?


Pengen belajar sambil praktek? klik di sini.

Terusin yah ...

Mari kita meneruskan kode kita dengan menambahkan beberapa bagian yang penting ke halaman terakhir kita tadi.
Dalam kode yang sudah anda tulis, tolong tuliskan beberapa baris lagi. kalau anda perhatikan, anda dapat menggabungkan lebih dari satu fungsi PHP dalam sebuah tag PHP. Ingat, gunakan komentar sesering mungkin. Komentar dalam kode bisa anda gunakan untuk menjelaskan apa yang dilakukan setiap bagian sebagai referensi nantinya saat membaca ulang kode script kita lagi.
Berikut scriptnya, dan saya akan menggunakan print sebagai alternatif dari perintah echo pada contoh sebelumnya. Keduanya berfungsi untuk menampilkan sesuatu ke layar browser anda.
Teks ini (atau HTML apapun yang ingin anda tampilkan) akan muncul persis sebelum kode-kode PHP.

<html>
<body>

<p><p>

<?php

// contoh pertama yang kita gunakan, phpversion ini adalah

// sebuah fungsi yang akan menampilkan versi PHP yang anda gunakan

phpversion();

// berikutnya, kita coba menampilkan kode HTML

// ke browser untuk membentuk 

// layout halaman yang kita tampilkan.

// Dalam kasus contoh kali ini, kita akan menggunakan tag <p>,

// tag <p> dapat diletakkan

// dalam baris print yang sama seperti saat kita menuliskan

// teks "Anda berada di situs prothelon.com"

// di antara teks phpversion dan

// hal-hal lain di baris sesudahnya.

print ("<p>"); /* tag <p> digunakan untuk membuat paragraf baru*/

print ("Anda berada di situs prothelon.com");

print ("<p>");

/* fungsi "phpinfo" berikut ini akan menampilkan sebuah halaman

yang panjang yang memberikan kita informasi mengenai konfigurasi

versi PHP yang kita gunakan. Ini akan sangat berguna saat kita

melakukan troubleshooting nantinya */

phpinfo();

?>

</body>

</html>






CATATAN: fungsi phpinfo akan menghasilkan informasi yang sangat panjang mengenai versi dan status server PHP anda. Jangan khawatir, karena untuk saat ini Anda tidak perlu memahami semua artinya, saya hanya ingin menunjukkan pada anda bahwa ada fungsi tersebut. Suatu saat anda akan memerlukannya, misalnya untuk melihat versi server PHP, lokasi file-file konfigurasi, dll.

PHP 3 - Aturan Penulisan Kode PHP

Masih ingat kan? Kalau kode-kode PHP anda akan disisipkan di antara kode-kode HTML. Sebagai akibatnya, PHP dan HTML akan sama-sama kita tulis dalam bentuk teks biasa. Kode PHP anda (misalnya dalam contoh di bawah ini  adalah sebuah halaman yang menampilkan kata-kata “Anda berada di situs Prothelon!”) akan berada di sela-sela kode-kode dalam sebuah file HTML yang berekstensi .php, bukan .htm atau .html seperti biasanya.

Pengen belajar sambil praktek? klik di sini.



Contoh halaman dari penjelasan tersebut adalah sebagai berikut :


<html>
<head>
<title> Contoh Halaman PHP </title>
</head>
<body>
<font color="blue">PHP kode saya akan membuat halaman ini menampilkan:</font>
<p>
  <?php
  print ("Anda berada di situs Prothelon!");
  ?>
</body>
</html>

Nah, perhatikan contohdi atas. Anda mungkin sudah mulai memahami cara kerja PHP dan HTML. HTML tetap diperlakukan sebagaimana HTML persis seperti HTML tanpa kode PHP, tetapi semua kode yang berada di antara tag akan dianggap kode PHP dan diproses oleh server PHP.


Ingat kan? Hasil output dari proses PHP itu yang akan ditampilkan oleh HTML ke browser. Perhatikan bahwa jika anda menyimpan file dengan ekstensi .htm/html, maka browser juga akan muncul akan menampilkan juga tag php namun tidak memprosesnya, sehingga muncul seperti ini:

<?php 
print ("Anda berada di situs Prothelon!");
?>


Sedangkan jika anda menyimpan dalam ekstensi .php, maka yang muncul hanya:

Anda berada di situs Prothelon!

Gitu….



Pengen belajar sambil praktek? klik di sini.

Cara Penulisan Kode PHP
Setelah anda memahami bagaimana sebuah kode PHP dan HTML dikawinkan dan diproses, sekarang saatnya bagi anda untuk mempelajari aturan-aturan dasar penulisan sintaks PHP. Aturan-aturan dasarnya secara singkat adalah sebagai berikut:

Penamaan File
File PHP anda harus disimpan dengan ekstensi .php (jika anda menemukan file dengan  ekstensi .php3 atau phtml maka kemungkinan besar file-file tersebut ditulis menggunakan PHP versi 3 ke bawah). Seperti sudah saya jelaskan sebelumnya, file-file tersebut akan disimpan sebagai file teks biasa. (Artinya kita ndak butuh editor khusus kalau kepepet, cukup notepad. Namun perlu diingat bahwa notepad tidak memunculkan nomor baris yang akan kita perlukan saat melakukan debugging jika ada masalah dengan kode kita).

Komentar
Komentar adalah bagian penting dalam kode PHP yang anda buat. Anda akan memerlukan komentar ini untuk membantu mengingat lagi kegunaan sebuah blok kode nantinya. Anda harus membiasakandiri untuk menuliskan catatan tentang kode-kode anda dengan tag komentar, sehingga sifat manusiawi kita yang pelupa bisa terbantu jika suatu saat anda perlu mereview kembali kode-kode yang pernah anda buat. Cara untuk membuat komentar yang tidak ingin anda tampilkan atau eksekusi adalah  dengan menambahkan “//” di awal baris atau mengapit komentar dengan “/*” dan “*/” jika perlu membuat komentar yang panjang:
<?php
// Baris ini akan diabaikan. Catatan untuk kita sendiri:
// Saya membuat script ini sambil
//Membaca, berenang dan menyelam.
print ("Anda berada di situs Prothelon!");
/*
Tiga baris berikut ini juga akan diabaikan.
Dan jangan lupa untuk kembali ke situs ini setiap minggu
untuk melihat artikel/tutorial baru!
*/
?>

Permulaan Kode
Blok kode PHP diawali dengan “<?php” (atau cukup disingkat “<?” saja bila server anda mengijinkan...dan biasanya bisa).

Akhir Kode
Blok kode PHP ditutup dengan menambahkan “?>” di akhir blok kodenya.

Akhir Baris Program
Setiap baris instruksi program diakhiri dengan tanda titik koma “;”. Artinya walaupun anda menuliskannya lebih dari 1 baris tetap akan dianggap satu baris instruksi program jika belum ada tanda titik koma (lihat contoh di penjelasan tanda kurung di bawah).

Tanda Kurung
Tanda kurung akan banyak anda gunakan dalam kode PHP. Salah satu penggunaan yang sering dilakukan adalah dalam memanggil fungsi. Secara sederhana, setiap fungsi PHP akan berbentuk seperti ini ….

print ( );

"print" adalah nama fungsi dan informasi lain yang perlu ditambahkan pada fungsi tersebut akan anda tuliskandi dalam tanda kurung. Ingat..... jangan lupa untuk mengakhiri dengan tanda titik koma (kesalahan tidak mengakhiri dengan titik koma ini paling sering terjadi pada pemula). Oh iya, sebelum lupa, echo() juga memiliki kegunaan yang sama dengan print().
Spasi, pergantian baris, dll tidak akan mempengaruhi output lho. Sehingga, bagian kode berikut ini ...

<?php
print ("Anda berada di situs Prothelon!");
?>

... akan menghasilkan hal yang sama dengan kode berikut ini:

<?php print ("Anda berada di si
tus Prothelon!"); ?>

Saran saya, anda tetap menuliskan dengan menggunakan spasi, kurung dan tab secara wajar. Hal ini penting untuk mempermudah kita membaca program yang panjang. (Biasain yach…)

PHP 2 - Pengenalan PHP

Penjelasan sederhananya adalah bahwa PHP merupakan sebuah program tambahan yang ada dalam software web server anda. PHP bisa anda temukan di web server Apache, Microsoft IIS, dan server-server lainnya (dalam kasus phptriad, web server yang digunakan adalah Apache Web Server). PHP ini gampang dipelajari lho, sama seperti VB yang tutorial dasar-dasar VB nya juga bisa anda baca di prothelon.com ini.

Cara menggunakan PHP juga sangat mudah. Pada prinsipnya anda hanya perlu menyisipkan kode PHP ke dalam tag-tag HTML yang sudah ada di situs anda.

Cara bekerjanya secara singkat adalah seperti ini. Ketika ada yang mengakses web anda di halaman yang berisi kode PHP (tentunya dengan file berekstensi .php), server anda akan mengeksekusinya dan kemudian mengirimkan hasil eksekusinya ke web server untuk selanjutnya ditampilkan menggunakan kode HTML.
Itulah sebabnya anda perlu menginstal server anda sendiri untuk mengetes kode PHP anda secara lokal. Dalam hal ini, server merupakan otaknya dan fungsi browser hanyalah untuk menampilkan hasil output serverPHP ke PC klien, yaitu PC anda.

Ingat, PC anda tidak memerlukan tambahan khusus atau apapun untuk melihat hasil eksekusi kode PHP anda.
Mengapa?

Karena begini. Browser anda kan sudah mengerti dan bisa menampilkan bahasa HTML. Web server akan mengolah kode PHP anda dan menampilkan outputnya langsung dalam format HTML. HTML inilah yang dikirimkan ke browser anda. Jadi, hasil output PHP akan diterima melalui internet oleh browser anda dalam format standar HTML. Tentu saja browser anda tidak memerlukan tambahan apapun, karena dia tetap menjalankan tugasnya persis seperti saat menampilkan halaman web tanpa script PHP.
Anda juga perlu tahu bahwa sama seperti HTML, PHP merupakan sebuah bahasa script atau kalau jaman saya dulu sering disebut interpreter. Hal ini berarti kode tidak perlu di-compile sebelum digunakan. Kode yang kita buat hanya akan diproses saat diperlukan. Ini berbeda dengan bahasa pemrograman seperti C, VB maupun Delphi yang perlu di-compile (di-compile artinya di ubah dari bentuk text ke bentuk bahasa mesin yang bisa langsung dieksekusi oleh komputer, biasanya ekstensi filenya adalah EXE).

Konsekuensinya enak, anda menulis kode PHP dalam bentuk teks dan menyimpannya dalam bentuk teks juga. Tapi...... script PHP anda jadi memerlukan interpreter yaitu server PHP untuk mengeksekusi kode PHP yang masih dalam bentuk teks, sedangkan pada program hasil compile dalam bentuk executable file tidak memerlukan program lain untuk bisa dieksekusi. Server PHP ini adalah penerjemah kode PHP menjadi bahasa mesin yang dikenal oleh hardware komputer.
Oh ya, kalau anda memerlukan pendalaman lebih detil tentang sintak-sintaks PHP, maka anda bisa mengunjungi situs  php.net. Situs ini berfungsi sebagai pusat pengembangan dan dokumentasi resmi dari PHP (ingat kan, PHP itu sifatnya open source, jadi harus ada tempat berkumpul dan berkoordinasi buat para pengembangnya. (kebayang kalau ndak ada yang koordinasi, bakalan ribet banget tuh proses pengembangannya, iya kan?).

Php.net memiliki banyak materi referensi mengenai PHP dan berbagai macam tips yang dikirim para programmer dari seluruh penjuru dunia. PHP.net memiliki informasi yang sangat hebat dan mendalam mengenai PHP, tapi akan sangat mengerikan bagi pemula untuk langsung terjun ke sana. Itulah sebabnya situs ini dibuat, selain materi di sana sudah advance, yang bikin repot buat kita ya bahasa inggrisnya itu loh. Tapi jangan khawatir, di akhir tutorial ini kita akan membicarakan mengenai bagaimana cara untuk memanfaatkan situs php.net tersebut.

OK, sekarang kita sudah tahu mengenai PHP, so what gitu loh? Emang PHP bisa apaan aja sih ? Gini loh, PHP itu bisa:
Mengambil informasi dari form berbasis web dan menggunakannya untuk berbagai macam keperluan (menyimpan dalam database, membuat halaman berkondisi berdasarkan isi form, ngirimin e-mail, ngirim e-mail ke pacar secara otomatis saat ultah do’i, pokoknya macem-macemlah);
Autentikasi dan menelusuri pengunjung, artinya kita bisa tau pengunjung situs kita itu lebih senang ngeliat halaman yang mana;
Melayani halaman yang berbeda-beda tergantung pada penggunaan browser atau peralatan (misalnya kita bisa tahu pengunjung situs kita itu pake IE atau Firefox atau PDA dan memperlakukannya secara berbeda. Kebayangkan kalau layar sekecil PDA dicekokin halaman web standar yang gede?);
Menampilkan seluruh halaman situs kita dengan hanya menggunakan satu layout. Kalau halamannya statis, kita harus membuat satu layout untuk satu halaman bisa bete tuh;
Namun sebelum kita mempelajari penggunaan khusus PHP, seperti biasa, kita perlu mulai dari yang sederhana dulu. Diawali dengan cara membuat blok program PHP dengan skrip sederhana berikut.

Tolong tulis kode di bawah ini (yang berwarna merah itu) pake notepad aja yah. Terus simpan dengan nama prothelon.php. Jangan lupa saat menyimpan di kotak file name, nama file harus diapit dengan tanda kutip (“prothelon.php”) soalnya kalau tidak begitu, nanti ekstensinya akan jadi txt dan nama filenya jadi prothelon.php.txt. Skrip sederhana ini akan menampilkan tulisan:
“Anda berada di situs Prothelon!”
pada browser anda.

<?
print ("Anda berada di situs Prothelon!");
?>
Kata-kata dalam tanda kurung adalah teks yang akan di tampilkan oleh browser, sedangkan sisanya merupakan kode PHP.

Tag merupakan awal dan akhir skrip, sedangkan karya-karya anda harus diletakkan di tengahnya. Gimana, dah ngerti? OK dah.

Dalam artikel selanjutnya kita akan mempelajari aturan-aturan dasar dalam menulis kode PHP yang harus anda ketahui sebelum anda menulis skrip PHP pertama anda termasuk cara ngegabungin PHP sama HTML. Jadi Kembalilah minggu depan OK?

PHP 1 - Persiapan Awal

Membuat Website sendiri? Kenapa enggak. Nah, bagi anda yang sama sekali baru di dunia PHP, halaman ini ditujukan untuk menggugah minat dan semangat mempelajari bahasa ini sebagai landasan awal buat kamu yang pengen membuat website dinamis sendiri. Ibarat pepatah, tak kenal maka tak sayang, maka halaman pertama ini dibuat untuk mengenalkan kita pada PHP.

Javascript Code: How to make menus in Java

This is for people who want to have a menu in their website easily. This is a menu which if you click it gradually fades out and shows the options to the visitor.

<!--this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
<!-- START OF Drop Down DHTML -->

<!-- SUMMARY BRIEFS
    This DHTML script will create a drop down link box out of
    an ordinary link.  VERY COOL!!!!

    The top portion of this script goes above the <BODY> tag.
    The second portion goes where you want the drop down link
    box to be.
-->




<style>
<!--
#wrapper{
position:relative;
height:30px
}

#wrapper2{
position:absolute
}

#coffeemenu03{
filter:revealTrans(Duration=1.5,Transition=12)
visibility:hide
}


-->
</style></HEAD>

<BODY>

<ilayer id="coffeemenu01" height=35px>
<layer id="coffeemenu02" visibility=show>
<span id="wrapper">
<span id="wrapper2" onClick="dropit2();event.cancelBubble=true;return false">
<font face="Verdana"><b><a href="notthisbrowser.html">Click Here To Navigate</a></b></font>
</span>
</span>
</layer>
</ilayer>

<script language="JavaScript1.2">


var enableeffect=true

var selection=new Array()
selection[0]='<font face="ARIAL BLACK"><a href="http://www.javascriptfreecode.com">Order Our Stuff</a><br>'
selection[1]='<a href="http://www.javascriptfreecode.com">Contact Us via E-mail</a><br>'
selection[2]='<a href="http://www.javascriptfreecode.com">Help With Our Items</a><br>'
selection[3]='<a href="http://www.javascriptfreecode.comm">Products We Have</a><br>'
selection[4]='<a href="www.javascriptfreecode.com">Services We Offer</a><br></font>'

if (document.layers)
document.coffeemenu01.document.coffeemenu02.visibility='show'

function dropit2(){
if (document.all){
coffeemenu03.style.left=document.body.scrollLeft+event.clientX-event.offsetX
coffeemenu03.style.top=document.body.scrollTop+event.clientY-event.offsetY+18
if (coffeemenu03.style.visibility=="hidden"){
if (enableeffect)
coffeemenu03.filters.revealTrans.apply()
coffeemenu03.style.visibility="visible"
if (enableeffect)
coffeemenu03.filters.revealTrans.play()
}
else{
hidemenu()
}
}
}

function dropit(e){
if (document.coffeemenu03.visibility=="hide")
document.coffeemenu03.visibility="show"
else
document.coffeemenu03.visibility="hide"
document.coffeemenu03.left=e.pageX-e.layerX
document.coffeemenu03.top=e.pageY-e.layerY+19
return false
}

function hidemenu(){
if (enableeffect)
coffeemenu03.filters.revealTrans.stop()
coffeemenu03.style.visibility="hidden"
}

function hidemenu2(){
document.coffeemenu03.visibility="hide"
}

if (document.layers){
document.coffeemenu01.document.coffeemenu02.captureEvents(Event.CLICK)
document.coffeemenu01.document.coffeemenu02.onclick=dropit
}
else if (document.all)
document.body.onclick=hidemenu

</script>

<div id="coffeemenu03" style="position:absolute;left:0;top:0;layer-background-color:#C0C0C0;background-color:#C0C0C0;width:200;visibility:hidden;border:2px solid black;padding:0px">
<script language="JavaScript1.2">
if (document.all)
coffeemenu03.style.padding='4px'
for (i=0;i<selection.length;i++)
document.write(selection[i])
</script>
</div>

<script language="JavaScript1.2">
if (document.layers){
document.coffeemenu03.captureEvents(Event.CLICK)
document.coffeemenu03.onclick=hidemenu2
}
</script>

<!-- END OF Drop Down DHTML -->
 

Javascript Code: Online visitors ( Online users )

The visitors who are online on you website, but don't forget to change the url asdress to your address

<!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
<!-- Start FastOnlineUsers.com -->
Oneline users :
<script src=http://fastonlineusers.com/online.php?d=www.YOUR WEB  NAME.com> </script>
<!-- End FastOnlineUsers.com -->
<p>

<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>

Javascript Code: Opening popup with the main page

Opening a popup with page whenever user opens the page

<!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
<HEAD>
<!--   DESCRIPTION:  This will make a small Navigation Window in which you can place links to different pages.

    INSTRUCTIONS:  Place this script in the HEAD tags of
your webpage. 

    FUNCTIONALITY:  Works in both Netscape & IE.
-->

<SCRIPT LANGUAGE="JavaScript">

//Modified by CoffeeCup Software
//This code is Copyright (c) 1997 CoffeeCup Software
//all rights reserved. License is granted to a single user to
//reuse this code on a personal or business Web Site.

<!--

coffeeWin=window.open("","coffeeWin","toolbar=no,width=200,height=250,directories=no,menubar=no,SCROLLBARS=no");

coffeeWin.document.write("<HTML>");
coffeeWin.document.write("<HEAD>");

coffeeWin.document.write("</HEAD>");

coffeeWin.document.write("<BODY BGCOLOR=#FFFFFF TEXT=#000000 LINK=#0000FF VLINK=#0000FF>")

coffeeWin.document.write("<CENTER>")

coffeeWin.document.write("<FONT FACE=VERDANA,ARIAL SIZE=2>");

coffeeWin.document.write("<B>");

coffeeWin.document.write("<FONT SIZE=3>Navigation Window</FONT>");

coffeeWin.document.write("<BR><HR WIDTH=180><BR><P>");

coffeeWin.document.write("<A HREF=http://www.webloger.5u.com TARGET=MAIN>Webloger Website</A>");

coffeeWin.document.write("<P>");

coffeeWin.document.write("<A HREF=http://www.microsoft.com TARGET=MAIN>Microsoft</A>");

coffeeWin.document.write("<P>");

coffeeWin.document.write("<A HREF=http://www.netscape.com TARGET=MAIN>Netscape</A>");

coffeeWin.document.write("<P>");

coffeeWin.document.write("<A HREF=http://www.infoseek.com TARGET=MAIN>InfoSeek</A>");

coffeeWin.document.write("<P>");

coffeeWin.document.write("</B>");

coffeeWin.document.write("</FONT>");

coffeeWin.document.write("</BODY>");

coffeeWin.document.write("</HTML>");



//-->
</SCRIPT>
</HEAD>


<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>

Javascript Code: Slide show showing pictures combo

if you want the user choose the picture from a combo box and then click on a button and show the picture changing picture in JavaScript
 
<!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
<!-- Drop Down Image Preview


  1.  Copy the coding into the HEAD of your HTML document
  2.  Add the last code into the BODY of your HTML document  -->

<!-- STEP ONE: Paste this code into the HEAD of your HTML document  -->

<HEAD>

<SCRIPT LANGUAGE="JavaScript">
function CoffeePreview(sel) {
document.CoffeePreview.src = "" + sel.options[sel.selectedIndex].value;
}
function CoffeeShow(sel) {
images = new Array();
images[1] = "1.jpg";
images[2] = "2.jpg";
images[3] = "3.jpg";
images[4] = "4.jpg";
images[5] = "5.jpg";
images[6] = "6.jpg";
window.location.href = images[sel.selectedIndex+1];
}
//  End -->
</script>
</HEAD>

<!-- STEP TWO: Copy this code into the BODY of your HTML document  -->

<BODY>

<center>
<form name=previewselect>
<select name=selbox size=1 onChange="CoffeePreview(this)">
<option value="1-small.jpg">Image #1
<option value="2-small.jpg">Image #2
<option value="3-small.jpg">Image #3
<option value="4-small.jpg">Image #4
<option value="5-small.jpg">Image #5
<option value="6-small.jpg">Image #6
</select>
<p>
<img name="preview" src="1-small.jpg" width=150 height=113 border=1>
<p>
<input type=button value="view Image" onclick="CoffeeShow(this.form.selbox)">
</form>
</center>


<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>

Javascript Code: Clock the visitor time visiting the page

Shows how long the user have been in the website and clock each second and shows it in a text box

<!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->

<!-- End of Time Spent JavaScript -->
<!-- This scripts tell your sites visitor how long they spent at the page. -->
<!-- Instructions:
    1.  Copy the coding into the HEAD of your HTML document
    2.  Add the last code into the BODY of your HTML document  -->
<!-- Script supplied with CoffeeCup HTML Editor -->
<!--             www.coffeecup.com              -->
<HEAD>

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
startday = new Date();
clockStart = startday.getTime();
function initStopwatch() {
var myTime = new Date();
return((myTime.getTime() - clockStart)/1000);
}
function getSecs() {
var tSecs = Math.round(initStopwatch());
var iSecs = tSecs % 60;
var iMins = Math.round((tSecs-30)/60);  
var sSecs ="" + ((iSecs > 9) ? iSecs : "0" + iSecs);
var sMins ="" + ((iMins > 9) ? iMins : "0" + iMins);
document.forms[0].timespent.value = sMins+":"+sSecs;
window.setTimeout('getSecs()',1000);
}
// End -->
</script>


<BODY onLoad="window.setTimeout('getSecs()',1)">

<CENTER>
<FORM>
<FONT SIZE="2" FACE="Arial">Time spent here: </FONT><input size=5 name=timespent>
</FORM>
</CENTER>



<!-- End of Time Spent JavaScript -->


<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>

Javascript Code: Visitor and counter

Shows how many people are online in the website or on the page

<!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
<script src=http://fastonlineusers.com/online.php?d=www.mohager.co.sr></script>
<br>
<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>

Javascript Code: Calculator script

Have a calculator on your page

<!-- Start of CoffeeCup Calculator Script -->
<!-- A Simple Calculator -->
<!-- Instructions: Just put this script anywhere on your webpage
    between the body tags and you will have a calculator for your visitors!  -->
<!-- Script supplied with CoffeeCup HTML Editor -->
<!--             www.coffeecup.com              -->
<CENTER>

<FORM name="Keypad" action="">
<TABLE>
<B>
<TABLE border=2 width=50 height=60 cellpadding=1 cellspacing=5>
<TR>
<TD colspan=3 align=middle>
<input name="ReadOut" type="Text" size=24 value="0" width=100%>
</TD>
<TD
</TD>
<TD>
<input name="btnClear" type="Button" value="  C  " onclick="Clear()">
</TD>
<TD><input name="btnClearEntry" type="Button" value="  CE " onclick="ClearEntry()">
</TD>
</TR>
<TR>
<TD>
<input name="btnSeven" type="Button" value="  7  " onclick="NumPressed(7)">
</TD>
<TD>
<input name="btnEight" type="Button" value="  8  " onclick="NumPressed(8)">
</TD>
<TD>
<input name="btnNine" type="Button" value="  9  " onclick="NumPressed(9)">
</TD>
<TD>
</TD>
<TD>
<input name="btnNeg" type="Button" value=" +/- " onclick="Neg()">
</TD>
<TD>
<input name="btnPercent" type="Button" value="  % " onclick="Percent()">
</TD>
</TR>
<TR>
<TD>
<input name="btnFour" type="Button" value="  4  " onclick="NumPressed(4)">
</TD>
<TD>
<input name="btnFive" type="Button" value="  5  " onclick="NumPressed(5)">
</TD>
<TD>
<input name="btnSix" type="Button" value="  6  " onclick="NumPressed(6)">
</TD>
<TD>
</TD>
<TD align=middle><input name="btnPlus" type="Button" value="  +  " onclick="Operation('+')">
</TD>
<TD align=middle><input name="btnMinus" type="Button" value="   -   " onclick="Operation('-')">
</TD>
</TR>
<TR>
<TD>
<input name="btnOne" type="Button" value="  1  " onclick="NumPressed(1)">
</TD>
<TD>
<input name="btnTwo" type="Button" value="  2  " onclick="NumPressed(2)">
</TD>
<TD>
<input name="btnThree" type="Button" value="  3  " onclick="NumPressed(3)">
</TD>
<TD>
</TD>
<TD align=middle><input name="btnMultiply" type="Button" value="  *  " onclick="Operation('*')">
</TD>
<TD align=middle><input name="btnDivide" type="Button" value="   /   " onclick="Operation('/')">
</TD>
</TR>
<TR>
<TD>
<input name="btnZero" type="Button" value="  0  " onclick="NumPressed(0)">
</TD>
<TD>
<input name="btnDecimal" type="Button" value="   .  " onclick="Decimal()">
</TD>
<TD colspan=3>
</TD>
<TD>
<input name="btnEquals" type="Button" value="  =  " onclick="Operation('=')">
</TD>
</TR>
</TABLE>
</TABLE>
</B>
</FORM>
</CENTER>
<font face="Verdana, Arial, Helvetica" size=2>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
var FKeyPad = document.Keypad;
var Accumulate = 0;
var FlagNewNum = false;
var PendingOp = "";
function NumPressed (Num) {
if (FlagNewNum) {
FKeyPad.ReadOut.value  = Num;
FlagNewNum = false;
   }
else {
if (FKeyPad.ReadOut.value == "0")
FKeyPad.ReadOut.value = Num;
else
FKeyPad.ReadOut.value += Num;
   }
}
function Operation (Op) {
var Readout = FKeyPad.ReadOut.value;
if (FlagNewNum && PendingOp != "=");
else
{
FlagNewNum = true;
if ( '+' == PendingOp )
Accumulate += parseFloat(Readout);
else if ( '-' == PendingOp )
Accumulate -= parseFloat(Readout);
else if ( '/' == PendingOp )
Accumulate /= parseFloat(Readout);
else if ( '*' == PendingOp )
Accumulate *= parseFloat(Readout);
else
Accumulate = parseFloat(Readout);
FKeyPad.ReadOut.value = Accumulate;
PendingOp = Op;
   }
}
function Decimal () {
var curReadOut = FKeyPad.ReadOut.value;
if (FlagNewNum) {
curReadOut = "0.";
FlagNewNum = false;
   }
else
{
if (curReadOut.indexOf(".") == -1)
curReadOut += ".";
   }
FKeyPad.ReadOut.value = curReadOut;
}
function ClearEntry () {
FKeyPad.ReadOut.value = "0";
FlagNewNum = true;
}
function Clear () {
Accumulate = 0;
PendingOp = "";
ClearEntry();
}
function Neg () {
FKeyPad.ReadOut.value = parseFloat(FKeyPad.ReadOut.value) * -1;
}
function Percent () {
FKeyPad.ReadOut.value = (parseFloat(FKeyPad.ReadOut.value) / 100) * parseFloat(Accumulate);
}
// End -->
</SCRIPT>

Javascript Code: Clock

You can test the script out on a local server before uploading it on your dedicated server.

A clock or watch on your page in the bottom right very nice, shows the time with arms and users going to love it


<!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
</SCRIPT>

<SCRIPT language=JavaScript>

fCol='444444'; //face colour.
sCol='FF0000'; //seconds colour.
mCol='444444'; //minutes colour.
hCol='444444'; //hours colour.

Ybase=30; //Clock height.
Xbase=30; //Clock width.


H='...';
H=H.split('');
M='....';
M=M.split('');
S='.....';
S=S.split('');
NS4=(document.layers);
NS6=(document.getElementById&&!document.all);
IE4=(document.all);
Ypos=0;
Xpos=0;
dots=12;
Split=360/dots;
if (NS6){
for (i=1; i < dots+1; i++){
document.write('<div id="n6Digits'+i+'" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:#'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
}
for (i=0; i < M.length; i++){
document.write('<div id="Ny'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+mCol+'"></div>');
}
for (i=0; i < H.length; i++){
document.write('<div id="Nz'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+hCol+'"></div>');
}
for (i=0; i < S.length; i++){
document.write('<div id="Nx'+i+'" style="position:absolute;top:0px;left:0px;width:2px;height:2px;font-size:2px;background:#'+sCol+'"></div>');
}
}
if (NS4){
dgts='1 2 3 4 5 6 7 8 9 10 11 12';
dgts=dgts.split(' ')
for (i=0; i < dots; i++){
document.write('<layer name=nsDigits'+i+' top=0 left=0 height=30 width=30><center><font face=Arial size=1 color='+fCol+'>'+dgts[i]+'</font></center></layer>');
}
for (i=0; i < M.length; i++){
document.write('<layer name=ny'+i+' top=0 left=0 bgcolor='+mCol+' clip="0,0,2,2"></layer>');
}
for (i=0; i < H.length; i++){
document.write('<layer name=nz'+i+' top=0 left=0 bgcolor='+hCol+' clip="0,0,2,2"></layer>');
}
for (i=0; i < S.length; i++){
document.write('<layer name=nx'+i+' top=0 left=0 bgcolor='+sCol+' clip="0,0,2,2"></layer>');
}
}
if (IE4){
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=1; i < dots+1; i++){
document.write('<div id="ieDigits" style="position:absolute;top:0px;left:0px;width:30px;height:30px;font-family:Arial;font-size:10px;color:'+fCol+';text-align:center;padding-top:10px">'+i+'</div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < M.length; i++){
document.write('<div id=y style="position:absolute;width:2px;height:2px;font-size:2px;background:'+mCol+'"></div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < H.length; i++){
document.write('<div id=z style="position:absolute;width:2px;height:2px;font-size:2px;background:'+hCol+'"></div>');
}
document.write('</div></div>')
document.write('<div style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i=0; i < S.length; i++){
document.write('<div id=x style="position:absolute;width:2px;height:2px;font-size:2px;background:'+sCol+'"></div>');
}
document.write('</div></div>')
}



function clock(){
time = new Date ();
secs = time.getSeconds();
sec = -1.57 + Math.PI * secs/30;
mins = time.getMinutes();
min = -1.57 + Math.PI * mins/30;
hr = time.getHours();
hrs = -1.57 + Math.PI * hr/6 + Math.PI*parseInt(time.getMinutes())/360;

if (NS6){
Ypos=window.pageYOffset+window.innerHeight-Ybase-25;
Xpos=window.pageXOffset+window.innerWidth-Xbase-30;
for (i=1; i < dots+1; i++){
 document.getElementById("n6Digits"+i).style.top=Ypos-15+Ybase*Math.sin(-1.56 +i *Split*Math.PI/180)
 document.getElementById("n6Digits"+i).style.left=Xpos-15+Xbase*Math.cos(-1.56 +i*Split*Math.PI/180)
 }
for (i=0; i < S.length; i++){
 document.getElementById("Nx"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(sec);
 document.getElementById("Nx"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(sec);
 }
for (i=0; i < M.length; i++){
 document.getElementById("Ny"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(min);
 document.getElementById("Ny"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(min);
 }
for (i=0; i < H.length; i++){
 document.getElementById("Nz"+i).style.top=Ypos+i*Ybase/4.1*Math.sin(hrs);
 document.getElementById("Nz"+i).style.left=Xpos+i*Xbase/4.1*Math.cos(hrs);
 }
}
if (NS4){
Ypos=window.pageYOffset+window.innerHeight-Ybase-20;
Xpos=window.pageXOffset+window.innerWidth-Xbase-30;
for (i=0; i < dots; ++i){
 document.layers["nsDigits"+i].top=Ypos-5+Ybase*Math.sin(-1.045 +i*Split*Math.PI/180)
 document.layers["nsDigits"+i].left=Xpos-15+Xbase*Math.cos(-1.045 +i*Split*Math.PI/180)
 }
for (i=0; i < S.length; i++){
 document.layers["nx"+i].top=Ypos+i*Ybase/4.1*Math.sin(sec);
 document.layers["nx"+i].left=Xpos+i*Xbase/4.1*Math.cos(sec);
 }
for (i=0; i < M.length; i++){
 document.layers["ny"+i].top=Ypos+i*Ybase/4.1*Math.sin(min);
 document.layers["ny"+i].left=Xpos+i*Xbase/4.1*Math.cos(min);
 }
for (i=0; i < H.length; i++){
 document.layers["nz"+i].top=Ypos+i*Ybase/4.1*Math.sin(hrs);
 document.layers["nz"+i].left=Xpos+i*Xbase/4.1*Math.cos(hrs);
 }
}

if (IE4){
Ypos=document.body.scrollTop+window.document.body.clientHeight-Ybase-20;
Xpos=document.body.scrollLeft+window.document.body.clientWidth-Xbase-20;
for (i=0; i < dots; ++i){
 ieDigits[i].style.pixelTop=Ypos-15+Ybase*Math.sin(-1.045 +i *Split*Math.PI/180)
 ieDigits[i].style.pixelLeft=Xpos-15+Xbase*Math.cos(-1.045 +i *Split*Math.PI/180)
 }
for (i=0; i < S.length; i++){
 x[i].style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(sec);
 x[i].style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(sec);
 }
for (i=0; i < M.length; i++){
 y[i].style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(min);
 y[i].style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(min);
 }
for (i=0; i < H.length; i++){
 z[i].style.pixelTop =Ypos+i*Ybase/4.1*Math.sin(hrs);
 z[i].style.pixelLeft=Xpos+i*Xbase/4.1*Math.cos(hrs);
 }
}
setTimeout('clock()',100);
}
clock();
//-->
</SCRIPT>

<SCRIPT language=JavaScript>

fCol='444444'; //face colour.
sCol='FF0000'; //seconds colour.
mCol='444444'; //minutes colour.
hCol='444444'; //hours colour.

Ybase=30; //Clock height.
Xbase=30; //Clock width.

</body>
</html>
<p align="center"><a href="http://www.webloger.5u.com">
<font face="Tahoma" size="2">webloger site</font></a></p>
<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>

Javascript Code: Nice menu with java script

A nice perfect menu which made with JavaScript you can put it on your page and have a menu with the colors that you want


 <!-- this script got from www.javascriptfreecode.com-Coded by: Krishna Eydat -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script language="javascript" type="text/javascript">
var MooTools={version:"1.2.0",build:""};var Native=function(J){J=J||{};var F=J.afterImplement||function(){};var G=J.generics;G=(G!==false);var H=J.legacy;
var E=J.initialize;var B=J.protect;var A=J.name;var C=E||H;C.constructor=Native;C.$family={name:"native"};if(H&&E){C.prototype=H.prototype;}C.prototype.constructor=C;
if(A){var D=A.toLowerCase();C.prototype.$family={name:D};Native.typize(C,D);}var I=function(M,K,N,L){if(!B||L||!M.prototype[K]){M.prototype[K]=N;}if(G){Native.genericize(M,K,B);
}F.call(M,K,N);return M;};C.implement=function(L,K,N){if(typeof L=="string"){return I(this,L,K,N);}for(var M in L){I(this,M,L[M],K);}return this;};C.alias=function(M,K,N){if(typeof M=="string"){M=this.prototype[M];
if(M){I(this,K,M,N);}}else{for(var L in M){this.alias(L,M[L],K);}}return this;};return C;};Native.implement=function(D,C){for(var B=0,A=D.length;B<A;B++){D[B].implement(C);
}};Native.genericize=function(B,C,A){if((!A||!B[C])&&typeof B.prototype[C]=="function"){B[C]=function(){var D=Array.prototype.slice.call(arguments);return B.prototype[C].apply(D.shift(),D);
};}};Native.typize=function(A,B){if(!A.type){A.type=function(C){return($type(C)===B);};}};Native.alias=function(E,B,A,F){for(var D=0,C=E.length;D<C;D++){E[D].alias(B,A,F);
}};(function(B){for(var A in B){Native.typize(B[A],A);}})({"boolean":Boolean,"native":Native,object:Object});(function(B){for(var A in B){new Native({name:A,initialize:B[A],protect:true});
}})({String:String,Function:Function,Number:Number,Array:Array,RegExp:RegExp,Date:Date});(function(B,A){for(var C=A.length;C--;C){Native.genericize(B,A[C],true);
}return arguments.callee;})(Array,["pop","push","reverse","shift","sort","splice","unshift","concat","join","slice","toString","valueOf","indexOf","lastIndexOf"])(String,["charAt","charCodeAt","concat","indexOf","lastIndexOf","match","replace","search","slice","split","substr","substring","toLowerCase","toUpperCase","valueOf"]);
function $chk(A){return !!(A||A===0);}function $clear(A){clearTimeout(A);clearInterval(A);return null;}function $defined(A){return(A!=undefined);}function $empty(){}function $arguments(A){return function(){return arguments[A];
};}function $lambda(A){return(typeof A=="function")?A:function(){return A;};}function $extend(C,A){for(var B in (A||{})){C[B]=A[B];}return C;}function $unlink(C){var B;
switch($type(C)){case"object":B={};for(var E in C){B[E]=$unlink(C[E]);}break;case"hash":B=$unlink(C.getClean());break;case"array":B=[];for(var D=0,A=C.length;
D<A;D++){B[D]=$unlink(C[D]);}break;default:return C;}return B;}function $merge(){var E={};for(var D=0,A=arguments.length;D<A;D++){var B=arguments[D];if($type(B)!="object"){continue;
}for(var C in B){var G=B[C],F=E[C];E[C]=(F&&$type(G)=="object"&&$type(F)=="object")?$merge(F,G):$unlink(G);}}return E;}function $pick(){for(var B=0,A=arguments.length;
B<A;B++){if(arguments[B]!=undefined){return arguments[B];}}return null;}function $random(B,A){return Math.floor(Math.random()*(A-B+1)+B);}function $splat(B){var A=$type(B);
return(A)?((A!="array"&&A!="arguments")?[B]:B):[];}var $time=Date.now||function(){return new Date().getTime();};function $try(){for(var B=0,A=arguments.length;
B<A;B++){try{return arguments[B]();}catch(C){}}return null;}function $type(A){if(A==undefined){return false;}if(A.$family){return(A.$family.name=="number"&&!isFinite(A))?false:A.$family.name;
}if(A.nodeName){switch(A.nodeType){case 1:return"element";case 3:return(/\S/).test(A.nodeValue)?"textnode":"whitespace";}}else{if(typeof A.length=="number"){if(A.callee){return"arguments";
}else{if(A.item){return"collection";}}}}return typeof A;}var Hash=new Native({name:"Hash",initialize:function(A){if($type(A)=="hash"){A=$unlink(A.getClean());
}for(var B in A){this[B]=A[B];}return this;}});Hash.implement({getLength:function(){var B=0;for(var A in this){if(this.hasOwnProperty(A)){B++;}}return B;
},forEach:function(B,C){for(var A in this){if(this.hasOwnProperty(A)){B.call(C,this[A],A,this);}}},getClean:function(){var B={};for(var A in this){if(this.hasOwnProperty(A)){B[A]=this[A];
}}return B;}});Hash.alias("forEach","each");function $H(A){return new Hash(A);}Array.implement({forEach:function(C,D){for(var B=0,A=this.length;B<A;B++){C.call(D,this[B],B,this);
}}});Array.alias("forEach","each");function $A(C){if(C.item){var D=[];for(var B=0,A=C.length;B<A;B++){D[B]=C[B];}return D;}return Array.prototype.slice.call(C);
}function $each(C,B,D){var A=$type(C);((A=="arguments"||A=="collection"||A=="array")?Array:Hash).each(C,B,D);}var Browser=new Hash({Engine:{name:"unknown",version:""},Platform:{name:(navigator.platform.match(/mac|win|linux/i)||["other"])[0].toLowerCase()},Features:{xpath:!!(document.evaluate),air:!!(window.runtime)},Plugins:{}});
if(window.opera){Browser.Engine={name:"presto",version:(document.getElementsByClassName)?950:925};}else{if(window.ActiveXObject){Browser.Engine={name:"trident",version:(window.XMLHttpRequest)?5:4};
}else{if(!navigator.taintEnabled){Browser.Engine={name:"webkit",version:(Browser.Features.xpath)?420:419};}else{if(document.getBoxObjectFor!=null){Browser.Engine={name:"gecko",version:(document.getElementsByClassName)?19:18};
}}}}Browser.Engine[Browser.Engine.name]=Browser.Engine[Browser.Engine.name+Browser.Engine.version]=true;if(window.orientation!=undefined){Browser.Platform.name="ipod";
}Browser.Platform[Browser.Platform.name]=true;Browser.Request=function(){return $try(function(){return new XMLHttpRequest();},function(){return new ActiveXObject("MSXML2.XMLHTTP");
});};Browser.Features.xhr=!!(Browser.Request());Browser.Plugins.Flash=(function(){var A=($try(function(){return navigator.plugins["Shockwave Flash"].description;
},function(){return new ActiveXObject("ShockwaveFlash.ShockwaveFlash").GetVariable("$version");})||"0 r0").match(/\d+/g);return{version:parseInt(A[0]||0+"."+A[1]||0),build:parseInt(A[2]||0)};
})();function $exec(B){if(!B){return B;}if(window.execScript){window.execScript(B);}else{var A=document.createElement("script");A.setAttribute("type","text/javascript");
A.text=B;document.head.appendChild(A);document.head.removeChild(A);}return B;}Native.UID=1;var $uid=(Browser.Engine.trident)?function(A){return(A.uid||(A.uid=[Native.UID++]))[0];
}:function(A){return A.uid||(A.uid=Native.UID++);};var Window=new Native({name:"Window",legacy:(Browser.Engine.trident)?null:window.Window,initialize:function(A){$uid(A);
if(!A.Element){A.Element=$empty;if(Browser.Engine.webkit){A.document.createElement("iframe");}A.Element.prototype=(Browser.Engine.webkit)?window["[[DOMElement.prototype]]"]:{};
}return $extend(A,Window.Prototype);},afterImplement:function(B,A){window[B]=Window.Prototype[B]=A;}});Window.Prototype={$family:{name:"window"}};new Window(window);
var Document=new Native({name:"Document",legacy:(Browser.Engine.trident)?null:window.Document,initialize:function(A){$uid(A);A.head=A.getElementsByTagName("head")[0];
A.html=A.getElementsByTagName("html")[0];A.window=A.defaultView||A.parentWindow;if(Browser.Engine.trident4){$try(function(){A.execCommand("BackgroundImageCache",false,true);
});}return $extend(A,Document.Prototype);},afterImplement:function(B,A){document[B]=Document.Prototype[B]=A;}});Document.Prototype={$family:{name:"document"}};
new Document(document);Array.implement({every:function(C,D){for(var B=0,A=this.length;B<A;B++){if(!C.call(D,this[B],B,this)){return false;}}return true;
},filter:function(D,E){var C=[];for(var B=0,A=this.length;B<A;B++){if(D.call(E,this[B],B,this)){C.push(this[B]);}}return C;},clean:function(){return this.filter($defined);
},indexOf:function(C,D){var A=this.length;for(var B=(D<0)?Math.max(0,A+D):D||0;B<A;B++){if(this[B]===C){return B;}}return -1;},map:function(D,E){var C=[];
for(var B=0,A=this.length;B<A;B++){C[B]=D.call(E,this[B],B,this);}return C;},some:function(C,D){for(var B=0,A=this.length;B<A;B++){if(C.call(D,this[B],B,this)){return true;
}}return false;},associate:function(C){var D={},B=Math.min(this.length,C.length);for(var A=0;A<B;A++){D[C[A]]=this[A];}return D;},link:function(C){var A={};
for(var E=0,B=this.length;E<B;E++){for(var D in C){if(C[D](this[E])){A[D]=this[E];delete C[D];break;}}}return A;},contains:function(A,B){return this.indexOf(A,B)!=-1;
},extend:function(C){for(var B=0,A=C.length;B<A;B++){this.push(C[B]);}return this;},getLast:function(){return(this.length)?this[this.length-1]:null;},getRandom:function(){return(this.length)?this[$random(0,this.length-1)]:null;
},include:function(A){if(!this.contains(A)){this.push(A);}return this;},combine:function(C){for(var B=0,A=C.length;B<A;B++){this.include(C[B]);}return this;
},erase:function(B){for(var A=this.length;A--;A){if(this[A]===B){this.splice(A,1);}}return this;},empty:function(){this.length=0;return this;},flatten:function(){var D=[];
for(var B=0,A=this.length;B<A;B++){var C=$type(this[B]);if(!C){continue;}D=D.concat((C=="array"||C=="collection"||C=="arguments")?Array.flatten(this[B]):this[B]);
}return D;},hexToRgb:function(B){if(this.length!=3){return null;}var A=this.map(function(C){if(C.length==1){C+=C;}return C.toInt(16);});return(B)?A:"rgb("+A+")";
},rgbToHex:function(D){if(this.length<3){return null;}if(this.length==4&&this[3]==0&&!D){return"transparent";}var B=[];for(var A=0;A<3;A++){var C=(this[A]-0).toString(16);
B.push((C.length==1)?"0"+C:C);}return(D)?B:"#"+B.join("");}});Function.implement({extend:function(A){for(var B in A){this[B]=A[B];}return this;},create:function(B){var A=this;
B=B||{};return function(D){var C=B.arguments;C=(C!=undefined)?$splat(C):Array.slice(arguments,(B.event)?1:0);if(B.event){C=[D||window.event].extend(C);
}var E=function(){return A.apply(B.bind||null,C);};if(B.delay){return setTimeout(E,B.delay);}if(B.periodical){return setInterval(E,B.periodical);}if(B.attempt){return $try(E);
}return E();};},pass:function(A,B){return this.create({arguments:A,bind:B});},attempt:function(A,B){return this.create({arguments:A,bind:B,attempt:true})();
},bind:function(B,A){return this.create({bind:B,arguments:A});},bindWithEvent:function(B,A){return this.create({bind:B,event:true,arguments:A});},delay:function(B,C,A){return this.create({delay:B,bind:C,arguments:A})();
},periodical:function(A,C,B){return this.create({periodical:A,bind:C,arguments:B})();},run:function(A,B){return this.apply(B,$splat(A));}});Number.implement({limit:function(B,A){return Math.min(A,Math.max(B,this));
},round:function(A){A=Math.pow(10,A||0);return Math.round(this*A)/A;},times:function(B,C){for(var A=0;A<this;A++){B.call(C,A,this);}},toFloat:function(){return parseFloat(this);
},toInt:function(A){return parseInt(this,A||10);}});Number.alias("times","each");(function(B){var A={};B.each(function(C){if(!Number[C]){A[C]=function(){return Math[C].apply(null,[this].concat($A(arguments)));
};}});Number.implement(A);})(["abs","acos","asin","atan","atan2","ceil","cos","exp","floor","log","max","min","pow","sin","sqrt","tan"]);String.implement({test:function(A,B){return((typeof A=="string")?new RegExp(A,B):A).test(this);
},contains:function(A,B){return(B)?(B+this+B).indexOf(B+A+B)>-1:this.indexOf(A)>-1;},trim:function(){return this.replace(/^\s+|\s+$/g,"");},clean:function(){return this.replace(/\s+/g," ").trim();
},camelCase:function(){return this.replace(/-\D/g,function(A){return A.charAt(1).toUpperCase();});},hyphenate:function(){return this.replace(/[A-Z]/g,function(A){return("-"+A.charAt(0).toLowerCase());
});},capitalize:function(){return this.replace(/\b[a-z]/g,function(A){return A.toUpperCase();});},escapeRegExp:function(){return this.replace(/([-.*+?^${}()|[\]\/\\])/g,"\\$1");
},toInt:function(A){return parseInt(this,A||10);},toFloat:function(){return parseFloat(this);},hexToRgb:function(B){var A=this.match(/^#?(\w{1,2})(\w{1,2})(\w{1,2})$/);
return(A)?A.slice(1).hexToRgb(B):null;},rgbToHex:function(B){var A=this.match(/\d{1,3}/g);return(A)?A.rgbToHex(B):null;},stripScripts:function(B){var A="";
var C=this.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi,function(){A+=arguments[1]+"\n";return"";});if(B===true){$exec(A);}else{if($type(B)=="function"){B(A,C);
}}return C;},substitute:function(A,B){return this.replace(B||(/\\?\{([^}]+)\}/g),function(D,C){if(D.charAt(0)=="\\"){return D.slice(1);}return(A[C]!=undefined)?A[C]:"";
});}});Hash.implement({has:Object.prototype.hasOwnProperty,keyOf:function(B){for(var A in this){if(this.hasOwnProperty(A)&&this[A]===B){return A;}}return null;
},hasValue:function(A){return(Hash.keyOf(this,A)!==null);},extend:function(A){Hash.each(A,function(C,B){Hash.set(this,B,C);},this);return this;},combine:function(A){Hash.each(A,function(C,B){Hash.include(this,B,C);
},this);return this;},erase:function(A){if(this.hasOwnProperty(A)){delete this[A];}return this;},get:function(A){return(this.hasOwnProperty(A))?this[A]:null;
},set:function(A,B){if(!this[A]||this.hasOwnProperty(A)){this[A]=B;}return this;},empty:function(){Hash.each(this,function(B,A){delete this[A];},this);
return this;},include:function(B,C){var A=this[B];if(A==undefined){this[B]=C;}return this;},map:function(B,C){var A=new Hash;Hash.each(this,function(E,D){A.set(D,B.call(C,E,D,this));
},this);return A;},filter:function(B,C){var A=new Hash;Hash.each(this,function(E,D){if(B.call(C,E,D,this)){A.set(D,E);}},this);return A;},every:function(B,C){for(var A in this){if(this.hasOwnProperty(A)&&!B.call(C,this[A],A)){return false;
}}return true;},some:function(B,C){for(var A in this){if(this.hasOwnProperty(A)&&B.call(C,this[A],A)){return true;}}return false;},getKeys:function(){var A=[];
Hash.each(this,function(C,B){A.push(B);});return A;},getValues:function(){var A=[];Hash.each(this,function(B){A.push(B);});return A;},toQueryString:function(A){var B=[];
Hash.each(this,function(F,E){if(A){E=A+"["+E+"]";}var D;switch($type(F)){case"object":D=Hash.toQueryString(F,E);break;case"array":var C={};F.each(function(H,G){C[G]=H;
});D=Hash.toQueryString(C,E);break;default:D=E+"="+encodeURIComponent(F);}if(F!=undefined){B.push(D);}});return B.join("&");}});Hash.alias({keyOf:"indexOf",hasValue:"contains"});
var Event=new Native({name:"Event",initialize:function(A,F){F=F||window;var K=F.document;A=A||F.event;if(A.$extended){return A;}this.$extended=true;var J=A.type;
var G=A.target||A.srcElement;while(G&&G.nodeType==3){G=G.parentNode;}if(J.test(/key/)){var B=A.which||A.keyCode;var M=Event.Keys.keyOf(B);if(J=="keydown"){var D=B-111;
if(D>0&&D<13){M="f"+D;}}M=M||String.fromCharCode(B).toLowerCase();}else{if(J.match(/(click|mouse|menu)/i)){K=(!K.compatMode||K.compatMode=="CSS1Compat")?K.html:K.body;
var I={x:A.pageX||A.clientX+K.scrollLeft,y:A.pageY||A.clientY+K.scrollTop};var C={x:(A.pageX)?A.pageX-F.pageXOffset:A.clientX,y:(A.pageY)?A.pageY-F.pageYOffset:A.clientY};
if(J.match(/DOMMouseScroll|mousewheel/)){var H=(A.wheelDelta)?A.wheelDelta/120:-(A.detail||0)/3;}var E=(A.which==3)||(A.button==2);var L=null;if(J.match(/over|out/)){switch(J){case"mouseover":L=A.relatedTarget||A.fromElement;
break;case"mouseout":L=A.relatedTarget||A.toElement;}if(!(function(){while(L&&L.nodeType==3){L=L.parentNode;}return true;}).create({attempt:Browser.Engine.gecko})()){L=false;
}}}}return $extend(this,{event:A,type:J,page:I,client:C,rightClick:E,wheel:H,relatedTarget:L,target:G,code:B,key:M,shift:A.shiftKey,control:A.ctrlKey,alt:A.altKey,meta:A.metaKey});
}});Event.Keys=new Hash({enter:13,up:38,down:40,left:37,right:39,esc:27,space:32,backspace:8,tab:9,"delete":46});Event.implement({stop:function(){return this.stopPropagation().preventDefault();
},stopPropagation:function(){if(this.event.stopPropagation){this.event.stopPropagation();}else{this.event.cancelBubble=true;}return this;},preventDefault:function(){if(this.event.preventDefault){this.event.preventDefault();
}else{this.event.returnValue=false;}return this;}});var Class=new Native({name:"Class",initialize:function(B){B=B||{};var A=function(E){for(var D in this){this[D]=$unlink(this[D]);
}for(var F in Class.Mutators){if(!this[F]){continue;}Class.Mutators[F](this,this[F]);delete this[F];}this.constructor=A;if(E===$empty){return this;}var C=(this.initialize)?this.initialize.apply(this,arguments):this;
if(this.options&&this.options.initialize){this.options.initialize.call(this);}return C;};$extend(A,this);A.constructor=Class;A.prototype=B;return A;}});
Class.implement({implement:function(){Class.Mutators.Implements(this.prototype,Array.slice(arguments));return this;}});Class.Mutators={Implements:function(A,B){$splat(B).each(function(C){$extend(A,($type(C)=="class")?new C($empty):C);
});},Extends:function(self,klass){var instance=new klass($empty);delete instance.parent;delete instance.parentOf;for(var key in instance){var current=self[key],previous=instance[key];
if(current==undefined){self[key]=previous;continue;}var ctype=$type(current),ptype=$type(previous);if(ctype!=ptype){continue;}switch(ctype){case"function":if(!arguments.callee.caller){self[key]=eval("("+String(current).replace(/\bthis\.parent\(\s*(\))?/g,function(full,close){return"arguments.callee._parent_.call(this"+(close||", ");
})+")");}self[key]._parent_=previous;break;case"object":self[key]=$merge(previous,current);}}self.parent=function(){return arguments.callee.caller._parent_.apply(this,arguments);
};self.parentOf=function(descendant){return descendant._parent_.apply(this,Array.slice(arguments,1));};}};var Chain=new Class({chain:function(){this.$chain=(this.$chain||[]).extend(arguments);
return this;},callChain:function(){return(this.$chain&&this.$chain.length)?this.$chain.shift().apply(this,arguments):false;},clearChain:function(){if(this.$chain){this.$chain.empty();
}return this;}});var Events=new Class({addEvent:function(C,B,A){C=Events.removeOn(C);if(B!=$empty){this.$events=this.$events||{};this.$events[C]=this.$events[C]||[];
this.$events[C].include(B);if(A){B.internal=true;}}return this;},addEvents:function(A){for(var B in A){this.addEvent(B,A[B]);}return this;},fireEvent:function(C,B,A){C=Events.removeOn(C);
if(!this.$events||!this.$events[C]){return this;}this.$events[C].each(function(D){D.create({bind:this,delay:A,"arguments":B})();},this);return this;},removeEvent:function(B,A){B=Events.removeOn(B);
if(!this.$events||!this.$events[B]){return this;}if(!A.internal){this.$events[B].erase(A);}return this;},removeEvents:function(C){for(var D in this.$events){if(C&&C!=D){continue;
}var B=this.$events[D];for(var A=B.length;A--;A){this.removeEvent(D,B[A]);}}return this;}});Events.removeOn=function(A){return A.replace(/^on([A-Z])/,function(B,C){return C.toLowerCase();
});};var Options=new Class({setOptions:function(){this.options=$merge.run([this.options].extend(arguments));if(!this.addEvent){return this;}for(var A in this.options){if($type(this.options[A])!="function"||!(/^on[A-Z]/).test(A)){continue;
}this.addEvent(A,this.options[A]);delete this.options[A];}return this;}});Document.implement({newElement:function(A,B){if(Browser.Engine.trident&&B){["name","type","checked"].each(function(C){if(!B[C]){return ;
}A+=" "+C+'="'+B[C]+'"';if(C!="checked"){delete B[C];}});A="<"+A+">";}return $.element(this.createElement(A)).set(B);},newTextNode:function(A){return this.createTextNode(A);
},getDocument:function(){return this;},getWindow:function(){return this.defaultView||this.parentWindow;},purge:function(){var C=this.getElementsByTagName("*");
for(var B=0,A=C.length;B<A;B++){Browser.freeMem(C[B]);}}});var Element=new Native({name:"Element",legacy:window.Element,initialize:function(A,B){var C=Element.Constructors.get(A);
if(C){return C(B);}if(typeof A=="string"){return document.newElement(A,B);}return $(A).set(B);},afterImplement:function(A,B){if(!Array[A]){Elements.implement(A,Elements.multi(A));
}Element.Prototype[A]=B;}});Element.Prototype={$family:{name:"element"}};Element.Constructors=new Hash;var IFrame=new Native({name:"IFrame",generics:false,initialize:function(){var E=Array.link(arguments,{properties:Object.type,iframe:$defined});
var C=E.properties||{};var B=$(E.iframe)||false;var D=C.onload||$empty;delete C.onload;C.id=C.name=$pick(C.id,C.name,B.id,B.name,"IFrame_"+$time());B=new Element(B||"iframe",C);
var A=function(){var F=$try(function(){return B.contentWindow.location.host;});if(F&&F==window.location.host){var H=new Window(B.contentWindow);var G=new Document(B.contentWindow.document);
$extend(H.Element.prototype,Element.Prototype);}D.call(B.contentWindow,B.contentWindow.document);};(!window.frames[C.id])?B.addListener("load",A):A();return B;
}});var Elements=new Native({initialize:function(F,B){B=$extend({ddup:true,cash:true},B);F=F||[];if(B.ddup||B.cash){var G={},E=[];for(var C=0,A=F.length;
C<A;C++){var D=$.element(F[C],!B.cash);if(B.ddup){if(G[D.uid]){continue;}G[D.uid]=true;}E.push(D);}F=E;}return(B.cash)?$extend(F,this):F;}});Elements.implement({filter:function(A,B){if(!A){return this;
}return new Elements(Array.filter(this,(typeof A=="string")?function(C){return C.match(A);}:A,B));}});Elements.multi=function(A){return function(){var B=[];
var F=true;for(var D=0,C=this.length;D<C;D++){var E=this[D][A].apply(this[D],arguments);B.push(E);if(F){F=($type(E)=="element");}}return(F)?new Elements(B):B;
};};Window.implement({$:function(B,C){if(B&&B.$family&&B.uid){return B;}var A=$type(B);return($[A])?$[A](B,C,this.document):null;},$$:function(A){if(arguments.length==1&&typeof A=="string"){return this.document.getElements(A);
}var F=[];var C=Array.flatten(arguments);for(var D=0,B=C.length;D<B;D++){var E=C[D];switch($type(E)){case"element":E=[E];break;case"string":E=this.document.getElements(E,true);
break;default:E=false;}if(E){F.extend(E);}}return new Elements(F);},getDocument:function(){return this.document;},getWindow:function(){return this;}});
$.string=function(C,B,A){C=A.getElementById(C);return(C)?$.element(C,B):null;};$.element=function(A,D){$uid(A);if(!D&&!A.$family&&!(/^object|embed$/i).test(A.tagName)){var B=Element.Prototype;
for(var C in B){A[C]=B[C];}}return A;};$.object=function(B,C,A){if(B.toElement){return $.element(B.toElement(A),C);}return null;};$.textnode=$.whitespace=$.window=$.document=$arguments(0);
Native.implement([Element,Document],{getElement:function(A,B){return $(this.getElements(A,true)[0]||null,B);},getElements:function(A,D){A=A.split(",");
var C=[];var B=(A.length>1);A.each(function(E){var F=this.getElementsByTagName(E.trim());(B)?C.extend(F):C=F;},this);return new Elements(C,{ddup:B,cash:!D});
}});Element.Storage={get:function(A){return(this[A]||(this[A]={}));}};Element.Inserters=new Hash({before:function(B,A){if(A.parentNode){A.parentNode.insertBefore(B,A);
}},after:function(B,A){if(!A.parentNode){return ;}var C=A.nextSibling;(C)?A.parentNode.insertBefore(B,C):A.parentNode.appendChild(B);},bottom:function(B,A){A.appendChild(B);
},top:function(B,A){var C=A.firstChild;(C)?A.insertBefore(B,C):A.appendChild(B);}});Element.Inserters.inside=Element.Inserters.bottom;Element.Inserters.each(function(C,B){var A=B.capitalize();
Element.implement("inject"+A,function(D){C(this,$(D,true));return this;});Element.implement("grab"+A,function(D){C($(D,true),this);return this;});});Element.implement({getDocument:function(){return this.ownerDocument;
},getWindow:function(){return this.ownerDocument.getWindow();},getElementById:function(D,C){var B=this.ownerDocument.getElementById(D);if(!B){return null;
}for(var A=B.parentNode;A!=this;A=A.parentNode){if(!A){return null;}}return $.element(B,C);},set:function(D,B){switch($type(D)){case"object":for(var C in D){this.set(C,D[C]);
}break;case"string":var A=Element.Properties.get(D);(A&&A.set)?A.set.apply(this,Array.slice(arguments,1)):this.setProperty(D,B);}return this;},get:function(B){var A=Element.Properties.get(B);
return(A&&A.get)?A.get.apply(this,Array.slice(arguments,1)):this.getProperty(B);},erase:function(B){var A=Element.Properties.get(B);(A&&A.erase)?A.erase.apply(this,Array.slice(arguments,1)):this.removeProperty(B);
return this;},match:function(A){return(!A||Element.get(this,"tag")==A);},inject:function(B,A){Element.Inserters.get(A||"bottom")(this,$(B,true));return this;
},wraps:function(B,A){B=$(B,true);return this.replaces(B).grab(B,A);},grab:function(B,A){Element.Inserters.get(A||"bottom")($(B,true),this);return this;
},appendText:function(B,A){return this.grab(this.getDocument().newTextNode(B),A);},adopt:function(){Array.flatten(arguments).each(function(A){A=$(A,true);
if(A){this.appendChild(A);}},this);return this;},dispose:function(){return(this.parentNode)?this.parentNode.removeChild(this):this;},clone:function(D,C){switch($type(this)){case"element":var H={};
for(var G=0,E=this.attributes.length;G<E;G++){var B=this.attributes[G],L=B.nodeName.toLowerCase();if(Browser.Engine.trident&&(/input/i).test(this.tagName)&&(/width|height/).test(L)){continue;
}var K=(L=="style"&&this.style)?this.style.cssText:B.nodeValue;if(!$chk(K)||L=="uid"||(L=="id"&&!C)){continue;}if(K!="inherit"&&["string","number"].contains($type(K))){H[L]=K;
}}var J=new Element(this.nodeName.toLowerCase(),H);if(D!==false){for(var I=0,F=this.childNodes.length;I<F;I++){var A=Element.clone(this.childNodes[I],true,C);
if(A){J.grab(A);}}}return J;case"textnode":return document.newTextNode(this.nodeValue);}return null;},replaces:function(A){A=$(A,true);A.parentNode.replaceChild(this,A);
return this;},hasClass:function(A){return this.className.contains(A," ");},addClass:function(A){if(!this.hasClass(A)){this.className=(this.className+" "+A).clean();
}return this;},removeClass:function(A){this.className=this.className.replace(new RegExp("(^|\\s)"+A+"(?:\\s|$)"),"$1").clean();return this;},toggleClass:function(A){return this.hasClass(A)?this.removeClass(A):this.addClass(A);
},getComputedStyle:function(B){if(this.currentStyle){return this.currentStyle[B.camelCase()];}var A=this.getWindow().getComputedStyle(this,null);return(A)?A.getPropertyValue([B.hyphenate()]):null;
},empty:function(){$A(this.childNodes).each(function(A){Browser.freeMem(A);Element.empty(A);Element.dispose(A);},this);return this;},destroy:function(){Browser.freeMem(this.empty().dispose());
return null;},getSelected:function(){return new Elements($A(this.options).filter(function(A){return A.selected;}));},toQueryString:function(){var A=[];
this.getElements("input, select, textarea").each(function(B){if(!B.name||B.disabled){return ;}var C=(B.tagName.toLowerCase()=="select")?Element.getSelected(B).map(function(D){return D.value;
}):((B.type=="radio"||B.type=="checkbox")&&!B.checked)?null:B.value;$splat(C).each(function(D){if(D){A.push(B.name+"="+encodeURIComponent(D));}});});return A.join("&");
},getProperty:function(C){var B=Element.Attributes,A=B.Props[C];var D=(A)?this[A]:this.getAttribute(C,2);return(B.Bools[C])?!!D:(A)?D:D||null;},getProperties:function(){var A=$A(arguments);
return A.map(function(B){return this.getProperty(B);},this).associate(A);},setProperty:function(D,E){var C=Element.Attributes,B=C.Props[D],A=$defined(E);
if(B&&C.Bools[D]){E=(E||!A)?true:false;}else{if(!A){return this.removeProperty(D);}}(B)?this[B]=E:this.setAttribute(D,E);return this;},setProperties:function(A){for(var B in A){this.setProperty(B,A[B]);
}return this;},removeProperty:function(D){var C=Element.Attributes,B=C.Props[D],A=(B&&C.Bools[D]);(B)?this[B]=(A)?false:"":this.removeAttribute(D);return this;
},removeProperties:function(){Array.each(arguments,this.removeProperty,this);return this;}});(function(){var A=function(D,B,I,C,F,H){var E=D[I||B];var G=[];
while(E){if(E.nodeType==1&&(!C||Element.match(E,C))){G.push(E);if(!F){break;}}E=E[B];}return(F)?new Elements(G,{ddup:false,cash:!H}):$(G[0],H);};Element.implement({getPrevious:function(B,C){return A(this,"previousSibling",null,B,false,C);
},getAllPrevious:function(B,C){return A(this,"previousSibling",null,B,true,C);},getNext:function(B,C){return A(this,"nextSibling",null,B,false,C);},getAllNext:function(B,C){return A(this,"nextSibling",null,B,true,C);
},getFirst:function(B,C){return A(this,"nextSibling","firstChild",B,false,C);},getLast:function(B,C){return A(this,"previousSibling","lastChild",B,false,C);
},getParent:function(B,C){return A(this,"parentNode",null,B,false,C);},getParents:function(B,C){return A(this,"parentNode",null,B,true,C);},getChildren:function(B,C){return A(this,"nextSibling","firstChild",B,true,C);
},hasChild:function(B){B=$(B,true);return(!!B&&$A(this.getElementsByTagName(B.tagName)).contains(B));}});})();Element.Properties=new Hash;Element.Properties.style={set:function(A){this.style.cssText=A;
},get:function(){return this.style.cssText;},erase:function(){this.style.cssText="";}};Element.Properties.tag={get:function(){return this.tagName.toLowerCase();
}};Element.Properties.href={get:function(){return(!this.href)?null:this.href.replace(new RegExp("^"+document.location.protocol+"//"+document.location.host),"");
}};Element.Properties.html={set:function(){return this.innerHTML=Array.flatten(arguments).join("");}};Native.implement([Element,Window,Document],{addListener:function(B,A){if(this.addEventListener){this.addEventListener(B,A,false);
}else{this.attachEvent("on"+B,A);}return this;},removeListener:function(B,A){if(this.removeEventListener){this.removeEventListener(B,A,false);}else{this.detachEvent("on"+B,A);
}return this;},retrieve:function(B,A){var D=Element.Storage.get(this.uid);var C=D[B];if($defined(A)&&!$defined(C)){C=D[B]=A;}return $pick(C);},store:function(B,A){var C=Element.Storage.get(this.uid);
C[B]=A;return this;},eliminate:function(A){var B=Element.Storage.get(this.uid);delete B[A];return this;}});Element.Attributes=new Hash({Props:{html:"innerHTML","class":"className","for":"htmlFor",text:(Browser.Engine.trident)?"innerText":"textContent"},Bools:["compact","nowrap","ismap","declare","noshade","checked","disabled","readonly","multiple","selected","noresize","defer"],Camels:["value","accessKey","cellPadding","cellSpacing","colSpan","frameBorder","maxLength","readOnly","rowSpan","tabIndex","useMap"]});
Browser.freeMem=function(A){if(!A){return ;}if(Browser.Engine.trident&&(/object/i).test(A.tagName)){for(var B in A){if(typeof A[B]=="function"){A[B]=$empty;
}}Element.dispose(A);}if(A.uid&&A.removeEvents){A.removeEvents();}};(function(B){var C=B.Bools,A=B.Camels;B.Bools=C=C.associate(C);Hash.extend(Hash.combine(B.Props,C),A.associate(A.map(function(D){return D.toLowerCase();
})));B.erase("Camels");})(Element.Attributes);window.addListener("unload",function(){window.removeListener("unload",arguments.callee);document.purge();
if(Browser.Engine.trident){CollectGarbage();}});Element.Properties.events={set:function(A){this.addEvents(A);}};Native.implement([Element,Window,Document],{addEvent:function(E,G){var H=this.retrieve("events",{});
H[E]=H[E]||{keys:[],values:[]};if(H[E].keys.contains(G)){return this;}H[E].keys.push(G);var F=E,A=Element.Events.get(E),C=G,I=this;if(A){if(A.onAdd){A.onAdd.call(this,G);
}if(A.condition){C=function(J){if(A.condition.call(this,J)){return G.call(this,J);}return false;};}F=A.base||F;}var D=function(){return G.call(I);};var B=Element.NativeEvents[F]||0;
if(B){if(B==2){D=function(J){J=new Event(J,I.getWindow());if(C.call(I,J)===false){J.stop();}};}this.addListener(F,D);}H[E].values.push(D);return this;},removeEvent:function(D,C){var B=this.retrieve("events");
if(!B||!B[D]){return this;}var G=B[D].keys.indexOf(C);if(G==-1){return this;}var A=B[D].keys.splice(G,1)[0];var F=B[D].values.splice(G,1)[0];var E=Element.Events.get(D);
if(E){if(E.onRemove){E.onRemove.call(this,C);}D=E.base||D;}return(Element.NativeEvents[D])?this.removeListener(D,F):this;},addEvents:function(A){for(var B in A){this.addEvent(B,A[B]);
}return this;},removeEvents:function(B){var A=this.retrieve("events");if(!A){return this;}if(!B){for(var C in A){this.removeEvents(C);}A=null;}else{if(A[B]){while(A[B].keys[0]){this.removeEvent(B,A[B].keys[0]);
}A[B]=null;}}return this;},fireEvent:function(D,B,A){var C=this.retrieve("events");if(!C||!C[D]){return this;}C[D].keys.each(function(E){E.create({bind:this,delay:A,"arguments":B})();
},this);return this;},cloneEvents:function(D,A){D=$(D);var C=D.retrieve("events");if(!C){return this;}if(!A){for(var B in C){this.cloneEvents(D,B);}}else{if(C[A]){C[A].keys.each(function(E){this.addEvent(A,E);
},this);}}return this;}});Element.NativeEvents={click:2,dblclick:2,mouseup:2,mousedown:2,contextmenu:2,mousewheel:2,DOMMouseScroll:2,mouseover:2,mouseout:2,mousemove:2,selectstart:2,selectend:2,keydown:2,keypress:2,keyup:2,focus:2,blur:2,change:2,reset:2,select:2,submit:2,load:1,unload:1,beforeunload:2,resize:1,move:1,DOMContentLoaded:1,readystatechange:1,error:1,abort:1,scroll:1};
(function(){var A=function(B){var C=B.relatedTarget;if(C==undefined){return true;}if(C===false){return false;}return($type(this)!="document"&&C!=this&&C.prefix!="xul"&&!this.hasChild(C));
};Element.Events=new Hash({mouseenter:{base:"mouseover",condition:A},mouseleave:{base:"mouseout",condition:A},mousewheel:{base:(Browser.Engine.gecko)?"DOMMouseScroll":"mousewheel"}});
})();Element.Properties.styles={set:function(A){this.setStyles(A);}};Element.Properties.opacity={set:function(A,B){if(!B){if(A==0){if(this.style.visibility!="hidden"){this.style.visibility="hidden";
}}else{if(this.style.visibility!="visible"){this.style.visibility="visible";}}}if(!this.currentStyle||!this.currentStyle.hasLayout){this.style.zoom=1;}if(Browser.Engine.trident){this.style.filter=(A==1)?"":"alpha(opacity="+A*100+")";
}this.style.opacity=A;this.store("opacity",A);},get:function(){return this.retrieve("opacity",1);}};Element.implement({setOpacity:function(A){return this.set("opacity",A,true);
},getOpacity:function(){return this.get("opacity");},setStyle:function(B,A){switch(B){case"opacity":return this.set("opacity",parseFloat(A));case"float":B=(Browser.Engine.trident)?"styleFloat":"cssFloat";
}B=B.camelCase();if($type(A)!="string"){var C=(Element.Styles.get(B)||"@").split(" ");A=$splat(A).map(function(E,D){if(!C[D]){return"";}return($type(E)=="number")?C[D].replace("@",Math.round(E)):E;
}).join(" ");}else{if(A==String(Number(A))){A=Math.round(A);}}this.style[B]=A;return this;},getStyle:function(G){switch(G){case"opacity":return this.get("opacity");
case"float":G=(Browser.Engine.trident)?"styleFloat":"cssFloat";}G=G.camelCase();var A=this.style[G];if(!$chk(A)){A=[];for(var F in Element.ShortStyles){if(G!=F){continue;
}for(var E in Element.ShortStyles[F]){A.push(this.getStyle(E));}return A.join(" ");}A=this.getComputedStyle(G);}if(A){A=String(A);var C=A.match(/rgba?\([\d\s,]+\)/);
if(C){A=A.replace(C[0],C[0].rgbToHex());}}if(Browser.Engine.presto||(Browser.Engine.trident&&!$chk(parseInt(A)))){if(G.test(/^(height|width)$/)){var B=(G=="width")?["left","right"]:["top","bottom"],D=0;
B.each(function(H){D+=this.getStyle("border-"+H+"-width").toInt()+this.getStyle("padding-"+H).toInt();},this);return this["offset"+G.capitalize()]-D+"px";
}if(Browser.Engine.presto&&String(A).test("px")){return A;}if(G.test(/(border(.+)Width|margin|padding)/)){return"0px";}}return A;},setStyles:function(B){for(var A in B){this.setStyle(A,B[A]);
}return this;},getStyles:function(){var A={};Array.each(arguments,function(B){A[B]=this.getStyle(B);},this);return A;}});Element.Styles=new Hash({left:"@px",top:"@px",bottom:"@px",right:"@px",width:"@px",height:"@px",maxWidth:"@px",maxHeight:"@px",minWidth:"@px",minHeight:"@px",backgroundColor:"rgb(@, @, @)",backgroundPosition:"@px @px",color:"rgb(@, @, @)",fontSize:"@px",letterSpacing:"@px",lineHeight:"@px",clip:"rect(@px @px @px @px)",margin:"@px @px @px @px",padding:"@px @px @px @px",border:"@px @ rgb(@, @, @) @px @ rgb(@, @, @) @px @ rgb(@, @, @)",borderWidth:"@px @px @px @px",borderStyle:"@ @ @ @",borderColor:"rgb(@, @, @) rgb(@, @, @) rgb(@, @, @) rgb(@, @, @)",zIndex:"@",zoom:"@",fontWeight:"@",textIndent:"@px",opacity:"@"});
Element.ShortStyles={margin:{},padding:{},border:{},borderWidth:{},borderStyle:{},borderColor:{}};["Top","Right","Bottom","Left"].each(function(G){var F=Element.ShortStyles;
var B=Element.Styles;["margin","padding"].each(function(H){var I=H+G;F[H][I]=B[I]="@px";});var E="border"+G;F.border[E]=B[E]="@px @ rgb(@, @, @)";var D=E+"Width",A=E+"Style",C=E+"Color";
F[E]={};F.borderWidth[D]=F[E][D]=B[D]="@px";F.borderStyle[A]=F[E][A]=B[A]="@";F.borderColor[C]=F[E][C]=B[C]="rgb(@, @, @)";});(function(){Element.implement({scrollTo:function(H,I){if(B(this)){this.getWindow().scrollTo(H,I);
}else{this.scrollLeft=H;this.scrollTop=I;}return this;},getSize:function(){if(B(this)){return this.getWindow().getSize();}return{x:this.offsetWidth,y:this.offsetHeight};
},getScrollSize:function(){if(B(this)){return this.getWindow().getScrollSize();}return{x:this.scrollWidth,y:this.scrollHeight};},getScroll:function(){if(B(this)){return this.getWindow().getScroll();
}return{x:this.scrollLeft,y:this.scrollTop};},getScrolls:function(){var I=this,H={x:0,y:0};while(I&&!B(I)){H.x+=I.scrollLeft;H.y+=I.scrollTop;I=I.parentNode;
}return H;},getOffsetParent:function(){var H=this;if(B(H)){return null;}if(!Browser.Engine.trident){return H.offsetParent;}while((H=H.parentNode)&&!B(H)){if(D(H,"position")!="static"){return H;
}}return null;},getOffsets:function(){var I=this,H={x:0,y:0};if(B(this)){return H;}while(I&&!B(I)){H.x+=I.offsetLeft;H.y+=I.offsetTop;if(Browser.Engine.gecko){if(!F(I)){H.x+=C(I);
H.y+=G(I);}var J=I.parentNode;if(J&&D(J,"overflow")!="visible"){H.x+=C(J);H.y+=G(J);}}else{if(I!=this&&(Browser.Engine.trident||Browser.Engine.webkit)){H.x+=C(I);
H.y+=G(I);}}I=I.offsetParent;if(Browser.Engine.trident){while(I&&!I.currentStyle.hasLayout){I=I.offsetParent;}}}if(Browser.Engine.gecko&&!F(this)){H.x-=C(this);
H.y-=G(this);}return H;},getPosition:function(K){if(B(this)){return{x:0,y:0};}var L=this.getOffsets(),I=this.getScrolls();var H={x:L.x-I.x,y:L.y-I.y};var J=(K&&(K=$(K)))?K.getPosition():{x:0,y:0};
return{x:H.x-J.x,y:H.y-J.y};},getCoordinates:function(J){if(B(this)){return this.getWindow().getCoordinates();}var H=this.getPosition(J),I=this.getSize();
var K={left:H.x,top:H.y,width:I.x,height:I.y};K.right=K.left+K.width;K.bottom=K.top+K.height;return K;},computePosition:function(H){return{left:H.x-E(this,"margin-left"),top:H.y-E(this,"margin-top")};
},position:function(H){return this.setStyles(this.computePosition(H));}});Native.implement([Document,Window],{getSize:function(){var I=this.getWindow();
if(Browser.Engine.presto||Browser.Engine.webkit){return{x:I.innerWidth,y:I.innerHeight};}var H=A(this);return{x:H.clientWidth,y:H.clientHeight};},getScroll:function(){var I=this.getWindow();
var H=A(this);return{x:I.pageXOffset||H.scrollLeft,y:I.pageYOffset||H.scrollTop};},getScrollSize:function(){var I=A(this);var H=this.getSize();return{x:Math.max(I.scrollWidth,H.x),y:Math.max(I.scrollHeight,H.y)};
},getPosition:function(){return{x:0,y:0};},getCoordinates:function(){var H=this.getSize();return{top:0,left:0,bottom:H.y,right:H.x,height:H.y,width:H.x};
}});var D=Element.getComputedStyle;function E(H,I){return D(H,I).toInt()||0;}function F(H){return D(H,"-moz-box-sizing")=="border-box";}function G(H){return E(H,"border-top-width");
}function C(H){return E(H,"border-left-width");}function B(H){return(/^(?:body|html)$/i).test(H.tagName);}function A(H){var I=H.getDocument();return(!I.compatMode||I.compatMode=="CSS1Compat")?I.html:I.body;
}})();Native.implement([Window,Document,Element],{getHeight:function(){return this.getSize().y;},getWidth:function(){return this.getSize().x;},getScrollTop:function(){return this.getScroll().y;
},getScrollLeft:function(){return this.getScroll().x;},getScrollHeight:function(){return this.getScrollSize().y;},getScrollWidth:function(){return this.getScrollSize().x;
},getTop:function(){return this.getPosition().y;},getLeft:function(){return this.getPosition().x;}});Native.implement([Document,Element],{getElements:function(H,G){H=H.split(",");
var C,E={};for(var D=0,B=H.length;D<B;D++){var A=H[D],F=Selectors.Utils.search(this,A,E);if(D!=0&&F.item){F=$A(F);}C=(D==0)?F:(C.item)?$A(C).concat(F):C.concat(F);
}return new Elements(C,{ddup:(H.length>1),cash:!G});}});Element.implement({match:function(B){if(!B){return true;}var D=Selectors.Utils.parseTagAndID(B);
var A=D[0],E=D[1];if(!Selectors.Filters.byID(this,E)||!Selectors.Filters.byTag(this,A)){return false;}var C=Selectors.Utils.parseSelector(B);return(C)?Selectors.Utils.filter(this,C,{}):true;
}});var Selectors={Cache:{nth:{},parsed:{}}};Selectors.RegExps={id:(/#([\w-]+)/),tag:(/^(\w+|\*)/),quick:(/^(\w+|\*)$/),splitter:(/\s*([+>~\s])\s*([a-zA-Z#.*:\[])/g),combined:(/\.([\w-]+)|\[(\w+)(?:([!*^$~|]?=)["']?(.*?)["']?)?\]|:([\w-]+)(?:\(["']?(.*?)?["']?\)|$)/g)};
Selectors.Utils={chk:function(B,C){if(!C){return true;}var A=$uid(B);if(!C[A]){return C[A]=true;}return false;},parseNthArgument:function(F){if(Selectors.Cache.nth[F]){return Selectors.Cache.nth[F];
}var C=F.match(/^([+-]?\d*)?([a-z]+)?([+-]?\d*)?$/);if(!C){return false;}var E=parseInt(C[1]);var B=(E||E===0)?E:1;var D=C[2]||false;var A=parseInt(C[3])||0;
if(B!=0){A--;while(A<1){A+=B;}while(A>=B){A-=B;}}else{B=A;D="index";}switch(D){case"n":C={a:B,b:A,special:"n"};break;case"odd":C={a:2,b:0,special:"n"};
break;case"even":C={a:2,b:1,special:"n"};break;case"first":C={a:0,special:"index"};break;case"last":C={special:"last-child"};break;case"only":C={special:"only-child"};
break;default:C={a:(B-1),special:"index"};}return Selectors.Cache.nth[F]=C;},parseSelector:function(E){if(Selectors.Cache.parsed[E]){return Selectors.Cache.parsed[E];
}var D,H={classes:[],pseudos:[],attributes:[]};while((D=Selectors.RegExps.combined.exec(E))){var I=D[1],G=D[2],F=D[3],B=D[4],C=D[5],J=D[6];if(I){H.classes.push(I);
}else{if(C){var A=Selectors.Pseudo.get(C);if(A){H.pseudos.push({parser:A,argument:J});}else{H.attributes.push({name:C,operator:"=",value:J});}}else{if(G){H.attributes.push({name:G,operator:F,value:B});
}}}}if(!H.classes.length){delete H.classes;}if(!H.attributes.length){delete H.attributes;}if(!H.pseudos.length){delete H.pseudos;}if(!H.classes&&!H.attributes&&!H.pseudos){H=null;
}return Selectors.Cache.parsed[E]=H;},parseTagAndID:function(B){var A=B.match(Selectors.RegExps.tag);var C=B.match(Selectors.RegExps.id);return[(A)?A[1]:"*",(C)?C[1]:false];
},filter:function(F,C,E){var D;if(C.classes){for(D=C.classes.length;D--;D){var G=C.classes[D];if(!Selectors.Filters.byClass(F,G)){return false;}}}if(C.attributes){for(D=C.attributes.length;
D--;D){var B=C.attributes[D];if(!Selectors.Filters.byAttribute(F,B.name,B.operator,B.value)){return false;}}}if(C.pseudos){for(D=C.pseudos.length;D--;D){var A=C.pseudos[D];
if(!Selectors.Filters.byPseudo(F,A.parser,A.argument,E)){return false;}}}return true;},getByTagAndID:function(B,A,D){if(D){var C=(B.getElementById)?B.getElementById(D,true):Element.getElementById(B,D,true);
return(C&&Selectors.Filters.byTag(C,A))?[C]:[];}else{return B.getElementsByTagName(A);}},search:function(J,I,O){var B=[];var C=I.trim().replace(Selectors.RegExps.splitter,function(Z,Y,X){B.push(Y);
return":)"+X;}).split(":)");var K,F,E,V;for(var U=0,Q=C.length;U<Q;U++){var T=C[U];if(U==0&&Selectors.RegExps.quick.test(T)){K=J.getElementsByTagName(T);
continue;}var A=B[U-1];var L=Selectors.Utils.parseTagAndID(T);var W=L[0],M=L[1];if(U==0){K=Selectors.Utils.getByTagAndID(J,W,M);}else{var D={},H=[];for(var S=0,R=K.length;
S<R;S++){H=Selectors.Getters[A](H,K[S],W,M,D);}K=H;}var G=Selectors.Utils.parseSelector(T);if(G){E=[];for(var P=0,N=K.length;P<N;P++){V=K[P];if(Selectors.Utils.filter(V,G,O)){E.push(V);
}}K=E;}}return K;}};Selectors.Getters={" ":function(H,G,I,A,E){var D=Selectors.Utils.getByTagAndID(G,I,A);for(var C=0,B=D.length;C<B;C++){var F=D[C];if(Selectors.Utils.chk(F,E)){H.push(F);
}}return H;},">":function(H,G,I,A,F){var C=Selectors.Utils.getByTagAndID(G,I,A);for(var E=0,D=C.length;E<D;E++){var B=C[E];if(B.parentNode==G&&Selectors.Utils.chk(B,F)){H.push(B);
}}return H;},"+":function(C,B,A,E,D){while((B=B.nextSibling)){if(B.nodeType==1){if(Selectors.Utils.chk(B,D)&&Selectors.Filters.byTag(B,A)&&Selectors.Filters.byID(B,E)){C.push(B);
}break;}}return C;},"~":function(C,B,A,E,D){while((B=B.nextSibling)){if(B.nodeType==1){if(!Selectors.Utils.chk(B,D)){break;}if(Selectors.Filters.byTag(B,A)&&Selectors.Filters.byID(B,E)){C.push(B);
}}}return C;}};Selectors.Filters={byTag:function(B,A){return(A=="*"||(B.tagName&&B.tagName.toLowerCase()==A));},byID:function(A,B){return(!B||(A.id&&A.id==B));
},byClass:function(B,A){return(B.className&&B.className.contains(A," "));},byPseudo:function(A,D,C,B){return D.call(A,C,B);},byAttribute:function(C,D,B,E){var A=Element.prototype.getProperty.call(C,D);
if(!A){return false;}if(!B||E==undefined){return true;}switch(B){case"=":return(A==E);case"*=":return(A.contains(E));case"^=":return(A.substr(0,E.length)==E);
case"$=":return(A.substr(A.length-E.length)==E);case"!=":return(A!=E);case"~=":return A.contains(E," ");case"|=":return A.contains(E,"-");}return false;
}};Selectors.Pseudo=new Hash({empty:function(){return !(this.innerText||this.textContent||"").length;},not:function(A){return !Element.match(this,A);},contains:function(A){return(this.innerText||this.textContent||"").contains(A);
},"first-child":function(){return Selectors.Pseudo.index.call(this,0);},"last-child":function(){var A=this;while((A=A.nextSibling)){if(A.nodeType==1){return false;
}}return true;},"only-child":function(){var B=this;while((B=B.previousSibling)){if(B.nodeType==1){return false;}}var A=this;while((A=A.nextSibling)){if(A.nodeType==1){return false;
}}return true;},"nth-child":function(G,E){G=(G==undefined)?"n":G;var C=Selectors.Utils.parseNthArgument(G);if(C.special!="n"){return Selectors.Pseudo[C.special].call(this,C.a,E);
}var F=0;E.positions=E.positions||{};var D=$uid(this);if(!E.positions[D]){var B=this;while((B=B.previousSibling)){if(B.nodeType!=1){continue;}F++;var A=E.positions[$uid(B)];
if(A!=undefined){F=A+F;break;}}E.positions[D]=F;}return(E.positions[D]%C.a==C.b);},index:function(A){var B=this,C=0;while((B=B.previousSibling)){if(B.nodeType==1&&++C>A){return false;
}}return(C==A);},even:function(B,A){return Selectors.Pseudo["nth-child"].call(this,"2n+1",A);},odd:function(B,A){return Selectors.Pseudo["nth-child"].call(this,"2n",A);
}});Element.Events.domready={onAdd:function(A){if(Browser.loaded){A.call(this);}}};(function(){var B=function(){if(Browser.loaded){return ;}Browser.loaded=true;
window.fireEvent("domready");document.fireEvent("domready");};switch(Browser.Engine.name){case"webkit":(function(){(["loaded","complete"].contains(document.readyState))?B():arguments.callee.delay(50);
})();break;case"trident":var A=document.createElement("div");(function(){($try(function(){A.doScroll("left");return $(A).inject(document.body).set("html","temp").dispose();
}))?B():arguments.callee.delay(50);})();break;default:window.addEvent("load",B);document.addEvent("DOMContentLoaded",B);}})();var JSON=new Hash({encode:function(B){switch($type(B)){case"string":return'"'+B.replace(/[\x00-\x1f\\"]/g,JSON.$replaceChars)+'"';
case"array":return"["+String(B.map(JSON.encode).filter($defined))+"]";case"object":case"hash":var A=[];Hash.each(B,function(E,D){var C=JSON.encode(E);if(C){A.push(JSON.encode(D)+":"+C);
}});return"{"+A+"}";case"number":case"boolean":return String(B);case false:return"null";}return null;},$specialChars:{"\b":"\\b","\t":"\\t","\n":"\\n","\f":"\\f","\r":"\\r",'"':'\\"',"\\":"\\\\"},$replaceChars:function(A){return JSON.$specialChars[A]||"\\u00"+Math.floor(A.charCodeAt()/16).toString(16)+(A.charCodeAt()%16).toString(16);
},decode:function(string,secure){if($type(string)!="string"||!string.length){return null;}if(secure&&!(/^[,:{}\[\]0-9.\-+Eaeflnr-u \n\r\t]*$/).test(string.replace(/\\./g,"@").replace(/"[^"\\\n\r]*"/g,""))){return null;
}return eval("("+string+")");}});Native.implement([Hash,Array,String,Number],{toJSON:function(){return JSON.encode(this);}});var Cookie=new Class({Implements:Options,options:{path:false,domain:false,duration:false,secure:false,document:document},initialize:function(B,A){this.key=B;
this.setOptions(A);},write:function(B){B=encodeURIComponent(B);if(this.options.domain){B+="; domain="+this.options.domain;}if(this.options.path){B+="; path="+this.options.path;
}if(this.options.duration){var A=new Date();A.setTime(A.getTime()+this.options.duration*24*60*60*1000);B+="; expires="+A.toGMTString();}if(this.options.secure){B+="; secure";
}this.options.document.cookie=this.key+"="+B;return this;},read:function(){var A=this.options.document.cookie.match("(?:^|;)\\s*"+this.key.escapeRegExp()+"=([^;]*)");
return(A)?decodeURIComponent(A[1]):null;},dispose:function(){new Cookie(this.key,$merge(this.options,{duration:-1})).write("");return this;}});Cookie.write=function(B,C,A){return new Cookie(B,A).write(C);
};Cookie.read=function(A){return new Cookie(A).read();};Cookie.dispose=function(B,A){return new Cookie(B,A).dispose();};var Swiff=new Class({Implements:[Options],options:{id:null,height:1,width:1,container:null,properties:{},params:{quality:"high",allowScriptAccess:"always",wMode:"transparent",swLiveConnect:true},callBacks:{},vars:{}},toElement:function(){return this.object;
},initialize:function(L,M){this.instance="Swiff_"+$time();this.setOptions(M);M=this.options;var B=this.id=M.id||this.instance;var A=$(M.container);Swiff.CallBacks[this.instance]={};
var E=M.params,G=M.vars,F=M.callBacks;var H=$extend({height:M.height,width:M.width},M.properties);var K=this;for(var D in F){Swiff.CallBacks[this.instance][D]=(function(N){return function(){return N.apply(K.object,arguments);
};})(F[D]);G[D]="Swiff.CallBacks."+this.instance+"."+D;}E.flashVars=Hash.toQueryString(G);if(Browser.Engine.trident){H.classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000";
E.movie=L;}else{H.type="application/x-shockwave-flash";H.data=L;}var J='<object id="'+B+'"';for(var I in H){J+=" "+I+'="'+H[I]+'"';}J+=">";for(var C in E){if(E[C]){J+='<param name="'+C+'" value="'+E[C]+'" />';
}}J+="</object>";this.object=((A)?A.empty():new Element("div")).set("html",J).firstChild;},replaces:function(A){A=$(A,true);A.parentNode.replaceChild(this.toElement(),A);
return this;},inject:function(A){$(A,true).appendChild(this.toElement());return this;},remote:function(){return Swiff.remote.apply(Swiff,[this.toElement()].extend(arguments));
}});Swiff.CallBacks={};Swiff.remote=function(obj,fn){var rs=obj.CallFunction('<invoke name="'+fn+'" returntype="javascript">'+__flash__argumentsToXML(arguments,2)+"</invoke>");
return eval(rs);};var Fx=new Class({Implements:[Chain,Events,Options],options:{fps:50,unit:false,duration:500,link:"ignore",transition:function(A){return -(Math.cos(Math.PI*A)-1)/2;
}},initialize:function(A){this.subject=this.subject||this;this.setOptions(A);this.options.duration=Fx.Durations[this.options.duration]||this.options.duration.toInt();
var B=this.options.wait;if(B===false){this.options.link="cancel";}},step:function(){var A=$time();if(A<this.time+this.options.duration){var B=this.options.transition((A-this.time)/this.options.duration);
this.set(this.compute(this.from,this.to,B));}else{this.set(this.compute(this.from,this.to,1));this.complete();}},set:function(A){return A;},compute:function(C,B,A){return Fx.compute(C,B,A);
},check:function(A){if(!this.timer){return true;}switch(this.options.link){case"cancel":this.cancel();return true;case"chain":this.chain(A.bind(this,Array.slice(arguments,1)));
return false;}return false;},start:function(B,A){if(!this.check(arguments.callee,B,A)){return this;}this.from=B;this.to=A;this.time=0;this.startTimer();
this.onStart();return this;},complete:function(){if(this.stopTimer()){this.onComplete();}return this;},cancel:function(){if(this.stopTimer()){this.onCancel();
}return this;},onStart:function(){this.fireEvent("start",this.subject);},onComplete:function(){this.fireEvent("complete",this.subject);if(!this.callChain()){this.fireEvent("chainComplete",this.subject);
}},onCancel:function(){this.fireEvent("cancel",this.subject).clearChain();},pause:function(){this.stopTimer();return this;},resume:function(){this.startTimer();
return this;},stopTimer:function(){if(!this.timer){return false;}this.time=$time()-this.time;this.timer=$clear(this.timer);return true;},startTimer:function(){if(this.timer){return false;
}this.time=$time()-this.time;this.timer=this.step.periodical(Math.round(1000/this.options.fps),this);return true;}});Fx.compute=function(C,B,A){return(B-C)*A+C;
};Fx.Durations={"short":250,normal:500,"long":1000};Fx.CSS=new Class({Extends:Fx,prepare:function(D,E,B){B=$splat(B);var C=B[1];if(!$chk(C)){B[1]=B[0];
B[0]=D.getStyle(E);}var A=B.map(this.parse);return{from:A[0],to:A[1]};},parse:function(A){A=$lambda(A)();A=(typeof A=="string")?A.split(" "):$splat(A);
return A.map(function(C){C=String(C);var B=false;Fx.CSS.Parsers.each(function(F,E){if(B){return ;}var D=F.parse(C);if($chk(D)){B={value:D,parser:F};}});
B=B||{value:C,parser:Fx.CSS.Parsers.String};return B;});},compute:function(D,C,B){var A=[];(Math.min(D.length,C.length)).times(function(E){A.push({value:D[E].parser.compute(D[E].value,C[E].value,B),parser:D[E].parser});
});A.$family={name:"fx:css:value"};return A;},serve:function(C,B){if($type(C)!="fx:css:value"){C=this.parse(C);}var A=[];C.each(function(D){A=A.concat(D.parser.serve(D.value,B));
});return A;},render:function(A,D,C,B){A.setStyle(D,this.serve(C,B));},search:function(A){if(Fx.CSS.Cache[A]){return Fx.CSS.Cache[A];}var B={};Array.each(document.styleSheets,function(E,D){var C=E.href;
if(C&&C.contains("://")&&!C.contains(document.domain)){return ;}var F=E.rules||E.cssRules;Array.each(F,function(I,G){if(!I.style){return ;}var H=(I.selectorText)?I.selectorText.replace(/^\w+/,function(J){return J.toLowerCase();
}):null;if(!H||!H.test("^"+A+"$")){return ;}Element.Styles.each(function(K,J){if(!I.style[J]||Element.ShortStyles[J]){return ;}K=String(I.style[J]);B[J]=(K.test(/^rgb/))?K.rgbToHex():K;
});});});return Fx.CSS.Cache[A]=B;}});Fx.CSS.Cache={};Fx.CSS.Parsers=new Hash({Color:{parse:function(A){if(A.match(/^#[0-9a-f]{3,6}$/i)){return A.hexToRgb(true);
}return((A=A.match(/(\d+),\s*(\d+),\s*(\d+)/)))?[A[1],A[2],A[3]]:false;},compute:function(C,B,A){return C.map(function(E,D){return Math.round(Fx.compute(C[D],B[D],A));
});},serve:function(A){return A.map(Number);}},Number:{parse:parseFloat,compute:Fx.compute,serve:function(B,A){return(A)?B+A:B;}},String:{parse:$lambda(false),compute:$arguments(1),serve:$arguments(0)}});
Fx.Tween=new Class({Extends:Fx.CSS,initialize:function(B,A){this.element=this.subject=$(B);this.parent(A);},set:function(B,A){if(arguments.length==1){A=B;
B=this.property||this.options.property;}this.render(this.element,B,A,this.options.unit);return this;},start:function(C,E,D){if(!this.check(arguments.callee,C,E,D)){return this;
}var B=Array.flatten(arguments);this.property=this.options.property||B.shift();var A=this.prepare(this.element,this.property,B);return this.parent(A.from,A.to);
}});Element.Properties.tween={set:function(A){var B=this.retrieve("tween");if(B){B.cancel();}return this.eliminate("tween").store("tween:options",$extend({link:"cancel"},A));
},get:function(A){if(A||!this.retrieve("tween")){if(A||!this.retrieve("tween:options")){this.set("tween",A);}this.store("tween",new Fx.Tween(this,this.retrieve("tween:options")));
}return this.retrieve("tween");}};Element.implement({tween:function(A,C,B){this.get("tween").start(arguments);return this;},fade:function(C){var E=this.get("tween"),D="opacity",A;
C=$pick(C,"toggle");switch(C){case"in":E.start(D,1);break;case"out":E.start(D,0);break;case"show":E.set(D,1);break;case"hide":E.set(D,0);break;case"toggle":var B=this.retrieve("fade:flag",this.get("opacity")==1);
E.start(D,(B)?0:1);this.store("fade:flag",!B);A=true;break;default:E.start(D,arguments);}if(!A){this.eliminate("fade:flag");}return this;},highlight:function(C,A){if(!A){A=this.retrieve("highlight:original",this.getStyle("background-color"));
A=(A=="transparent")?"#fff":A;}var B=this.get("tween");B.start("background-color",C||"#ffff88",A).chain(function(){this.setStyle("background-color",this.retrieve("highlight:original"));
B.callChain();}.bind(this));return this;}});Fx.Morph=new Class({Extends:Fx.CSS,initialize:function(B,A){this.element=this.subject=$(B);this.parent(A);},set:function(A){if(typeof A=="string"){A=this.search(A);
}for(var B in A){this.render(this.element,B,A[B],this.options.unit);}return this;},compute:function(E,D,C){var A={};for(var B in E){A[B]=this.parent(E[B],D[B],C);
}return A;},start:function(B){if(!this.check(arguments.callee,B)){return this;}if(typeof B=="string"){B=this.search(B);}var E={},D={};for(var C in B){var A=this.prepare(this.element,C,B[C]);
E[C]=A.from;D[C]=A.to;}return this.parent(E,D);}});Element.Properties.morph={set:function(A){var B=this.retrieve("morph");if(B){B.cancel();}return this.eliminate("morph").store("morph:options",$extend({link:"cancel"},A));
},get:function(A){if(A||!this.retrieve("morph")){if(A||!this.retrieve("morph:options")){this.set("morph",A);}this.store("morph",new Fx.Morph(this,this.retrieve("morph:options")));
}return this.retrieve("morph");}};Element.implement({morph:function(A){this.get("morph").start(A);return this;}});(function(){var A=Fx.prototype.initialize;
Fx.prototype.initialize=function(B){A.call(this,B);var C=this.options.transition;if(typeof C=="string"&&(C=C.split(":"))){var D=Fx.Transitions;D=D[C[0]]||D[C[0].capitalize()];
if(C[1]){D=D["ease"+C[1].capitalize()+(C[2]?C[2].capitalize():"")];}this.options.transition=D;}};})();Fx.Transition=function(B,A){A=$splat(A);return $extend(B,{easeIn:function(C){return B(C,A);
},easeOut:function(C){return 1-B(1-C,A);},easeInOut:function(C){return(C<=0.5)?B(2*C,A)/2:(2-B(2*(1-C),A))/2;}});};Fx.Transitions=new Hash({linear:$arguments(0)});
Fx.Transitions.extend=function(A){for(var B in A){Fx.Transitions[B]=new Fx.Transition(A[B]);}};Fx.Transitions.extend({Pow:function(B,A){return Math.pow(B,A[0]||6);
},Expo:function(A){return Math.pow(2,8*(A-1));},Circ:function(A){return 1-Math.sin(Math.acos(A));},Sine:function(A){return 1-Math.sin((1-A)*Math.PI/2);
},Back:function(B,A){A=A[0]||1.618;return Math.pow(B,2)*((A+1)*B-A);},Bounce:function(D){var C;for(var B=0,A=1;1;B+=A,A/=2){if(D>=(7-4*B)/11){C=-Math.pow((11-6*B-11*D)/4,2)+A*A;
break;}}return C;},Elastic:function(B,A){return Math.pow(2,10*--B)*Math.cos(20*B*Math.PI*(A[0]||1)/3);}});["Quad","Cubic","Quart","Quint"].each(function(B,A){Fx.Transitions[B]=new Fx.Transition(function(C){return Math.pow(C,[A+2]);
});});var Request=new Class({Implements:[Chain,Events,Options],options:{url:"",data:"",headers:{"X-Requested-With":"XMLHttpRequest",Accept:"text/javascript, text/html, application/xml, text/xml, */*"},async:true,format:false,method:"post",link:"ignore",isSuccess:null,emulation:true,urlEncoded:true,encoding:"utf-8",evalScripts:false,evalResponse:false},initialize:function(A){this.xhr=new Browser.Request();
this.setOptions(A);this.options.isSuccess=this.options.isSuccess||this.isSuccess;this.headers=new Hash(this.options.headers);},onStateChange:function(){if(this.xhr.readyState!=4||!this.running){return ;
}this.running=false;this.status=0;$try(function(){this.status=this.xhr.status;}.bind(this));if(this.options.isSuccess.call(this,this.status)){this.response={text:this.xhr.responseText,xml:this.xhr.responseXML};
this.success(this.response.text,this.response.xml);}else{this.response={text:null,xml:null};this.failure();}this.xhr.onreadystatechange=$empty;},isSuccess:function(){return((this.status>=200)&&(this.status<300));
},processScripts:function(A){if(this.options.evalResponse||(/(ecma|java)script/).test(this.getHeader("Content-type"))){return $exec(A);}return A.stripScripts(this.options.evalScripts);
},success:function(B,A){this.onSuccess(this.processScripts(B),A);},onSuccess:function(){this.fireEvent("complete",arguments).fireEvent("success",arguments).callChain();
},failure:function(){this.onFailure();},onFailure:function(){this.fireEvent("complete").fireEvent("failure",this.xhr);},setHeader:function(A,B){this.headers.set(A,B);
return this;},getHeader:function(A){return $try(function(){return this.xhr.getResponseHeader(A);}.bind(this));},check:function(A){if(!this.running){return true;
}switch(this.options.link){case"cancel":this.cancel();return true;case"chain":this.chain(A.bind(this,Array.slice(arguments,1)));return false;}return false;
},send:function(I){if(!this.check(arguments.callee,I)){return this;}this.running=true;var G=$type(I);if(G=="string"||G=="element"){I={data:I};}var D=this.options;
I=$extend({data:D.data,url:D.url,method:D.method},I);var E=I.data,B=I.url,A=I.method;switch($type(E)){case"element":E=$(E).toQueryString();break;case"object":case"hash":E=Hash.toQueryString(E);
}if(this.options.format){var H="format="+this.options.format;E=(E)?H+"&"+E:H;}if(this.options.emulation&&["put","delete"].contains(A)){var F="_method="+A;
E=(E)?F+"&"+E:F;A="post";}if(this.options.urlEncoded&&A=="post"){var C=(this.options.encoding)?"; charset="+this.options.encoding:"";this.headers.set("Content-type","application/x-www-form-urlencoded"+C);
}if(E&&A=="get"){B=B+(B.contains("?")?"&":"?")+E;E=null;}this.xhr.open(A.toUpperCase(),B,this.options.async);this.xhr.onreadystatechange=this.onStateChange.bind(this);
this.headers.each(function(K,J){if(!$try(function(){this.xhr.setRequestHeader(J,K);return true;}.bind(this))){this.fireEvent("exception",[J,K]);}},this);
this.fireEvent("request");this.xhr.send(E);if(!this.options.async){this.onStateChange();}return this;},cancel:function(){if(!this.running){return this;
}this.running=false;this.xhr.abort();this.xhr.onreadystatechange=$empty;this.xhr=new Browser.Request();this.fireEvent("cancel");return this;}});(function(){var A={};
["get","post","put","delete","GET","POST","PUT","DELETE"].each(function(B){A[B]=function(){var C=Array.link(arguments,{url:String.type,data:$defined});
return this.send($extend(C,{method:B.toLowerCase()}));};});Request.implement(A);})();Element.Properties.send={set:function(A){var B=this.retrieve("send");
if(B){B.cancel();}return this.eliminate("send").store("send:options",$extend({data:this,link:"cancel",method:this.get("method")||"post",url:this.get("action")},A));
},get:function(A){if(A||!this.retrieve("send")){if(A||!this.retrieve("send:options")){this.set("send",A);}this.store("send",new Request(this.retrieve("send:options")));
}return this.retrieve("send");}};Element.implement({send:function(A){var B=this.get("send");B.send({data:this,url:A||B.options.url});return this;}});Request.HTML=new Class({Extends:Request,options:{update:false,evalScripts:true,filter:false},processHTML:function(C){var B=C.match(/<body[^>]*>([\s\S]*?)<\/body>/i);
C=(B)?B[1]:C;var A=new Element("div");return $try(function(){var D="<root>"+C+"</root>",G;if(Browser.Engine.trident){G=new ActiveXObject("Microsoft.XMLDOM");
G.async=false;G.loadXML(D);}else{G=new DOMParser().parseFromString(D,"text/xml");}D=G.getElementsByTagName("root")[0];for(var F=0,E=D.childNodes.length;
F<E;F++){var H=Element.clone(D.childNodes[F],true,true);if(H){A.grab(H);}}return A;})||A.set("html",C);},success:function(D){var C=this.options,B=this.response;
B.html=D.stripScripts(function(E){B.javascript=E;});var A=this.processHTML(B.html);B.tree=A.childNodes;B.elements=A.getElements("*");if(C.filter){B.tree=B.elements.filter(C.filter);
}if(C.update){$(C.update).empty().adopt(B.tree);}if(C.evalScripts){$exec(B.javascript);}this.onSuccess(B.tree,B.elements,B.html,B.javascript);}});Element.Properties.load={set:function(A){var B=this.retrieve("load");
if(B){send.cancel();}return this.eliminate("load").store("load:options",$extend({data:this,link:"cancel",update:this,method:"get"},A));},get:function(A){if(A||!this.retrieve("load")){if(A||!this.retrieve("load:options")){this.set("load",A);
}this.store("load",new Request.HTML(this.retrieve("load:options")));}return this.retrieve("load");}};Element.implement({load:function(){this.get("load").send(Array.link(arguments,{data:Object.type,url:String.type}));
return this;}});Request.JSON=new Class({Extends:Request,options:{secure:true},initialize:function(A){this.parent(A);this.headers.extend({Accept:"application/json","X-Request":"JSON"});
},success:function(A){this.response.json=JSON.decode(A,this.options.secure);this.onSuccess(this.response.json,A);}});

</script>
<script language="javascript" type="text/javascript">
Fx.Slide=new Class({Extends:Fx,options:{mode:"vertical"},initialize:function(B,A){this.addEvent("complete",function(){this.open=(this.wrapper["offset"+this.layout.capitalize()]!=0);
if(this.open&&Browser.Engine.webkit419){this.element.dispose().inject(this.wrapper);}},true);this.element=this.subject=$(B);this.parent(A);var C=this.element.retrieve("wrapper");
this.wrapper=C||new Element("div",{styles:$extend(this.element.getStyles("margin","position"),{overflow:"hidden"})}).wraps(this.element);this.element.store("wrapper",this.wrapper).setStyle("margin",0);
this.now=[];this.open=true;},vertical:function(){this.margin="margin-top";this.layout="height";this.offset=this.element.offsetHeight;},horizontal:function(){this.margin="margin-left";
this.layout="width";this.offset=this.element.offsetWidth;},set:function(A){this.element.setStyle(this.margin,A[0]);this.wrapper.setStyle(this.layout,A[1]);
return this;},compute:function(E,D,C){var B=[];var A=2;A.times(function(F){B[F]=Fx.compute(E[F],D[F],C);});return B;},start:function(B,E){if(!this.check(arguments.callee,B,E)){return this;
}this[E||this.options.mode]();var D=this.element.getStyle(this.margin).toInt();var C=this.wrapper.getStyle(this.layout).toInt();var A=[[D,C],[0,this.offset]];
var G=[[D,C],[-this.offset,0]];var F;switch(B){case"in":F=A;break;case"out":F=G;break;case"toggle":F=(this.wrapper["offset"+this.layout.capitalize()]==0)?A:G;
}return this.parent(F[0],F[1]);},slideIn:function(A){return this.start("in",A);},slideOut:function(A){return this.start("out",A);},hide:function(A){this[A||this.options.mode]();
this.open=false;return this.set([-this.offset,0]);},show:function(A){this[A||this.options.mode]();this.open=true;return this.set([0,this.offset]);},toggle:function(A){return this.start("toggle",A);
}});Element.Properties.slide={set:function(B){var A=this.retrieve("slide");if(A){A.cancel();}return this.eliminate("slide").store("slide:options",$extend({link:"cancel"},B));
},get:function(A){if(A||!this.retrieve("slide")){if(A||!this.retrieve("slide:options")){this.set("slide",A);}this.store("slide",new Fx.Slide(this,this.retrieve("slide:options")));
}return this.retrieve("slide");}};Element.implement({slide:function(D,E){D=D||"toggle";var B=this.get("slide"),A;switch(D){case"hide":B.hide(E);break;case"show":B.show(E);
break;case"toggle":var C=this.retrieve("slide:flag",B.open);B[(C)?"slideOut":"slideIn"](E);this.store("slide:flag",!C);A=true;break;default:B.start(D,E);
}if(!A){this.eliminate("slide:flag");}return this;}});
</script>
<script language="javascript" type="text/javascript">  
    window.addEvent('domready', function(){
        $('drop_down_menu').getElements('li.menu').each( function( elem ){
            var list = elem.getElement('ul.links');  
            var myFx = new Fx.Slide(list).hide();          
            elem.addEvents({
                'mouseenter' : function(){                   
                    myFx.cancel();
                    myFx.slideIn();                  
                },
                'mouseleave' : function(){
                    myFx.cancel();
                    myFx.slideOut();                  
                }
            });  
        })
    });  
</script>

<style type="text/css" media="screen">
body { font-family:Arial, Helvetica, sans-serif; }
div.header { display:block; position:relative; height:100px; }
#menu-container { display:block; position:relative; width:700px; margin:0px auto 0px; font-size:11px; }
#drop_down_menu { display:block; position:absolute; clear:both; margin:0px; padding:0px; text-align:left; list-style-type:none; text-align:center; width:700px; float:none; left:0px; top:0px; }
#drop_down_menu li { font-size:12px; font-weight:bold; float:left; color:#11a2db; padding:5px; cursor:pointer; background:#333333; width:150px; }
#drop_down_menu li ul { margin:0px; padding:0px; list-style-type:none; padding-top:10px; }
#drop_down_menu li ul li { display:block; float:none; clear:both;  }
#drop_down_menu li ul li a { color:#FFFFFF; font-weight:normal; text-decoration:none; display:block; }
#drop_down_menu li ul li a:HOVER { text-decoration:underline; color:#CCCCCC; }
</style>
</head>



<body>
<div class="header">
    <div id="menu-container">  
        <ul id="drop_down_menu">
            <li class="menu">Menu 1
                <ul class="links">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2</a></li>
                </ul>
            </li>
            <li class="menu">Menu 2
                <ul class="links">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2</a></li>
                    <li><a href="#">Link 3</a></li>
                </ul>
            </li>
            <li class="menu">Menu 3
                <ul class="links">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2</a></li>
                    <li><a href="#">Link 3</a></li>
                    <li><a href="#">Link 4</a></li>
                </ul>
            </li>
            <li class="menu">Menu 4
                <ul class="links">
                    <li><a href="#">Link 1</a></li>
                    <li><a href="#">Link 2</a></li>
                </ul>
            </li>
        </ul>
    </div>
</div>
</body>
</html>
<font face="Tahoma"><a target="_blank" href="http://www.javascriptfreecode.com/"><span style="font-size: 8pt; text-decoration: none">JavaScript Free Code</span></a></font>