While scrolling ups and downs trying to digest the content, I noticed that there are left and right navigational buttons which are statically positioned. So even when I scrolled all the way up or down, the buttons will remain at the same position.

I totally bought this very good idea. I realized that this help the readers alot. They did not need to comb through the page to find the previous/next buttons.

Then I looked back at this very own blog’s navigational links. To my dismay, they are now looks totally unacceptable

So, I want to make this blog navigational buttons statically positioned too. But then I remember, visitors to this blog are not all using 24″ wide flat screen. To validate my suspicion, I logged in to Google Analytics and look at the visitors’ browser information.

Aha! Many of this blog’s visitors are still using resolution with 1024 pixels of width. Considering that this blog requires at least 960 pixels, I need to ensure that this changes only affect those visitors that have enough free pixels on the left and right side for the links. For that very reason, I can’t do the modification on the WordPress’ template. Hence, jQuery is the only way to go.

In summary, the jQuery script will do the following steps:

1. get the width of browser’s window.
2. if have enough space for the links, then set the links into fixed position and then hide the links’ original container.
3. if not, check whether the links’ container is hidden. If hidden, make it visible and move the links inside
4. repeat step 1,2,3 when the window is resized

To implement this, I need to firstly modify the navigational links in my template’s index.php and single.php.

index.php

<div class="navigation"  id="divPostNav">
	<div id="divPrev" class="left">
		<h3><?php next_posts_link(__('&laquo; Previous Entries', 'pyrmont_v2')); ?></h3>
	</div>
	<div id="divNext" class="right">
		<h3><?php previous_posts_link(__('Next Entries &raquo;', 'pyrmont_v2')); ?></h3>
	</div>
	<div class="clear"></div>
</div>

single.php

<div class="post" id="divPostNav">
	<div class="navigation">
	<div id="divPrev" style="width:50%" class="left">
		<h3><?php previous_post_link('%link','&lt;&lt; %title'); ?></h3>
	</div>
	<div id="divNext" style="width:50%; text-align:right;" class="right">
		<h3><?php next_post_link('%link','%title &gt;&gt;'); ?></h3>
	</div>
	<div class="clear"></div>
 </div>

Next, I need to add the following script to footer.php

if (jQuery)
{
	/* obtain jQuery instance */
	$sdv = jQuery.noConflict();

	/* ensure the links look & feel consistent */
	var formatLink = function(strEl){
		var pEl = $sdv(strEl);
		if (pEl.length>0) {
			pEl.children().children().css('color','#ccc');
			pEl.children().children().hover(
				function(){$sdv(this).css('color','#E1771E');},
				function(){$sdv(this).css('color','#ccc');}
			);
		}
	}
	formatLink("#divPrev");
	formatLink("#divNext");

	var fnModifyNavigation = function(){
		/* obtain window's width */
		var w = $sdv(window).width();
		var hw = (w-970)/2;
		if (hw>200)
		{
			/* we have enough space for the fixed postion links */
			jQFPL($sdv("#divPrev"),'left',0, hw);
			jQFPL($sdv("#divNext"),'right', 0, hw);
			$sdv("#divPostNav").hide();
		}
		else
		{
			/* not enough space for the fixed postion links */
			var divNav = $sdv("#divPostNav");
			if (divNav.length > 0) {
				if (divNav.css('display') == 'none')
				{
					divNav.show();
					divNav.prepend(jQSPL("#divNext", "right"));
					divNav.prepend(jQSPL("#divPrev", "left"));
				}
			}
		}
	}	

	/* jQuery Fixed Position Link */
	var jQFPL = function(el, remClass, absPosPX, width)
	{
		var pEl = el.detach();
		if (pEl) {
			pEl.removeClass(remClass);
			eval("var objStyle = { 'position':'fixed', 'top':'300px', 'width': '"
				+ width + "px', '" + remClass + "':'" + absPosPX+ "px', 'text-align':'"
				+remClass+"'};");
			pEl.css(objStyle);
			pEl.appendTo("body");
		}
	}

	/* jQuery Static Position Link*/
	var jQSPL = function(strEl, strFloat){
		var el = $sdv(strEl).detach();
		el.css('position','static');
		el.css('width','50%');
		el.css('float',strFloat);
		return el;
	}

	/* run position modification routine
		after the document is loaded */
	$sdv(fnModifyNavigation);	

	/* handle the window's resize event
		and run position modification routine again */
	$sdv(window).resize(fnModifyNavigation);
}

That’s all needed to make the prev/next navigational links statically positioned on the screen.

I hope it helps, cheers!

References

1. jQuery Selectors
2. jQuery CSS
3. jQuery DOM Manipulation
4. jQuery Events

Possibly Related Posts

• How to use jQuery in Your WordPress Post
• How to Prevent WordPress Loads jQuery Twice
• Using jQuery to Enhance Google Syntax Highligher WordPress Plugin

Today I want to share with you a very useful tool to instantly switch your Windows/Ubuntu hosts file. If you’re unfamiliar with the term ‘hosts file’, this WIKI should help.

Anyway, by using this tool you can immediately switch to a new hosts file, by at most two clicks of mouse (actually, it is one click and one double-clicks ). No installation needed, but you will need a full-write access to your hosts file.

Other than that, depending on your Operating System, you might need:

• Windows:
  • .Net framework 2.0 and upper.
• Linux:
  • Mono 1.2 and upper
  • root access
  • nscd Service
  • ifconfig commmand

Here is how the main interface looks like:

Really simple right?

Interested? You can visit and download it at: Host Profiles @ Codeplex . It’s FREE! And it’s open source too.

Have a great weekend everyone, Cheers!

Possibly Related Posts

• Foxit Reader on Ubuntu Linux (through Wine)
• Create Drag-and-Drog File Path Locator
• Reading CSV File with .NET

Sebetulnya saya ingin download semua data yang baru dan mengupdate semua blog post yang sudah ada, tapi kok kayaknya bakal makan waktu yang banyak ya . Maka saya memutuskan untuk membuat program yang bisa langsung dipakai di website ini, itung-itung sambil belajar Flex Programming.

Untuk bisa menjalankan program ini, Flash Player (minimal ver 10.2) diperlukan. Langkah untuk mengunduh data cukup singkat:

1. Pilih Propinsi
2. Pilih Kabupaten
3. Tekan Download button
4. Tunggu sampai download selesai, kemudian tekan Save As button
5. Pop-up window akan keluar, sekarang pilih lokasi untuk menyimpan file, dan tekan Save button

Semoga bisa membantu bapak/ibu guru sekalian

UPDATE

My apology Apparently Adobe Flash cannot download HTML file from other domain. That’s why the Flash form above doesn’t work. Let me find another way to download the latest Sertifikasi 2012 data.

I did a work around, by creating a cached proxy, here at sodeve.net. The proxy basically is a simple PHP’s curl method call. The cache will be refreshed daily.

UPDATE 23 Nov 2011

I just realized that my proxy didn’t set the expired header for the content retrieved. Thus, you may NOT get the latest data. So if you have ever dowloaded data from here, you NEED to clear your browser’s cache.

UPDATE 27 Dec 2011

1. Memperbaiki bug dimana halaman terakhir tidak diikutkan.
2. Memperlihatkan jumlah Kuota

PENTING: Untuk memastikan anda mendapatkan data terbaru, anda perlu membersihkan cache browser anda.

Possibly Related Posts

• Download Daftar Bakal Calon Peserta Sertifikasi Guru 2012 DKI Jakarta
• Download Daftar Bakal Calon Peserta Sertifikasi Guru 2012 Propinsi Bali
• Download Daftar Bakal Calon Peserta Sertifikasi Guru 2012 Propinsi GORONTALO

VirtualBox is a powerful x86 and AMD64/Intel64 virtualization product for enterprise as well as home use. Not only is VirtualBox an extremely feature rich, high performance product for enterprise customers, it is also the only professional solution that is freely available as Open Source Software under the terms of the GNU General Public License (GPL) version 2.

Between VMWare Workstation and VirtualBox, I prefer the later. Mainly because it’s free . It’s also sufficient to my need, which is pretty basic. I want to have a mini environment with a number of different database servers to test my application at home.

Anyway, the installation is really straight forward. Just by clicking Next buttons and Yes buttons, I think you should get your VirtualBox up and running.

Here are the screen captures for your viewing pleasure.

Possibly Related Posts

• Windows Oracle Clients Download
• Indonesia Won Global Enterprise Challenge (GEC) 2009
• Windows 8 x64 Developer Preview w/ developer tools is not working with VMWare Player

Anyway, let’s get started with project. Here are the tools needed: Paint.NET, ColorPic (color picker), and Junior Icon Editor.

Since it is very easy, I won’t go through the details. I’ll just give you these steps. I hope you can figure it out on your own.

1. Create a new Image in Paint.NET. The canvas must be in square shape. I usually use 200×200 size.
2. Use ColorPic to find out the color codes used on existing image.
3. Once image complete, start Junior Icon Editor. Create all the possible size combination (16×16, 24×24, 32×32, 48×48, 64×64)
4. On Paint.NET, resize the Image to 64×64, select All (Ctrl + A), Copy (Ctrl + C) the image
5. On Junior Icon Editor, select the 64×64 part, Paste (Ctrl + V) the image
6. Repeat above two steps for remaining sizes
7. On Junior Icon Editor, save the image as favicon.ico
8. Upload the favicon.ico to the root folder of your website / blog
9. …..
10. Profit?!??!

Once you’ve done above steps, you can test it whether it works. Below is the picture of SODEVE’s favicon.ico in various browsers:

I hope it helps Cheers!

Possibly Related Posts

• So You Like MS Paint? Here is the Free and Much much better Replacement
• An Even Better Quote of The Day for Your Website
• Here’s How to Add Quote of The Day into Your Website Instantly

Yes, IIS7 has an Application Request Routing extension. But since my public facing server is Windows 2003 Server, IIS7 was out.

Then I read Karl Seguin’s post on using NGINX to improve ASP.NET Performance. So I said to myself, let’s get dirty on this

My first step was to download VMWare Player. Why VMWare Player? Mainly because it’s free. You just need to register, activate VMWare account, then grab the installer.

Next step is to download Ubuntu Server VMWare image. Visit http://www.thoughtpolice.co.uk/vmware/ and grab a copy.

By now I believe you already run the Ubuntu server in VMWare Player.

1. Login as ‘notroot’. Password: ‘thoughtpolice’
2. Download Nginx source code. Command: wget http://nginx.org/download/nginx-1.0.4.tar.gz
3. Follow the following commands to extract the archive:
   1. gunzip nginx-1.0.4.tar.gz
   2. tar -xf nginx-1.0.4.tar
4. Follow the following commands to install the required runtime libraries:
   1. sudo -s
   2. apt-get update
   3. apt-get install gcc
   4. apt-get install libpcre3 libpcre3-dev
   5. apt-get install zlib1g-dev
   6. exit
5. Follow the following commands to build nginx:
   1. cd nginx-1.0.4
   2. ./configure
   3. sudo make install

By now you should have NGINX installed to /usr/local/nginx. You could now edit the configuration in /usr/local/nginx/conf/nginx.conf. If you’re not sure how, NGINX’s documentation have section with many examples on how to configure NGINX. Editing the .conf is done using vi, so iIf you’re unfamiliar with vi, you could read a simple intro here.

Have fun!

Possibly Related Posts

• Internet Explorer 9 (IE9) for Windows XP released today!!!

Today I am going to introduce you to SQLPal.
 

Installation

No installation needed! Just download the zip file and extract it at your convenience. You also need to have the latest JRE installed.

Important: If you get an error when connecting to Oracle you need to update the JDBC driver included with SQLpal. Find classes12.jar in your Oracle installation and copy the file over to your SQLpal directory, replacing the existing file.

Setting Up Oracle Connection

Click the ‘power-plug’ icon to initiate connection. It will ask you to provide:

1. User ID
2. Password
3. Oracle’s server host name
4. Oracle’s server port number
5. Oracle’s server System ID (SID)

If you don’t know what is your Oracle server’s SID, connect to Oracle using your existing tools, and run the following query:

select instance from v$thread

SQLPal is very simple yet sufficient. It has only four tabs:

1. SQL Prompt. This tab is pretty much like SQL*Plus with steroid. You can:
   1. run queries
   2. use Up / Down key to retrieve previous queries
   3. bookmark your queries (Bookmarks -> Bookmark last command …)
   4. export query result to Excel (by pressing the Excel icon)
2. Scratchpad. This tab is just like any other query editor. You can:
   1. load/save SQL file
   2. save query result as HTML
   3. export query result to Excel (by pressing the Excel icon)
3. Schema Browser. This tab will help you to see the details of every Oracle objects (Procedures, Packages, Functions, Tables, Views, Sequences, Synonims). Some objects are read-only (Tables, Views, Sequences, Synonims). But the rest are editable.
4. Research. This tab is basically a browser pointing to resources that might help you when you hit a stumbling block.

Try this tiny and efficient tools. I’m sure you going to like it very much!

Credit:

1. timewasteblog.com

Possibly Related Posts

• Oracle + IIS + ASP.NET Problem: Oracle client and networking components were not found
• Windows Oracle Clients Download
• Oracle + IIS + ASP.NET Problem: RESOLVED

The error window that she had was:

click Details to view the Exception:

To solve this issue, you need to do the following steps:

1. Remove the proxy settings (optional). There’s a chance that the your HTTP Proxy server is caching the outdated version of the applet
2. Clear your Java cache. Go to Control Panel – Java. click Settings, then click Delete Files.
3. Set JNLP File/MIME Association. In Java Cotrol Panel, click Advanced tab. Expand JNLP File/MIME Association. Select Promp User.

You should by now fixed the issue. When you launched the Java Application you should have the following prompt:

Click Run, and you are set to validate your Employment Income submission.

If it’s still not working, drop a comment and we’ll see what we can do .

Possibly Related Posts

• [Solved] Ext.Net.InitializationScriptNotFoundException: The Ext.NET initialization script was not found
• Oracle + IIS + ASP.NET Problem: Oracle client and networking components were not found
• Integrate Chatting to your existing Web Application

As Fred R. Barnyard said, ‘one picture is worth a thousand words’. Lo! And behold!

Possibly Related Posts

• COMIC: Thousand Words
• I Love Kompas

1. Oracle 11g Release 2 Client 32-bit 64-bit
2. Oracle 11g Release 1 Client 32-bit 64-bit
3. Oracle 10g Release 2 Client 32-bit 64-bit

If you’re looking for Oracle Client v. 9 and below, sadly it’s no longer available publicly at Oracle website. You can still call their sales rep and request for quotation though.

Possibly Related Posts

• Oracle + IIS + ASP.NET Problem: Oracle client and networking components were not found
• Oracle + IIS + ASP.NET Problem: RESOLVED
• How to Connect TOra to Oracle Database