Puzzle slide sederhana dengan JS (Java Script)

Tau permainan yang jadul and asah otak ini gan?

Betul nih puzzle slide (sliding puzzle) yang biasa di mainin anak-anak, tapi belum tentu orang dewasa juga bisa selesaikan permainan ini. karena lumayan menguras otak sih gan.. hehehe...

Ada pengalaman nih ane tentang game ini. Pas waktu ane masih SMA dulu  kerja suatu event organizer di Sidoarjo, Jawa Timur, Indonesia. Ane di tantang ama pemilik EO untuk selesaikan permainan ini dengan waktu 5-10 menit dengan dikasih imbalan Rp.100.000. ane trima tantangan itu. Pemilik EO ane mengutak atik meng acak acak puzzle slide itu berharap ane gak bisa selesaikan puzzle itu seakan gak mau merelakan uangnya yang Rp.100.000 jatuh ke tangan ane. Tapi ane duduk and menunggu dengan santai..

Tibalah ane untuk beraksi, berubah jadi dektektif conan. tet teret tet tet,,, akhirnya ane berhasil sebelum waktunya, aha.. uang Rp.100.000 ane dapatkan.. hahhahaaa... MANTAP!!

karena kenangan itu ane belajar- belajar, searching-searching akhirnya ane dapatkan formulanya.. hohohoo..

nih ane coba buat game puzzle slide berbasis HTML dan Java Script yang sederhana..

Liat hasilnya di sini

pertama nih simpan format index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
    <title>Bagus Romadhon (461114002)</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="c/puzzle.css" media="all" type="text/css" />
    <script src="j/mootools.v1.00.js" type="text/javascript"></script>
    <script src="j/puzzle-not-compressed.js" type="text/javascript"></script>
</head>
<body onload="return Puzzle.make(3)">
<div id="content">
  <h1></h1>
 <table >
  <tr>
    <td>&nbsp;</td>
    <td><h2>Puzzle</h2></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td rowspan="2"><div id="puzzle"><img src="i/red-stripe.jpg" alt="" width="350" height="263" /></div></td>
    <td>&nbsp;</td>
    <td><h2>Hasil Akhir</h2><img src="i/red-stripe.jpg" alt="" width="158" height="125" /></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>
      <input name="acak" id="jalan" value="Acak" type="submit" onclick="return Puzzle.shuffle()" />
      <br />
      <input name="jalan" id="jalan" value="Hasil" type="submit" onclick="return Puzzle.fix()" /></td>
  </tr>
 </table>
    </div>
<div id="footer">
    <p><a href="http://bagusromadhon.blogspot.com/">&copy; Bagus Romadhon </a></p>
</div>
</body>
</html>

selanjutnya nih program CSSnya simpan dengan puzzle.css

    *, td, img    {margin : 0; padding : 0;}
    img { border: 0; }
    form, fieldset    {font: 100%/120% verdana, arial, sans-serif}
    p    {padding: 0 0 0 0; margin: 0 0 1em 0}
    form label    {cursor: pointer}
    fieldset    {border: none}
    input, select, textarea {font-size: 100%}
    body    {
        background-color: #E0E6F2;
        color: #333436;
        font-family: "Lucida Sans Unicode", "Trebuchet MS", Helvetica, Sans-Serif;
        font-size: 13px;
        line-height: 1.6em;
        padding: 1px 0 3em 50px;
        width: 1000px;
    }
h1{
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2em;
    border-bottom: 1px  double #6b9ef1;
    color: #5f95ef;
    margin-bottom: 1em;
}
h2{
    font-weight: 700;
    font-size: 18px;
    line-height: 1.2em;
    border-bottom: 1px  double #6b9ef1;
    color: #5f95ef;
}
    #content {
        padding: 20px 0 0 50px;
    }
    #content table{
        width:200px; 
    }
    #content h1 {
        margin-bottom: 1em;
        color: #7F222B;
    }
    p {
        color: #999;
        font-size: .9em;
        margin-top: 2em;
    }
    #footer {
        color: #999;
        clear: both;
        font-size: 12px;
        line-height: 20px;
        letter-spacing: 1px;
        padding: 0 0 1px 50px;
        height: 6em;
        overflow: hidden;
        border-bottom: 1px  double #6b9ef1;
    }
#puzzle {
    width:350px;
    height:263px;
    border: 1px  double #F30;
}
#puzzle2 {
    background-color:#000;
    width:350px;
}
#jalan{
    background: #6f9ff1;
    color: #fff;
    font-weight: 700;
    font-style: normal;
    border: 0;
    cursor: pointer;
}
        a:link,
        a:visited    {color: #cf852c; text-decoration: underline;}
        a:hover,

kirab budaya Sidoarjo

Tau gak kirab?
ane juga gak tau gan hehehee... yang pasti masih berhubungan ama kebudayaan yang kental di masing-masing daerah..
ternyata di daerah ane yang terkenal dengan julukan kota udang yang sepak bolanya di juluk i The Lobster ada juga acara kirab budaya se kecamatan SIDOARJO.. yang di adakan setip taun ama bupati..
dicari bakat-bakat terpendam di masing-masing kecamatan se sidoarjo. mulai dari bakat nari, nyanyi, ekting, wes pokoknya kayak gado-gado lah campur jadi satu..
pas acaranya ane liat rame banget gan. yang bertepat di Alun-alun Sidoarjo, Sampai - sampai hingga menutup jalan kota, yang dari arah porong-surabaya harus muter ke barat  daerah gor sana keluar ke jalan air mancur. yang surabaya-porong harus muter ke timur  melewati daerah bluru kidul - bcf - keluar deh di celep..
Pada taun ini 2012 diadakan tanggal 18 februari jam 12.00-18.00 WIB.
Padahal ane gak ada niatan untuk acara itu, gara-garanya ane nyarik ibu' ane yang lagi nonton ama sodara ane. eh di liat liat ternyata acaranya seru juga. akhirnya nimbrung deh liat juga tuh karnaval..
Mulai sabang sampai merauke, eh salah dari porong sampai waru ada di situ. Ada 18 kecamatan gan numplek blek ikut acara itu dengan menampilkan budaya daerah masing- masing.
ini sedikit foto-foto jepretan ane di KIRAB BUDAYA 18 KECAMATAN SE-SIDOARJO:

Tuh yang kaos kuning celana putih sandal ungu sodara ane gan, namanya Rentsa. masih kelas 2 SD 

Ane seneng gan liat kirab budaya sidoarjo ini, bisa nambah pengetahuan kita tentang budaya daerah dimasing2 kecamatan sidoarjo khususnya. Apalagi selain menambah wawasan di sana juga ada panggung hiburan yang di isi oleh Inul dara tua eh maaf mbak maksud saya Inul dara tista dan artis lokal lainya...^^

Tapi ada yang ane keselin. bukan soal acaranya tapi soal penontonnya gan.

liat aja tabanab di depan kantor bupati rusak gara-gara penonton pingin liat lebih dekat. kasian kan tuh tanaman jadi mati. apa salahnya coba sampai kalian berbuat begini. khm khm.. sedih deh :'(

liat aja nih sedikit jepretan ane :

pokoknya pelihara terus budaya-budaya Indonesia, jangan sampai lupa akan baju yang di pakai dan jangan sampai bajumu di curi sama orang lain karena kalau sampai di curi kamu akan telanjang dan penuh malu untuk menutupinya..
salam lempeng.. -.-

video clip Java Sugar - Tergoda

nih gan, video clip band ane.
namanya Java sugar (gulo jowo) yang lagunya tergoda..
nih pengambilan gambarnya di studio 3D SDA and daerah terawas...
liat gan and kasih masukan ya.. maklum ane baru belajar..

jepret

nih ane mau share tentang jepretan menggunakan kamera samsung galaxy y yang 2mp.

foto ini ane ambil waktu matahari mau mengisi sinarnya di bumi sebelah barat, waktu itu habis ujan gan. liat nih.
nih model paronama

nih model biasa

terus yang ini model biasa tapi cuman langsung ane jepret selisih beberapa detik ama yang atas

yang ini model malam harinya gan, waktu itu ane lagi latian di studio

yang ini matahari menampakkan sinarnya di bagian timur, di ambil waktu ane di atep rumah pagi-pagi. Model biasa.

yang ini gan waktu indornya

ya gitulah gan jepretan-jepretan ane, ya masih baru belajar jadi potograper.. (ikut-ikut olga gak bisa ngomo f hehehe.. jangan sampek ya.. )
semoga bisa membuat agan-agan bisa terinspirasi dunia akhirat.. hehehe.. :p

bongkar gudang nemu robot lawas

kotor banget lemari ane. baiklah ane bersiin aja pumpung lagi giat nih.
eh lagi asik bersih-bersih ane nemu beginian. 

 

Nitendo 2

ane bongkar aja. pengen tau gimana dalamnya produk lama..
ane kagak ngerti.. hehee.. :P
udah lama banget ane gak main ini. digantikan robot yang lebih canggih..

 Asimo

nih ane biasa main ini. buat di rumah aja.. kayak pembantu dia..
hahahahaha...

di tengah jalan otak-atik mobil

Sabtu tanggal 17 Desember 2011 adalah pengalaman yang membuat orang di jalan Ahmad yani Surabaya kesal.
tau kenapa?
karena zebra yang aku kendarai lagi dehidrasi di tengah jalan..
suara klakson disana sini.. Akhirnya dorong deh zebraku.
ternyarta di tengah jalan ada aja orang menawarkan perbaikan. ampek 2 kali teknisi menwari ke aku. Emang aku gak bisa apa memperbaiki sendiri. aku buka aja mesin dan radiatornya.

Aku otak-atik, sampek lama. Emang aku gak bisa.. hehehee.. :p
ya udah deh, aku telpon orang yang aku percaya buwat memperbaikinya. dari kota udang alias Sidoarjo meluncur ke tampat per sembunyianku.

ternyata selang airnya bocor, seperti orang yang ngendarai tuh zebra.
selang udah di tambal akhirnya udah selesai. meluncurdeh ke suting videoclip Java Sugar.

CIGARETTES (ROKOK)

ow ow ow....

tau gak penyakit apa yang lebih mengerikan dari sakit hati?

sakit yang semu penyakit ada di dalam tubuh kita. Kalian bisa bayangin deh gimana jika semua penyakit masuk ke tubuh kita? pastinya ngeri banget..

penyakit yang satu ini salah satunya disebabkan oleh rokok. tau gak rokok? rokok adalah gabungan dari kata "rok" dan "ok" yang artinya rok yang ok.. wahahaha...

bukan-bukan itu definisi rokok yang sebenarnya. tapi yang pasti rokok itu mematikan seluruh umat manusia dalam waktu jangka panjang.. karena akibat mengkonsumsi rokok udah tercantum di bungkus rokok. "MEROKOK DAPAT MENYEBABKAN KANKER, SERANGAN JANTUNG, IMPOTENSI, GANGGUAN KEHAMILAN DAN JANIN". Apakah orang-orang perokok itu tidak bisa membaca peringatan itu.

nih kandungan yang ada di tiap batang rokok.

liat nih.. ngeri banget kan.. itu yang kita hisap selama ini didalam tubuh kita..

oww.. Tidak''...

kalau sudah kita hisap rokok, apa lagi jadi perokok aktif dan tak pernah berhenti untuk berhenti lama kelamaan akan seperti ini

ow ow ow.. tuh tubuh manusia apa sampah.. hehehee... :P

perokok selain merugikan diri sendiri juga merugikan sekitar dan lingkungannya. Haruskah tabungan kita habiskan untuk berobat dari pada untuk masa depan anak cucu kita nanti?

ayo kita semua bersikap dewasa untuk jadi lebih baik, lebih sehatan. dan tetap semangan untuk mengatakan

SAY NO TO CIGARETTES..

KATAKAN TIDAK PADA ROKOK..