<paulus />

jQuery

2008-05-17T18:57:00Z

Malam minggu ini saya mencoba sebuah framework di lingkungan client scripting yaitu jQuery. Tadinya saya menebak jQuery adalah framework atau tool di lingkungan Java karena ada embel-embel huruf J di depannya (walaupun bukan huruf J kapital), seperti JUnit, JPedal, JRoller, dan sebagainya. Ternyata jQuery adalah framework yang dapat digunakan di JavaScript. Dilihat dari fungsi teknisnya, jQuery mirip dengan ASP.NET AJAX Client Library yang dapat digunakan bukan hanya untuk membangun aplikasi dengan ASP.NET, yaitu memperluas fungsionalitas JavaScript sehingga developer dapat membangun code JavaScript dengan relatif lebih cepat karena code JavaScript yang perlu dituliskan lebih sedikit dan lebih memfokuskan pada fungsi apa yang ingin dilakukan oleh code JavaScript tersebut.

jQuery didistribusikan secara gratis dengan lisensi MIT dan GPL dan dapat di download di http://www.jquery.com

Sebenarnya jQuery hanyalah sebuah file JavaScript yang harus disertakan dalam sebuah halaman HTML (atau XHTML) melalui tag script seperti berikut :

Setelah itu kemudian saya bisa menggunakan semua kekuatan dari jQuery. Misalkan saya ingin membuat alert yang bertuliskan "Hello jQuery" menggunakan HTML button:

Code HTML:

<input type="button" id="btnHello" value="Hello jQuery" />

Code jQuery:

$(function() {
$("input#btnHello").click( function() { alert('Hello jQuery'); });
});

Penggunaan tanda $ di sini sangat mengingatkan saya dengan ASP.NET AJAX Client Library, walaupun dengan jQuery saya bisa mengganti $ dengan token lain, misalnya dengan $jquery.

Contoh yang lebih rumit: Saya ingin membuat sebuah efek tulisan fade in dan fade out secara bergantian.

Misalnya untuk code HTML berikut ini:

<h5>YOU'LL NEVER WALK ALONE</h5>

<p id="verse">
   When you walk through a storm,<br/>
   Hold your head up high,<br/>
   And don't be afraid of the dark.<br/>
   At the end of a storm,<br/>
   There's a golden sky,<br/>
   And the sweet silver song of a lark.<br/>
   Walk on through the wind, Walk on through the rain,<br/>
   Though your dreams be tossed and blown..
</p>

<a href="#" id="linkChorus">Hide Chorus</a>
<p id="chorus">
   Walk on, walk on, with hope in your heart,<br/>
   And you'll never walk alone.......<br/>
   You'll never walk alone. <br/><br/>
   Walk on, walk on, with hope in your heart,<br/>
   And you'll never walk alone.......<br/>
   You'll never walk alone.
</p>

Code jQuery:

$(function() {
   $("a#linkChorus").click( function() {
       if($("a#linkChorus").get(0).innerText == "Hide Chorus")
       {
          $("#chorus").hide("slow");
        $("a#linkChorus")[0].innerText = "Show Chorus";
       }
       else if($("a#linkChorus")[0].innerText == "Show Chorus")
       {
        $("#chorus").show("slow");
        $("a#linkChorus")[0].innerText = "Hide Chorus";
       }
   } );
});

Di sinilah kelebihan jQuery. Saya tidak perlu mendeteksi browser apa yang digunakan, karena framework jQuery yang nantinya akan berusaha mengenali browser dan menyesuaikan code JavaScript yang digunakan sesuai dengan fungsi yang saya inginkan. Code yang saya tulispun jauh lebih singkat daripada saya harus menuliskan code JavaScript secara keseluruhan.

Dan yang terpenting: jQuery menyediakan akses ke DOM yang lebih baik yaitu memungkinkan developer memfokuskan diri pada fungsionalitas yang ingin dibangun, persis seperti kalimat yang dituliskan di website jQuery: jQuery is designed to change the way that you write JavaScript.

jQuery: The Write Less, Do More, JavaScript Library

Share this post: | | | |

Failed to install .NET Framework 2.0

2008-03-25T10:00:00Z

Tadi siang asisten bos laptopnya minta diinstall .NET Framework 2.0 (hanya runtime bukan SDK) karena ada aplikasi yang menggunakan .NET Framework. Namun entah kenapa selalu saja failed saat installer baru mulai dan muncul pesan:

"Error opening installation log file. Verify that the specified log file location exists and is writable."

Hmmm.....mungkin hanya perlu restart Windows, tapi setelah restart pun hasilnya sama.

Coba install .NET Framework 3.5, gagal juga saat installer baru mulai.

Coba tanya uncle Google, ternyata ada beberapa kemungkinan:

Space hard disk tinggal sedikit: Ini ga mungkin, free space hard disk masih di kisaran 70 GB.
Temporary directory harus dibersihkan: Semua file di temporary sudah dihapus, tapi pesan error di atas tetap muncul.

Udah hampir nyerah, tapi masih ada waktu, si pemilik laptop mau meeting pukul 2 siang, sekarang masih pukul 13.30.

Saya coba masuk ke Command Prompt, lalu semua isi environment ditampilkan dengan perintah set, ternyata ada keanehan. Value dari variabel TEMP dan TMP isinya aneh.

TEMP=%USERPROFILE%\User\LOCALS~1\Temp
TMP=%USERPROFILE%\User\LOCALS~1\Temp

Lalu saya coba lakukan hal yang sama di komputer saya, hasilnya:

TEMP=C:\DOCUME~1\Paul\LOCALS~1\Temp
TMP=C:\DOCUME~1\Paul\LOCALS~1\Temp

Tampak variabel %USERPROFILE% diterjemahkan menjadi value variabel. Tapi yang di laptop ini kenapa variabel %USERPROFILE% tidak diterjemahkan menjadi value variabelnya? Padahal beberapa baris di bawahnya saya lihat variabel %USERPROFILE% juga ada:

USERPROFILE=C:\Documents and Settings\User

Wah, kayaknya ga sempat lagi untuk mencari tahu kenapa ini bisa terjadi, saya coba hapus variabel TMP dan TEMP dari environment di System Properties - Advanced - User Variables, lalu coba install lagi .NET Framework 2.0. Ternyata, pesan error tidak muncul lagi, instalasi berhasil. Variabel TMP dan TEMP saya kembalikan ke kondisi semula dan laptop harus segera dikembalikan ke pemiliknya karena sudah pukul 13.50.

Whew....Koq bisa begitu ya?

Share this post: | | | |

Silverlight dan Nokia

2008-03-11T11:11:00Z

Nokia akan mengimplementasikan Silverlight pada ponselnya. Baca selengkapnya di sini.

Share this post: | | | |

Embedded web resource

2008-03-11T09:51:00Z

Ini post saya yang pertama membahas tentang .NET, mohon maaf jika ada kesalahan (maklum langsung code di sini, ga pakai Visual Studio).

Ketika membuat aplikasi ASP.NET kadang saya membuat project Web Control Library yang isinya user controls yang tidak ingin saya expose code nya ke developer lain. User control tersebut membutuhkan code javascript yang ada pada file terpisah, atau file-file image. Jika user control ini digunakan dalam web form yang ada pada project terpisah atau pada solution yang lain, file-file javascript atau image tersebut harus diikutsertakan juga. Hal ini sepertinya agak merepotkan (setidaknya untuk saya).

Supaya yang dideploy hanya single file assembly, file javascript dan image tersebut dapat di-embed sebagai embedded resource ke dalam assembly. Caranya adalah:

Untuk setiap file yang akan di-embed sebagai embedded resource, di Visual Studio ubah property Build Action dari file tersebut menjadi Embedded Resource.

Kemudian daftarkan file tersebut pada AssemblyInfo.cs supaya HTTP handler dapat mengaksesnya melalui WebResource.axd, dengan syntax:

[assembly:WebResource("namespace.filename", "content-type")]

Misalnya untuk namespace MyWebControl.Validator dan nama file javascript yang akan di-embed adalah LengthValidator.js, maka penulisannya menjadi:

[assembly:WebResource("MyWebControl.Validator.LengthValidator.js", "text/javascript")]

Sampai di sini, jika project web control library di-build akan menghasilkan satu file DLL yang di dalamnya sudah di-embed file javascript yang disebutkan tadi. Misalkan nama file DLL yang dihasilkan adalah LengthValidator.dll

Untuk meng-consume resource, dilakukan dengan cara seperti halnya meng-inject sebuah file javascript ke dalam web form dengan memanggil method Page.ClientScript.RegisterClientScriptInclude:

Page.ClientScript.RegisterClientScriptInclude(
     "LengthValidator",
     Page.ClientScript.GetWebResourceUrl(typeof(LengthValidator),
                                         "MyWebControl.Validator.LengthValidator.js"));

Kalau diperhatikan di atas, perbedaan antara meng-inject sebuah file javascript biasa dengan file javascript sebagai embedded resource adalah pada parameter kedua dari method RegisterClientScriptInclude. Biasanya untuk meng-inject sebuah file javascript, parameter ini diisi dengan nama file javascript, tetapi karena yang di-inject adalah embedded resource, maka gunakan method GetWebResourceUrl.

Jika file javascript yang akan di-embed berada dalam folder lain (bukan folder root project), sebutkan nama folder tersebut ketika file tersebut didaftarkan di AssemblyInfo.cs. Misalkan file javascript LengthValidator.js berada dalam folder bernama scripts:

[assembly: WebResource("LengthValidator.scripts.LengthValidator.js", "text/javascript")]

Serupa dengan di atas, untuk mengambil javascript yang sudah di-embed tersebut dengan menyebutkan nama folder tadi:

Page.ClientScript.RegisterClientScriptInclude(
                "LengthValidator",
                Page.ClientScript.GetWebResourceUrl(this.GetType(),
                        "LengthValidator.scripts.LengthValidator.js"));

Share this post: | | | |

{Hello:World}

2008-03-11T09:43:00Z

Hello .NET-ers,

Sebenarnya udah lama punya blog di INDC tapi baru sekarang mau coba say hello untuk semua penghuni di sini. Kalau mau jujur, saya agak minder untuk posting tulisan karena setelah lihat judul-judul blog di sini ilmu .NET nya pasti sudah lebih tinggi dari saya.

Semoga kita bisa sharing ilmu di sini.

Maju terus komunitas developer .NET Indonesia !!

Share this post: | | | |