Blog Nur Akhwan

Blog Nur Akhwan - Blog tentang Pemrograman Web dengan Bahasa PHP, Download Gratis Aplikasi Web PHP

Maaf, pengunjung, bukannya nggak mau menerima komentar, cuma untuk komentar suruh ngirimin source code, mohon agar dibaca postingannya dengan lengkap. Link download aplikasi sudah tersedia di bawah, ini.. Keep reading..

Assalamu'alaikum... Selamat sore para pemiarsah.. Selamat sore Indonesah.. Selamat sore Jogjakardah... Sore ini Jogjakardah panas sekali. Dari situs termometer online Weather.com, didapatkan suhu udara kota Jogjakarta adalah sekitar 38 derajat Celcius. Hal ini tidak biasanya, jika dibandingkan dengan hari biasanya (haha.. ribet nulisnya).. Penyebabnya adalah karena terjadinya deklinasi matahari (ini istilah ilmiah beneran, gak mengada-ada, lho...). Deklinasi adalah gerak semu matahari dimana posisinya dilihat berdasarkan koordinat lintang bumi. Seperti yang saya baca di webnya Tribun Jogja (http://jogja.tribunnews.com/2013/10/17/yogya-panas-sekali-hari-ini-berapa-suhunya), yang diakses pada hari Jum'at, 18 Oktober 2013, pukul 16:28. (efek daftar pustaka skripsi, masih terasa)... 

Kembali lagi berjumpa lagi dengan tulisan saya yang sangat me-ngangenisasi para pembaca sekalian ini. Dengan suasana yang agak beda lagi, bukan pelajar/mahasiswa lagi. Mohon maaf sekali, pemiarsah.. lama saya gak ngupdate blog ini. Terakhir saya liat tanggal BERSEJARAH itu adalah adalah hari Kamis, tanggal 16 Mei 2013, yaitu tanggal dimana saya posting di blog ini terakhir. Kira-kira 6 bulan yang lalu. Waktu yang cukup lama bagi seorang blogger untuk mengupdate postingannya. Mengutamakan masa depan dulu, gan.. nyelesain kuliah yang sekarang sudah guudbay.. 

Masih seputar dunia aplikasi web, ijinkanlah kali ini saya  mau sharing kepada pemiarsah mengenai sebuah aplikasi sederhana yang namanya saya kira sangat keren, serem, lain daripada yang lain, dan sangat tidak layak dijadikan nama sebuah aplikasi. Perkenalkanlah namanya ASAMURAT. Dari namanya ini sudah mengejawantahkan sebuah benda yang sangat tidak berguna, tidak disukai manusia dan cenderung dijauhi. Namun disini ASAMURAT ini adalah akronim dari Aplikasi SederhanA Manajemen sURAT

Latar belakang masalah dari pembuatan aplikasi ini adalah dikarenakan sulitnya pencatatan dalam mengelola surat jika masih menggunakan metode manual dengan ditulis dengan buku agenda. Selain itu karena mencatat dengan menulis manual menjemukan jika ditulis tangan, apalagi jika jumlahnya banyak. Selain itu, pembuatan aplikasi sederhana ini juga didorong oleh keadaan di tempat saya bekerja (di sebuah MTs / setingkat SMP, di MTs Negeri Sidoharjo - http://mtsn-sidoharjo.co.nr/) akan diakreditasi. Kebetulan saya kebagian tugas sebagai pengelola sistem informasi. Nah, dengan harapan bisa mendapatkan nilai lebih nantinya, saya berinisiatif membuat aplikasi sistem informasi manajemen surat. 

Okeh langsung sajah, pemiarsah, berikut screenshot aplikasinya : 

Halaman Login Aplikasi

Halaman Dashboard Admin setelah berhasil login 
Halaman data referensi Kode Klasifikasi Surat (Peraturan Menteri Agam No. 44 Tahun 44)
Halaman manajemen data surat masuk
Form input data surat masuk
Isi disposisi surat masuk
Cetak lembar disposisi surat masuk
Halaman kelola data surat keluar
Form input data surat keluar
Halaman persiapan cetak data buku agenda surat masuk (setting parameter tanggal)
Print priview cetak data agenda surat masuk
Fasilitas yang akan dibuat pada pengembangan dimasa yang akan datang
Catat surat keputusan dan SPPD
Halaman setting nama instansi pengguna 
Halaman manajemen user aplikasi.
(Hanya bisa diakses oleh "Super Admin)
Form edit password user
Disinilah menu LOGOUTnya, gan..
System Requirements :
1. Komputer atau laptop minimal Pentium IV
2. Harus sudah terinstall paket web server (Apache, PHP, MySQL). 
Saya menggunakan WAMP Server versi 2.2. Dapat didownload DISINI  
3. Web browser 
Saya sarankan memakai Mozilla Firefox versi terbaru. Browser Mozilla Firefox bisa menampilkan hasil report dengan sangat baik, jika dibandingkan Google Chrome dan lainnya (ujicoba saya, walaupun saya pemakai Google Chrome)

Keunggulan aplikasi ini.
  • Memakai PHP Framework Codeigniter, sehingga insya Alloh lebih stabil di sisi frameworknya, klo di sisi program yg saya buat mungkin masih banyak kekurangannya.
  • Memakai jQuery Datepicker untuk mengambil inputan berupa tanggal, sehingga lebih memudahkan user dalam menginput data tanggal, sesuai dengan format yang dibutuhkan sistem
  • Memakai jQuery Autocomple untuk pengambilan data kode klasifikasi surat, sehingga lebih cepat dan interaktif
  • Sangat cocok diterapkan pada instansi di bawah Kementerian Agama, karena aplikasi ini saya bangun berdasarkan standar operasional prosedur pengelolaan surat di Kemenag. 
Langsung saja, untuk demo bisa dilihat di link berikut ini, pemiarsah..


Untuk link download maaf ditunggu dulu pemiarsa, karena saya baru bangun website download center saya, dengan harapan agar semua file saya dapat didownload, terpusat di website download center saya itu. hehehe :)

[Update 28 April 2014]
Namun, ternyata, menyempatkan waktu buat mengetik kode lagi, untuk membuat sebuah website download center, susahnya sekali pemiarsa. Jadinya, ane upload ziddu.com, saja. Itung-itung pembaca dapat sambil menambah counter download ziddu, untuk ngebuktiin apakah bisa di-redeem... wakaka.. Ini gan, link download-nya. Didownload semua aja, gan, semuanya saling terkait lho :D :D..

[Update 31 Maret 2015] 
Seiring jejak langkahku belajar dunia pemrograman, ada yang namanya Git Version Control, nah, ane ikut-ikutan buat nge-git ini, biar kekinian. URL Aplikasi ASAMURAT di GitHub :

https://github.com/akhwan90/asamurat



Terima kasih...


Template Website...? Ya, ini adalah sebuah bahasa Inggris. Menurut kamus besar bahasa google 4 juta milliar (teringat kamus bahasa inggris SMP-ku dulu 4 milliar, loh gan) itu arti dari kata “Template” sendiri adalah “Contoh” (diakses pada tanggal 20/04/2013, pukul 09.41). Nah loh, gak begitu nyambung, yak. Ane cari lagi, di google, arti kata template, buat menemukan arti sebenarnya yang mudah dimengerti dari kata template ini.  Nah, akhirnya dapet yang begitu nyambung, arti dari template website adalah sebuah desain tampilan halaman  dengan berisikan dokumen file model-model tambahan yang dikodekan dalam bahasa program dan siap pakai.


Itu kiranya pengertian template website. Klo ane ambil kesimpulan dari setiap ane membikin template adalah : membuat desain tampilan sebuah halaman web utama/utuh, yang dalam penggunaannya nanti ada salah satu bagian yang akan diisi oleh konten-konten dari website atau intinya bagian tertentu itu berubah-ubah... (kira-kira begitu, komandan). Lihat gambar dibawah ini :
Tapi dalam konteks ini, sesuai judulnya, kita akan memanfaatkan sebuah framework CSS Twitter Bootstrap, yang pengertiannya sudah dijelaskan dalam bagian pertama bahasan ini. Insya Alloh, Twitter bootstrap ini sudah mengadopsi teknologi yang bersifat “responsive design”, HTML5, dan CSS3. 





Banyak cara mecari template website ini, salah satunya dengan mendownload template gratis yang banyak bertebaran di internet. Untuk akhir-akhir ini template yang paling populer adalah template yang bersifat “responsive design” atau template tersebut bisa menyesuaikan layar device user/pengunjungnya. Secara, hari gini, banyak orang yg mengakses lewat Smartphone, Tablet, Kapsul (eh.. ora, lho), Blackberry, dll (yang satupun ane kagak punya, lho gan.. HP ane, tipe Nokia 103 dan Motorolla WX-193, -- sebuah pengakuan jujur, lho ini, hahaha). Trus yang ngetren lagi yang sudah HTML5 dan CSS 3, yang merupakan teknologi pemrograman web statis saat ini (2013). Hehe. 

OK, langsung saja. Pada pembuatan website ini kita akan membuat template dengan 2 kolom utama (kolom 2: sidebar, klom 3: konten), header (nomor 1), footer (4), seperti gambar di bawah ini :



Kita akan membuat templatenya dengan menggunakan twitter bootstrapnya. Langsung saja, karena saya tidak menjelaskannya satu-persatu, panjang bener, gan.. sumpah, maka akan langsung saya sertakan dalam file download di bawah ini.

Simpan file tersebut dengan nama index.html. Nah jika dibuka, makan belum menghasilkan template jadi, melainkan hanya menampilkan tampilan acak-acakan dan gak beraturan. Itu karena file CSS dan Javascript dari Twitter bootstrapnya belum kita sertakan. Buatlah sebuah folder dengan nama “aset” yang berfungsi untuk menyimpan file CSS dan Javascript dari Twitter Bootstrapnya. 

Selanjutnya buka folder ekstrak’an dari hasil download Twitter bootstrapnya. Buka folder : 

“twitter-bootstraps/docs/assets/”, akan didapatkan 4 folder seperti ini : 


Untuk folder “img” itu banyak terdapat  file yang sebenarnya tidak perlu, nah kita hapus saja file tersebut. Buka folder “img” tersebut, dan hapus beberapa file, dan sisakan hanya file-file berikut ini (file-file image intinya twitter bootstrap):

Kemudian balik ke folder “assets” , dan copykan semua foldernya (css, ico, js, dan img) ke folder “aset” di folder template yang kita buat tadi. Ilustrasinya seperti ini :


Nah, sekarang buka file “index.html” tersebut, maka akan ditampilkan template kita sudah jadi, dan akan seperti ini :


Mungkin agak berbeda dengan punya saya. Ada gambar yang tak tampil, dan lain sebagainya. Untuk gambar, itu nanti bisa diperbaiki sendiri, yak. Trus mungkin berbeda dengan punya saya yang ada warna biru-birunya, itu karena punya saya sudah saya ubah sedemikian rupa di file “aset/css/bootstrap.css”-nya. OK, sekian dulu untuk bahasan untuk Pembuatan Template dengan framework CSS , Twitter Bootstrap kali ini, akan kita lanjutkan di bahasan selanjutnya, yaitu mengisikan template ke Codeigniternya. Hehehe..  Untuk file template jadinya, bisa didownload di link berikut ini :






Oh, hiya... Jangan lupa klo membutuhkan WEBSITE PROFIL, WEBSITE SEKOLAH, SISTEM INFORMASI atau APLIKASI LAIN YANG BERBASIS WEB, hubungi ane saja, gan. Hubungi saja lewat YM di samping, atau untuk respon cepat tanggap (kayak PMI) hubungi 085292747190, SMS OK, telpon OK...
Selamat sore pemiarsa. Salam semangat super.. (motivator style).. Lamo tak  jumpa dengan pengunjung setia blog saya tercinta ini, yak.. hahahaha. Yak, saya tidak akan lupa untuk memposting sesuatu di blog ini, karena saya telah berkomitmen, di tahun 2013 ini minimal 1 bulan ane harus posting 1 artikel di blog ini.. hahaha.. Komitmen lho, bukan nazarr kdi.. Yah, biar para pengunjung blog sekalian gak pada jeleh (orang nJowo bilang) atau bosan, postingannya kok masih-masih itu aja.. Namun kenyataannya kemarin bulan Januari aja cuma ada 2 postingan, itupun hanya postingan cerita seputar cerita Ngampus ane, melalui media Kartun Ngampus yang saat ini pupyulerr.... (minimal di kampus ane..). Download karakternya di blog ini (http://shirongampus.blogspot.com/), gan. Juga kemarin Januari merupakan bulan tersibuk ane (Boxing Day), di semester 7, dihadapkan pada kewajiban menyelesaikan Kerja Praktek (KP) beserta laporannya. Syukur, saat detik ini saya saya memposting tulisan ini Laporan KP sudah diseminarkan, disetujui, disahkan oleh dosen pembimbing dan kaprodi... hehehe... tinggal lanjudh, take off ke semester 8.. hahah.. (salam semangat super, buat fren-freen ane yang belum maju KP, di Teknik Informatika STMIK El Rahma Yogyakarta Angkatan 2009. hehehee...

OK, gan.. bek to topik, sesuai judul di atas, ane mo mosting tentang membuat website profil pribadi, dengan menggunakan Framework Codeigniter yang populer sangath jagad persilatan web programming. Untuk desain, website profil ini saya percayakan pada Twitter Bootstraap. Itu lho, gan, sebuah framework CSS, yang memudahkan kita untuk mendesain tampilan sebuah website. Singkatnya gitu.. lebih lanjutnya bisa klik link-nya disitu, atau klik disini, untuk mencari tutorialnya...

Untuk Codeigniternya, ane anggap pemiarsa semua udah pada paham, yak...? Intinya dalam membuat website kita sendirikan menjadi 3 sub bagian pokok, yaitu Model (pengambilan data dari database), View (tampilan website) dan Controller (proses-proses yang dilakukan).

Yang pertama sekali dalam membuat website dengan Codeigniter adalah mengatur konfigurasi website, yang pengaturannya dilakukan di file "application/config/config.php". Settingannya yang PALING UTAMA (minimal) adalah sebagai berikut :

17.   $config['base_url'] = 'http://localhost/web_sd/';
227. $config['encryption_key'] = 'super90';   

Penjelasan :
Baris (17.   $config['base_url'] = 'http://localhost/web_sd/';) digunakan untuk mengatur alamat root website yang kita buat. Dalam kasus ini, folder web Codeigniter saya saya beri nama "web_sd" dan saya letakkan di folder WWW (Wamp Server). Jadi kalau di tempat pemiarsa foldernya diberi nama beda dengan ini, maka konfigurasinya menjadi :

17. $config['base_url'] = 'http://localhost/nama_folder_web_anda/';
Baris (227. $config['encryption_key'] = 'super90';). Ini gini pemiarsa. Dalam website ini nantinya kan menggunakan yang namanya session. Nah, di Codeigniter (selanjutnya kita sebut CI, males ngetiknya), jika mengaktifkan session, maka settingan ini harus disetting. Valuenya bebas, terserah Anda, pemiarsa.

Itu untuk setting konfigurasi dasar website CI kita kali ini. Selanjutnya kita melangkah ke setting database-nya. Setting database ini dapat kita temui di file "application/config/database.php". Oh iya, jangan lupa buat database dulu dengan nama "web_sd". Selanjutnya settingannya yang PALING UTAMA, seperti ini pemiarsa :
51. $db['default']['hostname'] = 'localhost';   //sesuaikan dengan server MySQL Anda
52. $db['default']['username'] = 'root'; // username mysql Anda
53. $db['default']['password'] = ''; //password mysql Anda
54. $db['default']['database'] = 'web_sd'; // kita sepakati, buat database dengan nama "web_sd"
Untuk skrip import file SQLnya adalah sebagai berikut :


CREATE TABLE `admin` (
  `id` int(1) NOT NULL auto_increment,
  `u` varchar(15) NOT NULL,
  `p` varchar(15) NOT NULL,
  `nama` varchar(30) NOT NULL,
  `email` varchar(30) NOT NULL,
  `level` enum('1','2','3') NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `agenda` (
  `id` int(3) NOT NULL auto_increment,
  `tgl` date NOT NULL,
  `ket` varchar(255) NOT NULL,
  `tempat` varchar(255) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `berita` (
  `id` int(4) NOT NULL auto_increment,
  `judul` varchar(255) NOT NULL,
  `gambar` varchar(100) NOT NULL,
  `isi` mediumtext NOT NULL,
  `hits` int(4) NOT NULL,
  `tglPost` datetime NOT NULL,
  `kategori` varchar(75) NOT NULL,
  `oleh` varchar(30) NOT NULL,
  `publish` int(1) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=18 ;

CREATE TABLE `berita_komen` (
  `id` int(4) NOT NULL auto_increment,
  `id_berita` int(4) NOT NULL,
  `nama` varchar(100) NOT NULL,
  `email` varchar(100) NOT NULL,
  `komentar` varchar(250) NOT NULL,
  `tgl` datetime NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `data_guru` (
  `id` int(3) NOT NULL auto_increment,
  `nama` varchar(100) NOT NULL,
  `nip` varchar(30) NOT NULL,
  `mapel` varchar(50) NOT NULL,
  `jk` enum('L','P') NOT NULL,
  `alamat` varchar(200) NOT NULL,
  `foto` varchar(150) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `data_siswa` (
  `id` int(3) NOT NULL auto_increment,
  `nama` varchar(100) NOT NULL,
  `nis` varchar(30) NOT NULL,
  `kelas` enum('1','2','3','4','5','6','L') NOT NULL,
  `jk` enum('L','P') NOT NULL,
  `alamat` varchar(200) NOT NULL,
  `foto` varchar(150) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `galeri` (
  `id` int(4) NOT NULL auto_increment,
  `id_album` int(3) NOT NULL,
  `file` varchar(255) NOT NULL,
  `ket` varchar(255) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;

CREATE TABLE `galeri_album` (
  `id` int(3) NOT NULL auto_increment,
  `nama` varchar(100) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=4 ;


CREATE TABLE `haldep` (
  `isi` longtext NOT NULL,
  `id` int(1) NOT NULL auto_increment,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `link` (
  `id` int(3) NOT NULL auto_increment,
  `nama` varchar(150) NOT NULL,
  `alamat` varchar(150) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `pesan` (
  `id` int(4) NOT NULL auto_increment,
  `nama` varchar(100) NOT NULL,
  `email` varchar(100) NOT NULL,
  `pesan` varchar(200) NOT NULL,
  `tgl` datetime NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=5 ;

CREATE TABLE `poll` (
  `id` int(3) NOT NULL auto_increment,
  `tanya` varchar(255) NOT NULL,
  `op_1` varchar(200) NOT NULL,
  `op_2` varchar(200) NOT NULL,
  `op_3` varchar(200) NOT NULL,
  `op_4` varchar(200) NOT NULL,
  `j_1` int(3) NOT NULL,
  `j_2` int(3) NOT NULL,
  `j_3` int(3) NOT NULL,
  `j_4` int(3) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=MyISAM  DEFAULT CHARSET=latin1 AUTO_INCREMENT=2 ;

CREATE TABLE `profil` (
  `id` int(2) NOT NULL auto_increment,
  `judul` varchar(200) NOT NULL,
  `isi` longtext NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=3 ;

 Jadi kita membuat 9 tabel, yaitu sebagai berikut :
  1. admin : untuk menampung data username dan passwod login admin
  2. agenda : untuk menyimpan data agenda kegiatan sekolah
  3. berita : untuk menampung data berita website
  4. berita_komen : untuk menampung data komentar berita website
  5. data_guru : untuk menampung data guru
  6. data_siswa : untuk menampung data siswa
  7. galeri : untuk menyimpan data foto-foto di galeri foto
  8. galeri_album : untuk menyimpan data albumd alam galeri foto
  9. haldep : untuk menampung data page halaman beranda website
  10. link : untuk menyimpan data link atau tautan dari website
  11. pesan : untuk menampun data kontak masuk melalui web
  12. poll : untuk menampung data polling
  13. profil : untuk menampung data profil sekolah
OK, pemiarsa nampaknya ane untuk bagian 1 cukup sampe di sini, yak. Langkah yang sudah kita lakukan adalah :
  1. Mengatur konfigurasi website (file : "application/config/config.php")
  2. Mengatur konfigurasi database website (file : "application/config/database.php")
  3. Membuat database, dengan 9 tabel. Jika kesulitan meliat skrip SQL di atas, bisa didownload, DISINI. Pilih yang "web_sd.sql
Kita lanjutkan ke bagian ke-2 tutorial ini, yak pemiarsa, daripada kepanjangan tulisan, males bacanya.. hehehe.. Si yu neks taim... Ciyussss.. baaa....#GGMU...

LANJUTAN TUTORIAL INI , KLIK DISINI 

Oh, hiya... Jangan lupa klo membutuhkan WEBSITE PROFIL, WEBSITE SEKOLAH, SISTEM INFORMASI atau APLIKASI LAIN YANG BERBASIS WEB, hubungi ane saja, gan. Hubungi saja lewat YM di samping, atau untuk respon cepat tanggap (kayak PMI) hubungi 085292747190, SMS OK, telpon OK...
Tutorial ini merupakan lanjutan dari postingan sebelumnya yaitu  : Membuat Gallery Foto dengan PHP - Bag. 1  yang dulu katanya admin ada  lanjutannya, namun ternyata tidak dilanjutkan sama sekali.. :P haahahaa.. maklumlah, klu dulu tampilannya masih sangat aneh, dan minim animasi. Nah pada postingan kali ini adalah masih tentang membuat galeri dengan PHP, tapi dengan dengan embel-embel "dan jQuery Fancybox". Tahu FancyBox, kan, yak, itu, untuk menampilkan detail suatu gambar, dengan animasi jQuery (definisi menurut ane hahaaha).. contohnya adalah sebagai berikut :


Selain halaman depan, juga akan saya tambahkan halaman admin untuk galeri tersebut. Untuk struktur folder-foldernya adalah sebagai berikut :



 Untuk databasenya, buat database dengan nama "lab" :


CREATE TABLE `galeri` (
  `id` int(4) NOT NULL auto_increment,
  `file` varchar(200) NOT NULL,
  `kategori` int(2) NOT NULL,
  `keterangan` varchar(255) NOT NULL,
  `oleh` int(2) NOT NULL,
  `tgl` datetime NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=25 ;
CREATE TABLE `galerikategori` (
  `id` int(2) NOT NULL auto_increment,
  `nama` varchar(200) NOT NULL,
  PRIMARY KEY  (`id`)
) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=10 ;


Kemudian selanjutnya file "koneksi.php"

<?php
$h = "localhost";
$u = "root";
$p = "";
$db = "lab";
mysql_connect($h, $u, $p) or die ("Not connected, please try again later");
mysql_select_db($db);
//Fungsi Perkecil Ukuran Gambar //
//penggunaan ===> perkecil("img/siswa_1.JPG", "img/small/"); (folder/file, folder/folder/)
function perkecil($imgAsal, $imgTujuan) {
$pcImgAsal = explode("/", $imgAsal);
$jAr = count($pcImgAsal) - 1;
$namaFileAsli = $pcImgAsal[$jAr];
//identitas file asli
$im_src = imagecreatefromjpeg($imgAsal);
$src_width = imageSX($im_src);
$src_height = imageSY($im_src);
//Simpan dalam versi small 110 pixel
//set ukuran gambar hasil perubahan
$dst_width = 110;
$dst_height = ($dst_width/$src_width)*$src_height;
//proses perubahan ukuran
$im = imagecreatetruecolor($dst_width,$dst_height);
imagecopyresampled($im, $im_src, 0, 0, 0, 0, $dst_width, $dst_height, $src_width, $src_height);
//Simpan gambar
imagejpeg($im, $imgTujuan."_s_".$namaFileAsli);

imagedestroy($im_src);
imagedestroy($im);
}
?>
<html>
<head>
<script type="text/javascript" src="JS/jquery.min.js"></script>
<script type="text/javascript" src="JS/fancybox/jquery.fancybox.js"></script>
<script type="text/javascript" src="JS/fancybox/jquery.mousewheel.js"></script>
<link rel="stylesheet" type="text/css" href="JS/fancybox/jquery.fancybox.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
<title>Galeri dengan jQuery Fancybox</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="JS/tooltip.js"></script>

</head>
<body>
Selanjutnya file "index.php"

<div id="isi">
<h1>Galeri Foto</h1>
<p>
<?php
include "koneksi.php";
echo "<ul id='produk'>";
$QKategori = mysql_query("SELECT * FROM galerikategori");
while ($AKategori = mysql_fetch_array($QKategori)) {
$Kategori = $AKategori[0];
$QGetNamaKategori = mysql_query("SELECT nama FROM galerikategori WHERE id = '$Kategori'");
$AGetNamaKategori = mysql_fetch_array($QGetNamaKategori);
$QJumlahPerKategori = mysql_query("SELECT file FROM galeri WHERE kategori = '$Kategori'");
$JJumlahPerKategori = mysql_num_rows($QJumlahPerKategori);
$QGaleri = mysql_query("SELECT * FROM galeri WHERE kategori = '$Kategori' ORDER BY RAND()");
$AGaleri = mysql_fetch_array($QGaleri);
if ($JJumlahPerKategori == 0) {
echo "
<a href='#' onclick=\"javascript:alert('belum ada foto ..!')\" class='tooltip' title='$AGetNamaKategori[0]'>
<li class='lis-produk'>
<div class='isi'><img src='foto/no-image.jpg'></div>
</li>
</a>";
} else {
echo "
<a href='galeri_detil.php?kat=$Kategori' class='tooltip' title='$AGetNamaKategori[0]'>
<li class='lis-produk'>
<div class='isi'><img src='foto/$AGaleri[1]'></div>
</li>
</a>";
}
}
echo "</ul>";
?>
</p>
</div>

dan file "galeri_detil.php" :
<?php
include "koneksi.php";

$Kategori = $_GET['kat'];
$nKategori = mysql_fetch_array(mysql_query("SELECT nama FROM galerikategori WHERE id = '$Kategori'"));
?>
<div id="isi">
<h1>Galeri Foto | <?php echo $nKategori[0]; ?></h1>
<p>
<b><a href="index.php">Back to Gallery</a></b>
<div id="gallery" class="ad-gallery">
      <div class="ad-image-wrapper"></div>
      <div class="ad-controls"></div>
   
 <center>
 <div class="ad-nav">
        <div class="ad-thumbs">
          <ul id='produk'>
<?php
$QGaleri = mysql_query("SELECT * FROM galeri WHERE kategori = '$Kategori'");
while ($AGaleri = mysql_fetch_array($QGaleri)) {
?>
<li class="lis-produk">
<h3><?=$AGaleri[3]?></h3>
<a class="fancybox" href="foto/<?=$AGaleri[1]?>" data-fancybox-group="gallery" title="<?=$AGaleri[3]?>">
<img src="foto/<?=$AGaleri[1]?>" alt="">
</a>
</li>
            <?php } ?>
          </ul>
        </div>
      </div>
 </center>
</div>
</p>
</div>
</body>
</html> 
Selanjutnya membuat halaman admin, yang sengaja tidak saya beri autentifikasi atau proses login. Untuk membuat proses login dengan jQuery bisa dilihat di tutorial "membuat halaman login dengan jQuery".

Buat folder baru dengan nama admin, yang berisi 2 file :
1. index.php
<?php
include "../koneksi.php";
?>
<div id="isi">
<h1>Admin Galeri Foto</h1>
<?php
//variabel post
$p = $_GET['p'];
if ($p == "simpan_album") {
$QTambahKategori = mysql_query("INSERT INTO galerikategori VALUES ('', '".$_POST['kategori']."')");
if ($QTambahKategori) {
echo "<script>alert('Berhasil Ditambahkan'); window.open('index.php', '_self');</script>";
} else {
echo "<script>alert('Gagal Ditambahkan'); window.open('index.php', '_self');</script>";
}
}
//variabel Get
$mod = $_GET['mod'];
$id_kat = $_GET['id_kat'];
if ($mod == "del_kat") {
//hapus file

$QDelKategori = mysql_query("DELETE FROM galerikategori WHERE id = '$id_kat'");
$QDelGaleriKat = mysql_query("DELETE FROM galeri WHERE kategori = '$id_kat'");
if ($QDelKategori && $QDelGaleriKat) {
echo "<script>alert('Berhasil Dihapuskan'); window.open('index.php', '_self');</script>";
} else {
echo "<script>alert('Gagal Dihapus'); window.open('index.php', '_self');</script>";
}
} else if ($mod == "upload") {
$id_kat = $_POST['id_kat'];
$ket = $_POST['ket'];
//upload foto
$fileName = $_FILES['foto']['name'];
$fileSize = $_FILES['foto']['size'];
$fileError = $_FILES['foto']['error'];
$fileType = $_FILES['foto']['type'];
if ($fileType == "image/gif" || $fileType == "image/pjpeg" || $fileType == "image/jpeg") {
if (move_uploaded_file($_FILES['foto']['tmp_name'], '../foto/'.$fileName)) {
perkecil("../foto/$fileName", "../foto/");
mysql_query("INSERT INTO galeri VALUES ('', '$fileName', '$id_kat', '$ket', '0', now())");
}
echo "<script>alert('Berhasil Ditambahkan'); window.open('galeri_form.php?id_kat=".$_POST['kategori']."', '_self');</script>";
} else {
echo "<script>alert('Gagal Ditambahkan'); window.open('galeri_form.php?id_kat=".$_POST['kategori']."', '_self');</script>";
}
}
?>
<!-- End Box Head --> <div style="margin: 0 15px 0 15px">
<div id="tKategori">
<form action="?p=simpan_album" method="post" name="tmKategori" onsubmit="return cekNama();">
<input type="text" name="kategori" size="40" style="padding: 3px" placeholder="Isikan nama album" required>&nbsp;<input type="submit" value="Buat Kategori" name="tbKat" style="padding: 3px">
</form>
</div>
</div>
<div style="margin: 0 15px 0 15px">
<?php
$QKategori = mysql_query("SELECT * FROM galerikategori");
while ($AKategori = mysql_fetch_array($QKategori)) {
$Kategori = $AKategori[0];
$QGetNamaKategori = mysql_query("SELECT nama FROM galerikategori WHERE id = '$Kategori'");
$AGetNamaKategori = mysql_fetch_array($QGetNamaKategori);
$QJumlahPerKategori = mysql_query("SELECT file FROM galeri WHERE kategori = '$Kategori'");
$JJumlahPerKategori = mysql_num_rows($QJumlahPerKategori);
echo "
<div id='foto' style='background: #E3FFB5; padding: 5px; margin: 10px 0 10px 0; border: solid 1px #85C226; overflow: auto; width: 50%'>
<h3 style='font-size: 10px; font-weight: bold;'>$AKategori[1] ($JJumlahPerKategori foto) |
[ <a href='galeri_form.php?id_kat=$AKategori[0]'>Manajemen Kategori Foto</a> ] |
[ <a href='?p=galeri&mod=del_kat&id_kat=$Kategori' onclick=\"return konfirmasi('Menghapus Data ini - $Kategori - ')\">Hapus Kategori ini</a> ]
</h3>";
$QGaleri = mysql_query("SELECT * FROM galeri WHERE kategori = '$Kategori'");
$no = 1;
if ($JJumlahPerKategori == 0) {
echo "<font color='red'><b>Belum ada foto dalam kategori ini</b></font>";
} else {
while ($AGaleri = mysql_fetch_array($QGaleri)) {
echo "
<td align='center'>
<img src='../foto/_s_$AGaleri[1]' width='50px' height='50px' style='margin: 10px 10px auto; border: solid 3px #85C226'>
</td>";
$no++;
if ($no > 6 ) {
echo "</tr><tr>";
}
}
}
echo "</div><!--</tr></table><br>-->";
}
?>
</div>
</div> 

2. galeri_form.php
<?php
include "../koneksi.php";
$p = $_GET['p'];
$id_kat = $_GET['id_kat'];
$id_foto= $_GET['id_foto'];
$mod = $_GET['mod'];
if (empty($id_kat)) {
echo "<script>alert('Pilih dulu albumnya')</script>";
echo "<meta http-equiv='refresh' content='0;url=http:index.php'>";
}
$q_ket_kategori = mysql_query("SELECT * FROM galerikategori WHERE id = '".$id_kat."'");
$ket_kat = mysql_fetch_array($q_ket_kategori);
if ($p == "upload") {
$id_kat = $_POST['id_kat'];
$ket = $_POST['ket'];
//upload foto
$fileName = $_FILES['foto']['name'];
$fileSize = $_FILES['foto']['size'];
$fileError = $_FILES['foto']['error'];
$fileType = $_FILES['foto']['type'];
if ($fileType == "image/gif" || $fileType == "image/pjpeg" || $fileType == "image/jpeg") {
$QUpload = mysql_query("INSERT INTO galeri VALUES ('', '$fileName', '$id_kat', '$ket', '0', now())");
$move = move_uploaded_file($_FILES['foto']['tmp_name'], '../foto/'.$fileName);
perkecil("../foto/$fileName", "../foto/");
echo "<script>alert('Berhasil Ditambahkan'); window.open('galeri_form.php?id_kat=$id_kat', '_self');</script>";
} else {
echo "<script>alert('Gagal Ditambahkan'); window.open('galeri_form.php?id_kat=$id_kat', '_self');</script>";
}
} else if ($p == "del_foto") {
$getNamaFile = mysql_query("SELECT file FROM galeri WHERE id = '".$id_foto."'");
$aNamaFile = mysql_fetch_array($getNamaFile);
$q_del = mysql_query("DELETE FROM galeri WHERE id = '$id_foto'");
if ($q_del) {
$del_file1 = unlink("../foto/".$aNamaFile[0]);
$del_file2 = unlink("../foto/_s_".$aNamaFile[0]);
echo "<script>alert('Berhasil Dihapuskan'); window.open('galeri_form.php?id_kat=$id_kat', '_self');</script>";
} else {
echo "<script>alert('Gagal Dihapuskan'); window.open('galeri_form.php?id_kat=$id_kat', '_self');</script>";
}

}
?>
<div id="isi">
<h1>Upload foto pada : <?php echo $ket_kat['nama']; ?></h1>
<a href="index.php">Back To beranda</a>
<form name="fUploadGaleri" action="?p=upload&id_kat=<?=$id_kat?>" method="POST" enctype="multipart/form-data">
<input type="hidden" name="id_kat" value="<?php echo $id_kat; ?>">
<table>
<tr>
<td>File</td>
<td><input type="file" name="foto" size="10"> *HANYA tipe .GIF dan .JPEG</td>
</tr>
<tr>
<td>Keterangan</td>
<td><input type="text" name="ket" size="45" placeholder="Isikan keterangannya" required></td>
</tr>
<tr>
<td width="124">&nbsp;</td>
<td width="319"><input type="submit" name="tbUpload" value="kirim"></td>
</tr>
</table>
</form>
<hr>
<br>
<b>Daftar Foto dalam kategori ini</b><br>
<?php
$QJumlahPerKategori = mysql_query("SELECT file FROM galeri WHERE kategori = '".$id_kat."'");
$JJumlahPerKategori = mysql_num_rows($QJumlahPerKategori);
?>
<div id='foto' style='background: #E3FFB5; padding: 5px; margin: 10px 0 10px 0; border: solid 1px #85C226; overflow: auto; width: 50%'>
<h3 style='font-size: 10px; font-weight: bold;'><?=$ket_kat['nama']." ( ".$JJumlahPerKategori."  foto) | "?>
[ <a href="index.php?mod=del_kat&id_kat=<?=$id_kat?>" onclick="return konfirmasi('Menghapus Data ini - <?=$ket_kat['nama']?> - ')">Hapus Kategori ini</a> ]
</h3>
<?php
$QGaleri = mysql_query("SELECT * FROM galeri WHERE kategori = '$id_kat'");
if ($JJumlahPerKategori == 0) {
echo "<font color='red'><b>Belum ada foto dalam kategori ini</b></font>";
} else {
while ($AGaleri = mysql_fetch_array($QGaleri)) {
?>
<div style="float: left">
<img src='../foto/_s_<?=$AGaleri[1]?>' width='50px' height='50px' style='margin: 10px 10px auto; border: solid 3px #85C226'>
<a style="font-size: 12px; margin-left: 23px; display: block" href='?p=del_foto&id_kat=<?=$id_kat?>&id_foto=<?=$AGaleri[0]?>' title='Klik Untuk Menghapus Foto Ini' onclick="return confirm('Anda yakin akan menghapus Foto ini ? ')">Hapus
</a>
</div> <?php }
}
echo "</tr></div><!--</tr></table><br>-->";
?>
</div> 

Selanjutnya adalah membuat folder "foto" yang digunakan untuk menyimpan foto yang diupload, dan folder "JS" yang berisi file Javascript, seperti jQuery, dan plugin Fancybox.

Setelah, anda copy pastekan kode di atas (pastilah dicopy paste, kan....? :P, hehehe) jika berhasil akan menjadi seperti di halaman demo di bawah ini :


Nah, seperti itu, yak pemiarsa, sekian postingan dari saya, atas kunjungannya diucapkan terima kasih. 

Oh, iya sampe lupa, pastilah, penginnya tinggal copas skrip yang udah jadi ke localhost, yak... haahahahaha... ini, linknya, yak.. silakan disedottt di link di bawah ini :


[UPDATE - 10 SEPTEMBER 2014]
1. Demo program :
http://nur-akhwan.web.id/demo/blog/fancybox/

2. Database :
http://www.4shared.com/document/iKsXPkkFce/Database_-_blog_fancybox.html

3. Source Code :
http://www.4shared.com/rar/53WFpYLyce/Source_Code_-_blog_fancybox.html


*) PROMOSI JASA 
Jangan lupa klo membutuhkan website profil, website sekolah, sistem informasi, yang ada hubungannya dengan website, hubungi ane saja, gan. Hubungi saja lewat YM di samping, atau untuk respon cepat hubungi : 085292747190 (WA), 085643437024 (SMS), BB :  790d66d2.

Ini merupakan pengalaman pribadi saya, selama menggunakan WAMP Server, sebagai salah satu web server favorit saya, karena kemudahahan penggunaannya jika dibandingkan dengan XAMPP, Vertrigo dll. Salah satu kelemahan WAMP Server adalah bahwa server yang satu ini tidak bisa diakses di dalam jaringan LAN bila tetap dengan setting defaultnya. Artinya komputer  lain yang ada dalam satu jaringan tidak bisa mengakses file-file web, yang ada di web server kita Sebagai contoh :

1. Komputer saya : 192.168.0.123 (Computer name : "akhwan")
2. Komputer 1      : 192.168.0.124 ( Computer name : "kom1" )

Sebagai contoh dari "Komputer 1" akan mengakses komputer Saya dari browser Mozilla Firefox, otomatis akan mengetikkan "http://akhwan/" (mengakses alamat komputer dengan nama komputernya, bukan alamat IP-nya), maka akan menghasilkan pesan error "Forbiden" sebagaimana komputer berikut ini :
Pasti sama masalahnya dengan milik Anda yang memakai webserver WAMP, ya tidak..?

Setelah browsing sana dan sini, dari timur ke barat, selatan ke utara, saya mendapatkan jawabannya di blognya X-Code yaitu di http://blog.xcode.or.id/. Mudah saja, dan cukup singkat saja ternyata. Langsung saja, pemiarsa kick-off babak pertama :


1. Klik WAMP Manager TrayIcon Anda > Config File > httpd.conf

2. Akan muncul "http.conf" yang dibuka dalam notepad, berikut ini. :


Cari pada bagian :


<Directory />

    Options FollowSymLinks
    AllowOverride None
    Order deny,allow
    Deny from all
    Satisfy all
</Directory>
dan juga pada bagian :


#   onlineoffline tag - don't remove

    Order Deny,Allow
    Deny from all
    Allow from 127.0.0.1
</Directory>
Hapus sekrip :

Order Deny,Allow 
Deny from all

dan

Deny from all
Allow from 127.0.0.1


Sehingga menjadi :
<Directory />   
Options Follow
SymLinks    Allow
Override None    
Satisfy all
</Directory>

dan
#   onlineoffline tag - don't remove
    Order Deny,Allow
</Directory>


3. Selanjutnya Restart Apache Anda :

 4. Dan sekarang coba akses lagi komputer Anda dari komputer lain tersebut. Dan akhirnya,

JEGERRRRRRRR.... hasilnya akan seperti ini... :


6. Selesai, dan sekian dan terimakasih yang sebesar-sebesarnya... #http://nur-akhwan.blogspot.com/


Gelaran EURO 2012 memang sudah usai. Namun bagi saya masih menyisakan pertanyaan, yaitu tentang sebuah benda yang seringkali melayang-layang dilapangan, yang digantung pada tali, seperti kalau di desa dulu lampu petromaks, gitu. Hal lain lagi, adalah tampilan (view) siaran EURO pada layar kaca sangat keren sekali, pemiarsa. Seperti contohnya adalah saat pengambilan sepak pojok, seolah-olah ada sebuah kamera yang berdiri 1 meter di atas pemain dengan pergerakan gambar yang sangat halus. Jika dipikir, mana ada orang yang berani ngambil gambar sebegitu dekatnya, atau kalau kita berfikir itu adalah kamera di dalam helikopter, jelas tidak mungkin, karena pasti baling-balingnya nabrak penonton. Perhatikan gambar saat Andres Iniesta mengecoh 6 pemain Kroasia layaknya Captain Tsubasa di bawah ini :

Ataupun video murka-nya Kiriakos Papadopoulos pada Giorgios Samaras, saat striker Yunani tersebut membuat peluang manis Yunani berikut ini :
Setelah saya berowsing-berowsing sana-sini, ternyata keindahan pengambilan gambar di atas diperoleh berkat sebuah alat yaitu SPIDER CAM. Seperti ulasan situs ini (http://bisnis-jabar.com/) dikutip sesuai aslinya.
Pada perhelatan EURO 2012 di Polandia dan Ukraina, melalui siaran langsung di layar kaca, pecinta sepakbola di seantero dunia saat ini dapat menyaksikan duel tim-tim Eropa yang tidak hanya menarik dari sisi kualitas para pemainnya dan permainan bolanya.
Selama permainan bola berlansung, penonton yang melihat dari televisi dapat melihat view yang bergerak cepat dari atas lapangan kemudian bergerak ke arah pemain atau ke arah gawang maupun ke arah penonton dan pelatih, sehingga pemirsa seolah juga ikut bergerak.
Terkadang, terlihat tayangan gerakan sangat lambat dari aksi lihai para pemain saat mengecoh lawan ketika mengiring bola atau ekspresi para penonton di stadion. Teknologi high speed camera dari spidercam-lah yang membuat pemirsa bisa menyaksikan gerakan ultra slowmotion (sangat lambat).
Spider Cam di Final Liga Champion 2012
Spidercam adalah sistem yang memungkinkan film dan televisi kamera untuk bergerak baik secara vertikal dan horizontal di daerah yang telah ditentukan, biasanya lapangan olahraga seperti lapangan sepak bola atau lapangan tenis.
Nama Spidercam merupakan merek dagang. Pemiliknya sendiri juga bernama Perangkat spidercam digunakan untuk menghasilkan view tiga dimensi atau 3D dalam pertandingan. Spidercam merupakan perangkat kamera yang mampu bergerak tanpa dibatasi oleh kendala di atas tanah.
Cara Kerja Spider Cam

Operator Spider Cam
Sejarah Spider Cam 
Jens C. Peters, yang merupakan pendiri CCSytems Inc, dia lah yang mengembangkan sistem Spidercam. Perusahaan di Austria yang mulai pada tahun 2000 khusus untuk menciptakan sebuah sistem kabel-suspensi yang berfungsi sepenuhnya untuk perangkat kamera transportasi, yang mampu bergerak tidak hanya lateral atau horizontal di tanah, tetapi juga vertikal, sehingga memberikan penuh tiga dimensi sementara gerakan meliputi area yang luas baik di dalam ruangan serta luar ruangan, menggunakan komponen standar dan dapat diandalakan sebagai modul. Pengujian sistem pertama, yang berhasil diambil di sebuah aula besar di Carinthia, Austria pada tahun 2003. Pada tahun 2004 sistem ini digunakan untuk pertama kalinya pada produksi televisi di Austria. Pada tahun yang sama, Peters bekerja sama dengan perusahaan Jerman PMT Profesional Motion Teknologi GmbH, sebuah rumah disewa khusus untuk teknologi kamera gerak. Setelah beberapa modifikasi terinspirasi oleh PMT, maka Spidercam memasuki pasar. Pengunaan spidercam awalnya adalah untuk acara live seperti konser - Kylie Minogue di Australia, Robbie Williams di Inggris dan Polisi di Argentina - program televisi seperti Eurovision Song Contest di Yunani dan Finlandia, dan acara olahraga besar seperti Piala Eropa Renang di Hungaria, Red Bull X-Fighters di Meksiko dan Spanyol dan pertandingan sepak bola internasional. PMT juga menyediakan sistem untuk kamera film 35 mm. Sebuah pasangan baru, pengusaha dari Austria Herbert Neff, yang bergabung dengan Peters pada tahun 2007 dan sebuah perusahaan baru spidercam GmbH, didirikan. Karena hubungan bisnis, maka lebih lanjut telah diciptakan di sejumlah negara, seperti Inggris, Perancis, Portugal, Italia, Polandia, Tunisia, Australia dan Cina, yang menyediakan staf, dan peralatan lokal tahu bagaimana untuk produksi film dan siaran perusahaan di negara tersebut. Untuk memenuhi pertumbuhan permintaan untuk layanan spidercam, spidercam GmbH menawarkan lokakarya untuk operator prospektif, dengan tujuan menjamin kualitas tertinggi dan standar keselamatan. Spidercam Gmbh memiliki departemen teknik dalam rumah yang bekerja pada peningkatan spidercam dan mengembangkan aplikasi khusus untuk memenuhi permintaan pelanggan. Saat ini sedang dilakukan revisi pada sistem sepenuhnya dan baru, yang disebut spidercam MkII. 
Fitur Spider Cam 
Diadaptasi untuk mengangkat kamera film 35mm yang merupakan fitur spidercam dalam memenuhi tuntutan fitur yang khas film dan produksi komersial. Selain kekhasannya, spidercam efeknya juga dilengkapi dengan fungsi "playback": Rekam gerakan Anda dan yang memiliki sistem yang dapat mengulang sesering yang Anda suka. 
Spesifikasi
Winches Berat : 300 kg/660 1bs Dimensi : 1500 x 900x 800 mm / 59 x 32,2 x 53,3 pasokan daya yang diperlukan 400 V /32 A CEE (untuk masing-masing winch) Kecepatan : 8 m/s Perangkat kabel/ komposit kabel kevlar Panjang : 340 m / 1115 ft Area : 230 x 230 m / 754 x 754 ft Ketegangan kabel maksimal : 100 kg / 220 lb Break point : 1200 kg / 2640 lbs Keamanan : 12 x dolly berat : 25 kg / 66 lb (without camera) power supply: 4 li-ion batteries remotehead Pan : kecepatan 60°/s, 360° tanpa akhir Tilt : kecepatan 120°/s, +90°, -100° kamera compact 35mm kamera film, contohnya : Arri 235 kamera digital yang memiliki resolusi tinggi, contohnya : RED one model selanjutnya berdasarkan permintaan! lensa: memasang prim dan perbesaran angle pada lensa berdasarkan permintaan kontrol-desk: footprint: minimal 2 x 3 m / 6,6 x 10 ft power supply: 230V/10A 
Jenis-Jenis SpiderCam (Ni petunjuk klo yang mau beli 29.000 Euro katanya) 
Spidercam®HD-STUDIO 
Dirancang untuk instalasi indoor atau dalam ruangan, terutama untuk acara TV dan produksi studio lainnya, spidercam yang HD-STUDIO menyediakan semua keuntungan dari sistem yang lebih besar sementara memiliki emisi kebisingan yang lebih rendah dan dikurangi ukurannya. Studio Kompak dan menunjukkan dengan penonton hidup sangat memanfaatkan fitur-fitur dari spidercam yang HD-STUDIO. 
Spidercam®HD-LAPANGAN 
Ditujukan untuk instalasi outdoor atau luar ruangan, seperti stadion dan lapangan atau daerah peristiwa besar, tetapi juga untuk studio besar, tahap suara atau arena dalam ruangan dan tempat lainnya, yang spidercam HD-LAPANGAN mencakup sebuah daerah yang luas dan dirancang untuk memberikan gerakan panjang di atas penonton, lapangan bermain atau tahap tentu saja dengan khas spidercam wow-efek. 
Namun ternyata teknologi ini, belum digunakan secara maksimal dalam membantu keputusan wasit dalam menentukan terjadinya gol, apakah sudah melewati garis gawang atau belum, seperti pada pertandingan Inggris vs Ukraina, "penyelamatan gemilang" John Terry di bawah mistar, terlihat dalam kamera bola sudah melewati garis gawang, namun wasit, memutuskan tidak gol...
Super Save by John Terry
Sumber :