One Click Upload File pada JSP (Java Server Pages)

January 15th, 2009

jsp-logoDisini aku mencoba mengembangkan dan memodifikasi hasil surfing bersama om google untuk teknik “One Click Upload File“. Aku menggunakan JQuery untuk membuat teknik tersebut pada clientside, sebagaimana kita ketahui JQuery merupakan salah satu framework AJAX yang diminati dan populer saat ini, yang dilengkapi oleh plugin-plugin yang fantastik. Agar teknik One Click Upload ini bisa berjalan dengan baik aku menggunakan plugin  one-click upload.

Plugin tersebut bisa direview pada url http://www.michaelmitchell.co.nz/one-click-upload/ , pada url tersebut diberikan contoh untuk serverside menggunakan PHP, untuk itu aku mencoba menggunakan JSP (Java Server Pages) sebagai serverside yang bertugas untuk merespon request dan melakukan proses upload file ke server.

Demo aplikasi ini bisa dilihat disini

Berikut ini potongan dari penggunaan plugin one-click upload yang aku gunakan pada demo tersebut.

$(document).ready(function() {
 
	$('#upload').upload({
		name: 'file',
		method: 'post',
		enctype: 'multipart/form-data',
		action: '/FileUpload/doupload.jsp', //Ubah menjadi /FileUpload/Upload jika ingin mencoba servlet
		onSubmit: function() {
			$('#loading').show();
			$('#result').hide();
            $('#upload').hide();
		},
		onComplete: function(data) {
			$('#loading').hide();
			$('#result').html(data);
			$('#result').fadeIn('slow');
            $('#upload').fadeIn('slow');
		}
	});
 
})

Sedangkan untuk seversidenya sebagai berikut

<%@page contentType="text/html" pageEncoding="UTF-8" language="java"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
   <%@ page import="java.util.List" %>
   <%@ page import="java.util.Iterator" %>
   <%@ page import="java.io.File" %>
   <%@ page import="org.apache.commons.fileupload.servlet.ServletFileUpload"%>
   <%@ page import="org.apache.commons.fileupload.disk.DiskFileItemFactory"%>
   <%@ page import="org.apache.commons.fileupload.*"%>
 
    <%
    String fullFile="";
    String realPath="";
    long sizerule = 102400; //(dalam byte) bisa diubah sesuai dengan kebutuhan
 
            boolean isMultipart = ServletFileUpload.isMultipartContent(request);
 
            if(!isMultipart){
                out.print("Request bukan multipart !!!<br>");
                return;
 
            }
 
               FileItemFactory factory = new DiskFileItemFactory();
               ServletFileUpload upload = new ServletFileUpload(factory);
               List items = null;
               try{
                   items = upload.parseRequest(request);
               }catch(FileUploadException e){}
 
               Iterator itr = items.iterator();
 
            while(itr.hasNext()){
                FileItem item = (FileItem) itr.next();
                if(item.isFormField()) {
                } else {
                    fullFile = item.getName().trim(); //Memperoleh nama_file.ekstensi
                    long filesize = item.getSize(); //Memperoleh ukuran file
 
                    //Memperoleh path tujuan upload
                    realPath = config.getServletContext().getRealPath("/") + "uploadedfile\\" + fullFile;
 
                    if(fullFile.trim().equals("")){
                       out.println("Inputan Anda masih kosong!!!<br>");
                    }else if(fullFile.indexOf(".jpg")==-1){
                       out.println("File Anda harus bertipe *.jpg <br>");
                    }else if(filesize > sizerule){
                       out.println("Ukuran file <b>"+fullFile+"</b> tidak boleh lebih dari "+
                                  (sizerule/1024)+" KB !!!<br>");
                    }else{
                            try {
                               File savedFile = new File(realPath);
                               item.write(savedFile);
                               out.print("File <b>"+fullFile+"</b> berhasil disimpan <br>");
 
                               /* File dihapus (buang saja/jadikan sebagai baris komentar pada
                                * bagian ini jika Anda ingin memperoleh/melihat hasil pada
                                * path tujuan upload)
                                */
                                new File(realPath).delete();
 
                            } catch (Exception ex) {
                                out.println("Gagal menyimpan file!!! <br>");
                                break;
                            }
                    }
                }
 
            }
%>

Sourcecode bisa diunduh disini

Untuk proses upload file aku memanfaatkan library commons-fileupload-1.2.1.jar dan commons-io-1.4.jar yang sudah aku sertakan pada file sourcecode.

Aku juga menyertakan sourcecode untuk servlet pada file yang Anda unduh tersebut jika ingin mencoba penanganan upload file pada serverside oleh servlet.

Selamat mencoba :wink:

Java, Javascript , , ,

Penerapan SQLite pada Java

January 14th, 2009

sqliteSebenarnya sudah lama aku ingin posting artikel ini, karena pikirku sudah banyak tutorial tentang SQLite pada pemrograman JAVA jadi aku urungkan untuk posting. Namun karena permintaan salah seorang temanku  akhirnya online juga nih postingan. :mrgreen:

Sebagaimana kita ketahui SQLite merupakan embedded database sifatnya serverless dan portable dimana semua data disimpan dalam satu file tunggal dan sudah pasti menggunakan perintah-perintah SQL untuk proses manipulasi data pada database tersebut.
Dari kelebihan tersebut menjadikan SQLite ini sangat populer dikalangan para developer software.

Untuk penggunaan SQLite pada pemrograman JAVA diperlukan SQLite JDBC Driver yang dapat diunduh pada situs http://zentus.com/sqlitejdbc/
Pada situs tersebut juga sudah memberikan contoh sederhana bagaimana cara penggunaan SQLite pada JAVA. Namun aku juga mencoba membuat Demo penggunaan SQlite pada JAVA yang diimplementasikan dalam aplikasi sederhana input data mahasiswa.

Screenshot :

sqlite1

sqlite2

Sourcecode demo tersebut bisa diunduh disini.

Selamat mencoba :wink:

Java ,

Jadi parno saat baca: “Suka Duka Jadi Programmer”

January 2nd, 2009

Lagi bengong abis coding seharian akhirnya aku putuskan untuk  googling, lagi asik googling eeehhh aku nemuin blog orang yang membahas tentang suka duka dia ketika menjadi programmer ( url : http://adiwirasta.blogspot.com/2008/01/suka-duka-jadi-programmer.html ). Topik yang dia tulis lumayan bikin parno juga, gimana gak parno…, wong jadi programmer dituliskan pada blog tersebut banyak dukanya. Gimana nasib aku yach… :cry: , tapi emang bener juga seh karena aku juga pernah mengalami beberapa nasib yang sama yang dituliskan pada blog tersebut  ( huahuahua… 8O  :cry:  ) .  Berikut ini review artikel blog tersebut.

Suka:
1. Setelah lulus kuliah, cari kerja gampang. Demand posisi programmer sangat tinggi beberapa tahun terakhir ini. (hihihi kalo aku seh no comment, cz blom lulus kul skrg :mrgreen: )

Duka:
1. Setelah kerja, belajar dan belajar dan belajar yang tidak pernah selesai. Ada teknologi baru, belajar. Ada yang baru lagi, belajar lagi. Intinya, ga pernah berhenti belajar. Cape deh… Kapan bisa bilang, “Get a life man…” (ho’oh tuh bikin puyeng :cry: )

2. Deadline dan deadline dan deadline yang tiada pernah berhenti. Selesai satu projek, pindah ke projek lain. Selesai satu deadline, pindah ke deadline lain. (hmmm.., gimana yach.., cz proyekku blom sepadat itu, hehehe kan masih kul)

3. Kalau lagi senggang, trus browsing, trus dilihat bagian keuangan, trus dijutekin. “Emangnya gue ngegaji lo buat browsing… Ngapain kek. Kerja apa kek.” Lah, kalau emang ga ada kerjaan, masa mo nyari-nyari kerjaan. Iseng amat.  (waduh…, gimana nasib aku ntar yach klo dijutekin mulu :roll: )

4. Tiap hari kerjanya duduk. Banyak duduk, perut buncit. Perut buncit, cewe lari. (hihihi…, masih banyak koq ce yang mo deketin aku, jah…, kepedean amat yach :lol: )

5. (Lagi)Tiap hari kerjanya duduk. Banyak duduk, kena wasir. Kena wasir, lihat darah -> pingsan. (wakakakak…, gak sebegitunya kaleee… :mrgreen: )

6. (Lagi)Tiap hari kerjanya duduk. Banyak duduk dan banyak kerja, rambut jadi gondrong, berjenggot, berkumis sehingga penampilan jadi dekil. Penampilan dekil, cewe menjauh. Lagi-lagi cewe pada lari. (waduh…, jangan sampe deh aku kayak gitu :( )

7. Posisi kerjaan hanya : Junior Programmer dan Senior Programmer. Sudah, mandek. Mo bisa punya mobil, otomatis cari side job. (hehehe.., no comment lah…, it’s depend on our self :roll: )

8. Kalau aplikasi buatannya eror, dicaci maki. Ga bakal dibayar. Kalau tidak muncul eror, dicari-cari sampai muncul. Duh, eror kok dicari-cari. Dah lah bayar aja invoice nya… (set dah.., dah kayak buronan aja dicari-cari, wakakakak :lol: )

9. Dah tahu kerjaannya didepan komputer, kantor masih saja nyuruh pake baju berkerah. Padahal, kalau ketemu klien, yang menghadapi mereka adalah orang marketing atau project manager. Duh… Risih. (enaknya mah pake kolor aja sekalian.., wakakakakak :mrgreen: )

10. Program mau selesai, klien minta nambah ini itu. Katanya biar ini itu. Ga dikerjain, nanti bisa mengganggu operasional ini itu. Kalau ga dikerjain, ga mau dibayar. Kalau projek ga dibayar, gaji bisa telat. Jahat-jahatnya GAJI bisa ga dibayar. (hikss.., koq kasusnya sama kayak aku yach.. :cry: )

Klo dilihat diatas tadi kebanyakan dukanya.., :roll: :cry: walaupun begitu aku tetap maju terus pantang mundur, karena semua yang kita kerjakan pasti ada hikmah tersendiri yang bisa menjadi pelajaran untuk kedepannya. Bisa sajakan seorang programmer menjadi system analyst atau project manager berbekal dari pengalamannya ketika menjadi programmer. So teruslah berkarya !!! :-)

Curhat

Integrate Xinha WYSIWYG Editor into CodeIgniter

January 2nd, 2009

ci_logo_flameSelama 2 hari nonstop aku googling sana sini karena penasaran bagaimana cara mengintegrasikan WYSIWYG(What You See Is What You Get) HTML Editor kedalam CodeIgniter. Hasil googling ternyata aku punya 3 kandidat yaitu TinyMCE, FCKEditor dan Xinha.
Untuk TinyMCE bisa direview di http://tinymce.moxiecode.com/, FCKEditor di http://www.fckeditor.net/ dan Xinha di http://trac.xinha.org/ .

Setelah aku unduh dan aku oprek ketiga editor tadi aku punya kesimpulan, untuk TiyMCE merupakan WYSIWYG Editor yang sangat elegan dan mudah sekali untuk digunakan dan diintegrasikan pada CodeIgniter namun sayangnya fitur Image Manager (MCImage Manager) dan File Manager(MCFile Manager) kita harus merogoh kocek lagi (maklumlah anak kost dompetnya tipis hehehe… :cry: ), karena tidak bisa diunduh secara bebas :roll:  akhirnya aku mengurungkan niat untuk menggunakan editor yang satu ini, walaupun sebenarnya ada yang telah menyediakan Ibrowser plugin dan Imanager plugin untuk TinyMCE (bisa direview disini)namun ukurannya sangat besar (Ibrowser 652KB dan Imanager 4MB(zipped), weleh weleh gede banget yach.. 8O ), lagipula aku juga males melakukan konfigurasi ini dan itu buat integrasikan plugin tersebut :P . Sedangkan FCKEditor sudah menyertakan Image Manager namun masih minim fitur dan untuk tampilan tidak seelegan TinyMCE, Image Manager untuk FCKEditor juga belum diperkuat dengan fitur editing gambar dan thumbnail.

Dan yang terakhir Xinha mempunyai fitur yang lumayan lengkap dan customizable, Xinha juga telah menyertakan plugin Image Manager dengan fitur editing gambar dan thumbnail yang sudah terintegrasi dengan baik, namun untuk plugin File Manager belum disertakan sehingga kita tidak bisa mengunggah file-file selain gambar ke dalam server walaupun begitu aku akhirnya memilih editor ini (karena aku suka ama Image Manager dan jenis-jenis emoticonnya banyak). Namun untuk proses integrasi ke dalam CodeIgniter agak rumit (hehehe gak sebegitunya kaleee.. :mrgreen: ).

Baiklah aku akan berikan langkah-langkah cara mengintegrasikan Xinha WYSIWYG Editor kedalam CodeIgniter. Sebenarnya langkah-langkah ini bersumber dari url http://codeigniter.com/wiki/WYSIWYG/ namun pada langkah yang akan aku berikan ini ada sedikit modifikasi kode.

Screenshot dari Xinha WYSIWYG Editor

xinha1

xinha2

Read more…

CodeIgniter, PHP , ,

File Inclusion untuk Javascript pada CodeIgniter

December 26th, 2008

ci_logo_flameLagi asik utak-atik CodeIgniter 1.7.0 yang merupakan salah satu framework PHP yang lagi populer saat ini, pada saat aku ingin mencoba melakukan file inclusion untuk file berisikan scripting javascript (file dengan ekstensi .js) tanpa panjang lebar aku langsung baca user guide CodeIgniter pada bagian HTML Helper. Anehnya koq function untuk inclusion file .js tidak ada, yang ada cuma function link_tag() untuk file inclusion  css, favicon dan rss feed.

Pikirku apa mungkin developer lupa tentang hal ini. Akhirnya setelah googling sana sini dapet juga solusinya. Untuk melakukan file inclusion untuk tipe file .js menggunakan function script_tag(). Namun sebelumnya kita harus modifikasi kode file html_helper.php terlebih dahulu pada direktori system/helpers/ dengan menambahkan kode berikut:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
if ( ! function_exists('script_tag'))
{
 function script_tag($src = '', $language = 'javascript', 
                    $type = 'text/javascript', $index_page = FALSE)
 {
    $CI =& get_instance();
 
    $script = '<script';
 
   if (is_array($src))
   {
	 foreach ($src as $k=>$v)
	 {
	  if ($k == 'src' AND strpos($v, '://') === FALSE)
	  {
		if ($index_page === TRUE)
		{
			$script .= ' src="'.
			$CI->config->site_url($v).'"';
		}
		else
		{
			$script .= ' src="'.
			$CI->config->slash_item('base_url').$v.'"';
		}
	   }
	   else
	   {
			$script .= "$k=\"$v\"";
	   }
	 }
 
	$script .= "></script>\n";
   }
   else
   {
	if ( strpos($src, '://') !== FALSE)
	{
		$script .= ' src="'.$src.'" ';
	}
	elseif ($index_page === TRUE)
	{
		$script .= ' src="'.$CI->config->site_url($src).'" ';
	}
	else
	{
		$script .= ' src="'.
		        $CI->config->slash_item('base_url').$src.'" ';
	}
 
	$script .= 'language="'.$language.'" type="'.$type.'"';
 
	$script .= '></script>'."\n";
  }
 
  return $script;
 }
}

Apabila Anda menerapkan URL Friendly maka jangan lupa pada file .htaccess lakukan modifikasi sehingga menjadi:

RewriteEngine on
RewriteCond $1 !^(index\.php|<strong>js</strong>|images|robots\.txt)
RewriteRule ^(.*)$ /<strong>directory_base</strong>/index.php/$1 [L]

Contoh penggunaan function script_tag() sebagai berikut:

<?=script_tag("js/md5.js")?>

Kode diatas akan menghasilkan output :

<script src="http://domain_anda/directory_base_anda/js/md5.js" language="javascript" type="text/javascript"></script>

Ref : here

CodeIgniter, PHP , ,

It’s Funny Video…Hahaha^^

December 23rd, 2008

Hahahaha…, tiada hentinya aku tertawa melihat tingkah laku dan ekspresi dari kedua orang yang menyanyikan lagu in the jungle pada video dibawah ini.  Dasar muka tebal tuh orang berdua… :lol:

Intermezo ,

Kaget saat baca ” Penyakit Para Bloger dan SEOers yang perlu diwaspadai! “

December 21st, 2008

Itulah kesan pertama saat aku nemuin artikel dengan judul diatas, artikel tersebut bisa dilihat disini

Penulis artikel tersebut menderita penyakit yang harus dioperasi karena kelamaan duduk (bukan ambeien), kurang minum, kurang makan, begadang lebih dari 12 jam sehari, …dst. Aku sangat terkejut karena aku juga punya kebiasaan seperti itu :cry: :cry: . Waduh…, dalam benakku aku harus segera ubah pola hidup menjadi lebih sehat dan teratur sebelum mengalami penyakit seperti penulis tadi alami.

Hmm.., mudah-mudahan aku bisa mengubah pola hidup dari sekarang. Dan mudah-mudahan penulis artikel tadi cepat sembuh.

Curhat

DFA(Deterministic Finite Automata) Simulator

December 21st, 2008

Topik ini aku tulis cuma pengen mereview tugas kuliahku beberapa hari yang lalu yaitu akudiberikan tugas untuk membuat sebuah DFA Simulator.

Sebenarnya topik yang membahas tentang DFA sudah sangat banyak sekali bertebaran di Internet, jadi aku cuma mengulas sedikit dan langsung ke intinya saja.

Sebagaimana kita tahu, DFA mempunyai ciri :
1. Tiap stata tidak boleh memiliki nilai transisi kosong.
2. Terdiri dari 1 transisi dari suatu stata pada 1 simbol masukan.

DFA terdiri 5 tupel (Q, Σ, δ, q0, F) yang terdiri dari:

1. Himpunan Hingga Stata (Q)
2. Himpunan Hingga Simbol Masukan (Σ)
3. Fungsi Transisi (δ : S × Σ → S)
4. Stata Awal (q0 ∈ Q)
5. Himpunan Stata Penerima (F ⊆ Q)

Disini aku asumsikan DFA dengan simbol M, dan berikut contoh sederhana dari DFA:
M = (S, Σ, T, s, A) dimana,

- S = {S1, S2}
- Σ = {0,1}
- s = S1
- A = {S1}
- T didefinisikan oleh tabel transisi berikut:

0 1
S1 S2 S1
S2 S1 S2

Sehingga diagram stata untuk  M jika digambarkan menjadi:

diagram stata

Suatu masukan diterima jika simbol masukan tersebut berhenti pada stata penerima.

Contoh kalimat yang diterima: 1010

Baiklah berikut ini DFA simulator sederhana dan sifatnya masih hardcode dan statis yang aku bikin dengan pemrograman JAVA, untuk mengimplementasikan contoh diatas:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
public class DFA {
    public static void main(String[] args) {
        String input = "1010";
        String[] status = { "terima", "tolak" };
        int[][] next = { { 1, 0 },
                         { 0, 1 },
                       };
        int stata = 0;
 
        for (int i = 0; i < input.length(); i++) {
            stata = next[stata][Integer.parseInt(
				    String.valueOf(input.charAt(i)))];
        }
        System.out.println(status[stata]);
    }
}

Pada kode diatas Himpunan Hingga Stata direpresentasikan dalam bentuk index array, untuk index 0 merupakan stata S1 dan index 1 merupakan stata S2. Sedangkan Himpunan Hingga Simbol Masukan direpresentasikan dalam bentuk angka 0 dan 1.

Untuk versi lebih dinamis dari simulator diatas silahkan unduh disini

Java ,

Penetapan Zona Waktu Setempat

December 19th, 2008

Mungkin hal ini kelihatannya sepele, namun akan sangat diperlukan jika kita membangun suatu aplikasi berbasis web yang bergantung pada proses beracuan pada zona waktu pada suatu wilayah yang berada pada suatu negara.

Seringkali hal ini terlupakan, namun akan sangat fatal akibatnya yaitu waktu yang diinginkan tidak sinkron atau tidak sesuai dengan harapan. Syukur-syukur zona waktu yang kita maksud sama dengan zona waktu server hosting yang kebetulan server tersebut berada pada satu wilayah dengan kita. Namun jika lokasi server hosting tidak satu wilayah bahkan beda negara pastinya terjadi perbedaan zona waktu.

Untuk menghindari hal tersebut aku akan memberikan contoh cara penetapan zona waktu setempat dengan menggunakan JSP. Mungkin cara ini sudah banyak yang tahu, namun aku cuma ingin mereview saja.

Kita bisa menggunakan kelas java.util.TimeZone untuk melakukan penetapan zona waktu setempat. Pada kelas tersebut kita manfaatkan method setDefault untuk melakukan penetapan zona yang dikembalikan oleh method getDefault. Berikut ini contoh kodenya:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<html>
 <head>
    <title>TimeZone</title>
 <%@ page import="java.util.Calendar, java.util.TimeZone" %>
 </head>
 <body> 
<%!
  public String waktuSetempat(String zona){
    String AMPM;
    TimeZone tz = TimeZone.getDefault();
    TimeZone id = TimeZone.getTimeZone(zona);
    tz.setDefault(id);
	Calendar cal = Calendar.getInstance();
	if(cal.get(Calendar.AM_PM)==1)
		 AMPM = "PM";
	else
		 AMPM = "AM";
 
    String info = cal.get(Calendar.DATE)+"/"+
		      (cal.get(Calendar.MONTH)+1)+"/"+
		      cal.get(Calendar.YEAR)+" - "+
		      cal.get(Calendar.HOUR)+":"+
                      cal.get(Calendar.MINUTE)+":"+
		      cal.get(Calendar.SECOND)+" "+AMPM;
    return info;
  }
%>
<%
 out.print("Waktu Jakarta : ");
 out.println(waktuSetempat("GMT+07"));
 out.println("<br>");
 out.print("Waktu Tokyo : ");
 out.println(waktuSetempat("GMT+09"));
 out.println("<br>");
 out.print("Waktu Cairo : ");
 out.println(waktuSetempat("GMT+02"));
 out.println("<br>");
 out.print("Waktu Amsterdam : ");
 out.println(waktuSetempat("GMT+01"));
 out.println("<br>");
 out.print("Waktu Alaska : ");
 out.println(waktuSetempat("GMT-09"));
 out.println("<br>");
 out.print("Waktu Santiago : ");
 out.println(waktuSetempat("GMT-04"));
%>
</body>
</html>

Untuk output bisa dilihat disini

Java , ,

Qt’s QGraphicsView API is awesome!!!

December 19th, 2008

Greatly fantastic!!!, hmmm.. itulah yang terdapat pada pikiranku pada saat menjadi peserta workshop QT for Rapid Mobile Application Development (5 Desember 2008) yang pada saat itu Pak Ariya Hidayat sebagai tutor mendemokan bagaimana QGraphicsView API pada Software QT dapat digunakan untuk meyatukan suatu widget ke dalam lingkungan 3D pada suatu Games.

Demo tersebut bisa dilihat langsung pada video dibawah ini.

QT ,