HTML maxlength problem</h1> 2011-12-07T23:33:00.001-08:00 <a href="http://feedads.g.doubleclick.net/~a/o8r4-SjdutDgTHWIYRtDYSnA_C4/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/o8r4-SjdutDgTHWIYRtDYSnA_C4/1/da"></img></a>We can limit the maximum characters in <input> with <maxlength> attribute. However it is not possible to do the same thing with <textarea>. This will be a problem if value of the <textarea> will be stored into database table and the length of the user input exceeds the field's length, either the value will be truncated or your database will throw an error to you. <a name='more'></a> Fortunately, a little jquery script can help here: <pre><html> <head> </head> <body> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready ( function() { $("textarea[maxlength]").keypress ( function() { var maxlength = $(this).attr("maxlength"); if ( this.value.length > maxlength ) { this.value = this.value.substring(0,maxlength-1); } } ) } ) </script> <form> This text box is limited to 5 chars <textarea maxlength="5"></textarea> This text box is not limited <textarea></textarea> </form> </body> </html> </pre><div class="blogger-post-footer"></div> </article> <article> <h1>Debugging php application with xdebug, netbeans and Google Chrome</h1> 2011-12-06T22:45:00.001-08:00 <a href="http://feedads.g.doubleclick.net/~a/mesu_pJytodRmVtbI4RTMfmEVTs/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/mesu_pJytodRmVtbI4RTMfmEVTs/1/da"></img></a>Debugging PHP application is a pain. When we get problems, we often to use var_dump() or die() in various location to inspect the variables and then clean them again once the problem is solved. Fortunately, there is a piece of software called xdebug which can tremendously help us debugging php code. This article is about using xdebug in linux environment. <a name='more'></a> <ol> <li> What we need: <ul> <li>A working apache2 web server with PHP </li> <li>Netbeans: an excellent IDE for writing PHP application </li> <li>xdebug </li> </ul> I assume you already have the first two. </li> <li>Install xdebug, open linux terminal, change to root and install xdebug with command (pecl install debug). See below <pre>bambang@bambang-notebook:~$ sudo su [sudo] password for bambang: root@bambang-notebook:/home/bambang#pecl install xdebug downloading xdebug-2.1.2.tar ... Starting to download xdebug-2.1.2.tar (Unknown size) .................................done: 1,340,416 bytes 66 source files, building running: phpize Configuring for: PHP Api Version: 20090626 Zend Module Api No: 20090626 Zend Extension Api No: 220090626 ..... ..... <snipped> ...... Build process completed successfully Installing '/usr/local/lib/php/extensions/no-debug-non-zts-20090626/xdebug.so' install ok: channel://pecl.php.net/xdebug-2.1.2 configuration option "php_ini" is not set to php.ini location You should add "extension=xdebug.so" to php.ini </snipped></pre> Note where the xdebug.so is installed in the line Installing '/usr/local/lib/php/extensions/no-debug-non-zts-20090626/xdebug.so' </li> <li>Add these lines to your php.ini. In my case /usr/local/lib/php.ini. </li> : <pre>zend_extension="/usr/local/lib/php/extensions/no-debug-non-zts-20090626/xdebug.so" xdebug.remote_enable=on xdebug.remote_log="/var/log/xdebug.log" xdebug.remote_host=localhost xdebug.remote_handler=dbgp xdebug.remote_port=9000 </pre> <li>Restart apache <pre>root@bambang-notebook:/home/bambang# /etc/init.d/apache2 restart * Restarting web server apache2 ... waiting [ OK ] root@bambang-notebook:/home/bambang# </pre> </li> <li>Write a phpinfo.php page in your web directory like this: <pre><html> <head> </head> <body> <?php echo phpinfo(); ?> </body> </html> </pre> </li> <li>Open the phpinfo.php in your browser and check whether the xdebug is successfully installed. <div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-kWZ76PTCPp8/TuIAEMd7uAI/AAAAAAAAAz0/rZ3pHserzG0/s1600/phpinfo_xdebug.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li>Now go to Netbeans and navigate through menu Tools->Option->PHP and make sure the Debugger port is the same with what we set in the php.ini above. I clear Stop at First Line check mark, but it is okay if you let it checked. If it is checked, the debugger will stop at first php statement. But I only want it stops on break point.</li> <div class="separator" style="clear: both; text-align: center;"> <a href="http://3.bp.blogspot.com/-_sijcVq2Gi8/TuIq9cZNNxI/AAAAAAAAA04/prIEoaAfJc8/s1600/netbeans-php-options.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> <li>Open your chrome, goto <a href="https://chrome.google.com/webstore/detail/eadndfjplgieldjbigjakmdgkmoaaaoc" target="_blank">https://chrome.google.com/webstore/detail/eadndfjplgieldjbigjakmdgkmoaaaoc</a> and install the xdebug helper.</li> <li>Now we are ready to debug, in this example I'll debug my CodeIgniter application. First I open one of my controller: daftar_negara.php and place a breakpoint in line 11 by clicking the line number or press ctrl-f8. <div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-f7NML0P5yLE/TuH_Kehv79I/AAAAAAAAAzo/3ZYlusLcj_4/s1600/netbeans_breakpont.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li>Still inside Netbeans run the debugger by clicking menu Debug->Debug Project or clicking the debug icon in the netbeans taskbar like (see the image below): <div class="separator" style="clear: both; text-align: center;"> <a href="http://1.bp.blogspot.com/--2cX4__xa3Y/TuIA9XiDyoI/AAAAAAAAA0A/PbzUnAPEPzU/s1600/netbeans_debugger_icon.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> The debugger will launch our project in chrome. Now we need to activate chrome xdebug helper, click the xhelper debug icon in right end of the address bar until it turns to green. <div class="separator" style="clear: both; text-align: center;"> <a href="http://3.bp.blogspot.com/-yRjywLieRD4/TuIi63M3gTI/AAAAAAAAA0M/oLXpXAeZot0/s1600/chrome_xhelper_icon.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li>Now press F5 (refresh), xdebug will stop the execution on our breakpoint and switch to our neatbeans:<div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-NDA40oIKsB0/TuIlA_yotPI/AAAAAAAAA0Y/m6edqFhV-_4/s1600/xdebug_netbeans_inaction.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> Now, we can step over, step info etc. via netbeans debugger tool bar, of course you can also use the shortcut key (F8,F7 etc): <div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-xDBIa0xaeuI/TuImD93Yt4I/AAAAAAAAA0k/y6eWOumEsIQ/s1600/netbeans_debugger_toolbar.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> We can also inspect the variable values in the window below the code window: <div class="separator" style="clear: both; text-align: center;"> <a href="http://1.bp.blogspot.com/-S-c7XrmXtBg/TuImtG9Qu5I/AAAAAAAAA0w/l0OmrvEXUSE/s1600/variable_watches.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> </ol> From here, I am sure you can figure the rest yourself. Happy bug hunting!<div class="blogger-post-footer"></div> </article> <article> <h1>Web app: move to next field with enter ala dos application</h1> 2011-12-06T09:08:00.001-08:00 <a href="http://feedads.g.doubleclick.net/~a/r7h2yCS-Mi62JnqiY8x-ZXzyQ/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/r7h2yCS-Mi62JnqiY8x-ZXzyQ/1/da"></img></a>This is a little experiment on how to use enter as a mean to move to the next input field in web application ala dos application. We need jquery here. Here we simply trap the enter key with keypress event. <a name='more'></a> Inside the event, we check the control tabIndex. Actually, the html elements have tabIndex property, unfortunately (at least in my case with google chrome) the value always 0, so we need a helper funtion myTabPosition which simply scan the parent's child node until it find itself name. After we have the tab index, we simply focus to the next sibling. Here is my solution: <pre><html> <head> </head> <body> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready ( function() { $(".ala_desktop").keypress ( function(event) { if (event.which==13) { i = myTabPosition(this) + 1; nxt=this.form.elements[i]; nxt.focus(); nxt.select(); return false; } return true; } ) } ) function myTabPosition( o ) { var MyName = o.name; var MyParent = o.form; var i; var retval = -1; for (i = 0 ; i < MyParent.elements.length - 1 ; i++ ) { if ( MyParent.elements[i].name == MyName ) { retval = i; break; } } return retval; } </script> <form name="coba"> Name : <input type="text" name="Name" id="Name" class="ala_desktop"> Address : <input type="text" name="Address" id="Address" class="ala_desktop"> City : <input type="text" name="City" id="City" class="ala_desktop"> </form> </body> </html> </pre><div class="blogger-post-footer"></div> </article> <article> <h1>HTML <input> tips - 01</h1> 2011-12-04T00:56:00.001-08:00 <a href="http://feedads.g.doubleclick.net/~a/dqwYvVNlzZ8VQ7RdLJ_VuINN9GE/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/dqwYvVNlzZ8VQ7RdLJ_VuINN9GE/1/da"></img></a>Beberapa tips yang berguna untuk penggunaan <input> pada html. <ol> <li>Membatasi jumlah character maksimal yang boleh diinput. Gunakan attribute maxlength. Contoh: <pre><html> <head> </head> <body> Input ini hanya dibatasi 5 character saja <input type="text" maxlength="5"> </body> </html> </pre> <pre><a name='more'></a></pre> </li> <li>Memaksa semua input ke huruf besar atau huruf kecil. Untuk hal ini kita harus menggunakan CSS property text-transform. Untuk memaksa semua input ke huruf besar gunakan text-transform:uppercase, untuk ke huruf kecil gunakan text-transform:lowercase. Namun harus diperhatikan bahwa CSS hanya merubah tampilan saja, tetapi value dari text box itu sendiri tetap. Semisal kita mengketik kata 'semarang' dalam huruf kecil, dengan text-transform:uppercase yang ditampilkan adalah 'SEMARANG', tetapi value dari <input> tetap 'semarang' dalam huruf kecil. Untuk memaksa value juga berubah ke huruf besar, kita harus mengkombinasikan css dengan jquery script yang mentrap event blur. Dalam hal ini kita memerlukan jquery, jika di komputer anda belum terinstall download terlebih dahulu jquery versi terbaru di <a href="http://docs.jquery.com/Downloading_jQuery">http://docs.jquery.com/Downloading_jQuery</a>. Nama file hasil download jQuery mengandung version number dan jenis script yang kita download (minified atau compressed). Copykan file tsb. ke web directory kita dan rename filenya menjadi jquery.js. Contoh: <pre> <html> <head> <style type="text/css"> input.hurufbesar { text-transform:uppercase } </style> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready ( function() { $('input.hurufbesar').blur ( function() { this.value = this.value.toUpperCase(); } ) } ) function CheckValue() { alert( "Value yang diketik adalah :" + document.getElementById('inputan').value ); } </script> </head> <body> Input ini dalam huruf besar semua <input type="text" class="hurufbesar" id="inputan"> <input type="button" value="Check" onclick="javascript:CheckValue()"> </body> </html> </pre> </li> <li>Membatasi hanya angka saja yang boleh diinput. Untuk keperluan ini kita bisa menggunakan jQuery. Selanjutnya kita buat sebuah function yang akan dijalankan pada waktu terjadi event keypress pada tag <input> yang mempunyai class angkasaja sbb: <pre>$(document).ready ( function() { $("input.angkasaja").keypress ( function( event ) { return ( event.which >= 48 && event.which <= 57 ); } ) } ) </pre> Code snippet di atas, intinya adalah bahwa setiap terjadi event keypress (tombol ditekan) akan dilakukan pengecekan apakah keycode dari tombol yang ditekan ada di antara 48 (ascii code dari angka 0) dan 57 (ascii code dari angka 9), apabila ya event functionnya akan mereturn TRUE artinya keypress diaccept, tapi bila tidak event functionnya akan mereturn FALSE artinya inputan ditolak. Selanjutnya, untuk semua <input> di mana kita menghendaki bahwa yang bisa diinput hanya angka saja, cukup kita berikan class angkasaja Contoh: <pre><html> <head> <script type="text/javascript" src="jquery.js"></script> </head> <script type="text/javascript"> $(document).ready ( function() { $("input.angkasaja").keypress ( function( event ) { return ( event.which >= 48 && event.which <= 57 ); } ) } ) </script> <body> Hanya angka yang bisa diinput <input type="text" class="angkasaja"> </body> </html> </pre> </li> </ol> Pada seri berikutnya kita akan bahas bagaimana menginput angka dengan separator ribuan dan desimal dan bagaimana kita bisa menginput data tanggal dengan mengklik kalender yang akan ditampilkan. Semoga membantu<div class="blogger-post-footer"></div> </article> <article> <h1>Debug javascript dengan Google Chrome</h1> 2011-12-02T03:01:00.001-08:00 <a href="http://feedads.g.doubleclick.net/~a/HG1HULl4gGMIIIjfWkY9235LFfk/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/HG1HULl4gGMIIIjfWkY9235LFfk/1/da"></img></a><ol> <li>Buat halaman html yang akan dibuat. Contoh: hapusaja.html <pre><html> <head> </head> <body> <script type="text/javascript"> function Sajikan() { Sel = document.getElementById( "PILIHAN" ); alert( "Mangga dahar " + Sel.options[ Sel.selectedIndex].value ); } </script><div class="separator" style="clear: both; text-align: center;"> </div> Mau buah apa? <select id="PILIHAN" onclick="Sajikan()"> <option value="Gedhang">Pisang</option> <option value="Kates">Pepaya</option> <option value="Pelem">Mangga</option> </select> </body> </html><a name='more'></a> </pre> </li> <li>Buka di Google Chrome <div class="separator" style="clear: both; text-align: center;"> </div> <div class="separator" style="clear: both; text-align: center;"> <a href="http://2.bp.blogspot.com/-Tchb4SReRBs/TtjHd2WIANI/AAAAAAAAAyI/CCS1rYqz4XA/s1600/debug_javascript_google_chrome_01.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li>Aktifkan debugger dengan klik kanan lalu klik 'Inspect Element' <div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-bo2viOJUYXY/TtjKDLKdbQI/AAAAAAAAAyU/satTdivKGao/s1600/debug_javascript_google_chrome_02.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li>Layar google chrome akan terbagi menjadi 2 bagian, bagian bawah ada windows untuk melihat elemen-elemen halaman page. Atur proporsi bagian atas dan bagian bawah dengan mendrag pembatas window ke atas atau ke bawah. <div class="separator" style="clear: both; text-align: center;"> <a href="http://1.bp.blogspot.com/-lgYzefJWCLM/TtjLWuYEUJI/AAAAAAAAAyg/-_mMuR5Mw30/s1600/debug_javascript_google_chrome_03.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li> Klik Script <div class="separator" style="clear: both; text-align: center;"> <a href="http://1.bp.blogspot.com/-5FPlXgmQ-y8/TtjL1qM4rjI/AAAAAAAAAys/6iPpGb6kxK4/s1600/debug_javascript_google_chrome_04.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li> Klik baris 11 untuk meletakkan break point di baris tsb. <div class="separator" style="clear: both; text-align: center;"> <a href="http://3.bp.blogspot.com/-e34dKxPOTAo/TtjMWkUqZXI/AAAAAAAAAy4/oMpYvK8Kcc0/s1600/debug_javascript_google_chrome_05.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li> Sekarang pada pilihan 'Mau buah apa?', pilih salah satu buah: <div class="separator" style="clear: both; text-align: center;"> <a href="http://4.bp.blogspot.com/-F2Gp21EL2tU/TtjNOQHc0lI/AAAAAAAAAzE/qzBxGDVG2Uc/s1600/debug_javascript_google_chrome_06.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> <li> Setelah pilihan buah diklik, maka debugger akan berhenti pada baris 11. Klik F10 untuk 'step over next function call', atau F11 untuk 'step into next function call'. <div class="separator" style="clear: both; text-align: center;"> <a href="http://1.bp.blogspot.com/-EUoQ7ZWwMJ8/TtjOT0jPw1I/AAAAAAAAAzQ/a4XPU-Vu1Gc/s1600/debug_javascript_google_chrome_07.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"></a></div> </li> </ol> Catatan: Tidak seperti firefox anda tidak perlu menginstall addon tambahan apapun pada google chrome untuk fasilitas debugging ini.<div class="blogger-post-footer"></div> </article> <article> <h1>Menginstall VoIP di Nokia E51</h1> 2011-11-08T17:05:00.000-08:00 <a href="http://feedads.g.doubleclick.net/~a/tGiHghpw0G0MYBzfnP9yuBXr-Jc/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/tGiHghpw0G0MYBzfnP9yuBXr-Jc/1/da"></img></a>VoIP (Voice over IP) adalah solusi koneksi telpon lewat Internet. Pada suatu jaringan VoIP ada sebuah komputer yang berfungsi sebagai Sentral Telpon atau Operator, komputer ini di sebut sebagai Server. Sedangkan pesawat-pesawat telpon pelanggannya berupa komputer atau perangkat-perangkat lain (termasuk smartphone) yang terhubung dengan internet. Salah satu server VoIP indonesia adalah http://voiprakyat.or.id yang disponsori oleh bapak Onno Purbo. VoIPRakyat ini dibuat dari rakyat Indonesia untuk rakyat Indonesia alias gratis. Baru-baru ini, aku barusan pasang wifi router di rumah. Harga router wifi sekarang sudah murah, aku beli DLink type DIR-600 seharga Rp 235 ribu rupiah dan itupun agak kemahalan karena begitu selesai beli aku check harganya di bhineka.com cuma Rp 218 ribu he..he... Kebetulan aku punya HPku adalah nokia E51 yang mempunyai fasilitas wifi dan ada fitur Internet Telephone, jadi aku pikir tentunya HP ini bisa dimanfaatkan untuk voip dan ternyata memang bisa he..he...Berikut langkah-langkahnya: <a name='more'></a> 1. Registrasi Daftar dulu untuk mendapatkan nomor telpon di voiprakyat lewat http://voiprakyat.or.id/?inc=signup&op=user , setelah pendaftaran berhasil anda akan mendapatkan voip id dan nomor telpon. Nomor telpon ini juga akan dikirim ke email anda untuk arsipnya. Di bawah ini adalah email konfirmasi pendaftaranku: === 8< ========= Halo Bambang Pranoto Selamat datang di VoIP Rakyat. Di bawah ini adalah account ID dan password anda yang dapat anda gunakan untuk login ke VoIP Rakyat baik melalui website http://www.voiprakyat.or.id atau dengan VoIP Rakyat Communicator dan SIP/IAX2 softphone lainnya. VoIP ID : nnnnnn (berupa 6 digit angka) IM ID : bpranoto Password : * Nomor telepon VoIP anda adalah : nnnnnn (sama dengan VoIP ID di atas) Nomor lengkap telepon VoIP anda adalah : +62 848 1001 nnnnnn (tanpa spasi) SIP proxy atau IAX gateway kami adalah : voiprakyat.or.id IM server kami adalah: voiprakyat.or.id Gunakan IM ID sebagai Account ID anda untuk login ke IM server voiprakyat.or.id menggunakan VoIP Rakyat Communicator. Summary: SIP address anda : nnnnnnn@voiprakyat.or.id XMPP ID/JID dan email anda : bpranoto@voiprakyat.or.id Salam hangat, VoIP Rakyat Development Team. === 8< ========= Informasi penting di sini adalah: VoIP ID, password dan alamat server yaitu voiprakyat.or.id 2. Konfigurasi SIP di Nokia E51 SIP (Session Initiation Protocol) adalah protocol yang dipergunakan untuk VoIP Akses lewat Menu => Tools => Settings => Connection => SIP Settings Option -> Add new -> Use Default Profile Isikan data-datanya sbb: Profile name : voiprakyat atau apa saja terserah anda Service profile: IETF Default Access Point: pilih salah satu dari access point yang ada Public Username: sip:nnnnnn@voiprakyat.or.id (nnnnnn adalah VoIP ID anda, lihat step 1 ) User compression: No Registration: When needed Use Security: No Proxy Server: (tidak usah diset, atau set sesuai kebutuhan) Registrar Server: Registrar Server address: sip:voiprakyat.or.id Realm: voiprakyat.or.id Username: nnnnnn (nnnnnn adalah VoIP ID anda dari point 1) Password: ** (sesuai password yang anda dapat dari point 1 ) Transport Type: UDP Port: 5060 Konfigurasi SIP selesai. 3. Konfigurasi Internet Tel di Nokia E51 Akses lewat Menu => Tools => Settings => Connection => Internet tel. Option -> New Profile Name -> VoIPRakyat atau terserah anda SIP Profiles -> VoIPRakyat (sesuai dengan yang anda set di poin 2) 4.Cara menggunakan panggilan voip Untuk dapat melakukan panggilan VoIP pastikan ada koneksi Internet tersedia di HP anda. Lewat home screen, tekan nomor yang akan dipanggil (contoh: 901 nomor test voiprakyat), jangan tekan tombol dial (warna hijau) tapi tekan Option -> Call -> Voice Call -> Internet Call Untuk menyimpan di Daftar Kontak, simpan nomor telpon di field Internet telephone dengan format nomor seperti ini: 901@voiprakyat.or.id Untuk membuat panggilan lewat Daftar Kontak, buka record kontak yang akan dihubungi, sorot Internet telephone kemudian tekan tombol dial (warna hijau). Yang disayangkan, saat ini belum ada konektifiti antara voiprakyat dengan nomor telpon PSTN dan cellular sehingga kita hanya bisa saling berhubungan antara nomor voiprakyat saja. Besok aku akan coba register dan install di BB istriku. Buat teman-teman (ma'af hanya bagi yang benar-benar kenal sama aku) yang sudah mencoba dan berhasil silahkan kirim message untuk nomor telpon voipku. <ol> </ol><div class="blogger-post-footer"></div> </article> <article> <h1>Recovering broken ubuntu partition</h1> 2011-10-29T00:23:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/7XULDg1dWQuSEXMpMyN7JxqjPm4/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/7XULDg1dWQuSEXMpMyN7JxqjPm4/1/da"></img></a>Recently, one of my client's computer (Ubuntu 10.10) refused to boot. Instead of booting the operating system it fell down to grub rescue prompt. This indicated that grub could not find its configuration file and it meant the partition table was corrupted :(. Fortunately, I finally succeeded repairing the system. What I learned from this experience is that ext file system is such a wonderful system which enabling partition recovery. <a name='more'></a> These are steps I took, unfortunately there were no screenshots (forgot to take): <ol> <li>Boot with Ubuntu live CD. The booting seemed took time forever because it tried to access the broken partition, but eventually the live session was up.</li> <li>Open terminal, became root and checked whether the partition was still there. <code> #fdisk -l</code> Fortunately, fdisk still list the hard disk partition.</li> <li>Try to repair with e2fsck. <code> #e2fsck -C 0 -v /dev/sda1 </code> -C 0: means the completion information will be written in file descriptor 0 which is our console. -v: verbose Unfortunately, this step failed. </li> <li>After some googling research, I knew that ext file system save its meta data structure in what is called "Superblock" and fortunately ext file system have several Superblocks, so if one superblock is failed we can recover from the other superblock. Now, my problem was find a way to query the superblocks. A way to query the superblock is with dumpe2fs <code> # dumpe2fs /dev/sda1 | grep -i superblock</code> Unfortunately, this step also failed. dumpe2fs could not read partition /dev/sda1</li> <li>Next step, I tried testdisk. You can read how to use testdisk here: http://www.howtogeek.com/howto/15761/recover-data-like-a-forensics-expert-using-an-ubuntu-live-cd/. Unfortunately, when testdisk "Analyze" function also failed to recover the partition. Its automatic search algorithm report that what it found were ntfs partitions which obviously wrong :)</li> <li>I then explored testdisk Advanced menu (File system utils). I found there was a facility to locate the superblock backups. I run this menu and fortunately it found all the superblock backups. Testdisk wrote all the findings in testdisk.log file so we didn't have to take the note manually.</li> <li>Quit running e2fsck again but this time with -b (use alternative superblock) option. <code> #e2fsck -b nnn <nnnnn> -C 0 -v -p -y /dev/sda1</nnnnn></code> replace nnn with<nnnnn> one of the superblock backup found by testdisk in the above step. Look in testdisk.log This time e2fsck succeeded repairing the partition. I rebooted the computer, took out the live cd and the computer came to life again.</nnnnn></li> </ol> <div class="blogger-post-footer"></div> </article> <article> <h1>View pdf document inline in firefox linux</h1> 2010-06-28T20:05:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/O445nx1Ui4lQOUlW6aDn2b2666E/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/O445nx1Ui4lQOUlW6aDn2b2666E/1/da"></img></a>In my bus ticketing web application, tickets are generated in form of pdf file. The problem is firefox (currently version 3.6.6) is not designed to display pdf file in its browser window out of the box, we need to install a plugin. The first obvious option is to install adobe acrobat reader for linux which includes firefox plugin (can be freely downloaded from Adobe web site). However, there are some problems: <ol> <li> It is huge! </li><li> Seems there are some memory leaks (firefox 3,6.3 and acrobat reader 9.3.2), after some time it only displays white blank page. You need to restart firefox to cure it. I don't know whether the problem is in acrobat or firefox. </li></ol> Fortunately, for Ubuntu, we still have another option: <ol> <li> Install mozzplugger and xpdf-reader: <code> $ sudo apt-get install mozplugger xpdf </code> </li> <li> Edit mozzplugger configuration file: <code> $ sudo vim /etc/mozpluggerrc </code> Find this line: <code> text/x-pdf:pdf:PDF file </code> Replace the blocks below that line to: <code> repeat noisy swallow(Xpdf) fill: xpdf "$file" repeat noisy swallow(evince) fill: evice "$file" ACROREAD() repeat noisy swallow(okular) fill: okular "$file" GV() repeat noisy fill exits: xpdf "$file" </code> </li><li> Save the file </li><li> Restart firefox </li><li> Done. And here is a screen shot: <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_lx3ybG2Edyw/TClpBrH4TrI/AAAAAAAAAt0/B6GUZu-nI5g/s1600/Screenshot-ticket_form.php+%28application-pdf+Object%29+-+Mozilla+Firefox.png"></a> </li></ol> <div class="blogger-post-footer"></div> </article> <article> <h1>Installing wine on Ubuntu 9.10 from source</h1> 2009-11-16T07:24:00.000-08:00 <a href="http://feedads.g.doubleclick.net/~a/XdNw_9Y9fHuC9xPwFjOObLsZbQ8/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/XdNw_9Y9fHuC9xPwFjOObLsZbQ8/1/da"></img></a>I just upgraded my ubuntu 9.04 to ubuntu 9.10. Before recompiling wine, we needed to install all the dependencies. I grabbed the newest dependencies installation script from http://winezeug.googlecode.com/svn/trunk/install-wine-deps.sh However, when I ran it, it stopped with an error: <code> Reading package lists... Done Building dependency tree Reading state information... Done Package libcupsys2-dev is a virtual package provided by: libcups2-dev 1.4.1-5ubuntu2.1 You should explicitly select one to install. E: Package libcupsys2-dev has no installation candidate </code> From the error message, the solution is clear, edit the script and replace libcupsys2-dev with libcups2-dev ... and we can enjoy the wine again now<div class="blogger-post-footer"></div> </article> <article> <h1>Ubuntu 9.10 hamachi problem</h1> 2009-11-14T19:20:00.000-08:00 <a href="http://feedads.g.doubleclick.net/~a/pQXw1gFUFLo5SSJeIYpBs36JMN8/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/pQXw1gFUFLo5SSJeIYpBs36JMN8/1/da"></img></a>I just installed Ubuntu 9.10 on a fresh new computer for a client. For this particular computer I install hamachi. Unfortunately, when run it only displayed 'Killed' in console and then a crash report notification appeared on the notification panel. After some googling, it turned that this new ubuntu doesn't like UPX packed application and unfortunately hamachi for linux (version hamachi-lnx-0.9.9.9-20) is one of it. The solution is: <ol> <li> Install upx uncompressor: <code> $sudo apt-get install upx-ucl </code> <li>Unpack hamachi (assuming hamachi is installed in /usr/bin): <code> $ sudo upx -d hamachi </code> </ol> After that, hamachi ran fine. This solution is also applied for other UPX packed applications. Hopefully, Ubuntu fixes this upx packed application problem which will be the best solution.<div class="blogger-post-footer"></div> </article> <article> <h1>Cara mendownload video youtube yang tidak dapat didownload....</h1> 2009-09-05T11:59:00.001-07:00 <a href="http://feedads.g.doubleclick.net/~a/vVnGyjGXjOqnBd3dXbEjwhxY4Gs/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/vVnGyjGXjOqnBd3dXbEjwhxY4Gs/1/da"></img></a>Video-video di youtube.com tidak dapat didownload secara langsung, tetapi ada beberapa situs-situs dan program-program utility termasuk addon Mozila firefox dan Widget dari Opera yang memungkinkan kita mendownload video dari youtube. Namun beberapa video tidak dapat didownload dengan program-program khusus di atas. Kelihatannya youtube melakukan proteksi sehingga beberapa video hanya dapat dimainkan tetapi tidak dapat didownload. Sebagai contoh: http://www.youtube.com/watch?v=_fgURJZebqc Lalu bagaimana cara kita mendownload video-video yang tidak dapat didownload tersebut? Apapun proteksi yang dilakukan youtube, sebenarnya komputer kita telah mendownload file video tersebut. Kalau tidak, bagaimana browser kita bisa memainkan video tsb? Jadi kuncinya adalah bagaimana menemukan file yang telah didownload oleh browser kita tsb. Ikuti langkah-langkah ini. <ol> <li>File-file video dari youtube adalah dalam format file .flv, maka pertama-tama kita harus mempunyai player dari file flv. Silahkan search di google player-player yang bisa memainkan file flv, ada banyak dan rasanya semua merupakan freeware yang dapat didownload gratis. <li>Buka youtube di browser kita dan nikmati videonya sampai selesai. <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_lx3ybG2Edyw/SqK-PP7ZZ9I/AAAAAAAAAsk/DkoBAPU6HoI/s1600-h/open_in_your_browser.jpg"></a> <li>Tunggu video sampai tuntas dimainkan, lalu cari direktori cache dari browser kita. Untuk Opera direktori tempat browser menyimpan file-file yang didonwload dapat dilihat dengan mengetikan di address barnya opera:about, untuk Firefox kita dapat melihatnya dengan mengetikkan about:cache di address barnya. Sorot textnya dan kemudian copy ke buffer. <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_lx3ybG2Edyw/SqK-8zm6I5I/AAAAAAAAAss/jPxiL3ELdd0/s1600-h/where_opera_stores_the_files.jpg"></a> <li>Buka Windows Explorer atau My Computer dan Paste di address bar lalu tekan Enter. <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_lx3ybG2Edyw/SqK_M9tQ2-I/AAAAAAAAAs0/lJeBzxfOTxg/s1600-h/open_the_cache_directory.jpg"></a> <li>Selanjutnya Klik View -> Details dan kemudian View -> Arrange Icons by -> Size dan kemudian ulangi sekali lagi View -> Arrange Icons by -> Size. Setelah ini, file-file yang ada di direktori tsb. akan ditampilkan dari ukurannya yang paling besar ke paling kecil. <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_lx3ybG2Edyw/SqK_jcmqg0I/AAAAAAAAAs8/5QSnW5o9q1U/s1600-h/files_sort_by_size_descending.jpg"></a> <li>Dari Size dan Date Modifiednya, kita tahu bahwa (kemungkinan besar) file yang paling atas adalah file video yang kita cari. Copykan file tsb. ke folder yang kita kehendaki, rename dan berikan extension .flv Pada contoh ini, file yang aku download aku rename menjadi file origami_cow.flv <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/_lx3ybG2Edyw/SqK_wLMwCuI/AAAAAAAAAtE/RyMPswx9nxM/s1600-h/copy_the_file_and_rename_to_flv_file.jpg"></a> <li>Buka file origami_cow.flv tersebut di flv player kita. <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_lx3ybG2Edyw/SqK_-2CrEcI/AAAAAAAAAtM/zULvrtH9iV8/s1600-h/played_offline_with_flv_player.jpg"></a> </ol> <div class="blogger-post-footer"></div> </article> <article> <h1>Problem installing MySQL 5.1.37 on Windows</h1> 2009-08-20T17:19:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/b_HTrwvXvVxZZESi0ViYlUBp5B4/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/b_HTrwvXvVxZZESi0ViYlUBp5B4/1/da"></img></a>Last night, I decided to upgrade my MySQL from version 4.1 to version 5 on my Windows XP box. I went to <a href=http://dev.mysql.com/downloads/mysql/5.1.html#win32>mysql's download area</a> and downloaded the latest windows MSI installer version 5.1.37. After finished downloading the huge 91MB file, I backed up my MySQL database with mysqldump, uninstalled the old version 4.1 and began installed the new version, unfortunately the installation always failed with this message: <blockquote>MySQL Server 5.1 Setup Wizard ended prematurely The wizard was interrupted before MySQL Server 5.1. could be completely installed. Your system has not been modified. To complete installation at another time, please run setup again.</blockquote> Again, the old uncle google came to help. This is MySQL's bug, didn't they test it before releasing the new version? Google pointed me to <a href="http://bugs.mysql.com/bug.php?id=45418">a solution</a>: you need to download and install orca, a tool for editing MSI files, which can be downloaded from <a href="http://www.technipages.com/wp-content/uploads/2007/11/orca.Msi">here</a>. Open the MySQL msi installation file, find and delete the action row SetDateTime and then save the msi file. After that, I had the new MySQL 5.1 installed on my computer. There was also no problem restoring the database. The next step was copying the libmysql.dll file to my php installation directory. Unfortunately, another problem came! the apache server always crashed whenever I loaded my php application, and again uncle google came to rescue, he leaded me to download <a href="http://windows.php.net/downloads/snaps/php-5.2-win32-VC6-x86-latest.zip">this zip file</a>, put down the apache server, copying the libmysql.dll from the zip file to the php directory, restarting the apache and then everything runs well. Kudos to uncle google! <div class="blogger-post-footer"></div> </article> <article> <h1>Gnome Network Manager dispatcher.d scripts doesn't run</h1> 2009-08-14T13:54:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/Hufv_iKQiBJssh5nSO0Ushp2ypU/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/Hufv_iKQiBJssh5nSO0Ushp2ypU/1/da"></img></a>I just set up a new linux box of Ubuntu 9.04. This computer will connect to netware servers, so I installed ipx. However, with this particular version of Ubuntu, the ipx won't start at boot time eventhough it has starting script in the /etc/init.d which is correctly linked to startup directories (/etc/rc2.d, /etc/rc3.d, etc). I guessed the reason is Gnome Network Manager, somehow it prevented ipx to be started. I then wrote a script in /etc/NetworkManager/dispatcher.d, I gave it a name: 02ipx.sh, so it will executed after the built in /etc/NetworkManager/01ifupdown, the content is very simple <code> #!/bin/bash if [ "$1" == "eth0" ] && [ $2 == "up" ] then /etc/init.d/ipx restart fi </code> I assign root as the owner of script and set the permission to 775. Unfortunately, this script was never called!! After spent 5 hours pulling my hairs, uncle Google came to help with <a href="http://markmail.org/message/lqq2rup4ludz4q7z#query:network%20manager%20dispatcher.d%20not%20running+page:1+mid:43klj3a75iyryv5g+state:results">this page</a> It turns that Network Manager is very picky with the script permission and ownership. Here is the relevant quote : <blockquote> Yep that is correct from the source: <a href="http://svn.gnome.org/viewvc/NetworkManager/tags/NETWORKMANAGER_0_6_5_RELEASE/dispatcher-daemon/NetworkManagerDispatcher.c?view=markup"></a> Yep that is correct from the source: http://svn.gnome.org/viewvc/NetworkManager/tags/NETWORKMANAGER_0_6_5_RELEASE/dispatcher-daemon/NetworkManagerDispatcher.c?view=markup /* * nmd_permission_check Verify that the given script has the permissions we want. Specifically, * ensure that the file is * - A regular file. * - Owned by root. * - Not writable by the group or by other. * - Not setuid. * - Executable by the owner. * / </blockquote> So the Network Manager doesn't like the 775 permission of my script. Changing the permission to 755 solves my problem. <div class="blogger-post-footer"></div> </article> <article> <h1>Ubuntu shutdown problem, acpid: exiting...</h1> 2009-08-05T11:16:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/GqTrFL2YSuz_P7oWVbe1V2M_DtI/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/GqTrFL2YSuz_P7oWVbe1V2M_DtI/1/da"></img></a>Some times ago, I uninstalled gnome network-manager on my Ubuntu 9.04 dan replaced it with WICD because it won't bring up ipx protocol on boot time. Unfortunately, WICD also has its own problem, it can't bring up your wired and wireless interface simultaneously. Tonight, I decided to replace WICD with gnome network-manager and I planned to fix the ipx problem through its dispatcher scripts feature. Surprisingly, right after the network manager installed there is no problem with the ipx protocol, apparently the package network-manager in ubuntu repository has been updated recently. However, when I shutdown or restarted my computer, it always hang with a blank screen displaying the message: acpid:exiting, the only way to completely shut down my laptop is only by pressing the power button for about 3 seconds. After some googling, it turns that the problem was the network interfaces should be brought down before taking down the computer. Here is the solution: <ol> <li>Edit as root the file /etc/init.d/alsa-utils <li>Find stop), here is what it looks like: <code> stop) EXITSTATUS=0 TARGET_CARD="$2" </code> <li>Insert statements to bring down your network interfaces: <code> stop) ifconfig wlan0 down ifconfig eth0 down EXITSTATUS=0 TARGET_CARD="$2" </code> </ol> Problem solved ... :) <div class="blogger-post-footer"></div> </article> <article> <h1>Yahoo messenger problem on Linux</h1> 2009-06-28T10:05:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/sgvX288wAsJ5_vIBDCcAewOPx1k/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/sgvX288wAsJ5_vIBDCcAewOPx1k/1/da"></img></a>Recently, I can't connect to yahoo messenger through Pidgin on my Ubuntu 9.04 box. After some googling I found this page: http://news.softpedia.com/news/How-to-Fix-Yahoo-problem-in-Pidgin-114754.shtml Unfortunately, after following the steps I still can't connect to yahoo with error message: unknown "error 1013. Logging into the Yahoo! website may fix this". Logging to yahoo website as suggested doesn't cure the problem :( After some more googling, I found this page: http://developer.pidgin.im/ticket/9467. Removing the @yahoo.com part of your pidgen account solves the problem.<div class="blogger-post-footer"></div> </article> <article> <h1>Menjalankan e-spt di linux.</h1> 2009-06-13T11:31:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/hFcA7KPyHTMOjyazTfKCi9naP0M/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/hFcA7KPyHTMOjyazTfKCi9naP0M/1/da"></img></a>Dirjen pajak belakangan ini mensosialisasikan e-spt yaitu program aplikasi komputer yang dipergunakan untuk pelaporan pajak (spt). Namun salah satu kendala besar bagi perusahaan-perusahaan menggunakan linux adalah bahwa program-program e-spt ini didesign hanya untuk komputer-komputer dengan O/S windows. Apakah kita harus mengorbankan sebuah komputer khusus plus o/s Windows hanya khusus untuk aplikasi e-spt ini? Untungnya, jawabannya adalah tidak, Wine (http://www.winehq.org) adalah sahabat anda. Bagaimana langkah-langkahnya? <ol> <li>Install wine.</li> <li>Install komponen-komponen windows dengan bantuan winetricks</li> <li>Download dan install program e-spt</li> <li>Set format tanggal Wine sesuai dengan format tanggal Indonesia</li> </ol> Detail langkah-langkah di atas adalah sbb: <ol> <li>Install wine. Secara garis besar ada 2 cara untuk menginstall Wine: <ol> <li>Install package binary</li> <li>Install dari source</li> </ol> Cara paling mudah dan cepat adalah dengan menginstall package binary. Namun, metode ini mempunyai beberapa kelemahan: Package yang terinstall sering kali tertinggal beberapa versi dari versi terbaru, padahal untuk saat ini, development wine berkembang dengan cepat. Kompatibilitas dan stabilitas versi terbaru jauh lebih baik dari versi-versi sebelumnya. Kelemahan lain adalah kesulitan melakukan patching apabila ditemukan sebuah masalah. Dengan pertimbangan-pertimbangan di atas, penulis lebih menyukai instalasi Wine dari source code. Langkah-langkah untuk menginstall wine dari source di Ubuntu 7.10 s/d 9.04 adalah sbb: <ul> <li>Install package-package dependency yang diperlukan: <code> $ wget http://winezeug.googlecode.com/svn/trunk/install-wine-deps.sh $ sudo ./install-wine-deps.sh </code> </li> <li>Download, compile dan install package wine terbaru dari http://www.winehq.org, pada saat tulisan ini dibuat versi terbaru adalah versi 1.1.23 <code> $ wget http://prdownloads.sourceforge.net/wine/wine-1.1.23.tar.bz2 $ tar -xf wine-1.1.23.tar.bz2 $ cd wine-1.1.23 $ ./configure $ make depend && make $ sudo make install </code> </li> </ul> </li> <li>Install komponen-komponen windows dengan bantuan winetricks</li> Winetricks merupakan script yang berguna untuk mendownload komponen-komponen windows yang diperlukan. Script ini dapat didownload dari http://winezeug.googlecode.com/svn/trunk/winetricks. Ikuti langkah-langkah ini: <code> $ sudo apt-get install cabextract $ wget -c http://winezeug.googlecode.com/svn/trunk/winetricks $ chmod 755 winetricks $ ./winetricks </code> Interface graphical dari winetricks akan muncul sbb: <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_lx3ybG2Edyw/SjP9AZVH05I/AAAAAAAAAlM/jdRuDphlsQ4/s1600-h/winetricks.png"></a> Tandai package-package jet40, mdac28 dan mfc42 dan kemudian clik OK. Winetricks akan mendownload package-package ybs. dan menginstallkan ke wine. Ikuti tahap-tahap penginstallan tiap-tiap package. <li>Download dan install program e-spt Program-program e-spt dapat di download dari situs dirjen pajak: http://www.pajak.go.id/index.php?option=com_content&view=article&id=73&Itemid=107 Sebagai contoh kita akan install e-spt untuk SPT Masa PPN <code> $ wget -c http://www.pajak.go.id/dmdocuments/Installer%20eSPT%20PPN%201107%20Versi%203.0%20With%20Zip%20+%20Pembetulan%202%20Digit%20%2803-03-2009%29.zip $ unzip "Installer eSPT PPN 1107 Versi 3.0 With Zip + Pembetulan 2 Digit (03-03-2009).zip" $ cd "Installer eSPT PPN 1107 Versi 3.0 With Zip + Pembetulan 2 Digit (03-03-2009)" $ wine setup.exe </code> </code> </li> <li>Set format tanggal Wine sesuai dengan format tanggal Indonesia</li> Program e-spt mensyaratkan format tanggal harus dalam dd/MM/yyyy. Untuk itu ubahlah key registry HKEY_CURRENT_USER\ControlPanel\International\sShortDate menjadi dd/MM/yyyy <code> $ wine regedit </code> <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/_lx3ybG2Edyw/SjQDp-Qy2MI/AAAAAAAAAlU/dV0yLhDMn8o/s1600-h/wine_change_date_format.png"></a> </ol> Dan hore! Program e-spt PPN telah terinstall di sistim linux kita. Di ubuntu, jalankan lewat menu Applications -> Wine -> Programs -> eSPT PPN 1107 Versi 3.0 -> eSPT PPN 1107 Versi 3.0 <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/_lx3ybG2Edyw/SjQF3Dcw5AI/AAAAAAAAAlc/xB8MAUguICs/s1600-h/e-sptPPN1107.png"></a> <div class="blogger-post-footer"></div> </article> <article> <h1>download ibpp and its documentation</h1> 2009-05-11T16:53:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/TYwFrn9uOipIkG2TFjEvMhYFSEQ/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/TYwFrn9uOipIkG2TFjEvMhYFSEQ/1/da"></img></a>Okay, I think it's time to try make a real database application using C++ and WxWidget. The tools needed which I already have so far: <ol> <li>C++: it is a native language with linux. Almost every linux distribution have it, and if you don't have it and you're using ubuntu, just install package base-essential with synaptic or apt-get. <li>WxWidgets: the main library which supposed to make our life easier. <li>Code::Blocks: the IDE <li>Firebird database server. </ol> We still need client library for accessing the database server. WxWidgets has database access functions using ODBC. But, I don't like ODBC, I prefer to have client library which access the database natively. After some google research, ibpp seems the best c++ firebird client library. I downloaded the library from http://www.ibpp.org/. But, a library is no use at all without documentation and it's very unfortunate ibpp only provides online documentation. As we live in Indonesia we certainly need an offline documentation so we can work without internet connection. Thanks to uncle google (again), I found a free utility which can save an entire website for offline reading from here: http://www.httrack.com/page/2/en/index.html. Installing under linux takes the usual route: $ wget -c http://www.httrack.com/httrack-3.43-4.tar.gz $ tar -xf httrack-3.43-4.tar.gz $ cd httrack-3.43.4 $ ./configure configure doesn't complain anything! I the proceeded $ make # make install Great!, now I have "WebHTTrack Website Copier" in my Applications->Internet menu, unfortunately nothing comes up when I clicked it.... :( Stuck? of course no! I tried to run it from terminal and here is what came up: $ webhttrack/usr/local/bin/htsserver: error while loading shared libraries: libhttrack.so.2: cannot open shared object file: No such file or directory /usr/local/bin/webhttrack(6248): could not spawn htsserver So it missed libhhtrack.so.2, it turns out that this file is located in /usr/local/lib. Make a soft link to it in the /usr/lib solves the problem: # ln -s /usr/local/lib/libhttrack.so.2 /usr/lib/libhttrack.so.2 Next step is firing webhttrack, make a new project and point the url address to ibpp online documentation (http://www.ibpp.org/reference), and 2 minutes later I have the documentation in my harddisk. <div class="blogger-post-footer"></div> </article> <article> <h1>Program timbangan elektronik, sebuah program Windows yang dijalankan di Linux.</h1> 2009-05-09T21:46:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/i6Wry_NAuvHu9YxFIia_j5NLyWE/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/i6Wry_NAuvHu9YxFIia_j5NLyWE/1/da"></img></a>Kemarin, mumpung hari libur aku setup program timbangan digital baru di kantor. Program yang lama merupakan program DOS yang aku tulis dengan menggunakan Clipper, program ini berjalan dengan baik di linux dengan bantuan dosemu. Program baru merupakan program Windows. Salah satu improvement dalam program ini adalah support untuk beberapa jenis indikator. Program diinstall di linux dengan wine versi 1.1.20. Beberapa catatan dalam instalasi program ini di wine: <ol><li>Pencetakan slip bukti timbangan dan laporan-2 menggunakan printer Dot Matrix. Apabila pencetakan dilakukan lewat printer driver, pencetakan dengan printer dot matrix akan menjadi sangat lambat plus hasil buruk plus boros pita... :) Oleh karena itu, program ini melakukan pencetakan langsung melalui printer port lpt1. Di windows, hal ini tidak menjadi suatu permasalahan, di linux dengan wine, maka lpt1 akan dimap ke /dev/lp0. Masalahnya, owner dari device ini adalah root dan group lp. Secara default user-user di Ubuntu (..nggak tahu untuk distro lainnya) tidak termasuk dalam group lp. Maka, jika kita dalam wine berusaha mencetak ke lpt1 akan selalu ditolak. Silahkan coba perintah-perintah di bawah ini: $wine cmd C:\>dir > lpt1 Kalau respon yang kita dapat adalah printer kita mencetak isi C:\, maka selamat! Tapi jika yang anda dapatkan adalah error message: Access denied, silahkan baca lebih lanjut. Lalu apa solusinya? menjalankan wine sebagai root? ha..ha..,ya enggaklah, itu kan solusi bodoh (yang sayangnya sering kali aku lihat dilakukan orang-orang). Solusi paling tepat adalah memasukkan user ke dalam group lp: $sudo usermod -a -G lp bambang Awas: perubahan ini hanya efektif setelah anda logoff dan login kembali! Setelah itu, silahkankan anda masuk lagi ke command prompt wine dan coba cetak isi directory ke printer anda </li><li>Masalah lain, pada modul setting konfigurasi Indikator (Indikator adalah alat pembaca hasil timbangan yang terkonek ke komputer kita melalui serial port), program berusaha mencari serial port apa saja yang ada di komputer kita. Pencarian serial ports ini dilakukan pada registry window: HKLM\HARDWARE\DEVICEMAP\SERIALCOMM Masalahnya, di wine (sampai dengan versi pada waktu blog ini ditulis: 1.1.21), registry key ini tidak ada! Penambahan secara manual tidak bisa dilakukan karena ini merupakan volatile key, yang artinya registry key ini secara otomatis akan diupdate oleh windows (atau wine) dengan melakukan pengecekan terhadap hardware yang ada. Ada 2 solusi untuk masalah ini: <ol> <li>Cek terlebih dahulu registry key tsb. ada atau tidak. Jika ada, go ahead! Silahkan tanya ke om Windows, serial port apa saja yang ada di komputer ini. Tapi jika registry key ini tidak ada (yang artinya anda sedang jalan di wine yang belum terpatch, ya nggak usah tanya ke windows. Di program saya, pilihan setting com port ini melalui sebuah combobox. Program ini dibuat dengan Delphi7 dan komponen TComPort, ini yang saya lakukan: <pre> // Serial Port try CPort.EnumComPorts(Self.CBSerialPort.Items); except if IWSDataModule.ComPorts = '' then begin MessageDlg( 'Gagal membaca registry key HKLM\HARDWARE\DEVICEMAPPING\SERIALCOMM.' + #13#10'Apakah program ini dijalankan di wine? Set Serial Port yang ada di file ' + ChangeFileExt( ParamStr(0) , '.ini'), mtError,[mbAbort],0); Abort; end; Self.CBSerialPort.Items.Clear; Str := IWSDataModule.ComPorts; while Str <> '' do begin i := Pos( ',' , Str ); if i <> 0 then begin Str1 := Trim(Copy( Str,1,i -1 )); Str := Trim(Copy(Str,i+1,Length(Str)-i )); end else begin Str1 := Trim( Str); Str := ''; end; Self.CBSerialPort.Items.Add(UpperCase(Str1)); end; end; Self.CBSerialPort.ItemIndex := Self.CBSerialPort.Items.IndexOf(SerialPortIndikator); </pre> </li> <li>Patch wine anda! Tentu saja ini hanya bisa dilakukan kalau kita install wine melalui source code (inilah alasan utama kenapa aku nggak mau install wine pakai cara gampang dengan install package jadinya). Patch agar supaya Wine melisting serial port apa saja yang ada ke registry key HKLM/HARDWARE/DEVICEMAP/SERIALCOMM tsb. dapat anda dapatkan di: http://www.nabble.com/create-DEVICEMAP%5CSERIALCOMM-registry-entries-td20693044.html Hanya saja masalahnya patch ini gagal diappliedkan ke wine versi 1.1.21, untuk itu berdasarkan patch tsb. saya buat patch di bawah ini, patch dilakukan terhadap file dlls/kernel32/oldconfig.c: <pre style="font-size:75%"> --- oldconfig.old.c 2009-05-10 12:39:08.000000000 +0700 +++ oldconfig.c 2009-05-10 12:53:06.000000000 +0700 @@ -331,8 +331,8 @@ } -/ create the hardware registry branch / -static void create_hardware_branch(void) +/ create the scsi registry branch / +static void create_scsi_branch(void) { / The following mostly will work on Linux, but should not cause * problems on other systems. / @@ -454,6 +454,149 @@ } +/ create SERIALCOMM branch containing keys for /dev/ttyS* / +void create_serialcomm_branch(void) +{ + OBJECT_ATTRIBUTES attr; + UNICODE_STRING nameU; + WCHAR dataW[50]; + DWORD length; + DWORD disp; + HANDLE targetKey; + struct dirent dent; + DIR * dir; +#if defined(FreeBSD) || defined(__FreeBSD_kernel__) + char deviceprefix[5] = "cuad"; +#else + char deviceprefix[5] = "ttyS"; +#endif + int portmap[256]; + int isdevice[256]; + char readlinkbuf[261]; + char keyname[] = "\\Device\\Serial999"; + char keydata[] = "COM999"; + const char * wineprefixdir; + char * dosdevicepath = 0; + static const char dosdevdirsuffix[] = "/dosdevices"; + int suffixlength = 11; + int pathlength = 0; + int index = 0; + int numbytes = 0; + int devnumber = 0; + int portnumber = 0; + + attr.Length = sizeof(attr); + attr.RootDirectory = 0; + attr.ObjectName = &nameU; + attr.Attributes = 0; + attr.SecurityDescriptor = NULL; + attr.SecurityQualityOfService = NULL; + + /* Ensure there is HARDWARE\\DEVICEMAP\\SERIALCOMM key / + if(!RtlCreateUnicodeStringFromAsciiz( &nameU, "Machine\\HARDWARE\\DEVICEMAP\\SERIALCOMM" ) || + NtCreateKey( &targetKey, KEY_ALL_ACCESS, &attr, 0, + NULL, REG_OPTION_VOLATILE, &disp )) + { + ERR("Cannot create DEVICEMAP\\SERIALCOMM registry key\n" ); + return; + } + RtlFreeUnicodeString( &nameU ); + + /initialise portmap and devices arrays to -1/ + for(index = 0; index < wineprefixdir =" wine_get_config_dir();" pathlength =" strlen(wineprefixdir)" dosdevicepath =" HeapAlloc(GetProcessHeap()," dir =" opendir(" dent =" readdir(dir)))">d_name, deviceprefix, 4) == 0) + { + /d_name is null terminated already/ + devnumber = strtol(dent->d_name + 4, NULL, 10); + /which COM port will this device map onto/ + portmap[devnumber] = devnumber + 1; + isdevice[devnumber] = 1; + } + } + } + closedir(dir); + + / Enumerate all dosdevices/com* symlinks / + dir = opendir(dosdevicepath); + if(dir) + { + dosdevicepath[pathlength -1] = '/'; + while((dent = readdir(dir))) + { + if(strncmp(dent->d_name, "com", 3) == 0) + { + portnumber = strtol(dent->d_name + 3, NULL, 10); + if(portnumber <> 256) + { + continue; + } + else + { + / get the symlink target + * strtol the last chars + * check and set portmap entry / + memcpy(dosdevicepath + pathlength, dent->d_name, strlen(dent->d_name) + 1); + numbytes = readlink(dosdevicepath, readlinkbuf, 261); + if(numbytes > 0 && numbytes < devnumber =" strtol(readlinkbuf" index =" 0;" index =" 0;"> Cara untuk mengapplykan patch tsb. di atas: <ol> <li> Save patch tsb. dengan nama devicemap_serialcomm.diff ke directory dlls/kernel32</li> <li> masuk ke directory dlls/kernet32 dan lakukan patch dengan command: patch -i nama devicemap_serialcomm.diff </li> </ol> </pre></li></ol></li></ol> <div class="blogger-post-footer"></div> </article> <article> <h1>Installing code::block</h1> 2009-05-08T11:12:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/vojd0F03SJcebWepT1PY2SMRTtY/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/vojd0F03SJcebWepT1PY2SMRTtY/1/da"></img></a>Now, I begin to understand the mechanism of wxWidget. Time to look for a good IDE. After some googling session, I decide to install code::block. At first, I downloaded the source code. However, I failed to build it myself and found it is too complicated to rectify the problem. So, I downloaded the .deb package and installed it: $wget -c http://transact.dl.sourceforge.net/sourceforge/codeblocks/codeblocks_8.02-0ubuntu1.deb.tar.gz $tar -xf codeblocks_8.02-0ubuntu1.deb.tar.gz #sudo dpkg -i .deb Surprisingly, right after the package installed synaptic update manager shouted that an upgraded package is available from repository .... :) If only I knew from the beginning I will install from the repository instead...:) <div class="blogger-post-footer"></div> </article> <article> <h1>wxWidgets: Adding menu and status bar</h1> 2009-05-08T10:51:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/8iKBLJ6TmMW2TBeOP81t_5Jh6JY/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/8iKBLJ6TmMW2TBeOP81t_5Jh6JY/1/da"></img></a>Steps to add menu: <ol><li>Define IDs for our menu items enum { ID_QUIT, ID_ABOUT, ID_POPUP }; </li><li>Create instances of wxMenu inside the constructor of the main windows wxMenu MenuFile = new wxMenu; MenuFile->Append( ID_ABOUT , _T("&About")); MenuFile->Append( ID_QUIT , _T("&Quit")); wxMenu MenuData = new wxMenu; MenuData->Append( ID_POPUP , _T( "Another &Form")); </li><li>Create an instance of wxMenuBar wxMenuBar MenuBar = new wxMenuBar; </li><li>Add our instances of wxMenus to the menubar MenuBar->Append( MenuFile , _T("&File") ); MenuBar->Append( MenuData , _T("&Data") ); </li><li>Assign the menubar to the main windows this->SetMenuBar( MenuBar);</li><li>Declare event function in our main windows class declaration class MainWindow: public wxFrame { public: MainWindow(const wxString& title , const wxPoint& pos , const wxSize& size ); void MenuClickQuit( wxCommandEvent& event); void MenuClickAbout( wxCommandEvent& event); void MenuClickPopup( wxCommandEvent& event); DECLARE_EVENT_TABLE() }; Don't forget to put the magic macro: DECLARE_EVENT_TABLE()</li><li>Write implementation of the event functions. void MainWindow::MenuClickQuit( wxCommandEvent& event) { cout << "Quit\n"; this->Close( TRUE ); } void MainWindow::MenuClickAbout( wxCommandEvent& event) { wxMessageBox( _T("Learning wxWidgets") , _T( "About" ), wxOK | wxCANCEL | wxICON_INFORMATION , this ); } void MainWindow::MenuClickPopup( wxCommandEvent& event) { FormData f = new FormData( this , _T("FormData"), wxPoint(-1,-1) , wxSize(-1,-1) ); f->Show( TRUE); } ...and again a magic macro which glues our event to the system: BEGIN_EVENT_TABLE( MainWindow , wxFrame) EVT_MENU( ID_QUIT , MainWindow::MenuClickQuit) EVT_MENU( ID_ABOUT , MainWindow::MenuClickAbout ) EVT_MENU( ID_POPUP , MainWindow::MenuClickPopup ) END_EVENT_TABLE() </li></ol>In our MenuClickPopup event we create a child form. We pass the main window as it's parent in the first parameter. By doing so, if the main window is closed, the child windows will be all closed to. Here is the complete source: #include <wx/wx.h> #include <iostream> using namespace std; enum { ID_QUIT, ID_ABOUT, ID_POPUP }; // Create our Application class derived from wxApp class MyApp: public wxApp { public: bool OnInit(); // have to override onInit }; class MainWindow: public wxFrame { public: MainWindow(const wxString& title , const wxPoint& pos , const wxSize& size ); void MenuClickQuit( wxCommandEvent& event); void MenuClickAbout( wxCommandEvent& event); void MenuClickPopup( wxCommandEvent& event); DECLARE_EVENT_TABLE() }; class FormData : public wxFrame { public: FormData( wxWindow Parent,const wxString& Title , const wxPoint& Pos , const wxSize& size); }; MainWindow::MainWindow(const wxString& title , const wxPoint& pos , const wxSize& size ) : wxFrame( NULL, -1, title, pos, size) { this->Show( TRUE); wxMenu MenuFile = new wxMenu; MenuFile->Append( ID_ABOUT , _T("&About")); MenuFile->Append( ID_QUIT , _T("&Quit")); wxMenu MenuData = new wxMenu; MenuData->Append( ID_POPUP , _T( "Another &Form")); wxMenuBar MenuBar = new wxMenuBar; MenuBar->Append( MenuFile , _T("&File") ); MenuBar->Append( MenuData , _T("&Data") ); this->SetMenuBar( MenuBar); // status bar this->CreateStatusBar(); this->SetStatusText( _T("Bambang is learning wxWidgets") ); }; bool MyApp::OnInit() { cout << "start\n"; MainWindow mainFrame = new MainWindow( _T("Hello empty world"),wxPoint(-1,-1),wxSize(-1,-1)); this->SetTopWindow( mainFrame); //mainFrame->Show( TRUE); return TRUE; }; void MainWindow::MenuClickQuit( wxCommandEvent& event) { cout << "Quit\n"; this->Close( TRUE ); } void MainWindow::MenuClickAbout( wxCommandEvent& event) { wxMessageBox( _T("Learning wxWidgets") , _T( "About" ), wxOK | wxCANCEL | wxICON_INFORMATION , this ); } void MainWindow::MenuClickPopup( wxCommandEvent& event) { FormData f = new FormData( this , _T("FormData"), wxPoint(-1,-1) , wxSize(-1,-1) ); f->Show( TRUE); } FormData::FormData( wxWindow Parent,const wxString& Title , const wxPoint& Pos , const wxSize& Size) : wxFrame( Parent , -1, Title , Pos, Size) { }; IMPLEMENT_APP(MyApp); BEGIN_EVENT_TABLE( MainWindow , wxFrame) EVT_MENU( ID_QUIT , MainWindow::MenuClickQuit) EVT_MENU( ID_ABOUT , MainWindow::MenuClickAbout ) EVT_MENU( ID_POPUP , MainWindow::MenuClickPopup ) END_EVENT_TABLE() <div class="blogger-post-footer"></div> </article> <article> <h1>wxWidgets:Hello empty world!</h1> 2009-05-06T10:38:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/i15u2DLlepfyGG2TsXj2ImUUfPU/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/i15u2DLlepfyGG2TsXj2ImUUfPU/1/da"></img></a>Basic skeleton learnt: <ol><li>Have to declare an application class derived from wxApp</li><li>Have to override virtual function OnInit of this class</li><li>Have to declare a main window class derived from wxFrame (windows is called frame in wxWidgets)</li><li>in OnInit of our application class, we should create (define) an instance of the main window class defined in step 3. Set this frame (window) as the top window with method SetTopWindow Don't forget to set its visibility to True with show method </li><li>To make the main() entry point, use macro: IMPLEMENT_APP( OurAppClass) which translated to complicated statement but then last with: int main( int argc , char ** argv ) { return ( wxEntry( argc , argv) ) }; </li></ol>Bulletes which bit me: <ul><li>The method name should be OnInit() but I wrote onInit() and nothing comes up to the screen. It took 1 hour to figure out what's going wrong. At least I now know wxWidget naming convention is EveryFirstWordShouldBeCapitalized() </li></ul> Compiling: g++ hello.cpp `wx-config --libs` `wx-config --cxxflags` -o hello Source code: hello.cpp #include <wx/wx.h> #include <iostream> using namespace std; // Create our Application class derived from wxApp class MyApp: public wxApp { public: bool OnInit(); // have to override onInit }; class MainWindow: public wxFrame { public: MainWindow(const wxString& title , const wxPoint& pos , const wxSize& size ); }; MainWindow::MainWindow(const wxString& title , const wxPoint& pos , const wxSize& size ) : wxFrame( NULL, -1, title, pos, size) { this->Show( TRUE); }; bool MyApp::OnInit() { cout << "start\n"; MainWindow *mainFrame = new MainWindow( _T("Hello empty world"),wxPoint(-1,-1),wxSize(-1,-1)); this->SetTopWindow( mainFrame); //mainFrame->Show( TRUE); return TRUE; }; IMPLEMENT_APP(MyApp); And here is the screenshot: <a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_lx3ybG2Edyw/SgHnI83LD0I/AAAAAAAAAjw/EmscziSgAYY/s1600-h/Screenshot-Hello+empty+world.png"></a><div class="blogger-post-footer"></div> </article> <article> <h1>Installing on Ubuntu 8.10</h1> 2009-05-06T07:39:00.000-07:00 <a href="http://feedads.g.doubleclick.net/~a/dTIfNeuxEKgfzcR20AkEss04e7s/0/da"></img></a> <a href="http://feedads.g.doubleclick.net/~a/dTIfNeuxEKgfzcR20AkEss04e7s/1/da"></img></a>WxWidgets is available from ubuntu standard repository, but it often lacks several version. Fortunately, the developer of wxwidget provides ubuntu repository: Add this lines to /etc/var/sources.list: deb http://apt.wxwidgets.org/ intrepid-wx main deb-src http://apt.wxwidgets.org/ intrepid-wx main (note replace intrepid with your ubuntu distribution) and then import security key: #curl http://apt.wxwidgets.org/key.asc #curl http://apt.wxwidgets.org/key.asc | sudo apt-key add - if you don't have curl, you can install it first: #apt-get install curl After that, update the repository: #sudo apt-get update And then install wxwidgets from synaptic. Here are the packages I installed: <ul><li>wx2.8-il18n</li><li>wx2.8-doc</li><li>wx2.8-headers</li><li>wx2.8-examples</li><li>libwxgtk2.8-0</li><li>wx-common</li><li>libwxgtk2.8-dev</li><li>wxformbuilder</li><li>libwxbase2.8-0</li><li>libwxbase2.8-dev </li></ul>After installing the packages, the documentation is the most important. The html reference is located in: /usr/share/doc/wx2.8-doc/wx-manual.html/index.html I opened the file in my browser and bookmarked it because it will be my companion. Now, I am skimming the manual trying to grab the essence of this framework.<div class="blogger-post-footer"></div> </article> </main></body></html>

Bambang P notes...

Creating custom build wine deb package

Merge several pdfs in ubuntu

Tip: Recompiling PHP under linux