diff options
Diffstat (limited to 'demos/quickstart/protected/pages/Advanced')
24 files changed, 2062 insertions, 0 deletions
diff --git a/demos/quickstart/protected/pages/Advanced/Samples/I18N/LanguageList.tpl b/demos/quickstart/protected/pages/Advanced/Samples/I18N/LanguageList.tpl index 2f919630..de1ef60f 100644 --- a/demos/quickstart/protected/pages/Advanced/Samples/I18N/LanguageList.tpl +++ b/demos/quickstart/protected/pages/Advanced/Samples/I18N/LanguageList.tpl @@ -5,6 +5,7 @@ <li><a href="index.php?page=<%= $this->Request->ServiceParameter %>&lang=de">Deutsch</a></li>
<li><a href="index.php?page=<%= $this->Request->ServiceParameter %>&lang=es">Español</a></li>
<li><a href="index.php?page=<%= $this->Request->ServiceParameter %>&lang=fr">Français</a></li>
+ <li><a href="index.php?page=<%= $this->Request->ServiceParameter %>&lang=id">Bahasa Indonesia</a></li>
<li><a href="index.php?page=<%= $this->Request->ServiceParameter %>&lang=pl">Polska</a></li>
</ul>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/Samples/I18N/id/Home.page b/demos/quickstart/protected/pages/Advanced/Samples/I18N/id/Home.page new file mode 100644 index 00000000..c7e5c63d --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/Samples/I18N/id/Home.page @@ -0,0 +1,161 @@ +<%@ Title="Internasionlisasi dalam PRADO"
+ Page.Application.Globalization.TranslationCatalogue="index" %>
+<com:TContent ID="body">
+
+<h1>Internasionlisasi dalam PRADO</h1>
+<p>Demo ini memperlihatkan komponen dasar yang tersedia dalam PRADO untuk memproses Internasionalisasi dan Lokalisasi aplikasi web. Halam ini memanfaatkan template siap multipel lokal (atau kultur) untuk memperlihatkan halaman terlokalisasi yang tersedia. Untuk melihat versi dilokalisasi yang berbeda, silahkan ganti setelan bahasa dalam browser anda.</p>
+
+<p>
+Saat ini kultur anda adalah <%= $this->Page->CurrentCulture %>.
+<div class="links">
+ Versi lokalisasi tersedia:
+ <com:LanguageList />
+</div>
+</p>
+
+<p>
+ Sebagai tambahan ke template siap kultur. Teks dapat dilokalisasi menggunakan banyak sumber terjemanan yang berbeda. PRADO menyediakan wadah gettext, XML, SQLite, dan MySQL untuk menyimpan terjemahan pesan. Contoh dalam link berikut mendemonstrasikan bagaimana teks dapat dilokalisasi menggunakan komponen TTranslate.
+</p>
+<hr />
+<h2>Pengenalan</h2>
+<p> Mengembangkan dan memelihara situs multi-bahasa adalah masalah umum bagi para pengembang web. </p>
+<dl>
+<dt><strong>Internasionalisasi (I18N)</strong></dt>
+<dd>Proses pengembangan sebuah produk dalam cara yang bekerja dengan data dalam bahasa berbeda dan dapat diadaptasi ke berbagai target pasar tanpa melakukan perubahan. </dd>
+<dt><strong>Lokalisasi (L10N)</strong></dt>
+<dd>Proses selanjutnya dari menterjemahkan dan mengadaptasi sebuah produk untuk pasar konvensi kultural yang tersedia.</dd>
+</dl>
+<p>Fitur berikut didukung oleh PRADO: </p>
+<ul id="u1" class="block-content">
+ <li>Terjemahan teks</li>
+ <li>Terjemahan atribut</li>
+ <li>Substitusi parameter (dengan terjemahan bila diperlukan) </li>
+ <li>Format tanggal, angka dan kurs </li>
+</ul>
+<h2>Contoh</h2>
+<h3>Tanggal: pola lengkap, kultur en_GB</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TDateFormat ID="Time1" Pattern="full" Culture="en_GB"/>
+</com:TTextHighlighter>
+<h4>Hasil:</h4>
+<com:TDateFormat ID="Time1" Pattern="full" Culture="en_GB"/> <br />
+<hr />
+
+<h3>Tanggal: pola pendek</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TDateFormat ID="Time2" Pattern="short" />
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TDateFormat ID="Time2" Pattern="short" /> <br />
+<hr />
+
+<h3>Pola standar tanggal dari <%= $this->Page->CurrentCulture %> </h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TDateFormat ID="Time3" Value="2004/12/06" />
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TDateFormat ID="Time3" Value="2004/12/06" /> <br />
+<hr />
+
+<h3>Format standar kurs</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TNumberFormat Type="currency" Value="12.4" />
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TNumberFormat Type="currency" Value="12.4" /> <br />
+<hr />
+<h3>Currency, de_DE culture with Euro</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TNumberFormat ID="Number2" Type="currency" Culture="de_DE" Currency="EUR"/>
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TNumberFormat ID="Number2" Type="currency" Culture="de_DE" Currency="EUR"/> <br />
+
+<hr />
+
+<h3>Kurs, format US dengan Euro</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TNumberFormat Type="currency" Culture="en_US" Currency="EUR" Value="100" />
+</com:TTextHighlighter>
+
+<h4>Hasil</h4>
+<com:TNumberFormat Type="currency" Culture="en_US" Currency="EUR" Value="100" /> <br />
+<hr />
+
+<h3>Contoh terjemahan</h3>
+<h4>ContohExample:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TTranslate>Hello</com:TTranslate>
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TTranslate>Hello</com:TTranslate> <br />
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TTranslate Text="Goodbye" />
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TTranslate Text="Goodbye" /> <br />
+
+<hr />
+<h3>Menggunakan tag lokalisasi</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<%[ Goodbye ]%>
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<%[ Goodbye ]%>
+<br />
+
+
+<hr />
+<h3>Menterjemahkan menggunakan katalog berbeda </h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TTranslate Text="Goodbye" Catalogue="tests" />
+</com:TTextHighlighter>
+
+<h4>Hasil:</h4>
+<com:TTranslate Text="Goodbye" Catalogue="tests" />
+<br />
+
+
+<hr />
+<h3>Translasi dengan substitusi parameter</h3>
+<h4>Contoh:</h4>
+<com:TTextHighlighter Language="prado" CssClass="source">
+<com:TTranslate>
+ {greeting} {name}!, The unix-time is "{time}".
+ <com:TTranslateParameter Key="name">
+ <com:TTranslate Catalogue="tests" Text="World" />
+ </com:TTranslateParameter>
+ <com:TTranslateParameter Key="greeting" Value="Hello" />
+ <com:TTranslateParameter Key="time" Value="<%= Time() %>" />
+</com:TTranslate>
+</com:TTextHighlighter>
+
+
+<h4>Hasil:</h4>
+
+<com:TTranslate>
+ {greeting} {name}!, The unix-time is "{time}".
+ <com:TTranslateParameter Key="name">
+ <com:TTranslate Catalogue="tests" Text="World" />
+ </com:TTranslateParameter>
+ <com:TTranslateParameter Key="greeting" Value="Hello" />
+ <com:TTranslateParameter Key="time" Value="<%= Time() %>" />
+</com:TTranslate>
+
+<div class="last-modified">$Id: Home.id.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/Samples/I18N/messages/index.id.xml b/demos/quickstart/protected/pages/Advanced/Samples/I18N/messages/index.id.xml new file mode 100644 index 00000000..6a8c0c56 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/Samples/I18N/messages/index.id.xml @@ -0,0 +1,29 @@ +<?xml version="1.0"?>
+<xliff version="1.0">
+<!-- @author $Author: weizhuo $ -->
+<!-- @version $Id: index.en.xml 1398 2006-09-08 19:31:03Z xue $ -->
+<file orginal="I18N Example IndexPage" source-language="EN" datatype="plaintext" date="2005-01-09T13:52:21Z">
+<body>
+
+<trans-unit id="1">
+<source>Hello</source>
+<target>Halo</target>
+</trans-unit>
+
+<trans-unit id="2">
+<source>Goodbye</source>
+<target>Selamat tinggal</target>
+</trans-unit>
+
+<trans-unit id="3">
+<source>World</source>
+<target>Dunia</target>
+</trans-unit>
+
+<trans-unit id="4">
+<source>{greeting} {name}!, The unix-time is "{time}".</source>
+<target>{greeting} {name}!, Waktu-unix adalah "{time}".</target>
+</trans-unit>
+</body>
+</file>
+</xliff>
diff --git a/demos/quickstart/protected/pages/Advanced/Samples/I18N/messages/tests.id.xml b/demos/quickstart/protected/pages/Advanced/Samples/I18N/messages/tests.id.xml new file mode 100644 index 00000000..558026dc --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/Samples/I18N/messages/tests.id.xml @@ -0,0 +1,17 @@ +<?xml version="1.0"?>
+<xliff version="1.0">
+<!-- @author $Author: weizhuo $ -->
+<!-- @version $Id: tests.en.xml 1398 2006-09-08 19:31:03Z xue $ -->
+<file orginal="I18N Example IndexPage" source-language="EN" datatype="plaintext" date="2004-12-28T18:10:19Z">
+<body>
+<trans-unit id="1">
+<source>Goodbye</source>
+<target>Selamat tinggal</target>
+</trans-unit>
+<trans-unit id="2">
+<source>World</source>
+<target>Dunia</target>
+</trans-unit>
+</body>
+</file>
+</xliff>
diff --git a/demos/quickstart/protected/pages/Advanced/id/Assets.page b/demos/quickstart/protected/pages/Advanced/id/Assets.page new file mode 100644 index 00000000..047b795d --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Assets.page @@ -0,0 +1,69 @@ +<com:TContent ID="body" >
+
+<h1 id="5701">Assets</h1>
+<p id="740577" class="block-content">
+Asset adalah file sumber daya (seperti gambar, suara, video, CSS stylesheet, javascript, dll.) yang dimiliki oleh kelas komponen tertentu. Assets disediakan bagi para pengguna Web. Untuk usabilitas dan kemudahan penyebaran kelas komponen terkait, asset harus berada bersama dengan file kelas komponen. Sebagai contoh, tombol toggle dapat memakai dua gambar, disimpan dalam file <tt>down.gif</tt> dan <tt>up.gif</tt>, untuk menampilkan kondisi toggle berbeda. Jika kita ingin file gambar disimpan di bawah direktori <tt>images</tt> di bawah akar dokumen server Web, tidak akan menjadi nyaman bagi para pengguna komponen tombol toggle, karena setiap kali mereka mengembangkan atau menyebarkan aplikasi baru, mereka harus meng-copy file gambar ke direktori tertentu itu secara manual. Untuk mengeliminir persyaratan ini, direktori relatif ke file kelas komponen harus digunakan untuk menyimpan file gambar. Strategi umum adalah menggunakan direktori yang berisi file kelas komponen untuk menyimpan file asset.
+</p>
+<p id="740578" class="block-content">
+Karena direktori yang berisi file kelas komponen biasanya tidak bisa diakses oleh pengguna Web, PRADO menerapkan skema penerbitan asset untuk menjadikan assets tersedia bagi para pengguna Web. Sebuah asset, setelah diterbitkan, akan mempunyai URL di mana para pengguna bisa mengambil file asset.
+</p>
+
+<h2 id="5702">Penerbitan Asset</h2>
+<p id="740579" class="block-content">
+PRADO menyediakan beberapa metode untuk penerbitan asset atu direktori yang berisi asset:
+</p>
+<ul id="u1" class="block-content">
+<li>Dalam file template, anda dapat menggunakan <a href="?page=Configurations.Templates2#at">tag asset</a> guna menerbitkan asset dan mendapatkan URL-nya. Catatan, asset harus relatif ke direktori yang berisi file template.</li>
+<li>Dalam kode PHP, anda dapat memanggil <tt>$object->publishAsset($assetPath)</tt> untuk menerbitkan asset dan mendapatkan URL-nya. <tt>$object</tt> di sini merujuk ke turunan <tt>TApplicationComponent</tt> atau kelas asalnya, dan <tt>$assetPath</tt> adalah file atau direktori relatif ke direktori yang berisi file kelas.</li>
+<li>Jika anda ingin menerbitkan asset sesukanya, anda perlu memanggil <tt>TAssetManager::publishFilePath($path)</tt>.</li>
+</ul>
+<p id="740580" class="block-content">
+HATI-HATI: Sangat berhati-hatilah dengan penerbitan asset, karena ia memberikan para pengguna Web akses ke file yang sebelumnya tidak dapat diakses. Pastikan bahwa anda tidak menerbitkan file yang tidak ingin pengguna lain melihatnya.
+</p>
+
+<h2 id="5703">Kustomisasi</h2>
+<p id="740581" class="block-content">
+Penerbitan asset diatur oleh modul <tt>System.Web.TAssetManager</tt>. Standarnya, semua file asset yang diterbitkan disimpan di bawah direktori <tt>[AppEntryPath]/assets</tt>, di mana <tt>AppEntryPath</tt> merujuk ke direktori yang berisi naskah entri aplikasi. Pastikan direktori <tt>assets</tt> bisa ditulisi oleh proses server Web. Anda dapat mengubah direktorinya ke direktori lain dengan mengkonfigurasi properti <tt>BasePath</tt> dan <tt>BaseUrl</tt> pada modul <tt>TAssetManager</tt> dalam konfigurasi aplikasi,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code1">
+<modules>
+ <module id="asset"
+ class="System.Web.TAssetManager"
+ BasePath="Web.images"
+ BaseUrl="images" />
+</modules>
+</com:TTextHighlighter>
+
+<h2 id="5704">Performansi</h2>
+<p id="740582" class="block-content">
+PRADO menggunakan teknik cache guna memastikan efisiensi penerbitan asset. Menerbitkan asset intinya memerlukan operasi copy file, yang mahal. Untuk menyimpan operasi copy file yang tidak diperlukan, <tt>System.Web.TAssetManager</tt> hanya menerbitkan asset saat ia memiliki waktu modifikasi file lebih baru daripada file yang pernah diterbitkan. Ketika aplikasi dijalankan di bawah mode <tt>Performance</tt>, pemeriksaan cap waktu tersebut juga diabaikan.
+</p>
+<p id="740583" class="block-content">
+SARAN: Jangan menggunakan penerbitan asset secara berlebihan. Konsep asset dipakai terutama untuk membantu pemakaian ulang dan redistribusi kelas komponen lebih baik. Normalnya, anda tidak akan menggunakan penerbitan asset untuk sumberdaya yang tidak terikat ke komponen manapun dalam aplikasi. Sebagai contoh, anda jangan menggunakan penerbitan asset untuk gambar yang digunakan terutama sebagai elemen desain (misalnya logo, gambar latar belakang, dll). Biarkan server Web melayani gambar ini secara langsung yang akan membantu meningkatkan performansi aplikasi anda.
+</p>
+
+<h2 id="5705">Contoh Tombol Toggle</h2>
+<p id="740584" class="block-content">
+Sekarang kita menggunakan contoh tombol toggle untuk menjelaskan penggunaan asset. Kontrol menggunakan dua file gambar <tt>up.gif</tt> dan <tt>down.gif</tt>, yang disimpan di bawah direktori yang berisi file kelas. Ketika tombol dalam kondisi <tt>Up</tt>, kita ingin menampilkan gambar <tt>up.gif</tt>. Ini dapat dikerjakan seperti berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code2">
+class ToggleButton extends TWebControl {
+ ...
+ protected function addAttributesToRender($writer) {
+ ...
+ if($this->getState()==='Up') {
+ $url=$this->getAsset('up.gif');
+ $writer->addAttribute('src',$url);
+ }
+ ...
+ }
+ ...
+}
+</com:TTextHighlighter>
+<p id="740585" class="block-content">
+Dalam contoh di atas, pemanggilan <tt>$this->getAsset('up.gif')</tt> akan menerbitkan file gambar <tt>up.gif</tt> dan mengembalikan URL untuk file gambar yang diterbitkan. URL kemudian disajikan sebagai atribut dari tag gambar HTML.
+</p>
+<p id="740586" class="block-content">
+Untuk meredistribusi <tt>ToggleButton</tt>, cukup paketkan bersama file kelas dan file gambar. Para pengguna <tt>ToggleButton</tt> cuma perlu untuk mengurai file, dan mereka bisa menggunakannya secara langsung tanpa mencemaskan mengenai ke mana meng-copy file gambar itu.
+</p>
+<div class="last-modified">$Id: Assets.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Auth.page b/demos/quickstart/protected/pages/Advanced/id/Auth.page new file mode 100644 index 00000000..3391c6de --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Auth.page @@ -0,0 +1,120 @@ +<com:TContent ID="body" >
+
+<h1 id="5501">Otentikasi dan Otorisasi</h1>
+<p id="720549" class="block-content">
+Otentikasi adalah proses verifikasi apakah seseorang yang mengaku siapa dirinya. Biasanya menyangkut nama pengguna dan kata sandi, tapi bisa menyertakan metode lain dari mendemonstrasikan identitas, seperti kartu pintar, sidik jari, dll.
+</p>
+<p id="720550" class="block-content">
+Otorisasi adalah mendapatkan keterangan jika orang yang sekali teridentifikasi, diijinkan untuk memanipulasi sumber daya tertentu. Ini biasanya ditentukan dengan menyelidiki apakah orang itu memiliki aturan akses tertentu terhadap sumber daya atau tidak.
+</p>
+
+<h2 id="5502">Bagaimana Kerangka Kerja Otentikasi PRADO Bekerja</h2>
+<p id="720551" class="block-content">
+PRADO menyediakan kerangka kerja otentikasi/otorisasi yang dapat diperluas. Seperti dijelaskan dalam <a href="?page=Fundamentals.Applications">masa hidup aplikasi</a>, <tt>TApplication</tt> menyimpan beberapa masa hidup untuk modul yang bertanggung jawab terhadap otentikasi dan otorisasi. PRADO menyediakan modul <tt>TAuthManager</tt> untuk keperluan tersebut. Para pengembang dapat memasukan modul otentikasinya sendiri dengan mudah. <tt>TAuthManager</tt> didesain untuk dipakai bersama dengan modul <tt>TUserManager</tt>, yang menerapkan datbase pengguna hanya-baca.
+</p>
+<p id="720552" class="block-content">
+Ketika sebuah permintaan halaman terjadi, <tt>TAuthManager</tt> akan mencoba untuk mengembalikan informasi pengguna dari sesi. Jika tidak ada informasi pengguna yang ditemukan, pengguna dianggap sebagai pengguna anonim atau tamu. Guna menjembatani verifikasi identitas pengguna, <tt>TAuthManager</tt> menyediakan dua metode yang umum dipakai: <tt>login()</tt> dan <tt>logout()</tt>. Pengguna dimasukan (diverifikasi) jika entitas nama pengguna serta kata sandinya sama dengan rekaman dalam database pengguna yang diatur oleh <tt>TUserManager</tt>. Pengguna dikeluarkan jika informasi pengguna dihapus dari sesi dan dia perlu masuk lagi jika dia membuat permintaan baru terhadap halaman.
+</p>
+<p id="720553" class="block-content">
+Selama masa hidup aplikasi <tt>Otorisasi</tt>, yang terjadi setelah masa hidup <tt>Otentikasi</tt>, <tt>TAuthManager</tt> akan memverifikasi apakah pengguna saat ini mempunyai akses ke halaman yang diminta berdasarkan set aturan otorisasi. Otorisasi adalah berbasis-aturan, misalnya seorang pengguna memiliki akses ke sebuah halaman jika 1) halaman secara ekplisit menyatakan bahwa pengguna mempunyai akses; 2) atau pengguna adalah aturan tertentu yang memiliki akses ke halaman. Jika pengguna tidak mempunyai akses ke halaman, <tt>TAuthManager</tt> akan mengalihkan browser pengguna ke halaman masuk yang ditetapkan oleh properti <tt>LoginPage</tt>.
+</p>
+
+<h2 id="5503">Menggunakan Kerangka Kerja Otentikasi PRADO</h2>
+<p id="720554" class="block-content">
+Untuk menghidupkan kerangka kerja otentikasi PRADO, tambahkan modul <tt>TAuthManager</tt> dan modul <tt>TUserManager</tt> ke <a href="?page=Configurations.AppConfig">konfigurasi aplikasi</a>,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code1">
+<service id="page" class="TPageService">
+ <modules>
+ <module id="auth" class="System.Security.TAuthManager"
+ UserManager="users" LoginPage="UserLogin" />
+ <module id="users" class="System.Security.TUserManager"
+ PasswordMode="Clear">
+ <user name="demo" password="demo" />
+ <user name="admin" password="admin" />
+ </module>
+ </modules>
+</service>
+</com:TTextHighlighter>
+<p id="720555" class="block-content">
+Di atas, properti <tt>UserManager</tt> dari <tt>TAuthManager</tt> disetel ke modul <tt>users</tt> yang adalah <tt>TUserManager</tt>. Para pengembang dapat menggantinya dengan modul manajemen pengguna yang berasal dari <tt>TUserManager</tt>.
+</p>
+<p id="720556" class="block-content">
+Aturan otorisasi untuk halaman ditetapkan dalam <a href="?page=Configurations.PageConfig">konfigurasi halaman</a> seperti berikut,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code2">
+<authorization>
+ <allow pages="PageID1,PageID2"
+ users="User1,User2"
+ roles="Role1" />
+ <deny pages="PageID1,PageID2"
+ users="?"
+ verb="post" />
+</authorization>
+</com:TTextHighlighter>
+<p id="720557" class="block-content">
+Aturan otorisasi bisa berupa aturan <tt>mengijinkan</tt> atau aturan <tt>menolak</tt>. Setiap aturan terdiri dari empat properti opsional:
+</p>
+<ul id="u1" class="block-content">
+<li><tt>pages</tt> - daftar nama halaman dipisahkan koma yang menerapkan aturan ini. Jika kosong atau tidak disetel, aturan ini akan berlaku ke semua halaman di bawah direktori saat ini dan seluruh subdirektorinya secara rekursif.</li>
+<li><tt>users</tt> - daftar nama pengguna yang menerapkan aturan dipisahkan koma di mana aturan ini berlaku. Karakter * menunjukan semua pengguna termasuk pengguna anonim/tamu. Karakter ? menunjukan pengguna anonim/tamu . Dan karakter @ menunjukan pengguna terotentikasi (tersedia sejak v3.1).</li>
+<li><tt>roles</tt> - daftar aturan pengguna yang menerapkan aturan ini.</li>
+<li><tt>verb</tt> - metode akses halaman yang memberlakukan aturan ini. Ia bisa berupa <tt>get</tt> atau <tt>post</tt>. Jika kosong atau tidak disetel, aturan berlaku untuk kedua metode tersebut.</li>
+</ul>
+
+<p id="720558" class="block-content">
+Ketika permintaan halaman sedang diproses, daftar aturan otorisassi menjadi tersedia. Akan tetapi, hanya aturan <i>efektif yang pertama</i> <i>menyamai</i> pengguna saat ini akan menyajikan hasil otorisasi.
+</p>
+<ul id="u2" class="block-content">
+<li>Aturan diurut dari bawak-ke atas, misalnya aturan yang berisi dalam konfigurasi dari folder halaman saat ini menjadi yang pertama. Aturan dalam konfigurasi dari folder halaman leluhurnya menjadi yang berikutnya.</li>
+<li>Sebuah aturan efektif jika halaman saat ini dalam halaman yang didaftarkan pada aturan DAN aksi pengguna saat ini (<tt>get</tt> ata <tt>post</tt>) dalam aksi terdaftar.</li>
+<li>Sebuah aturan sama terjadi jika nama pengguna saat ini ada dalam daftar nama pengguna pada aturan <i>efektif</i> ATAU jika aturan pengguna ada dalam aturan terdaftar yang mengaturnya.</li>
+<li>Jika tidak ada aturan yang sama, pengguna diotorisasi.</li>
+</ul>
+<p id="720559" class="block-content">
+Dalam contoh di atas, pengguna anonim akan ditolak atas penulisan ke <tt>PageID1</tt> dan <tt>PageID2</tt>, sementara <tt>User1</tt> dan <tt>User2</tt> dan semua pengguna aturan <tt>Role1</tt> bisa mengakses dua halaman (baik metode <tt>get</tt> maupun <tt>post</tt>).
+</p>
+
+<h2 id="5504">Menggunakan <tt>TUserManager</tt></h2>
+<p id="720560" class="block-content">
+Seperti telah disebutkan di atas, <tt>TUserManager</tt> menerapkan database pengguna hanya-baca. Informasi pengguna ditetapkan baik dalam konfigurasi aplikasi ataupun file XML eksternal.
+</p>
+<p id="720561" class="block-content">
+Kita telah melihat contoh di atas yang menggunakan duapengguna ditetapkan dalam konfigurasi aplikasi. Sintaks lengkap atas penetapan pengguna dan informasi aturan adalah sebagi berikut,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code3">
+<user name="demo" password="demo" roles="demo,admin" />
+<role name="admin" users="demo,demo2" />
+</com:TTextHighlighter>
+<p id="720562" class="block-content">
+di mana atribut <tt>roles</tt> dalam elemen <tt>user</tt> adalah opsional. Aturan pengguna dapat ditetapkan baik dalam elemen <tt>user</tt> ataupun dalam elemen <tt>role</tt> terpisah.
+</p>
+
+<h2 id="5505">Menggunakan <tt>TDbUserManager</tt></h2>
+<p id="720563" class="block-content">
+<tt>TDbUserManager</tt> diperkenalkan dalam v3.1.0. Tujuan utamanya adalah untuk menyederhanakan tugas pengaturan akun pengguna yang disimpan dalam sebuah database. Ini membutuhkan para pengembang untuk menulis kelaspengguna yang mewakili informasi yang diperlukan untuk akun pengguna. Kelas pengguna harus diperluas dari <tt>TDbUser</tt>.
+</p>
+<p id="720564" class="block-content">
+Untuk menggunakan <tt>TDbUserManager</tt>, konfigurasi itu dalam konfigurasi aplikasi seperti berikut:
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code4">
+<module id="db"
+ class="System.Data.TDataSourceConfig" ..../>
+<module id="users"
+ class="System.Security.TDbUserManager"
+ UserClass="Path.To.MyUserClass"
+ ConnectionID="db" />
+<module id="auth"
+ class="System.Security.TAuthManager"
+ UserManager="users" LoginPage="Path.To.LoginPage" />
+</com:TTextHighlighter>
+
+</p>
+<p id="720565" class="block-content">
+Dalam contoh di atas, <tt>UserClass</tt> menetapkan bahwa kelas akan dipakai untuk membuat turunan pengguna. Kelas harus diperluas dari <tt>TDbUser</tt>. <tt>ConnectionID</tt> merujuk ke ID dari modul <tt>TDataSourceConfig</tt> yang menetapkan bagaimana untuk melakukan koneksi database guna mendapatkan informasi penggunanya.
+</p>
+<p id="720566" class="block-content">
+Kelas pengguna harus menerapkan dua metode abstrak dalam <tt>TDbUser</tt>: <tt>validateUser()</tt> dan <tt>createUser()</tt>. Karena informasi akun pengguna disimpan dalam sebuah database, kelas pengguna dapat menggunakan properti <tt>DbConnection</tt>-nya untuk menjangkau database.
+</p>
+
+<div class="last-modified">$Id: Auth.page 2012 2007-06-15 16:09:57Z xue $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Collections.page b/demos/quickstart/protected/pages/Advanced/id/Collections.page new file mode 100644 index 00000000..acd821f7 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Collections.page @@ -0,0 +1,135 @@ +<com:TContent ID="body" >
+
+<h1 id="5501">Koleksi</h1>
+<p id="710529" class="block-content">
+Koleksi adalah struktur data dasar dalam pemrograman. Sebagai tambahan pada pemrograman PHP, array dipakai secara luas untuk mewakili koleksi struktur data. Array PHP adalah campuran dari array berindeks-kardinal dan tabel campuran.
+</p>
+<p id="710530" class="block-content">
+Untuk menghidupkan manipulasi obyek-terorientasi atas koleksi, PRADO menyediakan kelas koleksi bertenaga. Diantaranya, <tt>TList</tt> dan <tt>TMap</tt> adalah yang paling mendasar dan biasanya melayani sebagai basis kelas untuk kelas koleksi lainnya. Karena banyak komponen PRADO memiliki properti yang bertipe koleksi, penting bagi para pengembang untuk menguasai pemakaian kelas koleksi PRADO.
+</p>
+
+<h2 id="5502">Menggunakan <tt>TList</tt></h2>
+<p id="710531" class="block-content">
+Obyek <tt>TList</tt> mewakili array berindeks-kardinal, misalnya array (obyek) dengan indeks 0, 1, 2, ...
+</p>
+<p id="710532" class="block-content">
+<tt>TList</tt> bisa dipakai seperti array PHP. Sebagai contoh,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code1">
+$list=new TList; // buat obyek list
+...
+$item=$list[$index]; // baca item pada indeks yang ditetapkan
+$list[]=$item; // tambah item di akhir
+$list[$index]=$item; // ganti item pada indeks yang ditetapkan
+unset($list[$index]); // hapus item di posisi $index
+if(isset($list[$index])) // uji apakah daftar memiliki item di posisi $index
+foreach($list as $index=>$item) // jelajahi setiap item dalam daftar
+</com:TTextHighlighter>
+
+<p id="710533" class="block-content">
+Untuk memperoleh jumlah item dalam daftar, gunakan properti <tt>Count</tt>. Catatan, jangan gunakan <tt>count($list)</tt>, karena ia selalu mengembalikan 1.
+</p>
+
+<p id="710534" class="block-content">
+Sebagai tambahan, <tt>TList</tt> menerapkan beberapa metode yang nyaman untuk dipakai secara umum guna memanipulasi data dalam sebuah daftar. Ini termasuk
+</p>
+<ul id="u1" class="block-content">
+ <li><tt>clear()</tt>: membersihkan seluruh item dalam daftar.</li>
+ <li><tt>contains()</tt>: menguji apakah daftar berisi item yang ditetapkan.</li>
+ <li><tt>indexOf()</tt>: mendapatkan indeks berbasis-nol dari item yang ditetapkan dalam daftar.</li>
+ <li><tt>toArray()</tt>: mengembalikan perwakilan array atas item dalam daftar.</li>
+ <li><tt>copyFrom()</tt>: mempopulasikan daftar dengan data dari array atau obyek yang bisa dijelajahi (termasuk <tt>TList</tt>). Item yang sudah ada akan dihapus terlebih dahulu.</li>
+ <li><tt>mergeWith()</tt>: menambahkan daftar dengan data dari array atau obyek yang bisa dijelajahi (termasuk <tt>TList</tt>).</li>
+</ul>
+
+<h3 id="5504">Menggunakan properti komponen berbasis-<tt>TList</tt></h3>
+<p id="710535" class="block-content">
+Seperti telah disebutkan di atas, banyak properti komponen PRADO didasarkan pada <tt>TList</tt> atau kelas koleksi berasal dari <tt>TList</tt>. Properti ini semuanya berbagi pemakaian tersebut di atas.
+</p>
+<p id="710536" class="block-content">
+Sebagai contoh, <tt>TControl</tt> (basis kelas untuk semua kontrol PRADO) mempunyai properti yang disebut <tt>Controls</tt> yang mewakili koleksi dari kontrol anak. Tipe <tt>Controls</tt> adalah <tt>TControlCollection</tt> yang memperluas <tt>TList</tt>. Oleh karena itu, untuk menambahkan kontrol anak baru, kita dapat menggunakan cara berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code2">
+$control->Controls[]=$newControl;
+</com:TTextHighlighter>
+<p id="710537" class="block-content">
+Untuk menjelajahi melalui kontrol anak, kita bisa menggunakan,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code3">
+foreach($control->Controls as $childControl) ...
+</com:TTextHighlighter>
+<p id="710538" class="block-content">
+Controh lain adalah properti <tt>Items</tt>, tersedia dalam kontrol list, <tt>TRepeater</tt>, <tt>TDataList</tt> dan <tt>TDataGrid</tt>. Dalam kontrol ini, kelas leluhur dari <tt>Items</tt> adalah <tt>TList</tt>.
+</p>
+
+<h3 id="5505">Memperluas <tt>TList</tt></h3>
+<p id="710539" class="block-content">
+Seringkali kita ingin memperluas <tt>TList</tt> untuk melakukan operasi tambahan untuk setiap penambahan atau penghapusan sebuah item. Satu-satunya metode yang diperlukan kelas anak untuk mengganti adalah <tt>insertAt()</tt> dan <tt>removeAt()</tt>. Sebagai contoh, untuk memastikan daftar hanya berisi item yang bertipe <tt>TControl</tt>, kita dapat mengganti <tt>insertAt()</tt> sebagai berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code4">
+public function insertAt($index,$item)
+{
+ if($item instanceof TControl)
+ parent::insertAt($index,$item)
+ else
+ throw new Exception('TControl required.');
+}
+</com:TTextHighlighter>
+
+
+<h2 id="5503">Menggunakan <tt>TMap</tt></h2>
+<p id="710540" class="block-content">
+Obyek <tt>TMap</tt> mewakili tabel campuran (atau kami katakan array berindeks-string).
+</p>
+<p id="710541" class="block-content">
+Mirip dengan <tt>TList</tt>, <tt>TMap</tt> bisa dipakai layaknya sebuah array,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code5">
+$map=new TMap; // buat obyek map
+...
+$map[$key]=$value; // tambah pasangan kunci-nilai
+unset($map[$key]); // hapus nilai dengan kunci yang ditetapkan
+if(isset($map[$key])) // apakah map berisi kunci
+foreach($map as $key=>$value) // jelajahi item dalam map
+</com:TTextHighlighter>
+<p id="710542" class="block-content">
+Properti <tt>Count</tt> memberikan jumlah item dalam map sementara properti <tt>Keys</tt> mengembalikan daftar kunci yang dipakai dalam map.
+</p>
+
+<p id="710543" class="block-content">
+Metode berikut disediakan oleh <tt>TMap</tt> demi kenyamanan,
+</p>
+<ul id="u2" class="block-content">
+ <li><tt>clear()</tt>: menghapus semua item dalam map.</li>
+ <li><tt>contains()</tt>: menguji apakah map berisi kunci yang ditetapkan.</li>
+ <li><tt>toArray()</tt>: mengembalikan perwakilan array dari item dalam map.</li>
+ <li><tt>copyFrom()</tt>: mempopulasikan map dengan data dari array atau obyek yang bisa dijelajahi (termasuk <tt>TMap</tt>). Item yang sudah ada akan dihapus terlebih dulu.</li>
+ <li><tt>mergeWith()</tt>: menambahkan map dengan data dari array atau obyek yang bisa dijelajahi (termasuk <tt>TMap</tt>).</li>
+</ul>
+
+<h3 id="5506">Penggunaan <tt>TAttributeCollection</tt></h3>
+<p id="710544" class="block-content">
+<tt>TAttributeCollection</tt> adalah kelas khusus yang diperluas dari <tt>TMap</tt>. Ia dipakai terutama oleh properti <tt>Attributes</tt> dari <tt>TControl</tt>.
+</p>
+Selain fungsionalitas normal yang disediakan oleh <tt>TMap</tt>, <tt>TAttributeCollection</tt> membolehkan anda untuk mendapatkan dan menyetel item koleksi seperti mendapatkan dan menyetel properti. Sebagai contoh,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code6">
+$collection->Label='value'; // sama dengan: $collection['Label']='value';
+echo $collection->Label; // sama dengan: echo $collection['Label'];
+</com:TTextHighlighter>
+<p id="710545" class="block-content">
+Catatan, dalam <tt>$collection</tt> di atas TIDAK mempunyai properti <tt>Label</tt>.
+</p>
+<p id="710546" class="block-content">
+Tidak seperti <tt>TMap</tt>, kunci dalam <tt>TAttributeCollection</tt> tidak sensitif huruf. Oleh karena itu <tt>$collection->Label</tt> sama dengan <tt>$collection->LABEL</tt>.
+</p>
+<p id="710547" class="block-content">
+Karena fitur baru di atas, ketika berhadapan dengan properti <tt>Attributes</tt> dari kontrol, kita dapat mengambil keuntungan dari konsep subproperti dan mengkonfigurasi nilai atribut kontrol dalam sebuah template seperti berikut,
+</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code7">
+<com:TButton Attributes.onclick="if(!confirm('Are you sure?')) return false;" .../>
+</com:TTextHighlighter>
+<p id="710548" class="block-content">
+yang menambahkan atribut bernama <tt>onclick</tt> ke kontrol <tt>TButton</tt>.
+</p>
+<div class="last-modified">$Id: Collections.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Error.page b/demos/quickstart/protected/pages/Advanced/id/Error.page new file mode 100644 index 00000000..4224c551 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Error.page @@ -0,0 +1,77 @@ +<com:TContent ID="body" >
+
+<h1 id="6301">Penanganan Kesalahan dan Laporan</h1>
+<p id="800666" class="block-content">
+PRADO menyediakan kerangka kerja penanganan kesalahan dan laporan lengkap berdasarkan pada mekanisme eksepsi dari PHP 5.
+</p>
+
+<h2 id="6302">Kelas Eksepsi</h2>
+<p id="800667" class="block-content">
+Kesalahan yang terjadi dalam aplikasi PRADO dapat diklasifikasikan ke dalam tiga kategori: kesalahan yang disebabkan oleh penguraian naskah PHP, kode yang salah (seperti memanggil fungsi yang tidak didefinisikan, menyetel properti yang tidak dikenal), dan yang disebabkan oleh pemakaian yang tidak benar pada aplikasi Web oleh pengguna klien (seperti mencoba untuk mengakses halaman terbatas). PRADO tidak dapat berhadapan dengan kesalahan kategori pertama karena tidak dapat ditangkap dalam kode PHP. PRADO menyediakan sebuah hirarki eksepsi untuk berhadapan dengan kategori kedua dan ketiga.
+</p>
+<p id="800668" class="block-content">
+Semua kesalahan dalam aplikasi PRADO digambarkan sebagai eksepsi. Basis kelas untuk seluruh eksepsi PRADO adalah <tt>TException</tt>. Ia menyediakan fungsionalitas internasionalisasi pesan bagi semua eksepsi sistem. Pesan kesalahan dapat diterjemahkan ke dalam bahasa yang berbeda tergantung pada preferensi bahasa browser pengguna.
+</p>
+<p id="800669" class="block-content">
+Eksepsi muncul karena pemakaian yang tidak benar dari kerangka kerja PRADO yang diturunkan dari <tt>TSystemException</tt>, yang bisa berupa salah satu dari kelas eksepsi berikut:
+</p>
+<ul id="u1" class="block-content">
+<li><tt>TConfigurationException</tt> - konfigurasi salah, seperti kesalahan dalam konfigurasi aplikasi, template kontrol, dll.</li>
+<li><tt>TInvalidDataValueException</tt> - nilai data tidak benar atau tidak diharapkan.</li>
+<li><tt>TInvalidDataTypeException</tt> - tipe data tidak benar atau tidak diharapkan.</li>
+<li><tt>TInvalidDataFormatException</tt> - format data tidak benar.</li>
+<li><tt>TInvalidOperationException</tt> - permintaan operasi tidak benar.</li>
+<li><tt>TPhpErrorException</tt> - kesalahan PHP dapat ditangkap, peringatan, perhatian, dll.</li>
+<li><tt>TSecurityException</tt> - kesalahan terkait dengan keamanan.</li>
+<li><tt>TIOException</tt> - kesalahan operasi IO, seperti kegagalan membuka file.</li>
+<li><tt>TDBException</tt> - kesalahan terkait dengan operasi database.</li>
+<li><tt>TNotSupportedException</tt> - kesalahan disebabkan oleh permintaan dari fitur yang tidak didukung.</li>
+<li><tt>THttpException</tt> - kesalahan untuk ditampilkan ke pengguna klien Web.</li>
+</ul>
+<p id="800670" class="block-content">
+Kesalahan karena pemakaian yang salah dari aplikasi Web oleh pengguna klien diturunkan dari <tt>TApplicationException</tt>.
+</p>
+
+<h2 id="6303">Memunculkan Eksepsi</h2>
+<p id="800671" class="block-content">
+Memunculkan eksepsi dalam PRADO tidak berbeda dengan memunculkan eksepsi normal PJHP. Satu hal yang sama adalah untuk memunculkan eksepsi yang benar. Secara umum, eksepsi yang ditujukan untuk ditampilkan ke pengguna aplikasi harus menggunakan <tt>THttpException</tt>, sementara eksepsi yang ditampilkan bagi para pengembang harus menggunakan kelas eksepsi lain.
+</p>
+
+<h2 id="6304">Penangkapan Kesalahan dan Pelaporan</h2>
+<p id="800672" class="block-content">
+Eksepsi muncul selama menjalankan aplikasi PRADO ditangkap oleh modul <tt>System.Exceptions.TErrorHandler</tt>. Template output berbeda dipakai untuk menampilkan eksepsi yang ditangkap. <tt>THttpException</tt> dianggap berisi pesan kesalahan yang ditujukan untuk aplikasi pengguna akhir dan kemudian menggunakan grup template khusus. Untuk semua eksepsi lainnya, template umum ditampilkan seperti berikut dipakai untuk menyajikan eksepsi.
+</p>
+<a href="<%~ exception2.gif %>" target="_blank"><img src="<%~ exception.gif %>" alt="exception page" style="border:0px"/></a>
+
+<h2 id="6305">Mengkustomisasi Tampilan Kesalahan</h2>
+<p id="800673" class="block-content">
+Para pengembang dapat mengkustomisasi penyajian pesan kesalahan. Standarnya, semua template output kesalahan disimpan dalam <tt>framework/Exceptions/templates</tt>. Lokasi dapat diubah dengan mengkonfigurasi <tt>TErrorHandler</tt> dalam konfigurasi aplikasi,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_800226">
+<module id="error"
+ class="TErrorHandler"
+ ErrorTemplatePath="Application.ErrorTemplates" />
+</com:TTextHighlighter>
+<p id="800674" class="block-content">
+<tt>THttpException</tt> menggunakan satu set template yang dibedakan berdasarkan pada nilai properti <tt>StatusCode</tt> yang berbeda dari <tt>THttpException</tt>. <tt>StatusCode</tt> memiliki arti yang sama seperti kode status dalam protokol HTTP. Sebagai contoh, kode status yang sama dengan 404 berarti URL yang diminta tidak ditemukan pada server. File template output menggunakan konvensi penamaan berikut:
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_800227">
+ error<status code>-<language code>.html
+</com:TTextHighlighter>
+<p id="800675" class="block-content">
+di mana <tt>status code</tt> merujuk ke nilai properti <tt>StatusCode</tt> dari <tt>THttpException</tt>, dan <tt>kode bahasa</tt> harus bahasa yang benar seperti misalnya <tt>en</tt>, <tt>zh</tt>, <tt>fr</tt>, dll. Ketika <tt>THttpException</tt> muncul, PRADO akan memilih template yang sesuai untuk menampilkan pesan eksepsi. Pertama PRADO akan mencari file template yang namanya berisi kode status dan yang bahasanya lebih disukai oleh jendela browser klien. Jika template seperti itu tidak ada, ia akan mencari template yang memiliki kode status yang sama tapi tanpa kode bahasa.
+</p>
+<p id="800676" class="block-content">
+Konvensi penamaan untuk file template yang dipakai bagi semua eksepsi adalah sebagai berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_800228">
+ exception-<language code>.html
+</com:TTextHighlighter>
+<p id="800677" class="block-content">
+Sekali lagi, jika bahasa yang diinginkan tidak ditemukan, sebaliknya PRADO akan mencoba menggunakan <tt>exception.html</tt>.
+</p>
+<div class="note">
+<b class="tip">PERHATIAN:</b> Ketika menyimpan file template, pastikan file disimpan menggunakan pengkodean UTF-8. Pada Windows, anda bisa menggunakan <tt>Notepad.exe</tt> untuk melakukan penyimpanan tersebut.
+</div>
+
+<div class="last-modified">$Id: Error.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/I18N.page b/demos/quickstart/protected/pages/Advanced/id/I18N.page new file mode 100644 index 00000000..675257f0 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/I18N.page @@ -0,0 +1,336 @@ +<com:TContent ID="body" >
+
+<h1 id="6201">Internasionalisasi (I18N) dan Lokalisasi (L10N)</h1>
+<p id="790625" class="block-content">Banyak aplikasi web dibangun dengan PHP tidak memikirkan internasionlisasi saat ia pertama kali ditulis. Itu mungkin dikarenakan tidak dimaksudkan untuk digunakan dalam bahasa dan kultur. Internasionalisasi adalah aspek penting karena meningkatkan adopsi Internet dalam banyak negara yang berbicara non-Ingris. Proses internasionalisasi dan lokalisasi akan mengandung kesulitan. Di bawah adalah beberapa petunjuk umum untuk menginternasionalisasi aplikasi yang sudah ada.</p>
+
+<h2 id="6203">Pisahkan data sensitif kultur/lokal</h2>
+
+<p id="790626" class="block-content">Identifikasi dan pisahkan data yang beragam dengan kultur. Yang paling jelas adalah teks/string/pesan. Tipe lain dari data juga harus dipertimbangkan. Daftar berikut mengkategorikan beberapa contoh data sensitif kultur
+</p>
+
+<ul id="u1" class="block-content">
+ <li> String, Pesan, Teks, dalam unit relatif kecil (misalnya prasa, kalimat, paragraf, tapi tidak teks lengkap dari buku).</li>
+ <li> Label pada tombol.</li>
+ <li> File bantuan, unit besar teks, teks statis.</li>
+ <li> Suara.</li>
+ <li> Warna.</li>
+ <li> Grafik,Ikon.</li>
+ <li> Tanggal, Jam.</li>
+ <li> Angka, Kurs, Pengukuran.</li>
+ <li> Nomor Telepon.</li>
+ <li> Penghargaan dan titel personal.</li>
+ <li> Alamat pos.</li>
+ <li> Tata letak halaman.</li>
+</ul>
+
+<p id="790627" class="block-content">Bila memungkinkan semua ragam teks harus diisolasi dan disimpan dalam format persisten. Teks ini termasuk, pesan kesalahan aplikasi, string ditulis tangan dalam file PHP, email, teks statis HTML, dan teks pada elemen formulir (misalnya tombol).</p>
+
+<h2 id="6204">Konfigurasi</h2>
+<p id="790628" class="block-content">Untuk menghidupkan fitur lokalisasi dalam PRADO, anda perlu menambahkan beberapa opsi konfigurasi dalam <a href="?page=Configurations.AppConfig">konfigurasi aplikasi</a> anda.
+Pertama anda perlu menyertakan namespace <tt>System.I18N.*</tt> ke path anda.
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_790203">
+<paths>
+ <using namespace="System.I18N.*" />
+</paths>
+</com:TTextHighlighter>
+
+<p id="790629" class="block-content">Kemudian, jika anda ingin menterjemahkan beberapa teks dalam aplikasi anda, anda perlu menambahkan sumber data pesan terjemahan.</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_790204">
+<module id="globalization" class="TGlobalization">
+ <translation type="XLIFF"
+ source="MyApp.messages"
+ marker="@@"
+ autosave="true" cache="true" />
+</module>
+</com:TTextHighlighter>
+
+<p id="790630" class="block-content">Di mana <tt>source</tt> dalam <tt>translation</tt> adalah path titik ke direktori di mana anda akan menyimpan katalog pesan terjemahan. Atribut <tt>autosave</tt> jika dihidupkan, menyimpan pesan tidak diterjemahkan kembali ke dalam katalog pesasn.
+Dengan menghidupkan <tt>cache</tt>, pesan yang diterjemahkan disimpan dalam direktori aplikasi <tt>runtime/i18n</tt>.
+Nilai <tt>marker</tt> dipakai untuk mengelilingi teks yang tidak diterjemahkan.
+</p>
+
+<p id="790631" class="block-content">Dengan konfigurasi lengkap, sekarang kita dapat mulai melokalisasi aplikasi anda. Jika anda menghidupkan <tt>autosave</tt>, setelah menjalankan aplikasi anda dengan beberapa aktivitas lokalisasi (misalnya menterjemahkan beberapa teks), anda akan melihat sebuah direktori dan <tt>messages.xml</tt> dibuat di dalam direktori <tt>source</tt>.</p>
+
+<h2 id="6205">Apa yang harus dilakukan dengan <tt>messages.xml</tt>?</h2>
+<p id="790632" class="block-content">File katalog pesan terjemahan, jika menggunakan <tt>type="XLIFF"</tt>, adalah format intechange XML pesan terjemahan distandarisasi. Anda bisa mengedit file XML menggunakan editor yang mampu menangani UTF-8. Format dari XML adalah sesuatu mirip seperti berikut ini.</p>
+
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_790205">
+<?xml version="1.0"?>
+<xliff version="1.0">
+ <file original="I18N Example IndexPage"
+ source-language="EN"
+ datatype="plaintext"
+ date="2005-01-24T11:07:53Z">
+ <body>
+
+<trans-unit id="1">
+<source>Hello world.</source>
+<target>Hi World!!!</target>
+</trans-unit>
+
+ </body>
+ </file>
+</xliff>
+</com:TTextHighlighter>
+
+Setiap pesan terjemahan dilapisi dengan tag <tt>trans-unit</tt>, di mana <tt>source</tt> adalah pesan asli, dan <tt>target</tt> adalah pesan yang diterjemahkan. Editor seperti <a href="http://www.heartsome.net/EN/xlfedit.html">Heartsome XLIFF Translation Editor</a> dapat membantu mengedit file XML ini.
+
+
+<h2 id="6206">Menyetel dan Mengubah Kultur</h2>
+<p id="790633" class="block-content">Sekali globalisasi dihidupkan, anda dapat mengakses setelan globalisasi, seperti <tt>Culture</tt>, <tt>Charset</tt>, dll, menggunakan </p>
+<com:TTextHighlighter CssClass="source block-content" id="code_790206">
+$globalization = $this->getApplication()->getGlobalization();
+echo $globalization->Culture;
+$globalization->Charset= "GB-2312"; //ubah charset
+</com:TTextHighlighter>
+
+<p id="790634" class="block-content">Anda juga mengubah cara kultur ditentukan dengan mengubah atribut <tt>class</tt> dalam konfigurasi modul. Sebagai contoh, untuk menyetel kultur yang tergantung pada setelan browser, anda bisa menggunakan kelas <tt>TGlobalizationAutoDetect</tt>.
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_790207">
+<module id="globalization" class="TGlobalizationAutoDetect">
+ ...
+</module>
+</com:TTextHighlighter>
+
+<p id="790635" class="block-content">Anda juga bisa menyediakan kelas globalisasi sendiri untuk mengubah bagaimana kultur aplikasi ditetapkan.
+Terakhir, anda dapat mengubah setelan globalisasi dengan basis halaman demi halaman menggunakan <a href="?page=Configurations.Templates1#tct">tag kontrol template</a>. Sebagai contoh, mengubah <tt>Culture</tt> ke "zh".</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790208">
+<%@ Application.Globalization.Culture="zh" %>
+</com:TTextHighlighter>
+
+<h2 id="6207">Melokalisasi aplikasi PRADO anda</h2>
+Ada dua area dalam aplikasi anda yang mungkin membutuhkan lokalisasi pesan atau string, dalam kode PHP dan dalam template. Untuk melokalisasi string di dalam PHP, gunakan fungsi <tt>localize</tt> yang dijelaskan di bawah. Untuk melokalisasi teks dalam template, gunakan komponen <a href="#ttranslate">TTranslate</a>.
+<h2 id="6208">Menggunakan fungsi <tt>localize</tt> untuk menterjemahkan teks dalam PHP</h2>
+
+<p id="790636" class="block-content">Fungsi <tt>localize</tt> mencari string yang diterjemahkan yang sama dengan aslinya dari sumber terjemahan anda. Pertama, anda perlu mencari semua teks dikode langsung dalam PHP yang ditampilkan atau dikirimkan ke pengguna akhir. Contoh berikut melokalisasi teks <tt>$sender</tt> (menganggap, katakanlah, sender adalah sebuah tombol). Kode asli sebelum lokalisasi adalah sebagai berikut.
+<com:TTextHighlighter CssClass="source block-content" id="code_790209">
+function clickMe($sender,$param)
+{
+ $sender->Text="Hello, world!";
+}
+</com:TTextHighlighter>
+
+<p id="790637" class="block-content">Pesan dikodekan langsung "Hello, world!" dilokalisasi menggunakan fungsi <tt>localize</tt>. </p>
+<com:TTextHighlighter CssClass="source block-content" id="code_790210">
+function clickMe($sender,$param)
+{
+ $sender->Text=Prado::localize("Hello, world!");
+}
+</com:TTextHighlighter>
+
+<h2 id="6209">Pesan Gabungan</h2>
+
+<p id="790638" class="block-content">Pesan gabungan dapat berisi data variabel. Sebagai contoh, dalam pesan "There are 12 users online.", integer 12 dapat berubah tergantung pada beberapa data dalam aplikasi anda. Ini sulit diterjemahkan karena posisi dari data variabel mungkin berbeda untuk bahasa yang berbeda. Seabgai tambahan, bahasa yang berbeda memiliki aturannya sendiri untuk bentuk jamak (jika ada) dan/atau pembilang. Contoh berikut tidak mudah untuk diterjemahkan, karena struktur kalimat sudah tetap dengan dikodekan langsung data variabel dengan pesan.</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_790211">
+$num_users = 12;
+$message = "There are " . $num_users . " users online.";
+</com:TTextHighlighter>
+
+Masalah ini bisa dipecahkan menggunakan fungsi <tt>localize</tt> dengan penempatan string. Sebagai contoh, string <tt>$message</tt> di atas dapat dibentuk seperti berikut.
+<com:TTextHighlighter CssClass="source block-content" id="code_790212">
+$num_users = 12;
+$message = Prado::localize("There are {num_users} users online.", array('num_users'=>$num_users));
+</com:TTextHighlighter>
+<p id="790639" class="block-content">Di mana parameter kedua dalam <tt>localize</tt> mengambil array asosiatif dengan kunci sebagai penempatan yang dicari dalam teks dan menggantinya dengan nilai terkait.
+Fungsi <tt>localize</tt> tidak memecahkan masalah lokalisasi bahasa yang memiliki bentuk jamak, solusinya adalah menggunakan <a href="#choice-format">TChoiceFormat</a>.</p>
+
+<p id="790640" class="block-content">The following sample demonstrates the basics of localization in PRADO.</p>
+<com:RunBar PagePath="Advanced.Samples.I18N.Home" />
+
+<h1 id="6202">Komponen I18N</h1>
+<a name="ttranslate"></a>
+<h2 id="6210">TTranslate</h2>
+<p id="790641" class="block-content">Pesan dan string bisa dilokalisasi dalam PHP atau dalam template.
+Untuk menterjemahkan pesan atau string dalam template, gunakan <tt>TTranslate</tt>.</p>
+
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790213">
+<com:TTranslate>Hello World</com:TTranslate>
+<com:TTranslate Text="Goodbye" />
+</com:TTextHighlighter>
+
+<p id="790642" class="block-content"><tt>TTranslate</tt> juga dapat melakukan penempatan string. Properti <tt>Parameters</tt> bisa digunakan untuk menambah pasangan nama nilai untuk penempatan. Substring dalam terjemahan dikurung dengan "{" dan "}" yang dianggap sebagai nama parameter selama pencarian penempatan. Contoh berikut akan menempatkan substring "{time}" dengan nilai atribut parameter "<tt>Parameters.time=<%= time() %></tt>".
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790214">
+<com:TTranslate Parameters.time=<%= time() %> >
+The time is {time}.
+</com:TTranslate>
+</com:TTextHighlighter>
+
+<p id="790643" class="block-content">Kependekan dari <tt>TTranslate</tt> juga disediakan menggunakan sintaks berikut.</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790215">
+<%[string]%>
+</com:TTextHighlighter>
+<p id="790644" class="block-content">di mana string akan diterjemahkan ke bahasa berbeda berdasarkan preferensi bahasa pengguna akhir. Sintaks ini bisa dipakai dengan nilai atribut juga.</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790216">
+<com:TLabel Text="<%[ Hello World! ]%>" />
+</com:TTextHighlighter>
+
+<h2 id="6211">TDateFormat</h2>
+<p id="790645" class="block-content">Memformat tanggal dan jam dilokalisasi adalah pekerjaan langsung.</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790217">
+<com:TDateFormat Value="12/01/2005" />
+</com:TTextHighlighter>
+
+<p id="790646" class="block-content">Properti <tt>Pattern</tt> menerima 4 predefininisi pola tanggal dilokalisasi dan 4 predefininisi pola jam dilokalisasi.</p>
+<ul id="u2" class="block-content">
+ <li><tt>fulldate</tt></li>
+ <li><tt>longdate</tt></li>
+ <li><tt>mediumdate</tt></li>
+ <li><tt>shortdate</tt></li>
+ <li><tt>fulltime</tt></li>
+ <li><tt>longtime</tt></li>
+ <li><tt>mediumtime</tt></li>
+ <li><tt>shorttime</tt></li>
+</ul>
+<p id="p1" class="block-content">
+Predefinisi bisa dipakai dalam setiap kombinasi. Jika menggunakan pola predefinisi gabungan, pola pertama harus tanggal, diikuti oleh spasi, dan terakhir pola jam. Sebagai contoh, pola tanggal lengkap dengan pola jam pendek. Aktual uruta dari tanggal-jam dan pola aktual akan ditentukan secara otomatis dari data lokal yang ditetapkan oleh properti <tt>Culture</tt>.</p>
+
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790218">
+<com:TDateFormat Pattern="fulldate shorttime" />
+</com:TTextHighlighter>
+
+<p id="790647" class="block-content">Anda dapat menetapkan pola kustom menggunakan sub-pola berikut.
+Format tanggal/jam ditetapkan dalam arti pola waktu string. Dalam pola ini, semua huruf ASCII disimpan sebagai huruf pola, yang ditetapkan sebagai berikut:
+<com:TTextHighlighter Language="text" CssClass="source block-content" id="code_790219">
+ Simbol Arti Penyajian Contoh
+------ ---- --------- ------
+ G tanda abad (Teks) AD
+ y tahun (Angka) 1996
+ M bulan dalam tahun (Teks & Angka) July & 07
+ d hari dalam bulan (Angka) 10
+ h jam dalam am/pm (1~12) (Angka) 12
+ H jam dalam hari (0~23) (Angka) 0
+ m menit dalam jam (Angka) 30
+ s detik dalam menit (Angka) 55
+ E hari dalam minggu (Teks) Tuesday
+ D hari dalam tahun (Angka) 189
+ F hari minggu dalam bulan (Angka) 2 (2nd Wed in July)
+ w minggu dalam tahun (Angka) 27
+ W minggu dalam bulan (Angka) 2
+ a tanda am/pm (Teks) PM
+ k jam dalam hari (1~24) (Angka) 24
+ K jam dalam am/pm (0~11) (Angka) 0
+ z zona waktu (Jam) Pacific Standard Time
+ ' tanda kutip teks (Delimiter) 'Date='
+ '' tanda kutip tunggal (Literal) 'o''clock'
+</com:TTextHighlighter>
+</p>
+
+<p id="790648" class="block-content">Jumlah pola huruf menentukan format.</p>
+
+<p id="790649" class="block-content">(Teks): 4 huruf menggunakan bentuk lengkap, kurang dari 4 menggunakan bentuk pendek atau singkatan
+jika ada. (misalnya "EEEE" menghasilkan "Monday", "EEE" menghasilkan "Mon")</p>
+
+<p id="790650" class="block-content">(Angka): jumlah digit minimum. Angka lebih pendek adalah diisi-nol ke jumlah ini (misalnya jika "m" menghasilkan "6", "mm" menghasilkan "06"). Tahun ditangani secara khusus; yakni jika jumlah 'y' adalah 2, Tahun akan dipotong 2 digit. (misalnya jika "yyyy" menghasilkan "1997", "yy" menghasilkan "97".)
+ Tidak seperti field lain, pecahan detik dipadatkan pada sisi kanan dengan nol.</p>
+
+<p id="790651" class="block-content">(Teks dan Angka): 3 atau lebih, pakai teks, sebaliknya pakai angka. (misalnya
+"M" menghasilkan "1", "MM" menghasilkan "01", "MMM" menghasilkan "Jan", and "MMMM"
+menghasilkan "January".)</p>
+
+<p id="790652" class="block-content">Setiap karakter dalam pola yang tidak dalam jangkauan ['a'..'z']
+dan ['A'..'Z'] akan diperlakukan sebagai teks bertanda kutip. Contohnya, karakter seperti
+':', '.', ' ', dan '@' akan muncul dalam hasil teks waktu
+meskipun tidak dikurung dalam tanda kutip tunggal.</p>
+
+<p id="790653" class="block-content">Contoh menggunakan lokal US:
+
+<com:TTextHighlighter Language="text" CssClass="source block-content" id="code_790220">
+Pola Formasi Hasil
+------------ -----
+"yyyy.MM.dd G 'at' HH:mm:ss" ->> 1996.07.10 AD at 15:08:56
+"EEE, MMM d, ''yy" ->> Wed, Jul 10, '96
+"h:mm a" ->> 12:08 PM
+"hh 'o''clock' a, z" ->> 12 o'clock PM, Pacific Daylight Time
+"K:mm a" ->> 0:00 PM
+"yyyy.MMMM.dd G hh:mm a" ->> 1996.July.10 AD 12:08 PM
+</com:TTextHighlighter>
+</p>
+
+<p id="790654" class="block-content">Jika properti <tt>Value</tt> tidak ditetapkan, tanggal dan jam saat ini yang dipakai.</p>
+
+<h2 id="6212">TNumberFormat</h2>
+<p id="790655" class="block-content">Kerangka kerja Internasionalisasi PRADO menyediakan pembentukan kurs lokal dan pembentukan angka. Harap dicatat bahwa komponen <tt>TNumberFormat</tt> hanya menyediakan pembentukan, saat ini ia tidak melakukan konversi atau pertukaran.</p>
+
+<p id="790656" class="block-content">Numbers can be formatted as currency, percentage, decimal or scientific
+numbers by specifying the <tt>Type</tt> attribute. The valid types are:</p>
+<ul id="u3" class="block-content">
+ <li><tt>currency</tt></li>
+ <li><tt>percentage</tt></li>
+ <li><tt>decimal</tt></li>
+ <li><tt>scientific</tt></li>
+</ul>
+
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790221">
+<com:TNumberFormat Type="currency" Value="100" />
+</com:TTextHighlighter>
+
+<p id="790657" class="block-content">Properti <tt>Culture</tt> dan <tt>Currency</tt> dapat ditetapkan untuk membentuk angka spesifik lokal. </p>
+
+<p id="790658" class="block-content">Jika seseorang dari US ingin melihat gambar penjualan dari sebuah toko dalam bahasa Jerman (katakanlah menggunakan kurs EURO), diformat menggunakan kurs jerman, anda perlu untuk menggunakan atribut <tt>Culture="de_DE"</tt> guna memperoleh kurs yang benar, misalnya 100,00$. Pemisah desimal dan pengelompokan kemudian juga dari lokal <tt>de_DE</tt>. Ini dapat menimbulkan beberapa kebingungan karena orang dari US memakai "," (koma) sebagai pemisah ribuan. Oleh karena itu, atribut <tt>Currency</tt> tersedia agar output dari hasil contoh berikut menghasilkan $100.00
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790222">
+<com:TNumberFormat Type="currency"
+ Culture="en_US" Currency="EUR" Value="100" />
+</com:TTextHighlighter>
+</p>
+
+<p id="790659" class="block-content">Properti <tt>Pattern</tt> menetapkan jumlah digit, posisi pengelompokan ribuan, jumlah titik desimal dan posisi desimal. Karakter aktual yang dipakai untuk menyajikan titik desimal dan titik ribuan adalah spesifik kultur dan akan berubah secara otomatis berdasarkan properti <tt>Culture</tt>. Karakter <tt>Pattern</tt> yang benar adalah:</p>
+<ul id="u6" class="block-content">
+ <li><tt># (kris)</tt> - mewakili digit opsional</li>
+ <li><tt>0 (nol)</tt> - mewakili digit mandatori, nol di kiri terisi</li>
+ <li><tt>. (berhenti)</tt> - posisi titik desimal (hanya 1 titik desimal dibolehkan)</li>
+ <li><tt>, (koma)</tt> - pemisahan titik ribuan (sampai 2 koma dibolehkan)</li>
+</ul>
+<p id="p2" class="block-content">
+Sebagai contoh, anggap <tt>Value="1234567.12345"</tt> dan dengan
+<tt>Culture="en_US"</tt> (yang menggunakan "," untuk titik pemisah ribuan dan "." untuk pemisah desimal).
+</p>
+<com:TTextHighlighter Language="text" CssClass="source block-content" id="code_790223">
+Pola Output
+---- ------
+##,###.00 ->> 1,234,567.12
+##,###.## ->> 1,234,567.12345
+##,##.0000 ->> 1,23,45,67.1235
+##,###,##.0 ->> 12,345,67.1
+000,000,000.0 ->> 001,234,567.1
+</com:TTextHighlighter>
+</p>
+
+<h2 id="6213">TTranslateParameter</h2>
+<p id="790660" class="block-content">Pesan gabungan, misalnya penempatan string, bisa dilakukan dengan <tt>TTranslateParameter</tt>.
+Dalam contoh berikut, string "{greeting}" dan "{name}" masing-masing akan diganti dengan nilai "Hello" dan "World". Penempatan string harus dikurung dengan "{" dan "}". Parameter selanjutnya diterjemahkan dengan menggunakans <tt>TTranslate</tt>.
+
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790224">
+<com:TTranslate>
+ {greeting} {name}!
+ <com:TTranslateParameter Key="name">World</com:TTranslateParameter>
+ <com:TTranslateParameter Key="greeting">Hello</com:TTranslateParameter>
+</com:TTranslate>
+</com:TTextHighlighter>
+
+
+<a name="choice-format"></a>
+<h2 id="6214">TChoiceFormat</h2>
+
+<p id="790661" class="block-content">Menggunakan fungsi <tt>localize</tt> atau komponen <tt>TTranslate</tt> untuk menterjemahkan pesan tidak memberitahu penterjemah kardinalitas dari data yang diminta untuk menentukan struktur jamak yang benar yang dipakai. Ia hanya memberitahunya bahwa ada data tersedia, data dapat berupa apa saja. Selanjutnya, penterjemah tidak akan bisa menentukan dengan memperhatikan penempatan data plural yang benar, struktur bahasa atau prasa yang dipakai. Misalnya dalam bahasa Inggris, untuk menterjemahkan kalimat, "There are {number} of apples.", hasil terjemahan akan berbeda tergantung pada <tt>jumlah</tt> apel.</p>
+
+<p id="790662" class="block-content">Komponen <tt>TChoiceFormat</tt> melakukan pilihan terjemahan pesan/string. Contoh berikut mendemonstrasikan terjemahan pesan 2 pilihan sederhana.</p>
+
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_790225">
+<com:TChoiceFormat Value="1"/>[1] One Apple. |[2] Two Apples</com:TChoiceFormat>
+</com:TTextHighlighter>
+
+<p id="790663" class="block-content">Dalam contoh di atas, <tt>Value</tt> "1" (satu), kemudian string yang diterjemahkan adalah "One Apple". Jika <tt>Value</tt> adalah "2", maka ia akan menampilkan "Two Apples".</p>
+
+<p id="790664" class="block-content">Pilihan pesan/string dipisashkan oleh pipa "|" diikuti oleh set notasi dari formulir.</p>
+<ul id="u7" class="block-content">
+ <li><tt>[1,2]</tt> -- menerima nilai antara 1 dan 2, inklusif.</li>
+ <li><tt>(1,2)</tt> -- menerima nilai antara 1 dan 2, kecuali 1 dan 2.</li>
+ <li><tt>{1,2,3,4}</tt> -- hanya nilai yang didefinisikan dalam set yang diterima.</li>
+ <li><tt>[-Inf,0)</tt> -- menerima nilai lebih besar dari atau sama dengan infinitif negatif dan kurang dari 0</li>
+</ul>
+
+<p id="790665" class="block-content">Setiap kombinasi tidak-kosong dari kurung kotak dan bulat dapat diterima.
+String yang dipilih untuk tampilan tergantung pada properti <tt>Value</tt>. <tt>Value</tt> dievaluiasi untuk setiap set-nya sampai <tt>Value</tt> ditemukan milik set tertentu.</p>
+
+
+<div class="last-modified">$Id: I18N.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Logging.page b/demos/quickstart/protected/pages/Advanced/id/Logging.page new file mode 100644 index 00000000..aa8cbb8e --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Logging.page @@ -0,0 +1,61 @@ +<com:TContent ID="body" >
+
+<h1 id="6101">Pencatatan</h1>
+<p id="780615" class="block-content">
+PRADO menyediakan fungsionalitas sangat fleksibel dan bisa diperluas. Pesan yang dicatat dapat diklasifikasikan berdasarkan tingkat catatan dan kategori pesan. Menggunakan tingkat dan katkegori filter, pesan selanjutnya bisa dialihkan ke tujuan yang berbeda, seperti file, email, jendela browser, dll. Diagram berikut memperlihatkan arsitektur dasar dari mekanisme pencatatan PRADO,
+</p>
+<img src="<%~ logrouter.gif %>" alt="Pengalih catatan" />
+
+<h2 id="6102">Menggunakan Fungsi Pencatatan</h2>
+<p id="780616" class="block-content">
+Dua metode berikut disediakan untuk mencatat pesan dalam PRADO,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_780201">
+Prado::log($message, $logLevel, $category);
+Prado::trace($message, $category);
+</com:TTextHighlighter>
+<p id="780617" class="block-content">
+Perbedaan antara <tt>Prado::log()</tt> dan <tt>Prado::trace()</tt> adalah bahwa yang kedua memilih secara otomatis tingkat catatan berdasarkan mode aplikasi. Jika aplikasi dalam mode <tt>Debug</tt>, informasi pelacakan stack ditambahkan ke pesan. <tt>Prado::trace()</tt> dipakai secara luas dalam kode inti kerangka kerja PRADO.
+</p>
+
+<h2 id="6103">Pengalihan Pesan</h2>
+<p id="780618" class="block-content">
+Pesan yang dicatat menggunakan dua fungsi di atas dipelihara dalam memori. Untuk menggunakan pesan, para pengembang perlu mengalihkannya ke tujuan tertentu seperti file, email, atau jendela browser. Pengalihan pesan diatur oleh modul <tt>System.Util.TLogRouter</tt>. Ketika dimasukan ke dalam aplikasi, ia bisa mengalihkan pesan ke tujuan yang berbeda secara paralel. Saat ini PRADO menyediakan tiga jenis rute:
+</p>
+<ul id="u1" class="block-content">
+ <li><tt>TFileLogRoute</tt> - pesan yang disaring disimpan dalam file log yang ditetapkan. Standarnya, file ini bernama <tt>prado.log</tt> di bawah direktori dari aplikasi. Perputaran file disediakan.</li>
+ <li><tt>TEmailLogRoute</tt> - pesan yang disaring dikirimkan ke alamat email yang ditetapkan sebelumnya.</li>
+ <li><tt>TBrowserLogRoute</tt> - pesan yang disaring ditambahkan ke akhir output halaman saat ini.</li>
+</ul>
+<p id="780619" class="block-content">
+Untuk menghidupkan pengalihan pesan, masukan dan konfigurasi modul <tt>TLogRouter</tt> dalam konfigurasi aplikasi,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_780202">
+<module id="log" class="System.Util.TLogRouter">
+ <route class="TBrowserLogRoute"
+ Levels="Info"
+ Categories="System.Web.UI.TPage, System.Web.UI.WebControls" />
+ <route class="TFileLogRoute"
+ Levels="Warning, Error"
+ Categories="System.Web" />
+</module>
+</com:TTextHighlighter>
+<p id="780620" class="block-content">
+Dalam contoh di atas, <tt>Levels</tt> dan <tt>Categories</tt> menetapkan log dan filter kategori untuk mengambil secara selektif pesan ke tujuan terkait.
+</p>
+
+<h2 id="6104">Penyaringan Pesan</h2>
+<p id="780621" class="block-content">
+Pesan bisa disaring berdasarkan tingkat catatan serta kategorinya. Setiap catatan pesan dikaitkan dengan tingkat dan kategori catatan. Dengan tingkat dan kategori, para pengembang dapat mengambil pesan secara selektif yang menarik bagi mereka.
+</p>
+<p id="780622" class="block-content">
+Tingkat catatan didefinisikan dalam <tt>System.Util.TLogger</tt> termasuk: <tt>DEBUG</tt>, <tt>INFO</tt>, <tt>NOTICE</tt>, <tt>WARNING</tt>, <tt>ERROR</tt>, <tt>ALERT</tt>, <tt>FATAL</tt>. Pesan bisa disaring berdasarkan kriteria tingkat catatan. Sebagai contoh, jika sebuah filter menetapkan tingkat <tt>WARNING</tt> dan <tt>ERROR</tt>, maka hanya pesan tersebut yakni <tt>WARNING</tt> and <tt>ERROR</tt> yang akan dikembalikan.
+</p>
+<p id="780623" class="block-content">
+Kategori pesan adalah hirarkis. Kategori yang namanya awalan dari yang lain disebut menjadi leluhur kategori atas kategori lainnya. Sebagai contoh, kategori <tt>System.Web</tt> adalah leluhur dari kategori <tt>System.Web.UI</tt> dan <tt>System.Web.UI.WebControls</tt>. Pesan bisa diambil secara selektif menggunakan filter kategori hirarkis tersebut. Sebagai contoh, jika filter kategori adalah <tt>System.Web</tt>, maka semua pesan dalam <tt>System.Web</tt> dikembalikan. Sebagai tambahan, pesan dalam kategori anak seperti <tt>System.Web.UI.WebControls</tt>, juga dikembalikan.
+</p>
+<p id="780624" class="block-content">
+Dengan ketentuan, pesan yang dicatat dalam kode inti PRADO dikategorikan berdasarkan namespace dari kelas terkait. Sebagai contoh, pesan yang dicatat dalam <tt>TPage</tt> akan menjadi kategori <tt>System.Web.UI.TPage</tt>.
+</p>
+
+<div class="last-modified">$Id: Logging.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/MasterContent.page b/demos/quickstart/protected/pages/Advanced/id/MasterContent.page new file mode 100644 index 00000000..45a3ab08 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/MasterContent.page @@ -0,0 +1,57 @@ +<com:TContent ID="body" >
+
+<h1 id="5801">Master dan Konten</h1>
+<p id="750587" class="block-content">
+Halaman dalam aplikasi Web sering berbagi bagian yang sama. Sebagai contoh, semua halaman dari aplikasi tutorial berbagi bagian header dan footer yang sama. Jika kita menyimpan header dan footer secara berulang dalam setiap file sumber halaman, ia akan memusingkan pemeliharaan jika suatu saat kita menginginkan sesuatu pada header atau footer. Untuk memecahkan masalah ini, PRADO memperkenalkan konsep master dan konten. Ini terutama pola dekorator, dengan konten didekorasi oleh master.
+</p>
+<p id="750588" class="block-content">
+Master dan konten hanya berlaku ke kontrol template (kontrol memperluas <tt>TTemplateControl</tt> atau kelas anaknya). Kontrol template dapat mempunyai paling banyak satu kontrol master dan satu atau beberapa konten (masing-masing diwakili oleh kontrol <tt>TContent</tt>). Konten akan disisipkan ke dalam kontrol master di tempat yang disiapkan oleh kontrol <tt>TContentPlaceHolder</tt>. Dan penyajian kontrol template adalah <tt>TContentPlaceHolder</tt> yang disiapkan kontrol master diganti dengan <tt>TContent</tt>.
+</p>
+<p id="750589" class="block-content">
+Sebagai contoh, anggap kontrol template mempunyai template berikut:
+</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_750192">
+<%@ MasterClass="MasterControl" %>
+<com:TContent ID="A" >
+content A
+</com:TContent >
+<com:TContent ID="B" >
+content B
+</com:TContent >
+<com:TContent ID="B" >
+content B
+</com:TContent >
+</com:TTextHighlighter>
+<p id="750590" class="block-content">
+yang menggunakan <tt>MasterControl</tt> sebagai kontrol masternya. Kontrol master mempunyai template berikut,
+</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_750193">
+other stuff
+<com:TContentPlaceHolder ID="A" />
+other stuff
+<com:TContentPlaceHolder ID="B" />
+other stuff
+<com:TContentPlaceHolder ID="C" />
+other stuff
+</com:TTextHighlighter>
+<p id="750591" class="block-content">
+Kemudian, konten disisipkan ke dalam kontrol master berdasarkan diagram berikut, sementara hubungan leluhur-anak dapat dilihat dalam berikutnya. Catatan, kontrol template mengabaikan apapun dalam template selain konten, sementara kontrol master memelihara apapun dan mengganti tempat konten dengan konten berdasarkan ID yang sama.
+</p>
+<img src=<%~ mastercontent.gif %> alt="Master dan Konten" />
+<img src=<%~ pcrelation.gif %> alt="Hubungan leluhur-anak antara master dan konten" />
+
+<h2 id="6301">Master vs. Template Eksternal</h2>
+<p id="750592" class="block-content">
+Master sangat mirip dengan template eksternal yang diperkenalkan sejak versi 3.0.5. <a href="?page=Configurations.Templates1">Tag include</a> khusus dipakai untuk menyertakan file template eksternal ke dalam basis template.
+</p>
+<p id="750593" class="block-content">
+Baik template master maupun eksternal bisa dipakai untuk berbagi konten yang sama diantara halaman. Master adalah kontrol template yang berisi konten umum dan file kelasnya berisi logika terkait dengan master. Dilain pihak, template eksternal adalah file template murni tanpa file kelas apapun.
+</p>
+<p id="750594" class="block-content">
+Oleh karena itu, gunakan kontrol master jika konten umum harus dikaitkan dengan beberapa logika, seperti header halaman dengan kotak pencarian atau kotak login. Kontrol master membolehkan anda untuk menetapkan bagaimana konten umum harus berinteraksi dengan pengguna akhir. Jika anda menggunakan template eksternal, anda harus menyimpan logika yang diperlukan dalam halaman atau kelas kontrol yang memiliki basis template.
+</p>
+<p id="750595" class="block-content">
+Performansinya, template eksternal lebih ringan daripada master seperti berisi kontrol sendiri yang berparisipasi dalam masa hidup halaman, karena pembentuk hanya dipakai saat template sedang diuraikan.
+</p>
+
+<div class="last-modified">$Id: MasterContent.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Performance.page b/demos/quickstart/protected/pages/Advanced/id/Performance.page new file mode 100644 index 00000000..e655ee62 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Performance.page @@ -0,0 +1,88 @@ +<com:TContent ID="body" >
+
+<h1 id="6401">Penyesuaian Performansi</h1>
+<p id="810678" class="block-content">
+Performansi aplikasi Web dipengaruhi oleh banyak faktor. Akses database, operasi sistem file, bandwidth jaringan adalah faktor pengaruh potensial. PRADO mencoba dalam setiap usaha untuk mengurangi akibat performansi yang disebabkan oleh kerangka kerja.
+</p>
+
+<h2 id="6402">Caching</h2>
+<p id="810679" class="block-content">
+PRADO menyediakan teknik cache generik yang dipakai oleh beberapa bagian inti kerangka kerja. Sebagai contoh, ketika cache dihidupkan, <tt>TTemplateManager</tt> akan menyimpan template yang diurai dalam cache dan menggunakannya kembali dalam permintaan berikut, yang menghemat waktu penguraian template. <tt>TThemeManager</tt> mengadopsi strategi yang mirip untuk berhadapan dengan penguraian tema.
+</p>
+<p id="810680" class="block-content">
+Menghidupkan cache sangat mudah. Cukup tambahkan modul cache dalam konfigurasi aplikasi, dan PRADO memelihara semuanya.
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_810229">
+<modules>
+ <module id="cache" class="System.Caching.TSqliteCache" />
+</modules>
+</com:TTextHighlighter>
+
+<p id="810681" class="block-content">
+Para pengembang juga bisa mengambil keuntungan dari teknik cache dalam aplikasinya. Properti <tt>Cache</tt> dari <tt>TApplication</tt> mengembalikan modul cache yang dimasukan bila ia tersedia. Untuk menyimpan dan mengambil item data dari dalam cache, gunakan perintah berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_810230">
+if($application->Cache) {
+ // menyimpan item data ke cache
+ $application->Cache->set($keyName,$dataItem);
+ // mengambil item data dari cache
+ $dataItem=$application->Cache->get($keyName);
+}
+</com:TTextHighlighter>
+<p id="810682" class="block-content">
+di mana <tt>$keyName</tt> harus berupa string yang secara unik mengidentifikasi item data yang disimpan dalam cache.
+</p>
+
+<p id="840059" class="block-content">
+Sejak v3.1.0, kontrol baru bernama <a href="?page=Controls.OutputCache">TOutputCache</a> telah diperkenalkan. Kontrol ini membolehkan para pengguna untuk men-cache bagian-bagian dari output halaman. Bila dipakai dengan benar, teknik ini bisa meningkatkan performansi halaman secara signifikan karena kontrol di dalamnya tidak dibuat sama sekali jika versi yang di-cache diminta.
+</p>
+
+<h2 id="6403">Menggunakan <tt>pradolite.php</tt></h2>
+<p id="810683" class="block-content">
+Banyak file naskah PHP yang disertakan dapat mempengaruhi performansi aplikasi secara signifikan. Kelas PRADO disimpan dalam file berbeda dan ketika memproses sebuah permintaan halaman, ia bisa menyertakan puluhan file kelas. Untuk mengurangi masalah ini, setiap rilis PRADO, sebuah file bernama <tt>pradolite.php</tt> juga disertakan. File ini adalah gabungan dari seluruh file kelas inti PRADO dengan komentar dan pencatatan pesannya yang sudah dibuang.
+</p>
+<p id="810684" class="block-content">
+Untuk menggunakan <tt>pradolite.php</tt> dalam naskah entri aplikasi, ganti penyertaan <tt>prado.php</tt> dengan <tt>pradolite.php</tt>.
+</p>
+
+<h2 id="6404">Mengubah Mode Aplikasi</h2>
+<p id="810685" class="block-content">
+Mode aplikasi juga mempengaruhi performansi aplikasi. Aplikasi PRADO dapat berupa salah satu dari mode berikut: <tt>Off</tt>, <tt>Debug</tt>, <tt>Normal</tt> dan <tt>Performance</tt>. Mode <tt>Debug</tt> harus dipakai terutama selama pengembangan aplikasi, sementara mode <tt>Normal</tt> biasanya dipakai dalam tahap berikutnya setelah aplikasi disebarkan guna memastikan semuanya berjalan dengan baik. Setelah aplikasi terbukti bekerja stabil, selanjutnya mode bisa dialihkan ke <tt>Performance</tt> untuk meningkatkan performansi.
+</p>
+<p id="810686" class="block-content">
+Perbedaan antara mode <tt>Debug</tt>, <tt>Normal</tt> dan <tt>Performance</tt> yaitu di bawah mode <tt>Debug</tt>, catatan aplikasi akan berisi informasi debug, dan di bawah mode <tt>Performance</tt>, pemeriksaan cap waktu tidak dilakukan untuk template yang di-cache dan asset yang dipublikasikan. Oleh karena itu, di bawah mode <tt>Performance</tt>, aplikasi mungkin tidak berjalan dengan baik jika template atau asset dimodifikasi. Karena mode <tt>Performance</tt> dipakai terutama saat aplikasi sudah stabil, mengubah template atau asset tidak disukai.
+</p>
+<p id="810687" class="block-content">
+Untuk berganti mode aplikasi, konfigurasi itu dalam konfigurasi aplikasi:
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_810231">
+<application Mode="Performance" >
+ ......
+</application >
+</com:TTextHighlighter>
+
+<h2 id="6405">Mengurangi Ukuran Halaman</h2>
+<p id="810688" class="block-content">
+Standarnya PRADO menyimpan kondisi halaman dalam field tersembunyi dari output HTML. Kondisi halaman bisa berukuran sangat besar jika menggunakan kontrol yang kompleks, seperti <tt>TDataGrid</tt>. Guna mengurangi ukuran besarnya halaman yang dikirimkan melalui jaringan, dua strategi dapat dipakai.
+</p>
+<p id="810689" class="block-content">
+Pertama, anda dapat mematikan kondisi tampilan dengan menyetel <tt>EnableViewState</tt> menjadi false untuk halaman atau beberapa kontrol pada halaman jika pengguna tidak perlu berinteraksi dengan halaman/kontrol.
+</p>
+<p id="810690" class="block-content">
+Kedua, anda bisa menggunakan penyimpanan kondisi halaman berbeda. Sebagai contoh, kondisi halaman bisa disimpan dalam sesi, yang menyimpan kondisi halamaa terutama pada sisi server dan menghemat waktu transmisi jaringan. Properti <tt>StatePersisterClass</tt> dari halaman menentukan kelas persisten kondisi yang dipakai. Standarnya menggunakan <tt>System.Web.UI.TPageStatePersister</tt> untuk menyimpan kondisi persisten dalam field tersembunyi. Anda bisa mengubah properti ini ke kelas persisten anda sendiri, selama kelas persister menerapkan antarmuka <tt>IPageStatePersister</tt>. Anda dapat mengkonfigurasi properti ini dalam beberapa tempat, seperti konfigurasi aplikasi atau konfigurasi halaman menggunakan tag <pages> or <page>,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_810232">
+<pages StatePersisterClass="MyPersister1" ... >
+ <page ID="SpecialPage" StatePersisterClass="MyPersister2" ... />
+</pages>
+</com:TTextHighlighter>
+<p id="810691" class="block-content">
+Catatan, dalam <tt>SpecialPage</tt> di atas akan menggunakan <tt>MyPersister2</tt> sebagai kelas persisternya, sementara halaman lainnya akan menggunakan <tt>MyPersister1</tt>. Oleh karena itu, anda dapat memiliki strategi perister kondisi untuk halaman yang berbeda.
+</p>
+
+<h2 id="6406">Teknik Lainnya</h2>
+<p id="810692" class="block-content">
+Teknik cache server terbukti sangat efektif meningkatkan performansi aplikasi PRADO. Sebagai contoh, kita telah mengamati bahwa dengan menggunakan Zend Optimizer, RPS (request per second) dari aplikasi PRADO bisa meningkat lebih dari sepuluh kali. Tentunya, ini merupakan harga dari output yang stabil, sementara teknik cache PRADO selalu memastikan kebenaran output.
+</p>
+
+<div class="last-modified">$Id: Performance.page 1902 2007-05-07 04:17:37Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Scripts.page b/demos/quickstart/protected/pages/Advanced/id/Scripts.page new file mode 100644 index 00000000..b18899d1 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Scripts.page @@ -0,0 +1,334 @@ +<com:TContent ID="body" >
+<h1 id="6501">Pengenalan Javascript</h1>
+Bimbingan ini berdasarkan pada <a href="http://www.sergiopereira.com/articles/advjs.html">
+Bimbingan cepat bagi tur JavaScript tingkat lanjut dengan beberapa fitur OO</a> oleh Sergio Pereira.
+
+<h2 id="6502">Hey, Saya tidak tahu anda bisa melakukannya</h2>
+<p id="820693" class="block-content">
+ Jika anda adalah seorang pengembang web developer dan datang dari tempat yang sama seperti saya, anda mungkin telah mengenal sedikit Javascript dalam halaman web anda, terutama sebagai perekat UI.
+</p>
+<p id="820694" class="block-content">
+
+ Sampai saat ini, saya tahu bahwa Javascript mempunyai kemampuan OO daripada ketika saya dipekerjakan, tetapi saya tidak merasa perlu menggunakannya. Karena browser mulai mendukung set fitur Javascript dan DOM lebih distandarisasikan, itu menjadi semangat untuk menulis kode yang lebih fungsional dan kompleks untuk dijalankan pada klien. Itu membantu kelahiran fenomena AJAX.
+</p>
+<p id="820695" class="block-content">
+ Saat kita mulai mempelajari apa yang diperlukan untuk menulis aplikasi AJAX yang baik, kita mulai memperhatikan bahwa Javascript yang kita pakai benar-benar berada di puncak gunung es.
+ Sekarang kita melihat Javascript dipakai melampaui pekerjaan UI sehari-hari yang sederhana seperti validasi input dan tugas-tugas kecil. Kode klien sekarang jauh lebih maju dan berlapis, lebih mirip aplikasi desktop sebenarnya atau klien tebal dari klien-server. Kita melihat librari kelas, model obyek, hirarki, pola, dan banyak hal lain yang dapat kita pakai hanya dalam kode di dalam server.
+</p>
+<p id="820696" class="block-content">
+ Dalam banyak cata kita dapat mengatakan bahwa dengan tiba-tiba palang ditaruh lebih tinggi dari sebelumnya. Ia mengambil palang pintu lebih ahli menulis aplikasi untuk Web baru dan kita perlu mengingkatkan keahlian Javascript kita agar bisa sampai ke sana.
+ Jika anda mencoba untuk menggunakan banyak librari javascript yang ada di luar sana, seperti
+ <a href="http://prototype.conio.net/">Prototipe.js</a>,
+ <a href="http://script.aculo.us/">Scriptaculous</a>,
+ <a href="http://moofx.mad4milk.net/">moo.fx</a>,
+ <a href="http://bennolan.com/behaviour/">Perilaku</a>,
+ <a href="http://developer.yahoo.net/yui/">YUI</a>,
+ dan lain-lain, anda secara kebetulan akan menemukan diri anda sendiri sedang membaca kode JS. Mungkin dikarenakan anda ingin mempelajari bagaimana mereka melakukannya, atau karena anda penasaran, atau lebih sering karena itulah satu-satunya cara untuk memahami bagaimana untuk memakainya, karena dokumentasi nampaknya tidak banyak ditujukan terutama terhadap librari ini. Apapun kasusnya, anda akan menghadapi teknik kung-fu yang akan menjadi asing dan menakutkan jika anda belum melihat itu sebelumnya.
+</p>
+
+<p id="820697" class="block-content">
+ Kegunaan dari artikel ini tepatnya menjelaskan tipe konstruksi yang banyak dari kita belum terbiasa dengannya.
+</p>
+
+
+<h2 id="6503">JSON (JavaScript Object Notation)</h2>
+<p id="820698" class="block-content">
+ JavaScript Object Notation (<a href="http://www.json.org/">JSON</a>,) adalah salah satu dari isu baru yang muncul sekitar tema AJAX. JSON, cukup dikatakan suatu cara mendeklarasikan obyek dalam Javascript. Mari kita lihat contoh segera dan perhatikan bagaimana kemudahannya.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820233">
+var myPet = { color: 'black', leg_count: 4, communicate: function(repeatCount){
+for(i=0;i<repeatCount;i++) alert('Woof!');} };
+</com:TTextHighlighter>
+
+<p id="820699" class="block-content">
+ Mari kita tambahkan sedikit pembentukan agar terlihat lebih mirip bagaimana kita biasa menemukannya di sana:
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820234">
+var myPet =
+{
+ color: 'black',
+ legCount: 4,
+ communicate: function(repeatCount)
+ {
+ for(i=0;i<repeatCount;i++)
+ alert('Woof!');
+ }
+};
+</com:TTextHighlighter>
+<p id="820700" class="block-content">
+ Di sini kita membuat referensi ke obyek dengan dua properti (<tt>color</tt>
+ dan <tt>legCount</tt>) serta metode (<tt>communicate</tt>.)
+ Tidak sulit untuk memahami bahwa properti obyek dan metode didefinisikan sebagai daftar dipisahkan koma. Masing-masing anggota diperkenalkan dengan nama, diikuti oleh titik dua dan kemudian definisi. Dalam hal properti, ini cukup mudah, hanya nilai properti. Metode yang dibuat dengan penempatan fungsi anonim, yang akan kami jelaskan lebih baik di bawah baris.
+ Setelah obyek dibuat dan ditempatkan ke variabel <tt>myPet</tt>, kita dapat menggunakanya seperti ini:
+</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820235">
+alert('my pet is ' + myPet.color);
+alert('my pet has ' + myPet.legCount + ' legs');
+//jika anda anjing, mengonggong tiga kali:
+myPet.communicate(3);
+</com:TTextHighlighter>
+<p id="820701" class="block-content">
+ Anda akan melihat JSON banyak dipakai di mana saja dalam JS baru-baru ini, sebagai argumen bagi fungsi, sebagai nilai hasil, sebagai respon server (dalam string,) dll.
+</p>
+
+<h2 id="6504">Apa yang anda maksud? Fungsi juga adalah sebuah obyek?</h2>
+<p id="820702" class="block-content">
+ Ini mungkin tidak biasa bagi para pengembang yang tidak pernah memikirkan tentang itu, tapi dalam fungsi JS adalah sebuah obyek. Anda bisa mengirimkan sebuah fungsi sebagai argumen terhadap fungsi lain sama seperti anda mengirimkan sebuah string, misalnya. Ini sering dipakai dan siap digunakan.
+</p>
+
+<p id="820703" class="block-content">
+ Lihat pada contoh ini. Kami akan mengirimkan fungsi ke fungsi lain yang akan memakainya.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820236">
+var myDog =
+{
+ bark: function()
+ {
+ alert('Woof!');
+ }
+};
+
+var myCat =
+{
+ meow: function()
+ {
+ alert('I am a lazy cat. I will not meow for you.');
+ }
+};
+
+function annoyThePet(petFunction)
+{
+ //let's see what the pet can do
+ petFunction();
+}
+
+//ganggu anjing:
+annoyThePet(myDog.bark);
+//ganggu kucing:
+annoyThePet(myCat.meow);
+</com:TTextHighlighter>
+<p id="820704" class="block-content">
+ Catatan bahwa kami mengirimkan myDog.bark dan myCat.meow tanpa menambahkan tanda kurung <tt>"()"</tt> kepadanya. Jika kita melakukan itu kita tidak mengirimkan fungsi, sebaliknya kita akan memanggil metode dan mengirimkan nilai hasilnya, <tt>tidak terdefinisi</tt> dalam kedua kasus di sini.
+</p>
+
+<p id="820705" class="block-content">
+ Jika anda ingin membuat kucing malas mulai mengeong, anda dapat dengan mudah melakukan ini:
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820237">
+myCat.meow = myDog.bark;
+myCat.meow(); //alerts 'Woof!'
+</com:TTextHighlighter>
+
+<h2 id="6505">Arrays, items, and object members</h2>
+<p id="820706" class="block-content">
+ Dua baris berikut dalam JS melakukan hal yang sama.
+</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820238">
+var a = new Array();
+var b = [];
+</com:TTextHighlighter>
+<p id="820707" class="block-content">
+ Karena saya yakin anda sudah mengetahuinya, anda dapat mengakses item individual dalam sebuah array menggunakan tanda kurung kotak:
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820239">
+var a = ['first', 'second', 'third'];
+var v1 = a[0];
+var v2 = a[1];
+var v3 = a[2];
+</com:TTextHighlighter>
+<p id="820708" class="block-content">
+
+ Tetapi anda tidak dibatasi pada indeks numerik. Anda bisa mengakses banyak obyek JS dengan menggunakan namanya, dalam sebuah string. Contoh berikut membuat obyek kosong, dan menambah beberapa anggotanya dengan nama.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820240">
+var obj = {}; //baru, obyek kosong
+obj['member_1'] = 'this is the member value';
+obj['flag_2'] = false;
+obj['some_function'] = function(){ /* lakukan sesuatu */};
+</com:TTextHighlighter>
+<p id="820709" class="block-content">
+ Kode di atas mempunyai pengaruh yang sama seperti berikut:
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820241">
+var obj =
+{
+ member_1:'this is the member value',
+ flag_2: false,
+ some_function: function(){ /* lakukan sesuatu */}
+};
+</com:TTextHighlighter>
+
+<p id="820710" class="block-content">
+ Dalam banyak cara, ide obyek dan array asosiatif (hashes) dalam JS tidak dibedakan. Dua baris berikut melakukan hal yang sama juga.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820242">
+obj.some_function();
+obj['some_function']();
+</com:TTextHighlighter>
+
+
+<h2 id="6506">Cukup tentang obyek, boleh saya memiliki kelas sekarang?</h2>
+<p id="820711" class="block-content">
+
+ Kekuatan besar dari bahasa pemrograman obyek berasal dari pemakaian kelas. Saya tidak berpikir telah menebak bagaimana kelas didefinisikan dalam JS hanya menggunakan pengalaman saya sebelumnya dengan bahasa lainnya. Nilailah bagi diri anda sendiri.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820243">
+//mendefinisikan kelas baru bernama Pet
+var Pet = function(petName, age)
+{
+ this.name = petName;
+ this.age = age;
+};
+
+//mari kita membuat obyek dari kelas Pet
+var famousDog = new Pet('Santa\'s Little Helper', 15);
+alert('This pet is called ' + famousDog.name);
+</com:TTextHighlighter>
+<p id="820712" class="block-content">
+ Mari kita lihat bagaimana kita menambahkan metode pada kelas <tt>Pet</tt> kita. Kita akan menggunakan properti <tt>prototype</tt> yang dimiliki oleh semua kelas. Properti <tt>prototype</tt> adalah sebuah obyek yang berisi semua anggota yang merupakan obyek yang akan dimiliki oleh kelas.
+ Bahkan kelas JS standarnya, seperti <tt>String</tt>, <tt>Number</tt>,
+ dan <tt>Date</tt> mempunyai obyek <tt>prototype</tt> yang bisa kita tambah metode serta propertinya dan menjadikan setiap obyek dari kelas itu secara otomatis mendapatkan anggota baru ini.
+</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820244">
+Pet.prototype.communicate = function()
+{
+ alert('I do not know what I should say, but my name is ' + this.name);
+};
+</com:TTextHighlighter>
+<p id="820713" class="block-content">
+ Itulah saatnya librari seperti <a href="http://www.sergiopereira.com/articles/prototype.js.html">prototype.js</a> siap digunakan. Jika kita menggunakan prototype.js, kita dapat membuat kode kita lebih bersih (setidaknya menurut saya.)
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820245">
+var Pet = Class.create();
+Pet.prototype =
+{
+ //'constructor' kita
+ initialize: function(petName, age)
+ {
+ this.name = petName;
+ this.age = age;
+ },
+
+ communicate: function()
+ {
+ alert('I do not know what I should say, but my name is ' + this.name);
+ }
+};
+</com:TTextHighlighter>
+
+<h2 id="6507">Fungsi sebagai argumen, pola yang menarik</h2>
+<p id="820714" class="block-content">
+ Jika anda tidak pernah bekerja dengan bahasa yang mendukung klosur anda akan mendapatkan idion berikut terlalu busuk.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820246">
+var myArray = ['first', 'second', 'third'];
+myArray.each( function(item, index)
+{
+ alert('The item in the position #' + index + ' is:' + item);
+});
+</com:TTextHighlighter>
+<p id="820715" class="block-content">
+
+ Wah! Mari kita jelaskan apa yang terjadi di sini sebelum anda memutuskan saya telah pergi terlalu jauh dan beralih ke artikel yang lebih baik dari yang ini.
+</p>
+<p id="820716" class="block-content">
+ Pertama, dalam contoh di atas kita menggunakan librari prototype.js, yang menambahkan setiap fungsi ke kelas array. Setiap fungsi menerima satu argumen yang adalah obyek fungsi. Fungsi ini, silah berganti akan dipanggil sekali untuk setiap item dalam array, mengirimkan dua argumen saat dipanggil, item dan indeks untuk item saat ini. Mari kita panggil fungsi ini sebagai fungsi pengulang kita.
+ Kita juga dapat menulis kode seperti ini.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820247">
+function myIterator(item, index)
+{
+ alert('The item in the position #' + index + ' is:' + item);
+}
+
+var myArray = ['first', 'second', 'third'];
+myArray.each( myIterator );
+</com:TTextHighlighter>
+<p id="820717" class="block-content">
+ Tapi ketika kita tidak ingin melakukan seperti semua anak sekolah, bukan?
+ Lebih serius, bagaimanapun juga, format terakhir ini lebih sederhana untuk dimengerti karena kita memasuki kode mencari fungsi myIterator. Adalah baik untuk memiliki logaika fungsi iterator di sana dalam tempat yang sama ia dipanggil. Juga, dalam hal ini, kitak tidak memerlukan fungsi iterator di manapun juga dalam kode kita, maka kita dapat mengubahnya ke dalam fungsi anonim tanpa hukuman.
+</p>
+
+<h2 id="6508"><tt>this</tt> ini tapi kadang-kadang juga <tt>this</tt> itu</h2>
+<p id="820718" class="block-content">
+
+ Salah satu masalah yang paling umum yang kita miliki dengan JS adalah saat kita mulai menulis kode kita, itulah kegunaan dari kata kunci <tt>this</tt>. Ini benar-benar menjadi tripwire.
+</p>
+<p id="820719" class="block-content">
+ Seperti disebutkan sebelumnya, sebuah fungsi juga adalah sebuah obyek dalam JS, dan adakalanya kita tidak memperhatikan bahwa kita mengirimkan sebuah fungsi.
+</p>
+<p id="820720" class="block-content">
+ Ambil potongan kode ini sebagai contoh.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820248">
+function buttonClicked()
+{
+ alert('button ' + this.id + ' was clicked');
+}
+
+var myButton = document.getElementById('someButtonID');
+var myButton2 = document.getElementById('someOtherButtonID');
+myButton.onclick = buttonClicked;
+myButton2.onclick = buttonClicked;
+</com:TTextHighlighter>
+<p id="820721" class="block-content">
+ Karena fungsi buttonClicked didefinisikan di luar obyek manapun kita cenderung berpikir kata kunci <tt>this</tt> akan berisi referensi ke
+ obyek <tt>window</tt> atau <tt>document</tt> (menganggap kode ini ada ditengah halaman HTML yang dilihat dalam browser.)
+</p>
+
+<p id="820722" class="block-content">
+ Tapi saat kita menjalankan kode ini kita melihat ia bekerja seperti yang dimaksudkan dan menampilkan <tt>id</tt> dari tombol yang diklik. Apa yang terjadi di sini adalah bahwa kita membuat metode onclick dari setiap tombol yang berisi referensi obyek <tt>buttonClicked</tt>, mengganti apapun yang ada di sana sebelumnya. Sekarang kapan saja tombol diklik, browser akan menjalankan sesuatu mirip dengan baris berikut.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820249">
+myButton.onclick();
+</com:TTextHighlighter>
+<p id="820723" class="block-content">
+
+ Itu tidak membingungkan sama sekali bukan? Tapi lihat apa yang terjadi, anda mulai memiliki obyek lain yang berhadapan dengannya dan anda ingi betindak pada obyek ini terhadap event seperti klik tombol.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820250">
+var myHelper =
+{
+ formFields: [ ],
+ emptyAllFields: function()
+ {
+ for(i=0; i < this.formFields.length; i++)
+ {
+ var elementID = this.formFields[i];
+ var field = document.getElementById(elementID);
+ field.value = '';
+ }
+ }
+};
+
+//beritahu kita ingin bekerja dengan field formulir yang mana
+myHelper.formFields.push('txtName');
+myHelper.formFields.push('txtEmail');
+myHelper.formFields.push('txtAddress');
+
+//membersihkan kotak teks:
+myHelper.emptyAllFields();
+
+var clearButton = document.getElementById('btnClear');
+clearButton.onclick = myHelper.emptyAllFields;
+</com:TTextHighlighter>
+<p id="820724" class="block-content">
+ Anda pikir bagus, sekarang saya dapat mengklik tombol Clear pada halaman saya dan tiga kotak teks itu akan dikosongkan. Kemudian anda mencoba mengklik tombol hanya untuk mendapatkan kesalahan runtime. Kesalahan akan terkait dengan
+ (tebak apa?) kata kunci <tt>this</tt>.
+ Masalahnya adalah bahwa <tt>this.formFields</tt> tidak didefinisikan jika
+ <tt>this</tt> berisi sebuah referensi ke tombol, tepatnya itulah apa yang terjadi. Satu solusi cepat adalah menulis ulang baris kode terakhir.
+</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_820251">
+clearButton.onclick = function()
+{
+ myHelper.emptyAllFields();
+};
+</com:TTextHighlighter>
+<p id="820725" class="block-content">
+ Cara itu kita membuat fungsi baru yang memanggil metode penolong di dalam konteks obyek penolong.
+</p>
+<div class="last-modified">$Id: Scripts.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Scripts1.page b/demos/quickstart/protected/pages/Advanced/id/Scripts1.page new file mode 100644 index 00000000..5d4d28ea --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Scripts1.page @@ -0,0 +1,86 @@ +<com:TContent ID="body" >
+
+<h1 id="6601">Catatan Pengembang untuk prototype.js</h1>
+Bimbingan ini didasarkan pada <a href="http://www.sergiopereira.com/articles/prototype.js.html">
+Catatan Pengembang untuk prototype.js</a> oleh Sergio Pereira.
+
+<h2 id="6603">Apa itu?</h2>
+<p id="830726" class="block-content">
+Dalam hal anda tidak pernah menggunakannya, <a href="http://prototype.conio.net">prototype.js</a> adalah librari
+ JavaScript yang ditulis oleh <a href="http://www.conio.net">Sam Stephenson</a>.
+ Pemikiran yang hebat ini dan kode <b>sesuai-standar</b> yang ditulis dengan baik mengambil banyak beban terkait dengan pembuatan halaman web sangat interaktif dan kaya yang mengkarakterkan Web 2.0 di belakang anda.
+</p>
+
+<p id="830727" class="block-content">
+ Jika anda baru saja mencoba menggunakan librari ini, anda mungkin mencatat bahwa dokumentasi bukanlah salah satu titik yang terkuat. Seperti banyak pengembang lain sebelum saya, saya mempelajari prototype.js dengan membaca kode sumber dan melakukan percobaan denganya. Saya pikir akan baik jika mengambil catatan selama saya mempelajari dan berbagi dengan orang lain.
+</p>
+<p id="830728" class="block-content">
+ Setelah anda membaca contoh dan referensi, para pengembang yang terbiasa dengan bahasa pemrograman Ruby akan mencatat kesamaan maksud antara kelas built-in Ruby dan banyak ekstensi diimplementasikan oleh librari ini.
+</p>
+
+
+<h2 id="6604">Menggunakan fungsi <tt>$()</tt></h2>
+<p id="830729" class="block-content">
+ Fungsi <tt>$()</tt> adalah jalan pintas yang siap digunakan untuk fungsi yang semua-terlalu-sering <tt>document.getElementById()</tt> terhadap DOM. Seperti fungsi DOM, fungsi ini mengembalikan elemen yang id-nya dikirimkan sebagai sebuah argumen.
+</p>
+
+<p id="830730" class="block-content">
+ Tidak seperti fungsi DOM, bagaimanapun juga, yang satu ini melampauinya. Anda dapat mengirimkan lebih dari satu id dan
+ <tt>$()</tt> akan mengembalikan obyek <tt>Array</tt> dengan semua elemen yang diminta. Contoh di bawah seharunya menggambarkan ini.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_830252">
+<com:TClientScript UsingClientScripts="prado" />
+<div id="myDiv">
+ <p id="830731" class="block-content">This is a paragraph</p>
+</div>
+
+<div id="myOtherDiv">
+ <p id="830732" class="block-content">This is another paragraph</p>
+</div>
+
+<input type="button" value=Test1 onclick="test1();" />
+<input type="button" value=Test2 onclick="test2();" />
+
+<script type="text/javascript">
+/*<![CDATA[*/
+function test1()
+{
+ var d = $('myDiv');
+ alert(d.innerHTML);
+}
+
+function test2()
+{
+ var divs = $('myDiv','myOtherDiv');
+ for(i=0; i<divs.length; i++)
+ {
+ alert(divs[i].innerHTML);
+ }
+}
+/*]]>*/
+</script>
+</com:TTextHighlighter>
+<p id="830733" class="block-content">
+ Hal baik lainnya dari fungsi ini adalah bahwa anda bisa mengirimkan baik string <tt>id</tt> ataupun elemen obyek itu sendiri, yang menjadikan fungsi ini sangat berguna ketika membuat fungsi lain yang juga mengambil bentuk argumen.
+</p>
+
+<h2 id="6605">Using the <tt>$F()</tt> function</h2>
+
+<p id="830734" class="block-content">
+ Fungsi <tt>$F()</tt> adalah jalan pintas penyambutan lainnya. Ia mengembalikan nilai dari setiap kontrol input field, seperti kotak teks atau daftar drop-down. Fungsi bisa diambil sebagai argumen baik elemen <tt>id</tt> ataupun elemen obyek itu sendiri.
+</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_830253">
+<input type="text" id="userName" value="Joe Doe" />
+<input type="button" value=Test3 onclick="test3();" />
+
+<script type="text/javascript">
+/*<![CDATA[*/
+function test3()
+{
+ alert($F('userName'));
+}
+/*]]>*/
+</script>
+</com:TTextHighlighter>
+
+<div class="last-modified">$Id: Scripts1.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Scripts2.page b/demos/quickstart/protected/pages/Advanced/id/Scripts2.page new file mode 100644 index 00000000..10ba3684 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Scripts2.page @@ -0,0 +1,214 @@ +<com:TContent ID="body" >
+<h1 id="6701">Event DOM dan Javascript</h1>
+
+<h2 id="6702">Penanganan event dasar</h2>
+
+<p id="840735" class="block-content">Sintaks untuk bekerja dengan event terlihat seperti kode di bawah.</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840254">
+Event.observe(element, name, observer, [useCapture]);
+</com:TTextHighlighter>
+
+<p id="840736" class="block-content">Menganggap untuk saat ini kita ingin mengamati sebuah link yang diklik, kita dapat melakukan yang berikut:</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840255">
+// <a id="clicker" href="http://foo.com">Click me</a>
+Event.observe('clicker', 'click', function(event)
+{
+ alert('clicked!');
+});
+</com:TTextHighlighter>
+
+<p id="840737" class="block-content">Jika kita menginginkan untuk mendapatkan elemen yang memicu event, kita melakukan ini:</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840256">
+Event.observe('clicker', 'click', function(event)
+{
+ alert(Event.element(event));
+});
+</com:TTextHighlighter>
+
+<h2 id="6703">Mengamati tekanan tombol</h2>
+
+<p id="840738" class="block-content">Jika kita ingin mengamati tekanan tombol untuk seluruh dokumen, kita dapat melakukan yang berikut:</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840257">
+Event.observe(document, 'keypress', function(event)
+{
+ if(Event.keyCode(event) == Event.KEY_TAB)
+ alert('Tab Pressed');
+});
+</com:TTextHighlighter>
+
+<p id="840739" class="block-content">Dan katakanlah kita ingin melacak apa yang telak diketikan:</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840258">
+Event.observe('search', 'keypress', function(event)
+{
+ Element.update('search-results', $F(Event.element(event)));
+});
+</com:TTextHighlighter>
+
+<p id="840740" class="block-content">Prototipe mendefinisikan properti di dalam obyek event untuk beberapa dari tombol yang lebih umum, maka jangan ragu-ragu untuk mencari di sekitar Prototype guna melihat yang mana saja itu.</p>
+
+<p id="840741" class="block-content">Catatan terakhir pada event tekanan tombol; Jika anda ingin mendeteksi klik kiri anda bisa menggunakan <tt>Event.isLeftClick(event)</tt>.</p>
+
+<h2 id="6704">Mendapatkan koordinat dari penunjuk mouse</h2>
+
+<p id="840742" class="block-content">Tarik dan jatuhkan, pengukuran ulang elemen dinamis, permainan, dan lebih banyak lagi, semuanya memerlukan kemampuan untuk melacak lokasi X dan Y dari mouse. Prototipe menjadikan hal ini cukup sederhana. Kode di bawah melacak posisi X dan Y dari mouse dan memindahkan nilainya ke dalam kotak input bernama mouse.</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840259">
+Event.observe(document, 'mousemove', function(event)
+{
+ $('mouse').value = "X: " + Event.pointerX(event) +
+ "px Y: " + Event.pointerY(event) + "px";
+});
+</com:TTextHighlighter>
+
+<p id="840743" class="block-content">Jika kita ingin mengamati lokasi mouse saat ia melewati elemen tertentu, cukup ubah argumen dokumen ke id atau elemen yang relevan.</p>
+
+<h2 id="6705">Menghentikan Propagasi</h2>
+
+<p id="840744" class="block-content"><tt>Event.stop(event)</tt> akan menghentikan propagasi sebuah event .</p>
+
+<h2 id="6706">Event, Penyatuan, dan Obyek</h2>
+
+<p id="840745" class="block-content">Sejauh ini semuanya sudah jelas, tapi sesuatu mulai menjadi sedikit lebih rumit ketika anda perlu bekerja dengan event dalam lingkungan obyek-terorientasi. Anda harus berhadapan dengan penyatuan dan sintaks yang terlihat aneh yang memerlukan beberapa waktu bagi anda untuk mengetahuinya.</p>
+
+<p id="840746" class="block-content">Mari kita lihat pada beberapa kode agar anda bisa mendapatkan pengertian yang lebih baik atas apa yang sedang saya bicarakan.</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840260">
+EventDispenser = Class.create();
+EventDispenser.prototype =
+{
+ initialize: function(list)
+ {
+ this.list = list;
+
+ // Amati klik pada item list kita
+ $$(this.list + " li").each(function(item)
+ {
+ Event.observe(item, 'click', this.showTagName.bindEvent(this));
+ }.bind(this));
+
+ // Amati saat tombol pada keyboard ditekan.
+ // Dalam pengamat, kita memeriksa
+ // tombol tab dan memunculkan pesan jika ditekan.
+ Event.observe(document, 'keypress', this.onKeyPress.bindEvent(this));
+
+ // Amati kotak pencarian kita yang palsu. Ketika pengguna mengetik
+ // sesuatu ke dalam kotak, pengamat akan mengambil nilai (-1) itu
+ // dan memutakhirkan hasil pencarian div dengannya.
+ Event.observe('search', 'keypress', this.onSearch.bindEvent(this));
+
+ Event.observe(document, 'mousemove', this.onMouseMove.bindEvent(this));
+ },
+
+ // Fungsi bebas untuk merespon event
+ showTagName: function(event)
+ {
+ alert(Event.element(event).tagName);
+ },
+
+ onKeyPress: function(event)
+ {
+ var code = event.keyCode;
+ if(code == Event.KEY_TAB)
+ alert('Tab key was pressed');
+ },
+
+ onSearch: function(event)
+ {
+ Element.update('search-results', $F(Event.element(event)));
+ },
+
+ onMouseMove: function(event)
+ {
+ $('mouse').value = "X: " + Event.pointerX(event) +
+ "px Y: " + Event.pointerY(event) + "px";
+ }
+}
+</com:TTextHighlighter>
+<p id="840747" class="block-content">Wah! Apa yang terjadi di sini? Kita telah mendefinisikan kelas kustom kita <tt>EventDispenser</tt>. Kita akan menggunakan kelas ini untuk menyiapkan event untuk dokumenkita. Banyak dari kode ini ditulis ulang yang kita lihat di awal kecuali kali ini, kita bekerja dari dalam sebuah obyek.</p>
+
+<p id="840748" class="block-content">Melihat metode <tt>initialize</tt>, sebenarnya kita dapat melihat bagaimana sesuatu menjadi berbeda sekarang. Lihat kode di bawah ini:</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840261">
+// Observe clicks on our list items
+$$(this.list + " li").each(function(item)
+{
+ Event.observe(item, 'click', this.showTagName.bindEvent(this));
+}.bind(this));
+</com:TTextHighlighter>
+
+<p id="840749" class="block-content">Kita mendapatkan iterator, penyatuan dan semua hal lainnya. Mari kita rinci apa yang dikerjakan kode ini.</p>
+
+<p id="840750" class="block-content">Pertama kita memburu koleksi elemen berdasarkan selektor CSS. Ini menggunakan fungsi selektor Prototipe <tt>$$()</tt>.
+Setelah kita menemukan daftar item kita berhadapan dengan apa yang kita kirim ke dalam setiap iterasi di mana kita akan menambahkan pengamat kita.</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840262">
+Event.observe(item, 'click', this.showTagName.bindEvent(this));
+</com:TTextHighlighter>
+
+<p id="840751" class="block-content">Sekarang, melihat kode di atas, anda akan mencatat fungsi <tt>bindEvent</tt>. Ini mengambil metode sebelumnya <tt>showTagName</tt> dan memperlakukannya sebagai metode yang akan dipicu ketika seseorang mengklik salah satu dari item daftar kita.</p>
+
+<p id="840752" class="block-content">Anda juga akan mencatat bahwa kita mengirimkan ini sebagai argumen ke fungsi <tt>bindEvent</tt>.
+Ini membolehkan kita untuk mereferensi obyek dalam konteks <tt>EventDispenser</tt>
+di dalam fungsi <tt>showTagName(event)</tt> kita. Jika fungsi <tt>showTagName</tt> memerlukan parameter tambahan, anda melampirkannya ke parameter terakhir dari <tt>bindEvent</tt>. Sebagai contoh</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840263">
+this.showTagName.bindEvent(this, param1, param2);
+
+//di mana fungsi showTagName didefinisikan seperti
+showTime : function (event, param1, param2) { ... }
+</com:TTextHighlighter>
+
+<p id="840753" class="block-content">Selanjutnya, anda akan melihat <tt>bind(this)</tt> yang dilampirkan ke fungsi iterator.
+Ini sama sekali tidak berkaitan dengan event, ia berada di sini untuk membolehkan saya menggunakan <tt>this</tt> di dalam iterator. Jika kita tidak menggunakan <tt>bind(this)</tt>, saya tidak bisa mereferensi metode <tt>showTagName</tt> di dalam iterator.</p>
+
+<p id="840754" class="block-content">Ok, kita berlanjut untuk melihat metode kita yang sebenarnya dipanggil saat terjadi event. Karena kita sudah berhadapan dengan <tt>showTagName</tt>, mari kita lihat itu.</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840264">
+showTagName: function(event)
+{
+ alert(Event.element(event).tagName);
+}
+</com:TTextHighlighter>
+
+<p id="840755" class="block-content">Seperti yang anda lihat, fungsi ini menerima satu argumen--event.
+Agar kita mendapatkan elemen yang memicu event kita perlu mengirimkan argumen ke <tt>Event.element</tt>. Sekarang kita dapat memanipulasinya kapan saja.</p>
+
+<p id="840756" class="block-content">Ini mencakup bagian yang paling membingungkan dari kode kita. Teks di atas juga relevan untuk bagian sisa dari kode kita. Jika ada sesuatu mengenai ini yang tidak anda mengerti, jangan ragu-ragu untuk mengajukan pertanyaan dalam forum.</p>
+
+<h2 id="6707">Menghapus Pendengar Event</h2>
+
+<p id="840757" class="block-content">Yang satu ini melontarkan saya dari lingkaran untuk pertama kali saya mencoba menggunakannya.
+Saya mencoba sesuatu yang mirip dengan apa yang saya lakukan dalam pemanggilan <tt>Event.observe</tt> dengan kekecualian penggunaan <tt>stopObserving</tt>, tapi tidak ada yang berubah. Dengan kata lain, kode di bawah ini <b>TIDAK</b> bekerja.</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840265">
+$$(this.list + " li").each(function(item)
+{
+ Event.stopObserving(item, 'click', this.showTagName);
+}.bind(this));
+</com:TTextHighlighter>
+
+<p id="840758" class="block-content">Apa yang terjadi di sini? Alasan ini tidak bekerja karena tidak ada penunjuk ke pengamat. Ini berarti bahwa ketika kita mengirimkan <tt>this.showTagName</tt> dalam metode <tt>Event.observe</tt> sebelumnya, kita mengirimkannya sebagai fungsi anonim. Kita tidak bisa mereferensi fungsi anonim karena ia tidak mempunyai penunjuk.</p>
+
+<p id="840759" class="block-content">Lalu bagaimana kita yakin pekerjaan diselesaikan? Semua yang kita perlukan adalah memberikan fungsi mengamati penunjuk, atau kelompok versi bebas: Setel variabel yang mengarah ke <tt>this.showTagName</tt>. Ok, mari kita ubah kode kita sedikit.</p>
+
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840266">
+this.showTagObserver = this.showTagName.bindEvent(this);
+
+// Amati klik pada item list kita
+$$(this.list + " li").each(function(item)
+{
+ Event.observe(item, 'click', this.showTagObserver);
+}.bind(this));
+</com:TTextHighlighter>
+
+<p id="840760" class="block-content">Sekarang kita bisa menghapus pendengar event dari daftar kita seperti ini:</p>
+<com:TTextHighlighter Language="javascript" CssClass="source block-content" id="code_840267">
+$$(this.list + " li").each(function(item)
+{
+ Event.stopObserving(item, 'click', this.showTagObserver);
+}.bind(this));
+</com:TTextHighlighter>
+
+<div class="last-modified">$Id: Scripts2.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Scripts3.page b/demos/quickstart/protected/pages/Advanced/id/Scripts3.page new file mode 100644 index 00000000..cffe4904 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Scripts3.page @@ -0,0 +1,84 @@ +<com:TContent ID="body" >
+<h1 id="6801">Javascript dalam PRADO, Pertanyaan dan Jawaban</h1>
+<h2 id="6802">Bagaimana saya menyertakan librari Javascript yang didistribusikan dengan Prado?</h2>
+<p id="880060" class="block-content">Librari javascript yang didistribusikan dengan Prado dapat ditemukan dalam direktori
+<tt>framework/Web/Javascripts/source</tt>. File <tt>packages.php</tt>
+dalam direktori itu mendefinisikan daftar nama paket yang tersedia yang diambil. Itu bisa diambil seperti berikut.
+</p>
+<ul id="u1" class="block-content"><li>Menambahkan librari dalam template
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_850268">
+<com:TClientScript PradoScripts="effects" />
+</com:TTextHighlighter>
+ </li>
+ <li>Menambahkan librari dalam kode PHP
+ <com:TTextHighlighter Language="php" CssClass="source block-content" id="code_850269">
+$this->getPage()->getClientScript()->registerPradoScript("effects");
+ </com:TTextHighlighter>
+ </li>
+</ul>
+Paket librari yang tersedia disertakan dalam Prado adalah
+<ul id="u2" class="block-content">
+ <li><tt>prado</tt> : javascript dasar kerangka kerja PRADO berdasarkan Prototype</li>
+ <li><tt>effects</tt> : efek visual dari script.aculo.us</li>
+ <li><tt>ajax</tt> : terkait ajax dan callback bedasarkan Prototype</li>
+ <li><tt>validator</tt> : validasi</li>
+ <li><tt>logger</tt> : pencatat javascript dan browser obyek</li>
+ <li><tt>datepicker</tt> : datepicker</li>
+ <li><tt>colorpicker</tt> : colorpicker</li>
+</ul>
+
+<p id="850761" class="block-content">Ketergantungan masing-masing librari secara otomatis dipecahkan. Komponen yang memerlukan libari tertentu juga akan secara otomatis mengambil librari yang diperlukan.
+Sebagai contoh, jika anda menambah komponen <tt>TDatePicker</tt> pada halaman, <tt>datepicker</tt> dan dependensinya akan secara otomatis disertakan pada halaman.</p>
+
+<p id="850762" class="block-content">Lihat <a href="?page=Controls.ClientScript">TClientScript</a> untuk opsi penambahan kode Javascript kustom anda ke halaman.</p>
+
+<h2 id="176028">Menerbitkan Librari Javascript sebagai Assets</h2>
+<com:SinceVersion Version="3.1b" />
+<p class="block-content">Gunakan <a href="?page=Controls.ClientScriptLoader">TClientScriptLoader</a> untuk menerbitkan dan menggabung file javascript yang sudah ada (misalnya librari javascript yang didistribusikan dengan Prado atau sebaliknya) sebagai paket.</p> Untuk kontrol yang lebih besar pada apa dan kapan untuk menerbitkan, gunakan metode
+<tt>registerJavascriptPackages($base, $packages, $debug=null, $gzip=true)</tt>
+dalam kelas <tt>TClientScriptManager</tt>, yang turunannya bisa diperoleh dengan <tt>$this->getPage()->getClientScript()</tt> atau persamaannya.
+Sebagai contoh, jika multipel kontrol akan memakai set librari javascript yang sama, tulis sebuah kelas untuk menangani registrasi paket yang diperlukan oleh kontrol tersebut.
+</p>
+<com:TTextHighlighter Language="php" CssClass="source block-content">
+class MyJavascriptLib extends TComponent
+{
+ private $_packages=array(); //perlihara seluruh registrasi
+
+ private $_manager;
+
+ protected function __construct(TPage $owner)
+ {
+ $this->_manager = $owner->getClientScript();
+ $owner->onPreRenderComplete = array($this, 'registerScriptLoader');
+ }
+
+ public static function registerPackage(TControl $control, $name)
+ {
+ static $instance;
+ if($instance===null)
+ $instance=new self($control->getPage());
+ $instance->_packages[$name]=true;
+ }
+
+ protected function registerScriptLoader()
+ {
+ $dir = dirname(__FILE__).'/myscripts'; //berisi file my javascript
+ $scripts = array_keys($this->_packages);
+ $url = $this->_manager->registerJavascriptPackages($dir, $scripts);
+ $this->_manager->registerScriptFile($url,$url);
+ }
+}
+
+// contoh kelas kontrol menggunakan paket javascript
+class TestComp extends TControl
+{
+ public function onPreRender($param)
+ {
+ parent::onPreRender($param);
+ MyJavascriptLib::registerPackage($this,'package1');
+ }
+}
+</com:TTextHighlighter>
+
+
+<div class="last-modified">$Id: Scripts3.page 1902 2007-05-07 04:17:37Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Security.page b/demos/quickstart/protected/pages/Advanced/id/Security.page new file mode 100644 index 00000000..eb99c70e --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Security.page @@ -0,0 +1,79 @@ +<com:TContent ID="body" >
+
+<h1 id="5601">Keamanan</h1>
+
+<h2 id="5602">Perlindungan Kondisi Tampilan</h2>
+<p id="730563" class="block-content">
+Kondisi tampilan berada di jantung PRADO. Kondisi tampilan menggambarkan data yang bisa dipakai untuk menyimpan kembali halaman ke kondisi terakhir kali dilihat oleh pengguna akhir sebelum membuat permintaan saat ini. Standarnya, PRADO menggunakan field tersembunyi untuk menyimpan informasi kondisi tampilan.
+</p>
+<p id="730564" class="block-content">
+Sangat penting untuk memastikan bahwa kondisi tampilan tidak dirusak oleh pengguna akhir. Tanpa perlindungan, pengguna yang jahat bisa menginjeksi kode berbahaya ke dalam kondisi tampilan dan instruksi yang tidak diinginkan yang mungkin dilakukan ketika kondisi halaman sedang dikembalikan pada sisi server.
+</p>
+<p id="730565" class="block-content">
+Untuk mencegah kondisi tampilan dari perusakan, PRADO memaksa kondisi tampilan memeriksa HMAC (Keyed-Hashing for Message Authentication) sebelum menyimpan kembali kondisi tampilan. Pemeriksaan itu bisa mendeteksi apakah kondisi tampilan sudah dirusak atau tidak oleh pengguna akhir. Seandainya kondisi tampilan dimodifikasi, PRADO akan berhenti mengembalikan kondisi tampilan dan mengembalikan pesan kesalahan.
+</p>
+<p id="730566" class="block-content">
+Pemeriksaan HMAC memerlukan kunci pribadi yang harus menjadi rahasia bagi pengguna akhir. Para pengembang dapat menetapkan kunci ataupun membiarkan PRADO membuat kunci secara otomatis. Menetapkan kunci secara manual berguna saat aplikasi berjalan pada taman server. Untuk melakukannya, konfigurasi <tt>TSecurityManager</tt> dalam konfigurasi aplikasi,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_730186">
+<modules>
+ <module id="security"
+ class="TSecurityManager"
+ ValidationKey="my private key" />
+</modules>
+</com:TTextHighlighter>
+<p id="730567" class="block-content">
+Pemeriksaan HMAC tidak mencegah pengguna akhir dari pembacaan konten kondisi tampilan. Ukuran keamanan yang ditambahkanadalah untuk mengenkripsi informasi kondisi tampilan agar pengguna akhir tidak bisa mengurainya. Untuk menghidupkan enkripsi kondisi tampilan, setel <tt>EnableStateEncryption</tt> dari halaman menjadi true. Ini dapat dilakukan dalam <a href="?page=Configurations.PageConfig">konfigurasi halaman</a> atau dalam kode halaman. Catatan, mengenkripsi kondisi tampilan dapat menurunkan performansi aplikasi. Strategi yang lebih baik adalah dengan menyimpan kondisi tampilan pada sisi server daripada field tersembunyi.
+</p>
+
+<h2 id="5603">Pencegahan Penaskahan Situs Silang</h2>
+<p id="730568" class="block-content">
+Penaskahan situs silang(juga dikenal sebagai XSS) terjadi saat aplikasi web mengumpulkan data dari pengguna. Penyerang akan sering menyuntikan JavaScript, VBScript, ActiveX, HTML, atau Flash menjadi aplikasi yang mudah diserang guna mengelabui pengguna aplikasi lain dan mengumpulkan data darinya. Sebagai contoh, Sistem forum yang didesain dengan buruk dapat menampilkan input pengguna dalam tulisan forum tanpa pemeriksaan apapun. Kemudian penyerang bisa menyuntikan beberapa kode jahat JavaScript ke dalam sebuah tulisan agar pengguna lain membaca tulisan ini, JavaScript berjalan tidak seperti yang diharapkan pada komputernya.
+</p>
+<p id="730569" class="block-content">
+Salah satu ukuran paling penting guna mencegah penyerangan XSS adalah memeriksa input pengguna sebelum menampilkannya. Seseorang dapat melakukan pengkodean-HTML dengan input pengguna untuk mencapai tujuan ini. Akan tetapi, dalam beberapa situasi, pengkodean-HTML mungkin tidak disukai karena ia mematikan seluruh tag HTML.
+</p>
+<p id="730570" class="block-content">
+PRADO menyertakan pekerjaan <a href="http://pixel-apes.com/safehtml/">SafeHTML</a> dan menyediakan bagi para pengembang komponen berguna yang disebut <tt>TSafeHtml</tt>. Dengan mengurung konten di dalam tag komponen <tt>TSafeHtml</tt>, konten yang dikurung dipastikan amab bagi pengguna akhir. Sebagai tambahan, <tt>TTextBox</tt> yang umum dipakai memiliki properti <tt>SafeText</tt> yang berisi input pengguna yang dipastikan aman bila ditampilkan secara langsung ke pengguna akhir.
+</p>
+
+<h2 id="5604">Pencegahan Serangan Cookie</h2>
+<p id="730571" class="block-content">
+Melindungi cookie dari serangan adalah sangat penting, karena ID sesi umumnya disimpan dalam cookie. Jika seseorang memegang ID sesi, intinya ia mempunyai semua informasi sesi relevan.
+</p>
+<p id="730572" class="block-content">
+Ada beberapa pengukur guna mencegah cookie dari serangan.
+</p>
+<ul id="u1" class="block-content">
+ <li>Aplikasi dapat menggunakan SSL untuk membuat kanal komunikasi aman dan hanya mengirimkan cookie otentikasi melalui sambungan HTTPS. Para penyerang selanjutnya melakukan decipher isi dalam cookie yang dikirimkan.</li>
+ <li>Sesi berakhir secara tidak benar, termasuk semua token cookie dan sesi, untuk mengurangi kemungkinan penyerangan.</li>
+ <li>Mencegah penaskahan situs-silang (XSS) yang menyebabkan kode sesukanya berjalan dalam browser pengguna dan memunculkan cookie-nya.</li>
+ <li>Memvalidasi data cookie dan mendeteksi apakah cookie diubah atau tidak.</li>
+</ul>
+<p id="730573" class="block-content">
+PRADO menertapkan skema validasi cookie yang mencegah cookie dimodifikasi. Dalam keadaan tertentu, ia melakukan pemeriksaan HMAC untuk nilai cookie jika validasi cookie dihidupkan.
+</p>
+<p id="730574" class="block-content">
+Validasi cookie standarnya dimatikan. Untuk menghidupkannya, konfigurasi modul <tt>THttpRequest</tt> seperti berikut,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_730187">
+<modules>
+ <module id="request" class="THttpRequest" EnableCookieValidation="true" />
+</modules>
+</com:TTextHighlighter>
+<p id="730575" class="block-content">
+Untuk menggunakan skema validasi cookie yang disediakan oleh PRADO, anda juga perlu mengambil cookie melalui koleksi <tt>Cookies</tt> dari <tt>THttpRequest</tt> dengan menggunakan pernyataan PHP berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_730188">
+foreach($this->Request->Cookies as $cookie)
+ // $cookie adalah tipe THttpCookie
+</com:TTextHighlighter>
+<p id="730576" class="block-content">
+Untuk mengirimkan data cookie yang dikode dengan informasi validasi, buat obyek <tt>THttpCookie</tt> baru dan menambahkannya ke koleksi <tt>Cookies</tt> dari <tt>THttpResponse</tt>,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_730189">
+$cookie=new THttpCookie($name,$value);
+$this->Response->Cookies[]=$cookie;
+</com:TTextHighlighter>
+
+<div class="last-modified">$Id: Security.page 1741 2007-03-05 16:05:43Z xue $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/State.page b/demos/quickstart/protected/pages/Advanced/id/State.page new file mode 100644 index 00000000..a99f9774 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/State.page @@ -0,0 +1,54 @@ +<com:TContent ID="body" >
+
+<h1 id="6001">Kondisi Persisten</h1>
+<p id="770606" class="block-content">
+Aplikasi Web sering memerlukan untuk mengingat apa yang pengguna akhir kerjakan dalam permintaan halaman sebelumnya agar permintaan halaman baru bisa dilayani sesuai dengan itu. Persisten kondisi untuk menangani masalah ini. Secara tradisional, jika halaman perlu memelihara interaksi pengguna, ia akan mengurut ulang sesi, cookie, atau field tersembunyi. PRADO menyediakan baris baru skema kondisi persisten, termasuk kondisi tampilan, kondisi kontrol, dan kondisi aplikasi.
+</p>
+
+<h2 id="6002">Kondisi Tampilan</h2>
+<p id="770607" class="block-content">
+Kondisi tampilan berada di jantung PRADO. Dengan kondisi tampilan, halaman Web menjadi tangguh dan mampu menyimpan kembali halaman ke kondisi terakhir kali pengguna akhir berinteraksi sebelum permintaan halaman saat ini. Pemrograman Web mirip dengan pemrograman GUI Windows, dan para pengembang dapat berpikir secara kontinyu tanpa mencemaskan mengenai perjalanan pulang pergi antara pengguna akhir dan server web. Sebagai contoh, dengan kondisi tampilan, sebuah kontrol kotak centang dapat mendeteksi apakah input pengguna mengubah konten dalam kotak centang atau tidak.
+</p>
+<p id="770608" class="block-content">
+Kondisi tampilan hanya tersedia untuk kontrol. Kondisi tampilan dari kontrol bisa dimatikan dengan menyetel properti <tt>EnableViewState</tt> menjadi false. Untuk menyimpan variabel dalam kondisi tampilan, panggil yang berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_770197">
+$this->setViewState('Caption',$caption);
+</com:TTextHighlighter>
+<p id="770609" class="block-content">
+di mana <tt>$this</tt> merujuk ke obyek kontrol, <tt>Caption</tt> adalah kunci unik yang mengidentifikasi variabel <tt>$caption</tt> yang disimpan dalam kondisi tampilan. Untuk mengambil variabel kembali dari kondisi tampilan, panggil yang berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_770198">
+$caption = $this->getViewState('Caption');
+</com:TTextHighlighter>
+
+<h2 id="6003">Kondisi Kontrol</h2>
+<p id="770610" class="block-content">
+Kondisi kontrol mirip dengan kondisi tampilan dalam setiap aspek kecuali bahwa kondisi kontrol tidak bisa dimatikan. Kondisi kontrol bertujuan dipakai untuk menyimpan informasi kondisi krusial halaman atau kontrol mana yang tidak bekerja dengan baik.
+</p>
+<p id="770611" class="block-content">
+Untuk menyimpan dan mengambil variabel dalam kondisi kontrol, gunakan perintah berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_770199">
+$this->setControlState('Caption',$caption);
+$caption = $this->getControlState('Caption');
+</com:TTextHighlighter>
+
+<h2 id="6004">Kondisi Aplikasi</h2>
+<p id="770612" class="block-content">
+Kondisi aplikasi merujuk ke data yang persisten melalui sesi pengguna dan permintaan halaman. Contoh umum dari kondisi aplikasi adalah penghitung kunjungan pengguna. Nilai penghitung adalah persisten meskipun sesi pengguna saat ini berakhir. Catatan, kondisi tampilan dan kondisi kontrol hilang jika permintaan pengguna untuk halaman yang berbeda, karena kondisi sesi hilang jika sesi pengguna berakhir.
+</p>
+<p id="770613" class="block-content">
+Untuk menyimpan dan mengambil variabel dalam kondisi aplikasi, gunakan perintah berikut,
+</p>
+<com:TTextHighlighter CssClass="source block-content" id="code_770200">
+$application->setGlobalState('Caption',$caption);
+$caption = $application->getGlobalState('Caption');
+</com:TTextHighlighter>
+
+<h2 id="6005">Kondisi Sesi</h2>
+<p id="770614" class="block-content">
+PRADO melapisi manajemen sesi tradisional dalam modul <tt>THttpSession</tt>. Modul dapat diakses dari dalam setiap komponen dengan menggunakan <tt>$this->Session</tt>, di mana <tt>$this</tt> merujuk ke obyek komponen.
+</p>
+
+<div class="last-modified">$Id: State.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/Themes.page b/demos/quickstart/protected/pages/Advanced/id/Themes.page new file mode 100644 index 00000000..418a0bee --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/Themes.page @@ -0,0 +1,60 @@ +<com:TContent ID="body" >
+
+<h1 id="5901">Tema dan Skin</h1>
+
+<h2 id="5902">Pengenalan</h2>
+<p id="760596" class="block-content">
+Tema dalam PRADO menyediakan cara bagi para pengembang untuk menyediakan tampilan konsisten melintasi seluruh aplikasi web. Tema berisi daftar nilai awal untuk properti dari berbagai tipe kontrol. Ketika menerapkan tema ke sebuah halaman, semua kontrol dalam halaman tersebut akan menerima nilai properti awal terkait dari tema. Ini membolehkan tema untuk berinteraksi dengan seti properti yang banyak dari berbagai kontrol PRADO, berarti bahwa tema bisa dipakai untuk menetapkan jangkauan besar dari properti penyajian yang tidak bisa dilakukan metode tema lain (misaslnya CSS). Sebagai contoh, tema bisa dipakai untuk menetapkan ukuran standar halaman dari semua grid data melintasi aplikasi dengan menetapkan nilai standar untuk properti <tt>PageSize</tt> dari kontrol <tt>TDataGrid</tt>.
+</p>
+
+<h2 id="5903">Memahami Tema</h2>
+<p id="760597" class="block-content">
+Tema adalah sebuah direktori yang terdiri dari file skin, file javascript dan file CSS. Setiap file javascript atau CSS yang berada dalam tema akan diregistrasi dengan halaman yang menerapkan tema. Skin adalah set nilai properti awal untuk tipe kontrol tertentu. Tipe kontrol dapat memiliki satu atau beberapa skin, masing-masing diidentifikasi dengan <tt>SkinID</tt> unik. Ketika menerapkan tema ke sebuah halaman, skin diterapkan ke kontrol jika tipe kontrol dan nilai <tt>SkinID</tt> keduanya sama dengan ada dalam skin. Catatan, jika skin memiliki nilai <tt>SkinID</tt> kosong, ia akan menerapkannya ke semua kontrol dari tipe tertentu yang <tt>SkinID</tt>-nya tidak disetel atau kosong. File skin terdiri dari satu atau beberapa skin, untuk satu atau beberapa tipe kontrol. Tema adalah gabungan dari skin yang didefinisikan dalam semua file skin.
+</p>
+
+<h2 id="5904">Menggunakan Tema</h2>
+<p id="760598" class="block-content">
+Untuk menggunakan sebuah tema, anda perlu menyetel properti <tt>Theme</tt> dari halaman dengan nama tema, yaitu nama direktori tema. Anda dapat menyetelnya dalam <a href="?page=Configurations.PageConfig">konfigurasi halaman</a> atau dalam konstruktor atau metode <tt>onPreInit()</tt> dari halaman. Anda tidak bisa menyetel properti setelah <tt>onPreInit()</tt> karena saat itu, kontrol anak dari halaman sudah dibuat (skin harus diterapkan ke kontrol setelah kontrol tersebut dibuat.)
+</p>
+<p id="760599" class="block-content">
+Untuk menggunakan skin tertentu dalam tema untuk sebuah kontrol, setel properti <tt>SkinID</tt> dari kontrol dalam template seperti berikut,
+</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_760194">
+<com:TButton SkinID="Blue" ... />
+</com:TTextHighlighter>
+<p id="760600" class="block-content">
+Ini akan menerapkan skin 'Blue' ke tombol. Catatan, nilai properti awal yang ditetapkan oleh skin 'Blue' akan mengganti setiap nilai properti tombol. Gunakan tema stylesheet jika anda tidak ingi diganti. Untuk menggunakan tema stylesheet, setel properti <tt>StyleSheetTheme</tt> dari halaman daripada <tt>Theme</tt> (anda bisa memiliki keduanya <tt>StyleSheetTheme</tt> dan <tt>Theme</tt>).
+</p>
+<p id="760601" class="block-content">
+Untuk menggunakan file Javascript dan file CSS yang berada dalam sebuah tema, kontrol <tt>THead</tt> harus ditempatkan pada template halaman. Ini dikarenakan tema akan meregistrasi file itu dengan halaman dan <tt>THead</tt> adalah tempat yang tepat untuk menempatkan mengambil file tersebut.
+</p>
+<p id="760602" class="block-content">
+Dimungkinkan untuk menetapkan tipe media dari file CSS yang berisikan sebuah tema. Standarnya, file CSS berlaku untuk semua tipe media. Jika file CSS bernama seperti <tt>mystyle.print.css</tt>, ia akan diterapkan hanya pada tipe media <tt>print</tt>. Sebagai contoh lain, <tt>mystyle.screen.css</tt> hanya berlaku untuk media <tt>screen</tt>, dan <tt>mystyle.css</tt> berlaku bagi semua tipe media.
+</p>
+
+<h2 id="5905">Penyimpanan Tema</h2>
+<p id="760603" class="block-content">
+Semua tema standarnya harus ditempatkan di bawah direktori <tt>[AppEntryPath]/themes</tt>, di mana <tt>AppEntryPath</tt> merujuk ke direktori yang berisi naskah entri aplikasi. Jika anda ingin menggunakan direktori berbeda, konfigurasi properti <tt>BasePath</tt> dan <tt>BaseUrl</tt> dari modul <tt>System.Web.UI.TThemeManager</tt> dalam konfigurasi aplikasi,
+</p>
+<com:TTextHighlighter Language="xml" CssClass="source block-content" id="code_760195">
+<service id="page" class="TPageService">
+ <modules>
+ <module id="theme"
+ class="System.Web.UI.TThemeManager"
+ BasePath="mythemes"
+ BaseUrl="mythemes" />
+ </modules>
+</service>
+</com:TTextHighlighter>
+
+<h2 id="5906">Membuat Tema</h2>
+<p id="760604" class="block-content">
+Membuat sebuah tema melibatkan pembuatan direktori tema dan penulisan file skin (dan kemungkinan file Javascript serta CSS). Nama file skin harus diakhiri dengan <tt>.skin</tt>. Format file skin adalah sama seperti file template kontrol. Karena file skin tidak mendefinisikan penyajian hubungan leluhur-aak diantara kontrolnya, anda tidak bisa menempatkan tag komponen di dalam yang lainnya. Dan setiap teks statis antara tag komponen diabaikan. Untuk mendefinisikan skin 'Blue' seperti telah disebutkan di atas untuk <tt>TButton</tt>, tulis yang berikut dalam file skin,
+</p>
+<com:TTextHighlighter Language="prado" CssClass="source block-content" id="code_760196">
+<com:TButton SkinID="Blue" BackColor="blue" />
+</com:TTextHighlighter>
+<p id="760605" class="block-content">
+Seperti sudah disebutan di atas, anda dapat menyimpan beberapa skin dalam satu file skin, atau memisahkannya ke dalam beberapa file. Strategi yang umum digunakan adalah bahwa setiap file skin hanya berisi skin untuk satu tipe kontrol. Sebagai contoh, <tt>Button.skin</tt> akan berisi skin hanya untuk tipe kontrol <tt>TButton</tt>.
+</p>
+<div class="last-modified">$Id: Themes.page 1650 2007-01-24 06:55:32Z wei $</div></com:TContent>
\ No newline at end of file diff --git a/demos/quickstart/protected/pages/Advanced/id/exception.gif b/demos/quickstart/protected/pages/Advanced/id/exception.gif Binary files differnew file mode 100644 index 00000000..93b1a07f --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/exception.gif diff --git a/demos/quickstart/protected/pages/Advanced/id/exception2.gif b/demos/quickstart/protected/pages/Advanced/id/exception2.gif Binary files differnew file mode 100644 index 00000000..5fe0e625 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/exception2.gif diff --git a/demos/quickstart/protected/pages/Advanced/id/logrouter.gif b/demos/quickstart/protected/pages/Advanced/id/logrouter.gif Binary files differnew file mode 100644 index 00000000..5a74dfe1 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/logrouter.gif diff --git a/demos/quickstart/protected/pages/Advanced/id/mastercontent.gif b/demos/quickstart/protected/pages/Advanced/id/mastercontent.gif Binary files differnew file mode 100644 index 00000000..9354d65c --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/mastercontent.gif diff --git a/demos/quickstart/protected/pages/Advanced/id/pcrelation.gif b/demos/quickstart/protected/pages/Advanced/id/pcrelation.gif Binary files differnew file mode 100644 index 00000000..c1960d74 --- /dev/null +++ b/demos/quickstart/protected/pages/Advanced/id/pcrelation.gif |
