Reyza

tenang, senang, sederhana
See also: Other Geeks@INDC

Public

Geeks 2016

Posting ini ditulis dengan Open Live Writer.

Posting ini adalah posting pertama di portal ini yang akhirnya hidup kembali setelah beberapa tahun tanpa rumah

:)

Share this post: | | | |
Posted: Jun 29 2016, 08:17 PM by reyza | with no comments
Filed under:
Seminar dan Pelatihan Teknologi Informasi di Majalengka

Ini posting yang sangat terlambat, karena berbagai kesibukan dan terpaan smash berkali-kali maka laporan kegiatan di Majalengka ini baru bisa ditulis sekarang :)

Acara dihelat tanggal 29 Oktober 2011, dan diikuti oleh lebih 100 siswa dan siswi SMK Negeri 1 Lemahsugih, Majalengka. Dengan materi :

  1. Berkembang bersama komunitas oleh Dani R. Taufani, MSP Leader Regional Jawa Barat.
  2. Building Web Application with ASP.NET oleh M Reza Faisal.
  3. Building Apps in Windows 8 oleh M. Yusuf, MSP.
  4. Building Windows Phone 7 Apps oleh Billy Riantono, MSP.

29102011613

Berikut adalah beberapa laporan pandangan mata saat acara berlangsung.

29102011586

Building Web Application with ASP.NET oleh M Reza Faisal.

29102011601

Demo pembuatan program yang dilakukan langsung oleh peserta, untuk membuktikan bahwa membuat aplikasi web sangat mudah dilakukan dengan ASP.NET dan VS2010.

29102011595

Dany yang tengah mempersiapkan slide setelah didera prahara perjalangan selama 3 jam bandung-majalengka.

29102011608

Peserta yang mengikuti acara ini.

Sedangkan berikut adalah materi yang saya berikan saat acara ini dihelat.

aspnet1

Demo yang dilakukan adalah :

  1. Control Standard pada ASP.NET.
  2. Control Login.
  3. Control Data.
  4. Dynamic Data.
  5. Navigation.

aspnet2

aspnet3

aspnet4

Untuk slide lengkapnya dapat dilihat di bawah ini.

Sekian laporan kegiatan kali ini. Selamat berakhir pekan.

Share this post: | | | |
Windows 8 : Si Hijau yang ramping

ISO Windows 8 edisi developer telah dapat diunduh dan diinstall pada mesin yang diinginkan (http://msdn.microsoft.com/en-us/windows/home/).  Ada beberapa edisi yang bisa kita unduh, sesuai dengan keperluan, dan yang lebih penting adalah sesuai dengan bandwidth yang ada miliki :)

Ada 3 'versi' ISO yang dapat kita download sesuai dengan ukurannya :

  • 4,8GB, Windows Developer Preview 64-bit yang didalamnya telah berisi developer tool. Adapun developer tool tersebut adalah Visual Studio 2011 Express Edition yang didalamnya 'hanya' berisi template untuk pengembangan app di Windows 8.
  • 3,6GB, Windows Developer Preview 64-bit tanpa tool developer.
  • 2,8GB, Windows Developer Preview 32-bit.

Nah silakan dipilih sesuai keperluan anda, terlebih lagi bandwidth anda di http://msdn.microsoft.com/en-us/windows/home/ :)

Disini akan digunakan Windows Developer Preview 64-bit with developer tool, maklum bandwidth lagi bersahabat.  Untuk installasi sengaja dilakuan di atas VM, dan kebetulan VM yang dipilih adalah VMware Fusion 4 di atas mesin Mac gw :) Awalnya ingin menggunakan Parallel Desktop, tapi ada sedikit kegagalan 'masalah lisensi' :) Proses installasi berjalan lancar dan cepat, tidak sampai menghabiskan waktu 15 menit (ingin bilang sekitar 10menit, tapi kawatir di anggap lebay). Ini kesan pertama yang baik, kalau sebelumnya bersama Windows 7, waktu installnya lumayan lama 20-30 menit.

Kali ini akan diceritakan pengalaman setelah berkenalan dengan Windows 8 selama beberapa hari secara default, tanpa custom konfigurasi.

{Antarmuka}
Berikut adalah antarmuka Windows 8 saat desktop dilock.

Screen shot 2011-09-18 at 11.26.23 PM

Untuk unlock cukup dengan mengeser layar ke atas, pengalaman seperti bersama Windows Phone 7 dan saat layar lock terbuka kita akan bertemu dengan form login warna hijau. Warna yang menyejukkan. Pada layar ini terdapat daftar user yang dapat dipilih sebagai user untuk login.  Dan pada sisi kanan bawah terdapat tombol untuk melakukan shutdown dan restart.

Screen shot 2011-09-19 at 12.43.39 AM

Setelah login berhasil maka mata kita akan bertemu dengan antarmuka Metro, ala Windows Phone 7 :)

Screen shot 2011-09-18 at 10.44.42 PM

Tidak ada tombol logo "Windows" lagi di sisi kiri bawah, walau keberadaannya tidak benar-benar menghilang.  Ada dua tipe aplikasi yang mempunyai antarmuka yang berbeda, maksudnya ada tipe aplikasi yang saat jalan mempunyai antarmuka seperti pada Windows Phone 7 dan bergaya Metro. Selain itu juga ada juga aplikasi yang ketika jalan seperti layaknya antarmuka yang sering kita temu pada versi Windows sebelumnya.

Sebagai contoh bila dijalankan Internet Explorer dari layar Metro, maka akan prilaku dan antarmuka seperti aplikasi pada Windows Phone 7, kalau tidak percaya bisa lihat pada gambar berikut :) Tidak ada tab untuk membuka halaman baru seperti pada Internet Explorer yang sering kita temui, seperti pada gambar di bawah ini. 

Screen shot 2011-09-18 at 10.52.37 PM

Internet Explorer di bawah ini dijalankan dari shortcut yang terdapat pada Desktop.

Screen shot 2011-09-18 at 10.47.59 PM

Antarmuka Desktop akan membuat kita terkenang pada antarmuka Windows 7 atau sebelumnya, seperti gambar di atas. Ada tombol "Windows" pada sisi kiri bawah, tapi fungsinya akan berbeda dengan tombol yang sebelumnya telah kita kenal. Kalau tombol itu diklik kita akan diantarkan pada halaman Metro utama. 

Sebagai informasi Internet Explorer yang terdapat pada Windows 8 adalah Internet Explorer 10, jadi wajar saat membuka Flickr, masih belum dianggap sebagai Internet Explorer :)

Pada

{Tipe Aplikasi}
Seperti yang telah disebutkan di atas, ada dua tipe aplikasi (ini masih menurut penerawangan penulis). Aplikasi Metro (ala Windows Phone 7) kalau dijalankan  prilakunya memang berbeda dari segi life cycle.  Aplikasinya hidup "hanya saat ada dilayar saja", tp kalau kita berganti layar maka kehidupannya akan berhenti.  Aplikasi ini juga tidak akan terlihat saat kita menekan tombol "ALT+Tab" untuk berpindah ke aplikasi yang sedang jalan.  

Untuk aplikasi non Aplikasi Metro, maka ketika dijalankan akan berpindah ke desktop dan aplikasi tersebut akan dapat dilihat saat tombol "ALT+Tab" ditekan.  Berikut adalah beberapa shortcut aplikasi tipe ini yang dapat kita temui pada layar utama Metro. Berikut adalah beberapa aplikasi yang akan berpindah ke desktop saat dijalankan (kecuali Store, Control Panel dan //build/).

#ralat

Setelah dicoba lagi, ternyata aplikasi Metro style ini sifatnya tidak seperti yang telah ditulis di atas. Sifat dan life cycle aplikasi metro style ini juga seperti app pada umumnya. Artinya baik app metro style atau yang bukan dapat dilihat di daftar multitasking saat tombol ALT+Tab ditekan. Dan aplikasi metro style tetap dapat hidup walau dia sudah tidak ditampilkan dilayar, dan dengan memilih aplikasi tersebut di daftar saat tombol ALT+Tab maka aplikasi tersebut akan ditampilkan kembali :)

 

Screen shot 2011-09-18 at 11.55.38 PM  Screen shot 2011-09-19 at 12.20.00 AM

{Aplikasi}
Pada Windows 8, kita akan mendapatkan aplikasi Metro yang biasa kita gunakan sehari-hari. Seperti aplikasi untuk social network seperti Socialite untuk koneksi ke Facebook atau Tweet@rama untuk koneksi ke Twitter. Juga ada picstream untuk koneksi ke Flickr. Berikut adlah antarmuka dari Socialite.

Screen shot 2011-09-19 at 12.23.47 AM

Selain itu jug terdapat game atau aplikasi entertainment yang lain seperti berikut ini.

Screen shot 2011-09-19 at 12.37.35 AM

Screen shot 2011-09-19 at 12.37.11 AM

Ada beberapa aplikasi yang menarik, salah satunya adalah memories, your life book, aplikasi untuk mengelola/album gambar/video. Pada platform lain pasti sudah perah bertemu aplikasi sejenis :)

Screen shot 2011-09-19 at 12.39.32 AM

Screen shot 2011-09-19 at 12.40.54 AM

Sepertinya sekian dulu laporan pandangan mata hasil pertemuan dengan Windows 8. Selamat mencoba dan selamat berakhir pekan.

Share this post: | | | |
Posted: Sep 18 2011, 01:22 PM by reyza | with 1 comment(s)
Filed under:
Re-cover : Membangun Aplikasi Web dengan Mudah dan Cepat

image

Ebook ini bukan ebook baru, tapi hanya melewati proses recover, penggantian judul yang sebelumnya adalah Hand on Lab : ASP.NET dan juga re-upload karena link terdahulu mengalami kecelakaan sehingga filenya juga ikut ikut lenyap :)

Cover ebook ini bertuliskan ASP.NET 4.0, karena memang diniatkan ada perubahan dari edisi terdahulu yang masih membahas ASP.NET 3.5, tetapi ternyata belum selesai seluruhnya. Jadi pada ebook ini ada sedikit membahas VS2010 dan ASP.NET 4.0 (sangat sedikit) dan tentunya pembahasan sama persis pada edisi sebelumnya.

Bagi yang baru melihat ebook ini mungkin berikut adalah informasi jika dilihat dari daftar isi ebook ini :

  1. Pendahuluan.
  2. NET 3.5 & Visual Studio 2008.
  3. Pengenalan C#.
  4. ASP.NET.
  5. ASP.NET dan Database.
  6. Design Antarmuka.
  7. Resource & Globalization.
  8. Validasi.
  9. ASP.NET Ajax dan Ajax Control Toolkit.
  10. Membership, Profile dan Navigasi.
  11. Reporting, khusus untuk materi Reporting ditulis oleh saudar Iman Harmaen.

Ebook ini awalnya adalah modul pelatihan yang saya gunakan untuk training para developer ASP.NET. Sehingga isinya sesuai dengan langkah-langkah yang biasa ditemui pada suatu training/pelatihan pemrograman.

Ebook ini bisa di download di sini (Geeks Portal) atau di sini (Live).

Semoga berguna.

Share this post: | | | |
Screen Scraping : “Mencuri” Data Website dengan Elegan

Pada sebuah event komunitas gw mendengar istilah “mencuri” dari untuk menggantikan kata kerja “mengambil” data pada suatu site di internet.  Seperti “mencuri” pada umumnya ada dua cara yang bisa digunakan, yaitu :

1. Dengan Otot.

2. Dengan Otak.

Di internet kita dapat melihat data dapat diakses dengan mudah dengan browser, dan berikut ini contoh data yang mungkin kita lihat.

image

Atau seperti berikut :

image

Untuk aksi pencurian dengan otot maka langkahnya sangat gampang, cukup lakukan aksi blok data kemudian copy dan paste ke tempat yang diinginkan. Misalnya pada notepad, kemudian masih dengan bantuan otot, lakukan pembersihan data untuk mengambil item-item yang diperlukan. Misal pada contoh gambar di atas, item yang penting untuk diambil seperti RCTI, 01 Juni 2011 dan nama acara TV dan jam tayangnya. Sedangkan pada data gambar di atas, maka yang diperlukan selain data yang berhubungan dengan gambar juga gambarnya sendiri. Untuk mendapatkan gambarnya maka cukup perintahkan otot untuk melakukan aksi klik kanan dan save as image bersangkutan, satu per satu :)  Setelah data tersebut di dapatkan maka tinggal lakukan yg diinginkan, masih menggunakan otot, mungkin bisa dilanjutkan dengan menyalin data tersebut ke database.

Kalau otot-otot telah cape, maka bisa dipikirkan untuk mencuri dengan cara yang lebih elegan dan dan otot tidak perlu digunakan lagi (agar kalori tetap stabil dan gemuk tetap bertahan).  Salah satu caranya adalah dengan melakukan Screen Scraping.

Screen Scraping, apa sih itu?

Mungkin paparan ini akan “sedikit” menjawab. Sebagai contoh data dari acara TV di atas tidak lain adalah bagian dari sebuah halaman HTML, dan kira-kira berikut adalah kode HTML dari potongan data di atas.

   1: <div class='post' id='post'>
   2: <a name='4306621538310684552'></a>
   3: <h2 class='title'>
   4: <a href='http://www.televisi-indonesia.com/2011/06/rcti-rabu-01-juni-2011.html'>RCTI, Rabu 01 Juni 2011</a>
   5: </h2>
   6: <div class='post-date'>
   7: <p>
   8: </p>
   9: </div>
  10: <div class='post-info clearfix'>
  11: <p class='author alignleft'>
  12: Posted by
  13:  
  14: <span class='fn'>akbarri</span>
  15: </p>
  16: <p class='comments alignright'>
  17: <a class='comments' href='http://www.televisi-indonesia.com/2011/06/rcti-rabu-01-juni-2011.html#comments' onclick=''>0
  18: comments</a>
  19: </p>
  20: </div>
  21: <div class='post-content clearfix'>
  22: <p>
  23: 00:30 - 02:30 BOM:POLICE STORY 4<br />
  24: 02:30 - 03:00 SEPUTAR INDONESIA MALAM<br />
  25: 03:00 - 04:00 HIGHLIGHT UEFA CHAMPIONS LEAGUE<br />
  26: 04:00 - 04:30 ASSALAMU'ALAIKUM USTADZ<br />
  27: 04:30 - 06:00 SEPUTAR INDONESIA PAGI<br />
  28: 06:00 - 07:30 GO SPOT<br />07:30 - 11:00 DAHSYAT<br />
  29: 11:00 - 12:00 INFOTAINMENT INTENS<br />
  30: 12:00 - 12:30 SEPUTAR INDONESIA SIANG<br />
  31: 12:30 - 13:00 SEPUTAR PERISTIWA<br />
  32: 13:00 - 15:00 SINEMA SIANG: CINTA HIGIENIS<br />
  33: 15:00 - 16:00 CEK & RICEK<br />
  34: 16:00 - 17:00 BEDAH RUMAH<br />
  35: 17:00 - 17:30 SEPUTAR INDONESIA<br />
  36: 17:30 - 18:30 SILET<br />
  37: 18:30 - 19:30 MEGA SINETRON:PUTRI YANG DITUKAR<br />
  38: 19:30 - 21:00 MEGA SINETRON: ANUGERAH<br />
  39: 21:00 - 22:30 MEGA SINETRON : KASIH DAN CINTA<br />
  40: 22:30 - 00:30 MEGA SINEMA : PENGAMEN CINTA KACANGAN
  41: <div style='clear: both;'></div>
  42: </p>
  43: </div>

Dapat dilihat bawah data berada di dalam tag div dengan atribut class= post dan id=post yang terlihat pada baris ke-1 dan di akhiri pada baris ke-42. Sedangkan pada baris ke-3 sampai baris ke-5 dapat dilihat title dari data tersebut yang berisi “RCTI, Rabu 01 Juni 2011”. Sedangkan data acara TV-nya berada diantara tag div dengan atribut class=’post-content clearfix’.

Nah salah satu dari banyak aksi Screen Scraping adalah mengambil data berdasarkan tag HTML dengan aturan sesuai identitas yang telah disebutkan di atas atau yang diinginkan.  Atribut seperti nama pada atribut class atau pada atribut id dapat dijadikan penanda untuk menemukan data yang diinginkan.

Jadi bisa diartikan Screen Scraping adalah teknik yang dapat digunakan untuk “mengekstrak” data yang diinginkan pada suatu halaman web (HTML), walau tentunya ada fungsi lain dari Screen Scraping. CMIIW.

Di posting ini akan dicoba melakuan Screen Scraping dengan class library yang sudah ada dan menampilkan hasilnya pada suatu halaman web yang akan kita buat sendiri. Class library yang akan digunakan adalah Html Agility Pack yang dapat ditemui disini http://htmlagilitypack.codeplex.com. Setelah HtmlAgilityPack.1.4.0.zip diekstrak maka akan ditemui tiga file berikut.

image

Sekarang cukup lakukan penyalinan file .dll dan .xml ke folder Bin pada Web Site Project seperti berikut :

image

Pada gambar di atas dapat dilihat kedua file tersebut berada pada project AcaraTV.

Selanjutnya akan kita buat sebuah halaman untuk mengambil 1 posting yang ada disuatu web yg berisi daftar acara TV. Berikut kira-kira contoh yang dapat kita tulis.

   1: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
   2:  
   3: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   4:  
   5: <html xmlns="http://www.w3.org/1999/xhtml">
   6: <head runat="server">
   7:     <title></title>
   8: </head>
   9: <body>
  10:     <form id="form1" runat="server">
  11:     <div>
  12:         <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
  13:     </div>
  14:     </form>
  15: </body>
  16: </html>

Pada baris ke-12 dapat dilihat terdapat kontrol Label yang akan digunakan untuk menampilkan data curian ini :)

Dan pada file Default.aspx.cs

   1: using System;
   2:  
   3: using HtmlAgilityPack;
   4:  
   5: public partial class _Default : System.Web.UI.Page
   6: {
   7:     protected void Page_Load(object sender, EventArgs e)
   8:     {
   9:         HtmlWeb web = new HtmlWeb();
  10:         HtmlDocument doc = web.Load("http://www.televisi-indonesia.com");
  11:         var name = doc.DocumentNode.SelectSingleNode("//div[@id='post']").InnerHtml;
  12:         Label1.Text = name;
  13:     }
  14: }

Pada baris ke-3 dapat dilihat pendaftaran namespace HtmlAgilityPack agar class-class didalamnya dapat digunakan.  Class dari namespace ini yang digunakan adalah HtmlWeb dan HtmlDocument. Pada baris ke-10 dapat dilihat bagaimana cara untuk “menunjuk” site atau page sebagai rumah target pencurian. Sedangkan pada baris-11 adalah cara untuk melakukan pencurian barang yang diinginkan, dapat dilihat bagaimana cara menunjuk area div dengan atribut id=post di baris ini. Selanjutnya pada baris ke-12 cara paling sederhana untuk menampilkan hasil curian :)

Kira-kira berikut hasilnya.

image

Hm, terlihat masih “kotor” karena terdapat “link-link” yang tidak enak dipandang mata dan tidak diperlukan. Kita akan coba untuk mengambil “RCTI, Kamis 02 Juni 2011” saja tanpa bisa dilik dan data jadwal acara saja. Untuk itu maka gw akan coba ganti beberapa baris kode sebelumnya dengan seperti di bawah ini.

   1: <asp:Label ID="Label_StasiunTV" runat="server" Text="Label"></asp:Label>
   2: <br />
   3: <asp:Label ID="Label_DaftarAcara" runat="server" Text="Label"></asp:Label>

Untuk mengisi kedua kontrol tersebut maka dapat dilakukan dengan cara berikut.

   1: using System;
   2:  
   3: using HtmlAgilityPack;
   4:  
   5: public partial class _Default : System.Web.UI.Page
   6: {
   7:     protected void Page_Load(object sender, EventArgs e)
   8:     {
   9:         HtmlWeb web = new HtmlWeb();
  10:         HtmlDocument doc = web.Load("http://www.televisi-indonesia.com");
  11:         var stasiunTV = doc.DocumentNode.SelectSingleNode("//div[@id='post']//h2[@class='title']//a").InnerHtml;
  12:         var daftarAcara = doc.DocumentNode.SelectSingleNode("//div[@id='post']//div[@class='post-content clearfix']//p").InnerHtml;
  13:  
  14:         Label_StasiunTV.Text = stasiunTV;
  15:         Label_DaftarAcara.Text = daftarAcara;
  16:     }
  17: }

Dan berikut hasilnya :

image

Aaah lumayan rapi sekarang. Pada baris ke-11 kita dapati pola seperti berikut “//div[@id='post']//h2[@class='title']//a” yang artinya kira akan mengambil sesuatu yang berada pada :

1. Diantara tag a (<a>…</a>)

2. Dimana tag a tersebut berada di dalam tag h2 dengan atribut class=title (<h2 class=’title’><a>…</a></h2>).

3. Yang mana tag h2 tersebut berada di dalam tag div dengan atribut id=post (<div id=’post’><h2 class=’title’><a>…</a></h2></div>).

Begitu juga untuk baris ke-12.

Kalau di atas dicontohkan hanya berfungsi untuk mengambil 1 item pada 1 area saja, sekarang kita akan coba untuk mengambil lebih dari 1 item pada area yang mempunyai pola yang sama.  Perlu diketahui bahwa pada halaman site tersebut tidak hanya ada data jadwal dari stasiun RCTI saja tapi juga ada dari stasiun lain.  Dan setiap data dari stasiun lain tersebut ditulis dengan cara yang sama seperti data pada stasiun RCTI.

Berikut adalah halaman dari website yang menampilkan jadwal TV di Indonesia.

image

Contoh berikut akan menampilkan daftar stasiun TV, yang didapat dari title pada posting di web tersebut.  Daftar stasiun TV ini nanti akan ditampilkan pada kontrol DropDownList. Berikut contoh kode-nya.

   1: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="StasiunTV.aspx.cs" Inherits="StasiunTV" %>
   2:  
   3: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   4:  
   5: <html xmlns="http://www.w3.org/1999/xhtml">
   6: <head runat="server">
   7:     <title></title>
   8: </head>
   9: <body>
  10:     <form id="form1" runat="server">
  11:     <div>
  12:         <asp:DropDownList ID="DropDownList_StasinTV" runat="server">
  13:         </asp:DropDownList>
  14:     </div>
  15:     </form>
  16: </body>
  17: </html>

Dan berikut.

   1: using System;
   2: using System.Web.UI.WebControls;
   3:  
   4: using HtmlAgilityPack;
   5:  
   6: public partial class StasiunTV : System.Web.UI.Page
   7: {
   8:     protected void Page_Load(object sender, EventArgs e)
   9:     {
  10:         HtmlWeb web = new HtmlWeb();
  11:         HtmlDocument doc = web.Load("http://www.televisi-indonesia.com");
  12:         var stasiunTVs = doc.DocumentNode.SelectNodes("//div[@id='post']//h2[@class='title']//a");
  13:  
  14:         if (stasiunTVs != null)
  15:         {
  16:             ListItemCollection items = new ListItemCollection();
  17:  
  18:             foreach (var stasiunTv in stasiunTVs)
  19:             {
  20:                 string[] stasiunTVArr = stasiunTv.InnerText.Split(',');
  21:  
  22:                 ListItem item = new ListItem();
  23:                 item.Text = stasiunTVArr[0];
  24:                 item.Value = stasiunTVArr[0];
  25:                 items.Add(item);
  26:             }
  27:  
  28:             DropDownList_StasinTV.DataSource = items;
  29:             DropDownList_StasinTV.DataTextField = "Text";
  30:             DropDownList_StasinTV.DataValueField = "Value";
  31:             DropDownList_StasinTV.DataBind();
  32:         }
  33:     }
  34: }

Perbedaan dengan contoh sebelumnya adalah pada baris ke-12. Disini kita gunakan method SelectNodes untuk mengambil koleksi dari node yang ditentukan.  Dengan begitu kita dapat “mencuri” banyak item sekaligus dengan sekali tepukan :) Setelah itu hasilnya akan ditampung pada ListItemCollection yang nanti akan di-bind ke DropDownList. Hasilnya bisa dilihat seperti gambar berikut ini.

image

Contoh selanjutnya adalah akan menampilkan daftar jadwal acara berdasarkan stasiun TV yang dipilih. Jadwal acara akan ditampilkan pada kontrol GridView. Berikut kodenya.

   1: <%@ Page Language="C#" AutoEventWireup="true" CodeFile="StasiunTV.aspx.cs" Inherits="StasiunTV" %>
   2:  
   3: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   4:  
   5: <html xmlns="http://www.w3.org/1999/xhtml">
   6: <head runat="server">
   7:     <title></title>
   8: </head>
   9: <body>
  10:     <form id="form1" runat="server">
  11:     <asp:ScriptManager ID="ScriptManager1" runat="server">
  12:     </asp:ScriptManager>
  13:     <asp:UpdatePanel ID="UpdatePanel1" runat="server">
  14:         <ContentTemplate>
  15:             <div>
  16:                 Pilih Stasiun TV :
  17:                 <asp:DropDownList ID="DropDownList_StasinTV" runat="server" AutoPostBack="True" onselectedindexchanged="DropDownList_StasinTV_SelectedIndexChanged">
  18:                 </asp:DropDownList>
  19:                 <asp:UpdateProgress ID="UpdateProgress1" runat="server">
  20:                 <ProgressTemplate>Sedang mengambil data...</ProgressTemplate>
  21:                 </asp:UpdateProgress>
  22:             </div>
  23:             <br />
  24:             <div>
  25:                 <asp:GridView ID="GridView_Jadwal" runat="server">
  26:                 </asp:GridView>
  27:             </div>
  28:         </ContentTemplate>
  29:     </asp:UpdatePanel>
  30:     </form>
  31: </body>
  32: </html>

Dan ini :

   1: using System;
   2: using System.Web.UI.WebControls;
   3:  
   4: using HtmlAgilityPack;
   5: using System.Collections;
   6:  
   7: public partial class StasiunTV : System.Web.UI.Page
   8: {
   9:     protected void Page_Load(object sender, EventArgs e)
  10:     {
  11:         if (!IsPostBack)
  12:         {
  13:             DropDownList_StasiunTV_DataBind();
  14:             GetJadwalTVFromWeb();
  15:         }
  16:     }
  17:  
  18:     protected void GetJadwalTVFromWeb()
  19:     {
  20:         HtmlWeb web = new HtmlWeb();
  21:         HtmlDocument doc = web.Load("http://www.televisi-indonesia.com");
  22:         var data = doc.DocumentNode.SelectNodes("//div[@id='post']");
  23:  
  24:         if (data != null)
  25:         {
  26:             IList jadwalList = new ArrayList();
  27:  
  28:             foreach (var item in data)
  29:             {
  30:                 string[] stasiun = item.SelectSingleNode("h2[@class='title']//a").InnerText.Split(',');
  31:  
  32:                 if (stasiun[0].Equals(DropDownList_StasinTV.SelectedValue))
  33:                 {
  34:                     string[] dataJadwal = item.SelectSingleNode("div[@class='post-content clearfix']//p").InnerHtml.Replace("<br>", "#").Split('#');
  35:  
  36:                     foreach (var jadwal in dataJadwal)
  37:                     {
  38:                         JadwalTV jadwalTV = new JadwalTV();
  39:                         jadwalTV.Stasiun = stasiun[0];
  40:                         jadwalTV.Waktu = jadwal.Substring(0, 14);
  41:                         jadwalTV.NamaAcara = jadwal.Substring(14);
  42:                         jadwalList.Add(jadwalTV);
  43:                     }
  44:                 }
  45:             }
  46:  
  47:             GridView_Jadwal.DataSource = jadwalList;
  48:             GridView_Jadwal.DataBind();
  49:         }
  50:     }
  51:  
  52:     protected void DropDownList_StasiunTV_DataBind()
  53:     {
  54:         HtmlWeb web = new HtmlWeb();
  55:         HtmlDocument doc = web.Load("http://www.televisi-indonesia.com");
  56:         var stasiunTVs = doc.DocumentNode.SelectNodes("//div[@id='post']//h2[@class='title']//a");
  57:  
  58:         if (stasiunTVs != null)
  59:         {
  60:             ListItemCollection items = new ListItemCollection();
  61:  
  62:             foreach (var stasiunTv in stasiunTVs)
  63:             {
  64:                 string[] stasiunTVArr = stasiunTv.InnerText.Split(',');
  65:  
  66:                 ListItem item = new ListItem();
  67:                 item.Text = stasiunTVArr[0];
  68:                 item.Value = stasiunTVArr[0];
  69:                 items.Add(item);
  70:             }
  71:  
  72:             DropDownList_StasinTV.DataSource = items;
  73:             DropDownList_StasinTV.DataTextField = "Text";
  74:             DropDownList_StasinTV.DataValueField = "Value";
  75:             DropDownList_StasinTV.DataBind();
  76:         }
  77:     }
  78:  
  79:     protected void DropDownList_StasinTV_SelectedIndexChanged(object sender, EventArgs e)
  80:     {
  81:         GetJadwalTVFromWeb();
  82:     }
  83: }
  84:  
  85: public class JadwalTV
  86: {
  87:     public string Stasiun { set; get; }
  88:     public string Waktu { set; get; }
  89:     public string NamaAcara { set; get; }
  90: }

Dan berikut hasilnya :

image

Implikasi

Pada paparan di atas hanya mencontohkan bagaimana menggunakan salah satu teknik Screen Scraping untuk mengambil data pada suatu halaman web. Data yang dapat diambil dapat ditampilkan secara langsung seperti cara di atas atau disimpan pada database dan dipublish dengan menggunakan berbagai macam nama seperti Web Service, OData atau WCF Data Service sehingga nanti dapat dikonsumsi dan dimanfaatkan oleh client seperti Silverlight atau Windows Phone 7 bahkan Symbian atau iOS. Bagian ini akan di bahas pada posting berikutnya, dengan implementasi pembuatan aplikasi mobile Jadwal Televisi Indonesia :)

Selamat menikmati liburan panjang, bagi yang mengalaminya.

Share this post: | | | |
Memperbaiki “Kesalahan” SRC pada tag IMG dengan jQuery

Windows Live Writer sepertinya sudah menjadi tool yang lazim digunakan untuk menulis blog dan mempublish. Kenapa? karena kemudahannya tentu saja, menulis bisa kapan saja tanpa perlu terkoneksi dengan internet terlebih dahulu, menulis sangat gampang segampang menulis di MS Word, insert gambar pun juga sangat mudah karena gambar yang “ditempelkan” pada tulisan langsung terupload ke site. 

Misal site tersebut mempunyai domain “www.hahahihi.com” maka gambar yang telah disisipkan pada posting akan diubah menjadi tag HTML seperti berikut ini.

<img src="http://www.hahahihi.com/blog/reyza/gambar123.jpg" alt="gambar" />

Dari contoh diatas dapat dilihat bahwa gambar yang disisipkan akan mempunyai lokasi yang absolute berdasarkan domain site tersebut. Tidak akan menjadi masalah bila domain site tersebut akan selalu www.hahahihi.com, bagaimana bila ternyata domain tersebut berubah menjadi www.hihihaha.web.id ? Bila hal ini terjadi, dipastikan gambar pada setiap posting blog akan menghilang, karena tidak menemukan lagi domain www.hahahihi.com.

Solusinya ada 3 cara :

  1. User pemilih blog tinggal mengubah seluruh postingnya agar url gambar yang menggunakan domain www.hahahihi.com menjadi www.hihihaha.web.id :)
  2. Membuat script SQL untuk masuk ke setiap record pada tabel untuk menyimpan posting blog dan bermain-main regex dan kemudian mengubah www.hahahihi.com yang ada pada tag IMG menjadi www.hihihaha.web.id.
  3. Membuat script javascript dengan bantuan jQuery untuk mengubah www.hahahihi.com yang ada pada tag IMG menjadi www.hihihaha.web.id pada setiap halaman posting yang diakses oleh pengunjung.

Sepertinya cara ketiga lebih elegant dan lebih manusiawi, karena tidak perlu melakukan banyak pekerjaan susah dan mungkin beresiko terhadapat kesehatan data yang telah tersimpan. Cukup tiga langkah untuk membuat hal ini menjadi kenyataan :

1. Download class library jQuery dari http://jquery.com/.

2. Kemudian “daftarkan” lokasi file yang telah didownload pada langkah pertama.

<script src="http://www.hihihaha.web.id/script/jquery-1.4.1.min.js" type="text/javascript"></script>

3. Selanjutnya tinggal tambahkan baris berikut ini.

   1: $(document).ready(function() {
   2:     $("img[src^='http://www.hahahihi.com']")
   3:     .each(function() {
   4:         this.src = this.src.replace(/^http:\/\/www\.hahahihi\.com/, "http://hihihaha.web.id");
   5:     });
   6: });

Pada baris ke-1, berfungsi agar aksi didalamnya dilakukan setelah setelah content posting telah terload sempurna.

Pada baris ke-2, melakukan pengambilan seluruh objek elemen img, tetapi dengan filter bahwa hanya objek img dengan atribut yang mempunyai nilai awal http://www.hahahihi.com saja. Setelah semua objek didapat maka tinggal melakukan replace nilai pada atribut SRC agar http://www.hahahihi.com menjadi http://hihihaha.web.id seperti yang terlihat pada baris ke-4.

Share this post: | | | |
Posted: May 30 2011, 10:24 PM by reyza | with no comments
Filed under: ,
{Linq to SQL - Optimistic Concurrency} on ASP.NET

Misalnya seorang user, sebut saja berinisial MD sedang mengakses halaman berikut :

image imageimage

Begitu juga dengan user lain yang berinisial IR, mengkases halaman yang sama dan sedang mengedit record yang saja juga.

imageimageimage

Bila hal tersebut di atas terjadi, dan saat salah satu user melakukan proses Update, kira apa yang terjadi ?

  1. apakah data akan diupdate sesuai dengan user yang terakhir melakukan proses update?
  2. apakah user yang mengklik duluan yang akan berhasil mengupdate data, sedangkan user yang kemudian mengupdate akan melakukan kegagalan?
  3. ataukah, data akan di-merge antara data dari kedua user tersebut?

Kenapa perlu dipikirkan hal seperti di atas?

  1. Jika kasus 1 yang dianut, maka hanya user yang terakhir yang tahu akan kebenaran data yang user tersebut inputkan telah disimpan. Sedangkan user sebelumnya akan tenang-tenang saja dan merasa data yang telah dia inputkan telah masuk, padahal data tersebut sudah terubah oleh user terakhir. Secara logika mungkin benar, tetapi secara etika terhadap user pengguna mungkin kurang, karena user sebelum yang terakhir jadi korban…korban “tenang-tenang saja” padahal data dia telah berubah.
  2. Sedangkan kasus kedua atau ketiga mungkin akan lebih manusiawi.

Tapi pada posting ini hanya akan dibahas kasus kedua saja, yang lebih dikenal dengan Optimistic Concurrency.  Bila digunakan kebetulan digunakan teknologi Linq to SQL maka secara default akan digunakan metode Optimistic Concurrency, artinya jika satu record diakses bersamaan oleh MD dan IR maka :

  1. Jika user MD menyimpan/update terlebih dahulu maka user IR akan menemui pesan kegagalan.
  2. Jika user IR yang melakukan proses penyimpanan/update terlebih dahulu maka user MD akan menemui kegagalan saat menyimpan.

Berikut adalah contoh sederhana halaman yang berisi daftar data dan form inline editing pada GridView.

   1: <asp:LinqDataSource ID="LinqDataSource1" runat="server" 
   2:     ContextTypeName="DataClassesDataContext" EnableDelete="True" 
   3:     EnableInsert="True" EnableUpdate="True" EntityTypeName="" TableName="REF_AXLEs">
   4: </asp:LinqDataSource>
   5:     
   6: <br />
   7: <asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" 
   8:     DataKeyNames="AXLE_CODE" DataSourceID="LinqDataSource1" AllowPaging="True">
   9:     <Columns>
  10:         <asp:CommandField ShowEditButton="True" />
  11:         <asp:BoundField DataField="AXLE_CODE" HeaderText="AXLE_CODE" ReadOnly="True" SortExpression="AXLE_CODE" />
  12:         <asp:BoundField DataField="DESCRIPTION" HeaderText="DESCRIPTION" SortExpression="DESCRIPTION" />
  13:     </Columns>
  14: </asp:GridView>

Cara menguji kebenaran bahwa Linq to SQL dapat dilakukan dengan skenario seperti berikut :

Cukup gunakan 1 browser dengan dua tab yang berbeda untuk mengakses 1 halaman.

image

Pada tab 1, klik Edit pada AXLE_CODE=4, begitu juga pada tab 2.

Kemudian pada Tab 1 ubah data pada kolom Description klik tombol Update, proses Update berhasil.

Pada Tab 2, ubah data pada kolom Description kemudian klik tombol Update, proses gagal.

Dan berikut adalah contoh pesan kegagalan yang akan didapatkan oleh user yang kemudian menyimpan/update setelah user pertama melakukan update. Dapat dilihat terdapat pesan kegagalan karena kolom telah berubah atau tidak ditemukan.

image

Sebenarnya apa sih yang terjadi ketika proses update jika menggunakan Linq to SQL (atau “sejenisnya”) ? Berikut kira yang terjadi jika diterangkan secara sederhana :

  1. Ketika tombol Edit diklik, ada yang berperan untuk “menampung” nilai original dari record yang dipilih.
  2. Saat proses penyimpanan/update nilai original tersebut akan dibandingkan dengan data yang ada di database, jika nilai original dari field yang kita ubah berbeda dengan nilai yang ada di database, maka artinya ada yang telah mengubah nilai tersebut, maka akan dilemparkan pesan kegagalan.

Kasus di atas menggunakan control LinqDataSource dan GridView dengan inline editing. Bagaimana bila kasusnya dilakukan semi-manual seperti kasus di bawah ini.

image

Ketika link Detail pada suatu record dipilih, maka sebenarnya yang dipanggil adalah event OnSelectedIndexChanged dari GridView, dan pada event handlernya dilakukan pengisian nilai pada control-control seperti TextBox, DropDownList berdasarkan record yang dipilih, seperti pada gambar di bawah ini. Untuk menyimpan nilai original record dapat memanfaatkan Session seperti berikut :

   1: string id = Convert.ToString(GridView_Main.SelectedValue);
   2: REF_AXLE item = repository.Get<REF_AXLE>(id);
   3: Session["REF_AXLE"] = item;

Baris ke-2 adalah cara untuk “menangkap object” dr record yang dipilih, dan baris ke-3 adalah cara untuk menyimpan objek tersebut ke dalam Session.

image

Jika tombol Update (ImageButton), maka akan dieksekusi event handler OnClick dari ImageButton tersebut. Pada event handler ini yang dilakuan adalah mengambil kembali nilai pada Session.

   1: REF_AXLE originalitem = (REF_AXLE)Session["REF_AXLE"];

Kemudian menampung nilai yang akan diupdate pada objek :

   1: REF_AXLE item = new REF_AXLE();
   2:             
   3: item.AXLE_CODE = TextBox_FormCode.Text;
   4: item.DESCRIPTION = TextBox_FormName.Text;

Selanjutkan tinggal attach seperti berikut :

   1: DataAccessObject db = new DataAccessObject();
   2: db.DataContext.REF_AXLEs.Attach(item, originalitem);
   3: db.DataContext.SubmitChanges();

Baris ke-1 adalah class buatan sendiri, bukan default ada. Intinya adalah pada baris ke-2, ada proses attach dengan menggunakan dua objek, yaitu objek original dan objek dengan nilai untuk update. Hal ini memastikan Optimistic Concurrency masih berjalan.

#DokumentasiAgarTidakLupa

Share this post: | | | |
Posted: Apr 06 2011, 09:20 PM by reyza | with no comments
Filed under: , ,
ASP.NET : Using RoleManager and Profile in different way

Sejak ASP.NET 2.0 telah dikenal fitur Membership, RoleManager dan Profile, karena fitur lama jadi tidak perlu di jelaskan secara detail, karena dipastikan sudah pada tahu kalau :

  • Membership berfungsi membantu untuk mengelola user.
  • RoleManager berfungsi membantu untuk role dari user.
  • Profile berfungsi untuk menambah atribut pada user, seperti alamat, organisasi kerja dan lain-lain.

Sedangkan untuk membuat menu telah disediakan Sitemap yang dapat terintegrasi dengan fitur di atas.  Menu pada Sitemap dapat juga dapat berkerja sama dengan RoleManager, sehingga memungkinkan penampakan item-item pada menu dapat diatur sesuai dengan role dari user yang sedang login.  Untuk membuat mereka bekerjasama pun sangat mudah, pada file *.sitemap cukup tambahkan atribut Roles pada suatu item menu, dan berikan nama role yang  dapat mengakses item menu tersebut.

User memungkinkan dapat memiliki lebih dari role, sehingga ….

  • Jika pada Sitemap diatur item menu A, B, C adalah untuk role User,
  • Sedangkan item menu D, E, F, G adalah untuk role Admin,

Maka ketika seorang user memiliki role User dan Admin, secara otomatis akan ditampilkan item menu A, B, C, D, E, F, G.

Tetapi untuk sebagian orang mungkin ingin memiliki cara yang berbeda dengan cara di atas, sebagian orang mungkin ingin menggunakan cara penanganan seperti berikut :

  • User dapat memiliki lebih dari satu role, misal role yang telah didaftarkan adalah A, B, C dan D. Maka seorang user dapat memiliki role {A dan B} dari {A, B, C dan D}.
  • Setelah user login, terlebih dahulu user tersebut dapat memilih role yang ingin digunakan, role yang dapat dipilih adalah role yang telah didaftarkan ke user tersebut saja, dalam kasus ini adalah role {A dan B} saja.
  • Item-item menu yang ditampilkan akan sesuai dengan role yang dipilih.

Untuk membuat permintaan tersebut terlaksana maka perlu dilakukan langkah-langkah di bawah ini.

{Memanfaatkan Profile sebagai media penyimpanan role dari user}

Normalnya, role yang dimiliki oleh user disimpan pada tabel aspnet_UsersInRoles, bila user mempunyai lebih dari 1 role, misalnya 3 role, maka akan ditemui 3 record pada tabel ini. Dengan informasi itulah menu dirender berdasarkan role dari user yang sedang login.  Karena yang diinginkan hanya 1 role saja yang aktif berdasarkan pilihan user tersebut setelah login, maka tabel ini hanya akan berisi 1 role saja, yaitu role yang dipilih oleh user tersebut. 

image

Tetapi karena user masih mungkin memiliki lebih dari maka perlu media penyimpanan lain, oleh karena itu dapat memanfaatkan Profile untuk kebutuhan ini. Untuk keperluan itu perlu ditambahkan 1 atribut untuk menyimpan data role-role tersebut.  Penambahan atribut ini cukup dilakukan pada file web.config, dan tambahkan kode seperti paga baris ke-7.

   1: <profile>
   2:     <providers>
   3:         <clear/>
   4:         <add name="AspNetSqlProfileProvider" connectionStringName="HOREHOREUserConnString" applicationName="HOREHORE" type="System.Web.Profile.SqlProfileProvider, System.Web, Version=2.0.0.0, Culture=neutral, PublicKeyToken=b03f5f7f11d50a3a"/>
   5:     </providers>
   6:     <properties>
   7:     <add name="Groups" type="System.String" serializeAs="String" allowAnonymous="false" defaultValue="" readOnly="false"/>
   8:     . . .
   9:     </properties>
  10: </profile>

Data role yang disimpan pada atribut Groups di Profile akan dipisahkan oleh tanda koma (,). sehingga bila user punya role A dan B maka data yang disimpan pada atribut ini adalah A,B.

image

Misalnya role yang tersedia ditampilkan pada checkboxlist, maka penyimpanan role dari role yang dipilih pada checkboxlist dapat dilakukan dengan cara berikut :

   1: string roles = String.Empty;
   2: ProfileCommon profileCommon = Profile.GetProfile(userName);
   3:  
   4: for (int i = 0; i < CheckBoxList_FormRoles.Items.Count; i++)
   5: {
   6:     if (CheckBoxList_FormRoles.ItemsIdea.Selected)
   7:     {
   8:         if (!String.IsNullOrEmpty(roles)) roles += ",";
   9:         roles += CheckBoxList_FormRoles.ItemsIdea.Value;
  10:     }
  11:     CheckBoxList_FormRoles.ItemsIdea.Selected = false;
  12: }
  13: profileCommon.Groups = roles;
  14: profileCommon.Save();

{Menampilkan role yang ingin digunakan}

Setelah data telah siap, maka dapat dibuat skenario ketika user telah sukses login maka user akan ditampilkan role user yang disimpan pada Profile dan dapat dipilih seperti berikut ini.

image

Pada gambar di atas, dapat diketahui user tersebut mempunyai 4 role yang disimpan pada Profile, dan 1 role yang aktif yang disimpan pada tabel aspnet_UsersInRoles yaitu role Administrator (terlihat status = Active).

Untuk menampilkan 4 role yang disimpan pada Profile  tersebut, cukup buat GridView dan load datanya dengan cara seperti berikut ini :

   1: IList roles = new ArrayList();
   2: string username = HttpContext.Current.User.Identity.Name;
   3: ProfileCommon profileCommon = Profile.GetProfile(username);
   4: string rolesStr = profileCommon.Groups;
   5:  
   6: if (!String.IsNullOrEmpty(rolesStr))
   7: {
   8:     string[] roleArr = rolesStr.Split(',');
   9:     foreach (string role in roleArr)
  10:     {
  11:         CaltrisRoles item = new CaltrisRoles();
  12:         item.ROLENAME = role;
  13:         roles.Add(item);
  14:     }
  15: }
  16:  
  17: GridView_Roles.DataSource = roles;
  18: GridView_Roles.DataBind();

Dapat dilihat pada gambar di atas, terdapat LinkButton Select pada kolom Action.  Fungsi LinkButton itu ketika dipilih/diklik adalah menyimpan data role yang dipilih ke dalam tabel aspnet_UsersInRoles sesuai dengan user yang melakukan aksi tersebut.  Namun sebelumnya dipastikan terlebih dahulu data role dari user tersebut harus dihapus. Hal ini untuk memastikan data role yang disimpan untuk seorang user hanya SATU saja.

Cara untuk melakukan kebutuhan di atas dapat dilihat dari kode di bawah ini :

   1: string username = HttpContext.Current.User.Identity.Name;
   2: string selectedRole = Convert.ToString(GridView_Roles.SelectedValue);
   3: String[] roles = Roles.GetRolesForUser(username);
   4:  
   5: // remove role pada DB
   6: foreach (string role in roles)
   7: {
   8:     if (Roles.IsUserInRole(username, role))
   9:     {
  10:         Roles.RemoveUserFromRole(username, role);
  11:     }
  12: }
  13:  
  14: // insert role yang dipilih user pada GridView ke dalam DB
  15: Roles.AddUserToRole(username, selectedRole);

{Bukti}

Sebagai bukti dapat dilihat pada gambar berikut ini :

image

Pada gambar di atas role yang aktif adalah Administrator, maka dapat dilihat menu yang dimiliki oleh user tersebut. Dan berikut ini adalah ketika role FUEL yang aktif.

image

Sangat mudah bukan…terima kasih telah membaca, silakan kembali menikmati akhir weekend ini Smile

Share this post: | | | |
Posted: Apr 03 2011, 07:23 PM by reyza | with no comments
Filed under: ,
ASP.NET : Fake Windows Authentication

image

Patrick Jane : Hallo, Ada apa John? Deploymentnya sukses & lancar?

Red John : Ada beberapa issue nih mas bos, ternyata mereka ingin menggunakan smart card untuk login komputer dan ingin setelah login komputer otomatis juga login ke aplikasi yang kita buat. Padahal kita sekarang kita cuma melakukan authentication dengan menggunakan form login.

Patrick Jane : Bukannya gampang tuh untuk menyelesaikan masalah tersebut. Tujuh menit juga sudah kelar.

{Real Windows Authentication}

Pada ASP.NET sangat mudah untuk mengubah proses authentication dari Form (menggunakan form login) ke bentuk Windows (menggunakan windows logon), yaitu cukup mengedit file web.config dan mengganti kode berikut :

<authentication mode="Forms">

Menjadi seperti berikut :

<authentication mode="Windows">

Dan dalam sekejap, windows logon menjadi proses authentication pada aplikasi web. Tetapi bagaimana kalau aplikasi web terdahulu tersebut telah menggunakan Role Manager untuk mengelola role dari user, dimana role tersebut terkait dengan Sitemap yang digunakan untuk membuatan menu. Seperti yang telah kita ketahui, Sitemap adalah “sumber data” yang menampilkan menu dengan menggunakan kontrol Menu ataupun TreeView. Item-item menu yang akan ditampilkan akan sesuai dengan role yang dimiliki oleh user yang telah login. Aplikasi lama tersebut juga memanfaatkan Profile untuk mengelola data tambahan untuk user. Apakah ketika mode authentication diganti menjadi “Windows” akan berdampak pada Role dan Profile yang telah digunakan?

Misalkan nama user yang disimpan pada sistem sebelumnya adalah NAMAUSER, sedangkan bila menggunakan authentication mode Windows maka nama user login yang ditangkap adalah [NAMADOMAIN]\NAMAUSER. Walaupun proses authentication berhasil dilewati, tetapi karena perbedaan nama user login tersebut membuat user yang telah login tidak mendapatkan Role dan Profile. Otomatis user tersebut menjadi kehilangan item-item menu yang sesuai dengan rolenya atau data profile tambahan.

{Fake Windows Authentication}

Agar data user, role dan profile masih bisa digunakan tanpa harus melakukan perubahan yang berarti kode-kode yang ada pada aplikasi web yang telah ada. Logikanya adalah sesuai dengan langkah-langkah berikut ini :

  • Mendapatkan user logon window.
  • Mencocokan nilai user logon tersebut dengan data Membership pada aplikasi lama.
  • Bila cocok maka secara otomastis user akan “diloginkan” tanpa harus memasukkan username dan password pada form login.

Dengan cara ini mode authentication yang digunakan adalah Form.

<authentication mode="Forms">

Untuk mendapatkan user login windows dapat menggunakan kode berikut :

string logonUser = Request.ServerVariables["LOGON_USER"];

Dengan kode di atas, maka nilai pada logonUser akan seperti berikut [NAMA_DOMAIN]\nama_user. Artinya kita cukup mengambil nama_user yang dapat dilakukan dengan cara berikut :

if (!String.IsNullOrEmpty(logonUser))
{
    string[] logonUserArr = logonUser.Split('\\');
    username = logonUserArr[logonUserArr.Length - 1];
    . . .
}

Sekarang kita sudah punya nilai “nama_user” yang ditampung di dalam variable username.  Selanjutnya tinggal memeriksa keberadaan username tersebut ke data Membership dengan cara berikut “kasar” seperti berikut ini :

   1: MembershipUser userObj = Membership.GetUser(username);
   2:  
   3: if (userObj != null)
   4: {
   5:     FormsAuthentication.RedirectFromLoginPage(username, true);
   6: }
   7: else
   8: {
   9:     Response.Redirect("~/Public/MessagePage.aspx");
  10: }

Pada baris pertama dapat dilihat cara untuk mengambil data user sesuai nilai username yang telah didapat, kemudian jika user tersebut ditemukan pada data Membership maka secara otomatis kita bisa “me-login-kan” user tersebut dengan cara seperti pada baris ke-5.

Dan Semi/Fake Windows Authentication pun dapat digunakan seperti layaknya Real WIndows Authentication.

#selamat-menikmati-akhir-pekan

Share this post: | | | |
Posted: Jan 21 2011, 11:05 PM by reyza | with 2 comment(s)
Filed under:
Dynamic Data : Create Simple CRUD Page in Seconds

Dynamic Data untuk membuat form CRUD untuk banyak tabel  dalam sekejap bukan barang baru lagi, tapi apakah benar Dynamic Data bisa memberikan apa yang diinginkan baik itu dari sisi kesesuaian antarmuka dan hal-hal lainnya ?

Sebelum pertanyaan itu terjawab ada baiknya memperlihatkan secara singkat bagaimana Dynamic Data membantu mempercepat pekerjaan developer untuk membuat halaman sederhana dengan fungsi CRUD (Create Retrieve Update Delete).

image

Pada gambar di atas digunakan Web Application Template untuk membuat “Aplikasi yang memanfaatkan Dynamic Data”, walau tidak menutup kemungkinan untuk menggunakan “Web Site Template”. Untuk “sumber data” dapat digunakan Linq to SQL dan Entity Framework, seperti yang terlihat pada gambar di atas. Pada contoh ini akan digunakan Linq to SQL.

Selanjutnya menambahkan “sumber data” dengan membuat LINQ to SQL Classes, dengan nama Northwind.dbml.

image

Selanjutnya tinggal membuat koneksi ke database via Server Explorer yang ada di Visual Studio, dan “tarik” tabel-tabel yang diinginkan ke Northwind.dbml.

image

Langkah terakhir adalah memodifikasi file Global.asax.cs untuk menentukan “sumber data” yang digunakan, dengan cara “meng-uncomment” baris berikut :

 
DefaultModel.RegisterContext(typeof(YourDataContextType), new ContextConfiguration() { ScaffoldAllTables = false });
 

Kemudian mengubah nilai “YourDataContextType” dengan nama data context yang sesuai dengan yang telah didefinisikan pada Northwind.dbml, yaitu NorthwindDataContext, dan mengubah nilai ScaffoldAllTables menjadi True, artinya nanti kita akan mempunyai halaman CRUD untuk semua “tabel” yang sudah didaftarkan pada Northwind.dbml.

 
DefaultModel.RegisterContext(typeof(NorthwindDataContext), new ContextConfiguration() { ScaffoldAllTables = true });
 

Build, dan View in Browser, hasilnya bisa dilihat seperti gambar di bawah ini :

image

image

image

Secara “otomatis” kita sudah punya halaman untuk melihat data dalam bentuk Grid dan form untuk insert/update data sesuai dengan struktur tabel yang ada. Form lumayan pintar melakukan penyesuaian, misalnya tabel mempunyai relasi maka “ada kemungkinan” input-an akan berbentuk dropdownlist. Apabila field memiliki sifat “not null” maka secara otomatis memberikan validasi dengan control RequiredFieldValidator dan banyak lain hal-hal lain yang “dibuatkan secara otomatis”.

Apakah “Default” yang dibuat oleh Dynamic Data sudah cukup? Bagaimana apabila ada keinginan seperti berikut ini :

  • Saya sudah membuat web app dengan menggunakan template Web Site, dan sudah banyak halaman yang telah dibuat, tetapi setelah mendapatkan informasi tentang Dynamic Data, ada keinginan menggunakannya untuk mengelola data master yang memang fungsionalitasnya cuma CRUD, apakah mungkin Dynamic Data digabungkan dengan web app yang sudah ada?
  • Karena saya sudah punya web app, saya ingin antarmuka halaman yang menggunakan Dynamic Data mempunyai tampilan yang senada. Begitu juga dengan keragaman URL untuk mengakses halaman. Apakah bisa?
  • Saya menggunakan LINQ to SQL, yang didalamnya sudah didaftarkan seluruh tabel untuk keperluan aplikasi, saya ingin menggunakan Dynamic Data tapi hanya ingin “tabel-tabel” tertentu saja yang akan dikelola dengan Dynamic Data, apakah hal itu mungkin?

Baiklah kita coba temukan jawabannya satu per satu.

{Dynamic Data Web Site + Existing My Web App}

Sebelumnya kita perhatikan dahulu item-item apa saja yang terdapat pada template ASP.NET Dynamic Data Linq to SQL Web Site.

image

Terdapat beberapa hal penting dari Solution Explorer yang dilihat digambar, yaitu folder DynamicData, Global.asax dan web.config. Maka langkah pertama untuk menambahkan “kemampuan Dynamic Data” pada website yang kita miliki maka copy folder Dynamic Data beserta isinya ke web app yang sudah ada. Kemudian copy juga file Global.asax ke root folder dari web app.

Maka kira-kira akan terlihat seperti gambar berikut :

image

Selanjutnya menyesuaikan isi web.config pada Existing My Web App agar mempunyai “kemampuan Dynamic Data” dengan menambahkan hal-hal berikut ini :

<compilation debug="true">
    <assemblies>
        . . .
        <!-- Dynamic Data-Start -->
        <add assembly="System.Web.Abstractions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        <add assembly="System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        <add assembly="System.ComponentModel.DataAnnotations, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        <add assembly="System.Web.DynamicData, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        <add assembly="System.Data.Linq, Version=3.5.0.0, Culture=neutral, PublicKeyToken=B77A5C561934E089"/>
        <!-- Dynamic Data-End -->
        . . .
    </assemblies>
</compilation>

Kemudian…

<pages theme="Ehem">
    <controls>
        . . .
        <!-- Dynamic Data-Start -->
        <add tagPrefix="asp" namespace="System.Web.DynamicData" assembly="System.Web.DynamicData, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        <add tagPrefix="rsweb" namespace="Microsoft.Reporting.WebForms" assembly="Microsoft.ReportViewer.WebForms, Version=9.0.0.0, Culture=neutral, PublicKeyToken=B03F5F7F11D50A3A"/>
        <!-- Dynamic Data-End -->
    </controls>
</pages>

Kemudian…

<httpModules>
   . . .
   <!-- Dynamic Data-Start -->
   <add name="UrlRoutingModule" type="System.Web.Routing.UrlRoutingModule, System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
   <!-- Dynamic Data-End -->
</httpModules>

Kemudian …

<system.webServer>
    . . .
    <modules>
        . . .
        <!-- Dynamic Data-Start -->
        <remove name="UrlRoutingModule"/>
        <add name="UrlRoutingModule" type="System.Web.Routing.UrlRoutingModule, System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
        <!-- Dynamic Data-End -->
    </modules>
    . . .
</system.webServer>

Sekarang modifikasi web.config sudah selesai, dan dilanjutkan dengan penyesuaian pada file Global.asax untuk menentukan Class DataContext seperti yang telah dijelaskan di atas.

Selain itu juga dapat dilakukan penyesuaian URL akses dengan cara seperti berikut :

   1: routes.Add(new DynamicDataRoute("Setup/{table}.aspx")
   2: {
   3:     Action = PageAction.List,
   4:     ViewName = "ListDetails",
   5:     Model = model
   6: });

Pada baris ke-1 adalah cara untuk menentukan cara akses halaman CRUD untuk tabel yang diinginkan, misalnya ingin mengakses halaman CRUD untuk tabel Pegawai, maka kita dapat menuliskannya seperti berikut http://domain/Setup/Pegawai.aspx. Bila nama tabelnya adalah Hasil_Penjualan, maka kita dapat mengaksesnya dengan mengakses URL http://domain/Setup/Hasil_Penjualan.aspx. Pada kode di atas dapat juga untuk menentukan Page Template yang ingin digunakan. Pada contoh di atas akan digunakan ListDetails.aspx sebagai Page Template.

Page Template ini dapat kita temukan di folder DynamicData\PageTemplates, seperti pada gambar.

image

Pada file ListDetail.aspx, dapat kita tentukan MasterPage yang digunakan oleh “Existing My Web App” sehingga antarmuka halaman Dynamic Data akan sesuai dengan halaman-halaman yang sudah ada. Dan berikut antarmuka dari halaman DynamicData yang telah dipermak baik dari penggunaan MasterPage dan juga CSS.

image

image

Sangat gampang!

{Menentukan Tabel yang ingin dikelola dengan halaman Dynamic Data}

Bila dalam LINQ to SQL Classes terdapat banyak “class yang menjadi representasi tabel pada database”, tetapi tidak semua yang akan dikelola dengan halaman Dynamic Data, maka kita bisa menentukan “tabel” mana saja yang ingin dikelola dengan cara berikut ini.

Langkah pertama membuat nilai atribut ScaffoldAllTables pada file Global.asax bernilai false.

   1:  
   2: DefaultModel.RegisterContext(typeof(NorthwindDataContext), new ContextConfiguration() { ScaffoldAllTables = false });
   3:  

Dari kode di atas maka tidak semua tabel yang dikelola oleh halaman Dynamic Data, kita harus menentukan sendiri tabel mana saja yang ingin dikelola. Misalnya kita ingin mengelola tabel Category dan Territory saja maka yang pertama kita lakukan adalah membuat file class dengan isi seperti berikut ini.

   1: using System;
   2: using System.Collections.Generic;
   3: using System.Linq;
   4: using System.Web;
   5:  
   6: using System.ComponentModel.DataAnnotations;
   7:  
   8: namespace WebApplication1
   9: {
  10:     [ScaffoldTable(true)]
  11:     public partial class Category { }
  12:  
  13:     [ScaffoldTable(true)]
  14:     public partial class Territory { }
  15: }

Dari kode di atas baris 10 dan baris 13 dapat dilihat bagaimana menentukan agar “tabel” Category dan Territory “didaftarkan” agar agar bisa dikelola dengan menambahkan atribut [ScaffoldTable(true)], dan jangan lupa untuk menggunakan NameSpace System.ComponentModel.DataAnnotations, agar kedua baris tersebut tidak “digarisbawahi”.

Selamat mencoba bagi yang memerlukan, semoga berguna.

Share this post: | | | |
ASP.NET : Create you own “CommandName”

Daripada menjawab pertanyaan satu arah via email, akan lebih baik pertanyaannya dijawab via tulisan di Blog agar bila ada pertanyaan yang sama cukup “copy-paste” URL saja, tanpa perlu analisis :)

Bagi pengemar ebook yang saya buat pasti tidak asing dengan gaya penyampilan data dengan menggunakan GridView dan aksi seperti pada gambar di bawah ini.

image

Pada gambar di atas terdapat LinkButton dengan title Detail yang ketika dipilih akan memanggil CommandName=”Select” yang secara default pasti akan mengeksekusi method yang “dipilih” pada “atribut” OnSelectedIndexChanged.

image

image

Setelah itu tinggal terserah anda mau melakukan hal-hal apa saja didalam method tersebut.

   1: protected void GridView_Main_SelectedIndexChanged(object sender, EventArgs e)
   2: {
   3:     // silakan tulis yang ingin dilakukan disini
   4: }

Jadi dapat disimpulkan apabila link “Detail” diklik maka secara otomatis method di atas ini akan dieksekusi.

Selanjutnya untuk menghapus data dilakukan dengan cara memilih checkboxlist record-record yang akan dihapus kemudian diakhiri menekan tombol Delete untuk menghapus. (caranya? silakan unduh ebooknya di sini).

Bagaimana kalau ingin melakukan kedua hal tersebut dengan cara berbeda, misalnya seperti ini :

image

Pada record terdapat tombol untuk “menghapus record yang dipilih” (icon merah) dan “melihat nilai lengkap record yang dipilih” (icon edit). Untuk icon edit adalah ImageButton yang menggunakan CommandName=Select seperti contoh sebelumnya.

 
<asp:ImageButton ID="ImageButton2" ImageUrl="~/App_Themes/Ehem/icons/icon_edit.png" AlternateText="Select" CommandName="Select" runat="server" />
 

Sedangkan ‘icon delete’ dapat menggunakan CommandName=Erase dan melemparkan key dari record yang ingin di hapus.

 
<asp:ImageButton ID="ImageButton1" ImageUrl="~/App_Themes/Ehem/icons/icon_close.gif" OnClientClick="return confirm('Are you sure you want to delete?');" Width="16px" Height="16px" AlternateText="Delete" CommandName="Erase" CommandArgument='<%# DataBinder.Eval(Container.DataItem, "ADDRESS_ID") %>' runat="server" />
 

Pada code di atas dapat dilihat cara untuk melempar key dari record yang ingin dihapus dengan menggunakan CommanArgument.

Pertanyaannya adalah, Apakah Command “Erase” itu ada? Jawabnya tidak ada, Anda dan harus dibuatnya! Caranya gampang, tinggal gunakan OnRowCommand pada GridView.

image

Kemudian pada event handler GridView_Detail_RowCommand, dapat dibuat seperti berikut :

protected void GridView_Detail_RowCommand(Object sender, GridViewCommandEventArgs e)
{
    if (e.CommandName == "Erase")
    {
        // contoh mengambil key yang dilempar dengan CommandArgument
        decimal childId = Convert.ToDecimal(e.CommandArgument);
    }
}

Selanjutnya terserah Anda.

#semogaMembantu

Share this post: | | | |
Posted: Jan 17 2011, 09:15 PM by reyza | with 1 comment(s)
Filed under:
WP7 Challenge : “Photos of The Day”

Seperti yang dapat ditemui disini http://msdn.microsoft.com/id-id/gg128656, maka ada tantangan di awal tahun 2011 dari Windows Phone 7 (begitu juga tantangan dari forum-forum sebelah *eh) :)

image

Photo of The Day? Apakah itu? Informasi ini mungkin tidak penting buat penghuni portal ini, tapi bagi saya informasi ini lumayan penting yang karena setiap jam 12 malam beberapa situs melakukan perhitungan dan menampilkan foto terbaik hari ini. Membuka situs jam 12 malam atau membuka situs tersebut setelah bangun tidur? Sepertinya akan lebih baik bila ada 1 apps yang bisa memberikan informasi “photos of the day” dari beberapa situs sekaligus yang bisa dilihat sambil tiduran dalam dan dalam genggaman pula :)

Tapi kan informasi itu tidak menarik untuk penghuni portal ini? ah biar lah…seperti tujuan gw nge-blog di portal ini untuk catatan biar tidak lupa dan gampang dilihat dimana saja bila diperlukan. Begitu juga apps ini, dibuat untuk tujuan pribadi, sukur-sukur bisa digunakan juga bagi penghuni situs fotografer tersebut, seperti :

  • fotografer.net,  yang penghuninya terhitung cuma terbesar se-Asia Tenggara.
  • inifotoku.com, yang lagi naik daun karena fitur-fitur yang lucu (harus dipromosikan nih, karena dibuat temen).
  • ayofoto.com, yang banyak digunakan untuk mempertemukan yang punya foto dengan pembeli foto (denger-denger).
  • tidak ketinggalan jakartafotoclub.com, situs lain yang sering gw kunjungi.

Untuk situs luar negeri yang sering memberikan inspirasi foto adalah Boston Big Picture (http://www.boston.com/bigpicture/) , bagaimana dengan Flickr Explore? ah malas, sudah banyak orang yang membuat apps untuk Flickr, tinggal download dan gratis :)

{Photos of The Day}

image

(Maaf…masih ada ruang yang kosong antara menu dan “All Site”)

image  image

(Today models? .. *eh)

Ingin melihat “foto terbaik hari ini” tinggal sentuh Today Photo, untuk melihat komentar-komentar tinggal sentuh Today Comments, untuk melihat Model yang ada pada foto-foto terbaik tinggal sentuh Model … dengan prefix Today :P

Ingin melihat “foto terbaik hari ini” per situs tinggal klik situs yang diinginkan….gampang, bisa dilaukan sambil tiduran atau sambil sarapan pagi.

image

Apalagi fitur-fitur yang akan didapat? Yang pasti akan terintegrasi dengan Facebook, Twitter dan (tidak)Friendster :)

{Data}

Datanya dari mana? Karena sering ngobrol dengan Bos Movreak, maka tidak ada salahnya mencontek cara untuk mendapatkan data untuk apps ini :) Dan karena nanti datanya akan “terpusat” maka jangan kaget akan ada versi untuk iOS (secara para fotografer kebanyakan Apple Fanboy :P) dan Android.

BB? Hmm….mungkin akan dibuat dikehidupan yang lain, saat roda reinkarnasi berputar sebagai BB user :) Symbian? Hmm….nanti dipikirkan kalau ada hardwarenya :P

 

*Selamat tahun baru, 2011 untuk semua

Share this post: | | | |
1.1.11

image

Selamat Tahun Baru, semoga 2011 menjadi tahun yang lebih baik dari tahun sebelumnya. Untuk mengenang cahaya-cahaya di awal 2011 “diseluruh” dunia maka bisa segera mengunduh Firework Windows 7 Theme.

DSC_3848-resize

Bandung, 1.1.11

Share this post: | | | |
Visual Basic for the Windows Phone Developer Tools RTW

Seperti yang disebutkan pada judul dan pada blog ini : http://windowsteamblog.com/windows_phone/b/wpdev/archive/2010/11/29/visual-basic-for-the-windows-phone-developer-tools-rtw.aspx, memberikan kabar gembira  bagi para developer yang mempunyai keyakinan untuk berbahasa VB bahwa Windows Phone Developer Tools telah dapat digunakan sebagai project template pada visual studio. Tapi….sayangnya versi visual studio yang dapat digunakan adalah yang “berlevel” Visual Studio 2010 Professional atau di atasnya.

Bagi yang tidak punya lisensi Visual Studio 2010 Professional, dapat menggunakan versi trial yang dapat diunduh disini. Atau bagi yang tetap ingin menggunakan Visual Studio 2010 Express Editon dapat masih tetap dilakukan dengan cara mengubah kenyakinan anda untuk berbahasa C# :)

Apalagi? Sayangnya template project yang tersedia untuk VB hanya Silverlight Project saja, belum tersedia support untuk penggunaan XNA Framework.

Tidak sabar ingin mengunduh Windows Phone Developer Tools RTW maka dapat segera mengunjungi alamat ini.

image

Selamat Mencoba & Menikmati!

(maaf tidak ada analisis pada link tersebut, murni copy paste saja, sekali lagi tanpa analisis, apalagi hasil coding yang kami buat sendiri Smile.  Kalau ingin melihat hasil coding kami, silakan kirim private email yang berisi requirement dan harganya Smile with tongue out)

Share this post: | | | |
Next Generation Application {Desktop.Web.Phone}

Banyak rumor yang berkembang akan “kekuasaan” HTML5 nanti yang mungkin dapat menggeser Flash dan juga Silverlight. Apalagi terdengar kabar kalau Silverlight “kurang dibahas” di PDC 2010. Banyak anggapan fitur-fitur di HTML5 sudah cukup untuk meracuni Flash dan Silverlight hingga mati Open-mouthed smile 

Benarkah?

image

Bila dilihat pada halaman http://www.silverlight.net/getstarted/overview.aspx, dapat dihitung fitur-fitur yang dimiliki oleh Silverlight sejak versi 1.0 sampai sekarang versi 4.0. Banyak hal-hal yang menarik yang mungkin “belum” bisa digantikan oleh HTML5.

Maka pada event yang diadakan oleh MIC ITB, saya mencoba memperlihatkan fitur-fitur yang menjadi keunggulan Silverlight 4.0 saat ini.

foto1

Berikut ini adalah hal-hal yang dicoba untuk dibroadcast pada event tersebut.

{Pengenalan Silverlight Secara Umum}

Pada bagian ini dicoba dijelaskan hal-hal umum yang berhubungan dengan Silverlight seperti tentang file XAP, integrasi dengan HTML, tool development dan lain-lain. Selain itu juga ditunjukkan theme-theme yang telah tersedia dan gratis untuk digunakan untuk mempercantik tampilan apps Silverlight.

image

{Webcam & Microphone + Printing}

Fitur ini hanya terdapat sejak Silverlight 4.0, pada event ini ditunjukkan implementasi fitur ini untuk membuat KTP sederhana.

image

Selain untuk meng-capture gambar juga terdapat fasilitas Printing. Fitur ini juga menjadi bagian fitur baru yang ada pada Silverlight 4.0.

image

Cara menggunakannya sangat mudah, cukup tentukan “area” yang ingin dicetak kemudian lakukan penulisan kode seperti ini.

private void Button_Print_Click(object sender, RoutedEventArgs e)
{
    PrintDocument document = new PrintDocument();
    document.PrintPage += new EventHandler<PrintPageEventArgs>(doc_PrintPage);
    document.Print("KTP");
}
 
void doc_PrintPage(object sender, PrintPageEventArgs e)
{
    e.PageVisual = canvas1;
}

 

{Drag-Drop}

Fitur selanjutnya adalah Drag yang memungkinkan suatu area atau kontrol dapat “dilempar” suatu item, seperti file gambar, file doc, file xls dan lain-lain. Kemudian item tersebut “ditangkap” untuk dapat diolah lebih lanjut lagi. sebagai contoh file gambar yang “ditangkap” untuk ditampilkan.

image

Pada contoh di atas, area yang dimaksudkan adalah kotak merah (kontrol canvas) yang diberi kemampuan Drag.

 
<Canvas Height="200" HorizontalAlignment="Left" AllowDrop="True" Drop="canvas1_Drop" Name="DropArea" 
VerticalAlignment="Top" Width="243" Background="#FF920000" Margin="0,87,0,0">
</Canvas>
 

Pada kode diatas terdapat property AllowDrop=”True” dan event Drop=”canvas1_Drop”.

{Out of Browser/OOB & Notification}

Fitur lain dari Silverlight adalah OOB, dengan menggunakan Visual Studio 2010 maka developer dapat sangat terbantu untuk “menghidupkan” fitur ini. cukup dengan meng-klik kanan pada project Silverlight kemudian pilih Properties, dan centang Enamble running application out of the browser. Sedangkan untuk melakukan konfigurasi lebih lanjut tinggal klik tombol Out-of-Browser Settings.

image

Ketika berjalan pada mode OOB maka kita dapat “mengeluarkan” notifikasi seperti berikut.

image

Dengan menekan tombol Advance Notification maka akan keluar notifikasi seperti yang sering kita lihat pada Yahoo Messanger. Berikut adalah contoh kode untuk mengeluarkan notifikasi.

   1: private void Button_Advance_Click(object sender, RoutedEventArgs e)
   2: {
   3:     if (Application.Current.IsRunningOutOfBrowser)
   4:     {
   5:         NotificationWindow notify = new NotificationWindow();
   6:         UpdateNotification un = new UpdateNotification();
   7:         TextBlock tb = (TextBlock)un.FindName("TextBlock_Status");
   8:         tb.Text = "Advance Notification";
   9:         notify.Height = 75;
  10:         notify.Width = 300;
  11:  
  12:         notify.Content = un;
  13:         notify.Show(3000);
  14:     }
  15:     else
  16:     {
  17:         MessageBox.Show("Fitur ini hanya bisa berjalan pada mode Out of Browser");
  18:     }
  19: }

Yang perlu diperhatikan dari kode di atas adalah baris ke-5, ke12 dan ke-13.

*sayang tidak sempat didemokan.

 

{WCF Data Service}

Fitur ini dulunya bernama WCF Ria Service, yang memungkinkan apps mengakses database dengan mudah.

image

image

Untuk lebih lengkapnya source-code demo dapat diunduh disini :

{Narsis}

Sedangkan untuk suasana event tersebut dapat dilihat pada gambar berikut. Kurang lebih ada sekitar 60 peserta yang hadir pada acara ini.

image

*selamat berakhir pekan.

Share this post: | | | |
More Posts Next page »