<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>arif.suparlan.com &#187; Programming</title>
	<atom:link href="http://arif.suparlan.com/category/programming/feed" rel="self" type="application/rss+xml" />
	<link>http://arif.suparlan.com</link>
	<description>Just another WordPress weblog</description>
	<lastBuildDate>Tue, 31 Jan 2012 15:38:37 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Script untuk Tahun Copyright di Footer</title>
		<link>http://arif.suparlan.com/2011/12/07/script-untuk-tahun-copyright-di-footer?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=script-untuk-tahun-copyright-di-footer</link>
		<comments>http://arif.suparlan.com/2011/12/07/script-untuk-tahun-copyright-di-footer#comments</comments>
		<pubDate>Wed, 07 Dec 2011 04:03:12 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[copyright]]></category>
		<category><![CDATA[footer]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[tahun]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=535</guid>
		<description><![CDATA[Hehehe, hal yang remeh banget nih. Ya, untuk catatan saya saja, supaya ga tiap tahun ngedit footer website, karena tahunnya sudah kelewat lawas. Kenapa ga dari dulu ya? Hehehe&#8230; sebenernya sudah kepikiran lama, cuman males aja ngubahnya. Langsung saja, di &#8230; <a href="http://arif.suparlan.com/2011/12/07/script-untuk-tahun-copyright-di-footer">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Hehehe, hal yang remeh banget nih. Ya, untuk catatan saya saja, supaya ga tiap tahun ngedit footer website, karena tahunnya sudah kelewat lawas. Kenapa ga dari dulu ya? Hehehe&#8230; sebenernya sudah kepikiran lama, cuman males aja ngubahnya.<span id="more-535"></span></p>
<p>Langsung saja, di footer ada yang namanya Copyright notice. Di situlah ada yang disebut, misalnya -katakanlah tahun pembuatan. Kemudian supaya website seolah-olah sering diupdate, letakkan juga tahun saat ini. Kalo misalnya saya hanya tampilkan tahun pembuatan, misalnya 2005. Wah keliatannya website ini sudah sangat jadul. Seperti ini:</p>
<pre>Copyright © 2005-2009 <a href="http://www.suparlan.com/">Suparlan.com</a>, v.7. All rights reserved.</pre>
<p>Wah ini webmasternya pemalas banget ya&#8230; woi ini udah 2011 lahh&#8230; Siapa sih adminnya?</p>
<p>Ya ya yaa&#8230; Gini aja solusinya kita pake tahun dinamik, ngikutin tahun server. Gampang bukan? Banget!!! Mari pasang di footer WordPress dah.</p>
<pre>&lt;?php
$etdy = '2005';
echo sprintf('Copyright &amp;copy; %s &lt;a href="%s"&gt;%s&lt;/a&gt;, v.7.',
(date("Y")==$etdy) ? $etdy : $etdy.' - '.date("Y"),
'http://www.suparlan.com',
'Suparlan.com' );
?&gt; All rights reserved.</pre>
<p>Ya ya cupu abis. Hahaha&#8230;</p>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2011/12/07/script-untuk-tahun-copyright-di-footer/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Codeigniter: Pagination Helper dengan URI Associative Array untuk Parameter Tambahan</title>
		<link>http://arif.suparlan.com/2011/11/13/codeigniter-pagination-helper-dengan-uri-associative-array-untuk-parameter-tambahan?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=codeigniter-pagination-helper-dengan-uri-associative-array-untuk-parameter-tambahan</link>
		<comments>http://arif.suparlan.com/2011/11/13/codeigniter-pagination-helper-dengan-uri-associative-array-untuk-parameter-tambahan#comments</comments>
		<pubDate>Sun, 13 Nov 2011 05:01:52 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[codeigniter]]></category>
		<category><![CDATA[pagination]]></category>
		<category><![CDATA[paging]]></category>
		<category><![CDATA[parameter]]></category>
		<category><![CDATA[query string]]></category>
		<category><![CDATA[segmented uri]]></category>
		<category><![CDATA[uri associative array]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=487</guid>
		<description><![CDATA[Pagination library dari Codeigniter sederhana dan sangat mudah digunakan. Tapi gimana caranya kalau kita mau nambah parameter tambahan lainnya seperti filter atau search di antara paging tersebut? Bisa pake query string! Gimana kalo pake URI bersegmennya CI biar rapi? Ga &#8230; <a href="http://arif.suparlan.com/2011/11/13/codeigniter-pagination-helper-dengan-uri-associative-array-untuk-parameter-tambahan">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><a href="http://codeigniter.com/user_guide/libraries/pagination.html" target="_blank">Pagination library dari Codeigniter</a> sederhana dan sangat mudah digunakan. Tapi gimana caranya kalau kita mau nambah parameter tambahan lainnya seperti filter atau search di antara paging tersebut? Bisa pake query string! Gimana kalo pake URI bersegmennya CI biar rapi? Ga dibahas di user_guide nya nih. Dan entah kenapa, saya lebih suka menyebutnya &#8220;Paging&#8221;.<span id="more-487"></span></p>
<p>Kita pake fitur <a href="http://codeigniter.com/user_guide/libraries/uri.html" target="_blank">URI dan Associative Array</a>, sudah pernah pake sebelumnya? Gampang, dengan &#8220;uri_to_assoc&#8221; kita bisa dapatkan parameter dalam bentuk array dari uri bersegmen dan &#8220;assoc_to_uri&#8221; untuk sebaliknya. Tinggal pelajari user_guide aja.</p>
<pre>index.php/user/search/name/joe/location/UK/gender/male</pre>
<pre>[array]
 (
 'name' =&gt; 'joe'
 'location' =&gt; 'UK'
 'gender' =&gt; 'male'
 )</pre>
<p>Cobain dulu <a href="http://arif.suparlan.com/demo/paging_assoc/" target="_blank">demonya di sini</a>.</p>
<p>Pertama, buat helper dengan nama paging_assoc_helper.php, trus simpan di folder helper. Bisa <a href="http://arif.suparlan.com/demo/paging_assoc/paging_assoc_helper.php.txt" target="_blank">copas di sini</a>.</p>
<pre>&lt;?php if (!defined('BASEPATH')) exit('No direct script access allowed.');

    function paging_assoc($varkey, $assoc_n=3)
    {
        $CI =&amp; get_instance();

        $qs_arr = $CI-&gt;uri-&gt;uri_to_assoc($assoc_n);
        $qs_tmp_arr=array();
        foreach($qs_arr as $key =&gt; $value)
            if ($key!=$varkey) $qs_tmp_arr[$key]=$value;

        foreach($CI-&gt;uri-&gt;segment_array() as $key =&gt; $value)
            if ($value=='p') $assoc_n = $key;

        $offset = (isset($qs_arr[$varkey])) ? $qs_arr[$varkey] : 0;
        $qs_uri = $CI-&gt;uri-&gt;assoc_to_uri($qs_tmp_arr).'/'.$varkey;

        return array(
            'offset' =&gt; $offset,
            'seg' =&gt; $assoc_n+1,
            'uri' =&gt; $qs_uri,
            );
    }</pre>
<p>Kemudian buat sebuah controller, atau untuk ngetes, replace saja welcome.php controller. Jangan lupa load library dan helper yang diperlukan. Cara penggunaannya kira-kira seperti ini:</p>
<pre>        //get paging settings, uri, segments, and offset
        //input param paging variable key, init segment
        $pg_arr = paging_assoc('p', 3);</pre>
<p>Tidak begitu rumit, helper ini sebenarnya hanya untuk mendapatkan URI tambahan, segmen untuk paging yang baru, dan offset untuk LIMIT. Scriptnya sudah dites beberapa kali, tapi tidak menutup ada bug. Silakan kalau ada yang mau diperbaiki.</p>
<pre>    public function index()
    {
        //$this-&gt;load-&gt;view('welcome_message');

        //load db, paging lib, some helpers
        $this-&gt;load-&gt;database();
        $this-&gt;load-&gt;library(array('pagination'));
        $this-&gt;load-&gt;helper(array('url', 'paging_assoc', 'form'));

        //get paging settings, uri, segments, and offset
        //input param paging variable key, init segment
        $pg_arr = paging_assoc('p', 3);
        if (isset($_POST['search']))
            redirect('/welcome/index/s/'.$_POST['search']);

        //other parameters
        $assoc_arr = $this-&gt;uri-&gt;uri_to_assoc(3);
        $s = (isset($assoc_arr['s'])) ? $assoc_arr['s'] : '';

        if ($s) $this-&gt;db-&gt;like('text', $s);
        $query = $this-&gt;db-&gt;get('test2');
        $num_rows = $query-&gt;num_rows();

        $paging['base_url'] = site_url().'/welcome/index/'.$pg_arr['uri'];
        $paging['total_rows'] = $num_rows;
        $paging['uri_segment'] = $pg_arr['seg'];
        $paging['per_page'] = 2;
        $this-&gt;pagination-&gt;initialize($paging);

        echo form_open('');
        echo 'Filter: '.form_input('search', (($s) ? $s : 'a'));
        echo form_submit('mysubmit', 'Submit');
        echo form_close();
        echo $this-&gt;pagination-&gt;create_links().'&lt;br&gt;';

        if ($s) $this-&gt;db-&gt;like('text', $s);
        $this-&gt;db-&gt;limit($paging['per_page'], $pg_arr['offset']);
        $query = $this-&gt;db-&gt;get('test2');

        foreach ($query-&gt;result() as $row)
        {
            echo $row-&gt;id.' '.$row-&gt;text.'&lt;br&gt;';
        }
    }</pre>
<p>Dan ini contoh data MySQL nya;</p>
<pre>CREATE TABLE IF NOT EXISTS `test2` (
  `id` int(11) NOT NULL AUTO_INCREMENT,
  `text` varchar(255) NOT NULL,
  `status` int(11) NOT NULL,
  PRIMARY KEY (`id`)
) ENGINE=InnoDB  DEFAULT CHARSET=latin1 AUTO_INCREMENT=37 ;

INSERT INTO `test2` (`id`, `text`, `status`) VALUES
(1, 'croissant', 1),
(2, 'dessert', 0),
(3, 'gummi bears', 1),
(4, 'caramels', 1),
(5, 'candy canes', 0),
(6, 'fruitcake', 1),
(7, 'lollipop', 0),
(8, 'jelly-o macaroon', 1),
(9, 'fruitcake', 1),
(10, 'chocolate bar', 0),
(11, 'sesame snaps', 1),
(12, 'jelly beans', 1),
(13, 'jelly-o', 0),
(14, 'donut', 1),
(15, 'applicake', 0),
(16, 'chupa chups', 1),
(17, 'apple pie', 0),
(18, 'cheesecake', 0),
(19, 'pastry', 1),
(20, 'pudding', 1),
(21, 'marshmallow', 0),
(22, 'cookie', 0),
(23, 'croissant', 1),
(24, 'bonbon', 1),
(25, 'gingerbread', 0),
(26, 'tiramisu', 1),
(27, 'toffee', 0),
(28, 'caramels', 0),
(29, 'halvah', 1),
(30, 'sweet roll macaroon', 0),
(31, 'wafer', 1),
(32, 'brownie', 1),
(33, 'ice cream', 0),
(34, 'sugar plum', 1),
(35, 'jujubes', 0),
(36, 'biscuit', 1);</pre>
<p>Selamat mencoba.</p>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2011/11/13/codeigniter-pagination-helper-dengan-uri-associative-array-untuk-parameter-tambahan/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Shell Script untuk membackup database MySQL</title>
		<link>http://arif.suparlan.com/2011/04/05/shell-script-untuk-mem-backup-database-mysql?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=shell-script-untuk-mem-backup-database-mysql</link>
		<comments>http://arif.suparlan.com/2011/04/05/shell-script-untuk-mem-backup-database-mysql#comments</comments>
		<pubDate>Tue, 05 Apr 2011 16:15:32 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[backup]]></category>
		<category><![CDATA[cron]]></category>
		<category><![CDATA[mysql]]></category>
		<category><![CDATA[sh]]></category>
		<category><![CDATA[shell]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=331</guid>
		<description><![CDATA[Menurut saya cara membackup MySQL yang paling baik yaitu dengan membuat mirrornya yang selalu di-sync. Tetapi ini bukan bahasan tentang itu kali ini. Cara yang lebih cepat adalah dengan menggunakan perintah mysqldump. Lalu bagaimana kalo membackup banyak database secara rutin? &#8230; <a href="http://arif.suparlan.com/2011/04/05/shell-script-untuk-mem-backup-database-mysql">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Menurut saya cara membackup MySQL yang paling baik yaitu dengan membuat mirrornya yang selalu di-sync. Tetapi ini bukan bahasan tentang itu kali ini. Cara yang lebih cepat adalah dengan menggunakan perintah mysqldump. Lalu bagaimana kalo membackup banyak database secara rutin? Gampang saja, buat shell scriptnya.<span id="more-331"></span></p>
<p>Sebagai catatan saya, shell script ini sangat membantu untuk membackup database MySQL. Selain praktis untuk di-cron, juga ada fitur untuk merotasi backup, contoh di bawah, menyimpan 7 backup yang terakhir, sehingga bisa menghemat space juga. Scriptnya cukup mudah untuk newbi seperti saya.</p>
<p>Sebelum membuat shell scriptnya, buat dulu satu user di MySQL yang nanti akan digunakan untuk membackup dari script shell ini. Privilegenya ga perlu dihantam semua, lebih baik dibatasi minimal seperti ini:</p>
<pre>SELECT, INDEX, SHOW DATABASES, CREATE TEMPORARY TABLES, LOCK TABLES, SHOW VIEW</pre>
<p>Berikut contoh shell scriptnya:</p>
<pre>#!/bin/bash
#config
NOW=$(date +"%Y%m%d-%H%M%S")
#mysql
MYSQLUSER="user"
MYSQLPASS="password"
MYSQLHOST="localhost"
MYSQL="$(which mysql)"
MYSQLDUMP="$(which mysqldump)"
#local backup
FOLDER="/mysql"
DIRBAK="/home/backup/backup_files"$FOLDER
DIRBAKTEMP="/temp"
BAKFILENAME="backup_mysql.gz"
#compression
GZIP="$(which gzip)"
TAR="/bin/tar"

echo ""
echo "ROTATING FOLDERS..."
echo "--------------------------------------------------------"
rm -rf $DIRBAK/07_old
[ -d $DIRBAK/06 ] &amp;&amp; mv $DIRBAK/06 $DIRBAK/07_old
[ -d $DIRBAK/05 ] &amp;&amp; mv $DIRBAK/05 $DIRBAK/06
[ -d $DIRBAK/04 ] &amp;&amp; mv $DIRBAK/04 $DIRBAK/05
[ -d $DIRBAK/03 ] &amp;&amp; mv $DIRBAK/03 $DIRBAK/04
[ -d $DIRBAK/02 ] &amp;&amp; mv $DIRBAK/02 $DIRBAK/03
[ -d $DIRBAK/01 ] &amp;&amp; mv $DIRBAK/01 $DIRBAK/02
mkdir -p $DIRBAK/01/
mkdir -p $DIRBAK$DIRBAKTEMP/
echo "Done."

echo ""
echo "PERFORMING MYSQL BACKUP..."
echo "--------------------------------------------------------"
DBS="$($MYSQL -u $MYSQLUSER -h $MYSQLHOST -p$MYSQLPASS -Bse 'show databases')"
SKIPDBS="test test01 "

for db in $DBS
do
	skipdb=-1
	if [ "$SKIPDBS" != "" ]; then
		for i in $SKIPDBS
		do
			[ "$db" == "$i" ] &amp;&amp; skipdb=1 || :
		done
	fi

	if [ "$skipdb" == "-1" ] ; then
		DIRMYSQL=$DIRBAK/01/$db.$NOW.gz
		echo "DB Backup:" $db $DIRMYSQL
		$MYSQLDUMP -u $MYSQLUSER -h $MYSQLHOST -p$MYSQLPASS $db | $GZIP -9 &gt; $DIRMYSQL
	fi

	if [ "$skipdb" == "1" ] ; then
		echo "DB Backup Skipped:" $db
	fi
done
echo "Done."

echo ""
echo "PERFORMING COMPRESSION..."
echo "--------------------------------------------------------"
DIRS2="$DIRBAK/01/"
cd $DIRS2
DIRFILES2=$DIRBAK$DIRBAKTEMP/$BAKFILENAME
echo "Backup:" $DIRFILES2
$TAR cvf $DIRFILES2 *.*
echo "Done."
</pre>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2011/04/05/shell-script-untuk-mem-backup-database-mysql/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Downgrade ke PHP 5.2 di CentOS 5.5</title>
		<link>http://arif.suparlan.com/2011/04/04/downgrade-ke-php-5-2-di-centos-5-5?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=downgrade-ke-php-5-2-di-centos-5-5</link>
		<comments>http://arif.suparlan.com/2011/04/04/downgrade-ke-php-5-2-di-centos-5-5#comments</comments>
		<pubDate>Mon, 04 Apr 2011 09:51:34 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Free/Open Source]]></category>
		<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[centos]]></category>
		<category><![CDATA[php]]></category>
		<category><![CDATA[yum]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=375</guid>
		<description><![CDATA[Ada satu alasan yang jelas untuk tetap menggunakan PHP 5.2 dibandingkan dengan versi baru 5.3, yaitu karena beberapa fungsi telah ditiadakan di versi 5.3 sedangkan sistem-sistem lama masih banyak yang menggunakannya. Ini daftar fungsi-fungsi yang sudah dihilangkan, dan kebanyakannya masih &#8230; <a href="http://arif.suparlan.com/2011/04/04/downgrade-ke-php-5-2-di-centos-5-5">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Ada satu alasan yang jelas untuk tetap menggunakan PHP 5.2 dibandingkan dengan versi baru 5.3, yaitu karena beberapa fungsi telah ditiadakan di versi 5.3 sedangkan sistem-sistem lama masih banyak yang menggunakannya. Ini daftar <a href="http://php.net/manual/en/migration53.deprecated.php" target="_blank">fungsi-fungsi yang sudah dihilangkan,</a> dan kebanyakannya masih sangat penting digunakan dibeberapa sistem.<span id="more-375"></span></p>
<p>Saya sendiri masih menggunakan/membangun sistem yang berdasarkan framework Codeigniter 1.7.2. yang kalau dijalankan di PHP 5.3 langsung ngadat. Selain itu kebanyakan hosting pun mau ga mau harus tetap dengan versi PHP 5.2. Jadi kalau membangun sebuah server ada baiknya untuk mempertimbangkan versi mana yang akan dipakai.</p>
<p>Kalau di server Debian/Ubuntu bisa dibilang mudah, mungkin karena sudah terbiasa dan di repositorinya, PHP versi 5.2 masih disupport, jadi instalasi bisa langsung lancar-lancar aja. Kebetulan server yang sekarang sedang digunakan adalah CentOS 5.5 jadi agak ribet, selain belum biasa, juga harus tau menggunakan command yum, dan harus ngecek repo yang masih ada PHP 5.2-nya.</p>
<p>Tapi ternyata ga susah-susah amat. Saya oprek-oprek sepertinya ini ada dua cara, atau tiga kalo mau lebih. Tulisan ini untuk catatan saya, silakan koreksi kalau ada yang salah.</p>
<p>Cara pertama dengan menggunakan repo dari Zend. Pertama-tama pastikan sudah tidak ada lagi instalasi PHP versi baru. Kalau masih ada dihilangkan saja.</p>
<pre>yum remove php*.*</pre>
<p>Kemudian buka yum.conf untuk meng-exclude-kan segala yang berbau php-5.3 di konfigurasi yum.</p>
<pre>vim /etc/yum.conf</pre>
<p>Tambahkan line berikut menghindari yum untuk menginstal atau me-list yang berkaitan dengan php-5.3.</p>
<pre>exclude=php-5.3*, mod-php-5.3*, zend-server-php-5.3*</pre>
<p>Kemudian buat file repo dengan nama <code>zend.repo</code></p>
<pre>vim /etc/yum.repos.d/zend.repo</pre>
<p>Isi dengan ini:</p>
<pre>[Zend]
name=Zend Server
baseurl=http://repos.zend.com/zend-server/rpm/$basearch
enabled=1
gpgcheck=0
[Zend_noarch]
name=Zend Server - noarch
baseurl=http://repos.zend.com/zend-server/rpm/noarch
enabled=1
gpgcheck=0</pre>
<p>Setelah itu langsung install saja dengan perintah berikut:</p>
<pre>yum install zend-server-php-5.2</pre>
<p>Saya pikir ini cara yang paling cepat dan sederhana, yum langsung menginstall semua yang berkaitan dengan php-5.2. Gampang kan? Ya mudah-mudahan dengan cara tadi langsung beres.</p>
<p>Cara kedua, sebenernya sama saja, cuma ini menggunakan <a href="http://www.jasonlitka.com/yum-repository/" target="_blank">repo yang lain lagi</a>. Tetap dengan meng-exclude-kan php-5.3, buat file repo seperti berikut:</p>
<pre>vim /etc/yum.repos.d/utterramblings.repo</pre>
<p>Isikan dengan ini:</p>
<pre>[utterramblings]
name=Jason's Utter Ramblings Repo
baseurl=http://www.jasonlitka.com/media/EL$releasever/$basearch/
enabled=1
gpgcheck=1
gpgkey=http://www.jasonlitka.com/media/RPM-GPG-KEY-jlitka</pre>
<p>Lihat list repo php yang ada, kemudian install paket yang ada beserta extension-extensionnya:</p>
<pre>yum list php

yum install php php-xmlrpc php-imap php-mhash php-mbstring php-mysql
php-xml php-gd php-openssl php-exif php-mcrypt php-soap</pre>
<p>Sedangkan cara yang ketiga, harus download dulu source php-5.2 di php.net, kemudian dikompil. Install dulu tools untuk mengompil sourcenya.</p>
<pre>yum install php-devel
yum install httpd-devel
yum install libxml2-devel
yum install mysql-devel</pre>
<p>Download source php-5.2</p>
<pre>wget http://id.php.net/distributions/php-5.2.17.tar.gz</pre>
<p>Extract file sourcenya, kemudian masuk ke foldernya:</p>
<pre>tar -zxvf php-5.2.17.tar.gz
cd php-5.2.17</pre>
<p>Jalankan proses kompil:</p>
<pre>./configure --with-apxs2=/usr/sbin/apxs --with-mysql=/usr/local
--with-zlib-dir=/usr --with-mysql=/usr/local --with-kerberos=/usr --enable-cli
--enable-exif --enable-mbstring --enable-mbregex --enable-sockets
--with-curl --with-openssl=/usr --with-xmlrpc --with-xsl=/usr --with-pear
--with-iconv --with-gd --with-jpeg-dir=/opt/local --with-png-dir=/opt/local
--with-freetype-dir=/opt/local

make install</pre>
<p>&nbsp;</p>
<p>&nbsp;</p>
<div id="_mcePaste" class="mcePaste" style="position: absolute; left: -10000px; top: 0px; width: 1px; height: 1px; overflow: hidden;">menggunakannya</div>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2011/04/04/downgrade-ke-php-5-2-di-centos-5-5/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Download Youtube Video dengan Shell Script V2</title>
		<link>http://arif.suparlan.com/2011/02/23/download-youtube-video-dengan-shell-script?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=download-youtube-video-dengan-shell-script</link>
		<comments>http://arif.suparlan.com/2011/02/23/download-youtube-video-dengan-shell-script#comments</comments>
		<pubDate>Wed, 23 Feb 2011 16:52:07 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Free/Open Source]]></category>
		<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[bash]]></category>
		<category><![CDATA[grep]]></category>
		<category><![CDATA[regex]]></category>
		<category><![CDATA[sh]]></category>
		<category><![CDATA[shell]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[wget]]></category>
		<category><![CDATA[youtube]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=344</guid>
		<description><![CDATA[Aplikasi yang dibuat mas Trio ini (You2Pup) ini adalah aplikasi di Puppy Linux untuk mendownload video dari Youtube. Beberapa hari lalu baru diupdate dengan menggunakan shell script yt-download.sh, padahal script itu lumayan cupu. Jadi ini yang ngebuat saya jadi iseng &#8230; <a href="http://arif.suparlan.com/2011/02/23/download-youtube-video-dengan-shell-script">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Aplikasi yang dibuat <a href="http://www.murga-linux.com/puppy/viewtopic.php?p=326803#326803" target="_blank">mas Trio ini (You2Pup)</a> ini adalah aplikasi di Puppy Linux untuk mendownload video dari Youtube. Beberapa hari lalu baru diupdate dengan menggunakan <a href="http://arif.suparlan.com/2010/07/30/download-youtube-video-dengan-shell-script-update" target="_blank">shell script yt-download.sh</a>, padahal script itu lumayan cupu. Jadi ini yang ngebuat saya jadi iseng ngoprek-ngoprek lagi.<span id="more-344"></span></p>
<p>Sama seperti aplikasi pendownload youtube yang lain, script yt-download yang lama masih bisa dijalankan mulus. Tapi, bedanya, dia hanya mendownload salah satu video saja (defaultnya), sementara di Youtube, satu video ada berbagai macam ukuran dan format. Ide dari mas Trio, di script yang baru, saya coba tambahkan beberapa fitur.</p>
<p>Shell ini masih sederhana seperti yang lama, hanya jauh lebih banyak barisnya. Ga jauh beda, cuma memanfaatkan fungsi-fungsi regular expression dan string manipulation untuk mendapatkan url video, format, dan ukuran. Variable tersebut ada di source html youtube dengan key &#8220;PLAYER_CONFIG&#8221; yang berupa array JSON. Dengan mendapatkan nilai &#8220;fmt_url_map&#8221; dan &#8220;fmt_map&#8221; sudah cukup menghasilkan url video, format, dan ukurannya. Kalo shell bisa ngebaca JSON, mungkin akan lebih mudah untuk parsingnya.</p>
<p>Script yt-download.sh bisa <a href="http://arif.suparlan.com/demo/yt-download/yt-download.sh.txt" target="_blank">didownload di sini</a>.</p>
<p><strong>Change log</strong></p>
<p>v2.32 &#8211; 2012-01-31</p>
<ul>
<li>Fixed: Youtube&#8217;s format changed, reported by Abdulla. PLAYER_CONFIG to playerConfig, line 54-55.</li>
<li>Changed: Added tmp file with timestamp, and deleted as soon as it is processed, to prevent write problems.</li>
</ul>
<p>v2.3 &#8211; 2011-08-29</p>
<ul>
<li>Fixed: Youtube&#8217;s format changed. url_encoded_fmt_stream_map &amp; fmt_list.</li>
<li>Fixed: Youtube&#8217;s url changed. Url decoded, remove some parameters, added &#8216;title&#8217; parameter.</li>
</ul>
<p>v2.2</p>
<ul>
<li>Fixed: Youtube&#8217;s url changed. Remove o-o.preferred.matrix-cgk1</li>
<li>Fixed: Youtube&#8217;s url changed. \u0026 replaced with &amp;.</li>
<li>Fixed: array sorting problem.</li>
</ul>
<p>v2.1</p>
<ul>
<li>Added: input for save directory, and some error handling if directory&#8217;s not found. (Thanks to Trio).</li>
<li>Added: abort option. (Thanks to Trio).</li>
<li>Added: wget parameter. (Thanks to Trio).</li>
<li>Added: new video format webm. Format list: flv, mp4, 3gp, and webm.</li>
<li>Changed: parsing algorithm based on Dougal&#8217;s Shell script. (Thanks to Dougal). But problem with array sorting.</li>
</ul>
<p>v2.0</p>
<ul>
<li>Added: automatic file naming based on page title.</li>
<li>Added: some error handling.</li>
<li>Added: allow user to choose available size and format. Format list: flv, mp4, and 3gp.</li>
<li>Changed: parsed portion. JSON array from youtube HTML source provides various video format. (Thanks to Trio).</li>
<li>Reported: problem with title and &#8220;/&#8221; character. Tested with Debian/Ubuntu &amp; Puppy, no problem.</li>
</ul>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2011/02/23/download-youtube-video-dengan-shell-script/feed</wfw:commentRss>
		<slash:comments>18</slash:comments>
		</item>
		<item>
		<title>Codeigniter Helper untuk Modular Extensions-HMVC</title>
		<link>http://arif.suparlan.com/2011/02/20/codeigniter-helper-untuk-modular-extensions-hmvc?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=codeigniter-helper-untuk-modular-extensions-hmvc</link>
		<comments>http://arif.suparlan.com/2011/02/20/codeigniter-helper-untuk-modular-extensions-hmvc#comments</comments>
		<pubDate>Sun, 20 Feb 2011 10:41:00 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[codeigniter]]></category>
		<category><![CDATA[helper]]></category>
		<category><![CDATA[hmvc]]></category>
		<category><![CDATA[matchbox]]></category>
		<category><![CDATA[modular extentions]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=335</guid>
		<description><![CDATA[Di Codeigniter 1.72 saya menggunakan Matchbox untuk modular extention. Dengan Matchbox, saya bisa mengatur applikasi yang saya buat menjadi komponen-komponen terpisah atau secara modular. Sekarang Codeigniter sudah versi 2, sementara Matchbox sudah tidak pernah disentuh lagi oleh pembuatnya. Akhirnya saya &#8230; <a href="http://arif.suparlan.com/2011/02/20/codeigniter-helper-untuk-modular-extensions-hmvc">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Di Codeigniter 1.72 saya menggunakan <a href="http://codeigniter.com/wiki/Matchbox/" target="_blank">Matchbox</a> untuk modular extention. Dengan Matchbox, saya bisa mengatur applikasi yang saya buat menjadi komponen-komponen terpisah atau secara modular. Sekarang <a href="http://codeigniter.com/" target="_blank">Codeigniter</a> sudah versi 2, sementara Matchbox sudah tidak pernah disentuh lagi oleh pembuatnya. Akhirnya saya pake <a href="http://codeigniter.com/wiki/Modular_Extensions_-_HMVC/">Modular Extensions &#8211; HMVC</a> atau ME-HMVC untuk Codeigniter.<span id="more-335"></span></p>
<p>Di bawah ini adalah helper untuk ME-HMVC, dibuat berdasarkan <a href="http://codeigniter.com/forums/viewthread/82622/" target="_blank">Philip Sturgeon&#8217;s Matchbox helper</a>,  dengan sedikit perubahan minor. Masih kasar, belum ditest semua, untuk catatan saja supaya ga lupa.</p>
<pre>
&lt;?php if (!defined('BASEPATH')) exit('No direct script access allowed.');

function module_directories() {
    return Modules::$locations;
}

function module_array() {
    $module_arr = array();

    foreach (module_directories() as $key=&gt;$value)
    {
        foreach(glob($key.'*', GLOB_ONLYDIR) as $module)
        {
            array_push($module_arr, array('module'=&gt;basename($module), 'path'=&gt;$key));
        }

    }

    return $module_arr;
}

function is_module($module) {
    if(!$module) return FALSE;
    foreach (module_directories() as $key=&gt;$value)
    {
        if (is_dir($key.basename($module))) {
            return TRUE;
        }
    }

    return FALSE;
}

?&gt;
</pre>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2011/02/20/codeigniter-helper-untuk-modular-extensions-hmvc/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Menambahkan First &amp; Last Class pada Menu UL LI</title>
		<link>http://arif.suparlan.com/2010/10/16/menambahkan-first-last-class-pada-menu-ul-li?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=menambahkan-first-last-class-pada-menu-ul-li</link>
		<comments>http://arif.suparlan.com/2010/10/16/menambahkan-first-last-class-pada-menu-ul-li#comments</comments>
		<pubDate>Fri, 15 Oct 2010 19:46:14 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[menu]]></category>
		<category><![CDATA[Wordpress]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=302</guid>
		<description><![CDATA[Salah satu yang menarik perhatian di WordPress 3 adalah penambahan fitur untuk pengaturan menu. Sama seperti wp_page_menu, fungsi wp_nav_menu akan menghasilkan menu dalam bentuk list (ul/li). Untuk keperluan styling CSS, saya ingin menambahkan property first &#38; last di dalam class &#8230; <a href="http://arif.suparlan.com/2010/10/16/menambahkan-first-last-class-pada-menu-ul-li">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Salah satu yang menarik perhatian di WordPress 3 adalah penambahan fitur untuk pengaturan menu. Sama seperti <code>wp_page_menu</code>, fungsi <code>wp_nav_menu</code> akan menghasilkan menu dalam bentuk list (ul/li). Untuk keperluan styling CSS, saya ingin menambahkan property first &amp; last di dalam class untuk li yang pertama dan yang terakhir. <span id="more-302"></span></p>
<p>Perubahan ini diperlukan supaya styling CSS dengan mudah menandakan menu pertama dan menu terkahir. Meskipun dapat dengan mudah untuk mengatur menu, sayangnya fitur ini tidak membedakan property class tiap menunya. Mungkin diversi berikutnya.</p>
<p>Ini hasil keluaran fungsi <code>wp_nav_menu</code>:</p>
<pre>&lt;ul id="main_nav" class="menu"&gt;
&lt;li id="menu-item-1" class="menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 1&lt;/a&gt;&lt;/li&gt;
&lt;li id="menu-item-2" class="menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 2&lt;/a&gt;&lt;/li&gt;
&lt;li id="menu-item-3" class="menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 3&lt;/a&gt;&lt;/li&gt;
&lt;li id="menu-item-4" class="menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 4&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</pre>
<p>Tujuannya untuk merubah seperti berikut:</p>
<pre>&lt;ul id="main_nav" class="menu"&gt;
&lt;li id="menu-item-1" class="first menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 1&lt;/a&gt;&lt;/li&gt;
&lt;li id="menu-item-2" class="menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 2&lt;/a&gt;&lt;/li&gt;
&lt;li id="menu-item-3" class="menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 3&lt;/a&gt;&lt;/li&gt;
&lt;li id="menu-item-4" class="last menu-item-type-post_type"&gt;&lt;a href="#"&gt;Menu 4&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;</pre>
<p>Penambahan class=&#8221;first dan class=&#8221;last ini dapat dilakukan oleh proses preg_replace. Berikut contoh sederhana script PHP dan penggunaannya.</p>
<pre>function add_li_first_last($str, $echo=TRUE, $ul=TRUE)
{
  $str = str_replace("\r\n", "", $str);

  //strip ul
  preg_match('/&lt;ul(.*?)&gt;/i', $str, $matches);
  $inul = $matches[1];
  $str = preg_replace('/&lt;ul(.*?)&gt;/i', '', $str);
  $str = str_replace("&lt;/ul&gt;", "", $str);

  //insert first
  $str = preg_replace('/^&lt;li(.*?)class=\"/i', '$0first ', $str);
  //insert last
  $str = preg_replace('/&lt;li(.*)class=\"(.*)$/i', '&lt;li$1class="last $2', $str);

  $str = str_replace("&lt;/li&gt;", "&lt;/li&gt;\r\n", $str);

  if ($ul)
    $str = '&lt;ul '.$inul.' &gt;'.$str.'&lt;/ul&gt;';

  if ($echo)
    echo $str;
  else
    return $str;
}

add_li_first_last(wp_nav_menu($args), TRUE);</pre>
<p>Fungsi ini perlu ditest beberapa kali untuk hasil outout <code>wp_nav_menu</code> yang berbeda-beda. CMIIW &#8211; <a href="http://arif.suparlan.com/demo/li_first_last/" target="_blank">Demo</a>.</p>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2010/10/16/menambahkan-first-last-class-pada-menu-ul-li/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Selamat Hari Programer</title>
		<link>http://arif.suparlan.com/2010/09/09/selamat-hari-programer?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=selamat-hari-programer</link>
		<comments>http://arif.suparlan.com/2010/09/09/selamat-hari-programer#comments</comments>
		<pubDate>Thu, 09 Sep 2010 01:42:19 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[hari programer]]></category>
		<category><![CDATA[programmers day]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=295</guid>
		<description><![CDATA[Di Rusia hari Programer atau Programmer&#8217;s Day sudah menjadi hari libur resmi sejak disetujui oleh pemerintah Rusia 2009 lalu. Hari programer ini dirayakan setiap hari ke-256 setiap tahunnya, biasanya akan jatuh pada tanggal 12 atau 13 September. Tahun ini Programmer&#8217;s &#8230; <a href="http://arif.suparlan.com/2010/09/09/selamat-hari-programer">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Di Rusia hari Programer atau Programmer&#8217;s Day sudah menjadi hari libur resmi sejak disetujui oleh pemerintah Rusia 2009 lalu. Hari programer ini dirayakan setiap hari ke-256 setiap tahunnya, biasanya akan jatuh pada tanggal 12 atau 13 September. Tahun ini Programmer&#8217;s Day jatuh pada tanggal 13. <span id="more-295"></span></p>
<p>Kenapa harus di Rusia saja? Ini seharusnya, menurut saya juga harus diperingati diseluruh dunia. Ya, mungkin profesi programer di Rusia jauh lebih dihargai kali ya. Terus, gimana nasib programer seculun saya? yang bisanya hanya buat program yang tidak berguna.</p>
<p>Nah, seperti <a href="http://arif.suparlan.com/2010/07/31/happy-sysadmin-day-hari-apresiasi-system-administrator">SysAdmin Day tempo hari</a>, saya pun sudah iseng menyiapkan fungsi yang intinya hanya sebaris saja untuk menentukan kapan hari Programmer. Fungsi yang sangat tidak berguna, jadinya <a href="http://arif.suparlan.com/demo/programmers_day/" target="_blank">seperti ini</a>.</p>
<pre>&lt;?php
echo 'This year: '.when_programmer_day(date("Y")).'&lt;br /&gt;';
echo 'Next year: '.when_programmer_day(date("Y")+1).'&lt;br /&gt;';

function when_programmer_day($year)
{
 //256th day of the year
 return date("l, F j, Y", mktime(0, 0, 0, 1, 256, $year));
}
?&gt;
</pre>
<p>Selamat Hari Programer buat semua para programer!!!</p>
<p>[<a href="http://en.wikipedia.org/wiki/Programmer%27s_day" target="_blank">wikipedia.org</a>]</p>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2010/09/09/selamat-hari-programer/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Ucapan Selamat Lebaran untuk para Geek</title>
		<link>http://arif.suparlan.com/2010/09/08/ucapan-selamat-lebaran-untuk-parageek?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=ucapan-selamat-lebaran-untuk-parageek</link>
		<comments>http://arif.suparlan.com/2010/09/08/ucapan-selamat-lebaran-untuk-parageek#comments</comments>
		<pubDate>Wed, 08 Sep 2010 06:01:15 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[idul fitri]]></category>
		<category><![CDATA[selamat lebaran]]></category>
		<category><![CDATA[ucapan lebaran]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=284</guid>
		<description><![CDATA[Hari ini ID facebook saya ditag di gambar oleh seorang teman. Menjelang Idul Fitri, memang sering banyak yang nge-tag untuk ngucapin selamat Lebaran. Gambar ucapan Lebaran yang satu ini agak sedikit berbeda, lebih kreatif dari yang lain. Gambarnya didesain sendiri &#8230; <a href="http://arif.suparlan.com/2010/09/08/ucapan-selamat-lebaran-untuk-parageek">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Hari ini ID facebook saya ditag di gambar oleh seorang teman. Menjelang Idul Fitri, memang sering banyak yang nge-tag untuk ngucapin selamat Lebaran. Gambar ucapan Lebaran yang satu ini agak sedikit berbeda, lebih kreatif dari yang lain.<span id="more-284"></span></p>
<p>Gambarnya didesain sendiri bertema glossy/candy. Menggambarkan button keyboard &#8220;Ctrl + A&#8221; dan &#8220;Del&#8221;, kemudian dibawahnya bertuliskan &#8220;Sucikan diri di bulan suci Ramadhan. Selamat Hari Raya Idul Fitri. Mohon Maaf Lahir Batin&#8221;.</p>
<p style="text-align: center;"><img class="aligncenter" title="moses_lebaran" src="http://arif.suparlan.com/wp-content/uploads/2010/09/moses_lebaran-300x225.jpg" alt="" width="300" height="225" /></p>
<p>Itu gambarnya yang dibuat teman saya, seorang web designer. Kesannya kita dengan mudah menghapus semua dosa-dosa kita digambarkan dengan kombinasi tombok &#8220;Ctrl-A&#8221; dan &#8220;Del&#8221;.</p>
<p>Saya sebagai seorang Programmer, punya cara tersendiri untuk mengucapkan Mohon Maaf Lahir Batin. Begini ucapan saya:</p>
<pre>&lt;?php
// Bila dosa dan kesalahan di dalam sebuah variable array,
$dosa = array(
 'dendam',
 'dengki',
 'iri',
 'benci',
 'caci',
 'maki',
 'amarah',
 'bohong',
 ...
);

// Maka dihari yang suci ini mari kita sama mengosongkan variable tersebut.
$dosa = 0;

// SELAMAT HARI RAYA IDUL FITRI 1431H. MOHON MAAF LAHIR DAN BATIN
// Mohon maaf atas segala bugs, baik itu berupa error maupun warning.
print_r($dosa); // Alhamdulillah sudah kosong
?&gt;</pre>
<p>Atau untuk yang biasa dengan command-command Linux:</p>
<pre>history -c |grep -e sins -e mistakes
#Happy Eid ul-Fitr. Minal Aidzin Wal Faidzin.</pre>
<p>Btw, Selamat Lebaran semuanya <img src='http://arif.suparlan.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /> . Mohon maaf lahir batin.</p>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2010/09/08/ucapan-selamat-lebaran-untuk-parageek/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Resize gambar proporsional &amp; posisi tengah dengan CSS &amp; Javascript (Update)</title>
		<link>http://arif.suparlan.com/2010/08/18/resize-proporsional-posisi-center-dengan-css-javascript?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=resize-proporsional-posisi-center-dengan-css-javascript</link>
		<comments>http://arif.suparlan.com/2010/08/18/resize-proporsional-posisi-center-dengan-css-javascript#comments</comments>
		<pubDate>Wed, 18 Aug 2010 15:16:46 +0000</pubDate>
		<dc:creator>Arif</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Iseng]]></category>
		<category><![CDATA[Programming]]></category>
		<category><![CDATA[Tutorial]]></category>
		<category><![CDATA[center]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[image]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[overflow hidden]]></category>
		<category><![CDATA[resize]]></category>
		<category><![CDATA[scale]]></category>
		<category><![CDATA[skala]]></category>

		<guid isPermaLink="false">http://arif.suparlan.com/?p=259</guid>
		<description><![CDATA[Saya hampir gila mencoba me-resize dan memposisikan tengah beberapa gambar di dalam div yang mempunyai property overflow: hidden. Terlalu berlebihan ya? hehehe&#8230; Tapi memang sulit. Ukuran gambar tersebut berbeda-beda, portrait atau landscape, yang jelas dia lebih besar dari ukuran div &#8230; <a href="http://arif.suparlan.com/2010/08/18/resize-proporsional-posisi-center-dengan-css-javascript">Continue reading <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Saya hampir gila mencoba me-<em>resize </em>dan memposisikan tengah beberapa gambar di dalam <em>div </em>yang mempunyai <em>property overflow: hidden</em>. Terlalu berlebihan ya? hehehe&#8230; Tapi memang sulit. Ukuran gambar tersebut berbeda-beda, portrait atau landscape, yang jelas dia lebih besar dari ukuran div itu. Saya belum bisa ngakalinnya bermodalkan CSS saja.<span id="more-259"></span></p>
<p>Meskipun mentok dengan CSS, saya akhirnya ngakalin dengan bantuan Javascript. Dengan memanfaatkan Javascript saya bisa untuk merubah ukuran dan posisi gambar secara dinamis. Bisa lebih dari itu sih, tapi untuk pemula seperti saya ini bisa sangat membantu melayout halaman.</p>
<p>Dulu saya pernah buat script untuk <a href="http://arif.suparlan.com/2009/09/11/resize-crop-gambar-proporsional-di-codeigniter" target="_blank">Resize &amp; crop gambar dengan Codeigniter</a>. Nah script ini memakai hitung-hitungan yang sama. Kalau Codeigniter kalkulasinya oleh PHP di sisi server, yang ini di sisi client/browser. Cara ini bisa dipermudah dengan menggunakan framework Javascript. Saya belum coba, tapi kalau ada cara yang lebih mudah lagi, mohon dipost di sini. Makasih.</p>
<p>Di bawah berikut kira-kira contoh scriptnya. Kedua gambar yang berukuran besar dengan orientasi yang berbeda, portrait dan landscape ini saya letakkan sebagai icon dalam div dengan property overflow hidden. Prosesnya mudah, tetapi agak panjang, yaitu membandingkan rasio dua ukuran untuk menentukan orientasi kemudian me-resize dan menghitung posisi tengah. Ini contohnya: <a href="http://arif.suparlan.com/demo/resize_position_center/" target="_blank">Demo</a>.</p>
<pre>&lt;html&gt;
&lt;head&gt;
 &lt;title&gt;Resize proporsional &amp; posisi center dengan Javascript&lt;/title&gt;
&lt;style type="text/css"&gt;
.test {
 border:1px solid;
 margin-top:100px;
 margin-left:250px;
 width:150px;
 height:150px;
 overflow: hidden;
 float: left;
}

.test img {
}

&lt;/style&gt;

&lt;script type="text/javascript"&gt;
 window.onload = function() {
 var $images = document.getElementsByTagName('img');
 $x=150;
 $y=150;

 for($i=0; $i&lt;$images.length; $i++)
 {
 $new_size = resize_min($images[$i].width, $images[$i].height, $x, $y);

 $images[$i].style.width = $new_size[0];
 $images[$i].style.height = $new_size[1];
 $images[$i].style.marginLeft = -(($new_size[0]-$x)*.25) + "px";
 $images[$i].style.marginTop = -(($new_size[1]-$y)*.25) + "px";
 }

 function resize_min($x0, $y0, $x1, $y1) {
 $xs=$x0/$x1;
 $ys=$y0/$y1;

 if ($ys&gt;$xs){
 $x2 = $x1;
 $y2 = $x1 * ($y0/$x0);
 }
 else {
 $x2 = $y1 * ($x0/$y0);
 $y2 = $y1;
 }

 return [$x2, $y2];
 }
 }
&lt;/script&gt;

&lt;/head&gt;
&lt;body&gt;
&lt;h1&gt;Resize proporsional &amp; posisi center dengan Javascript&lt;/h1&gt;

&lt;div&gt;
 &lt;img src="img01.jpg" /&gt;
&lt;/div&gt;
&lt;div&gt;
 &lt;img src="img02.jpg" /&gt;
&lt;/div&gt;

&lt;/body&gt;
&lt;/html&gt;</pre>
<p>Update berikut untuk penggunaan dengan jQuery. Ada beberapa tambahan script untuk mengukur dimensi ketika dalam keadaan gambar hidden.</p>
<pre>$(document).ready(function() {
 $('img').each(function() {
 var x = 150;
 var y = 150;
 var ratio = x/y;

 if ($(this).height() &gt; 0) {
 var width = $(this).width();
 var height = $(this).height();
 } else {
 var elem_clone = $(this).clone()
 .attr("id", false)
 .css({visibility:"hidden", display:"block", position:"absolute"});
 $("body").append(elem_clone);
 var width = elem_clone.width();
 var height = elem_clone.height();
 elem_clone.remove();    
 }

 $new_size = resize_min(width, height, x, y);

 $(this).css("width", $new_size[0]);
 $(this).css("height", $new_size[1]);
 $(this).css("marginLeft", -(($new_size[0]-x)*.5) + "px");
 $(this).css("marginTop", -(($new_size[1]-y)*.5) + "px");
 });
 });</pre>
]]></content:encoded>
			<wfw:commentRss>http://arif.suparlan.com/2010/08/18/resize-proporsional-posisi-center-dengan-css-javascript/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

