Page 3 of 3

Autofit an image in a div using JQuery

I had a problem with one of my current projects where I was supposed to have an image enclosed in a div with fixed dimensions.

<div id="resize-div">
<img src="someimage.jpg", :id="resize-div">

For the dimensions of the div, you can set it inline or use css file:

#resize-div {

Now since not all images will fit this aspect ratio you’ll encounter problems easily enough. With images smaller than the div, I had little problem letting the css to handle it so it’s situated perfectly center in the div. I didn’t include it here to shorten the codes i need to display :).

Judging from the code shown above, you’ll not that if you have larger images that exceeded the div’s set height and width (especially those width different aspect ratios), a pure css solution simply won’t work (or at least I couldn’t make it work…. :/) so I thought of using JQuery to work it out for me.

Here’s my script to autofit images in a div using JQuery.

	var divElem = $("#resize-div");
	var maxht = divElem.height();
	var maxwdt = divElem.width();
	var imgElem = $("#resize-image");
	var ht = imgElem.height();
	var wdt = imgElem.width();
	if (ht < wdt){
		if (wdt > maxwdt)
			$("#resize-image").css({'height' : "auto", 'width' : maxwdt});
			$("#resize-image").css({'height' : "auto", 'width' : wdt});
	else if (ht > wdt){
		if (ht > maxht)
			$("#resize-image").css({'height' : maxht, 'width' : "auto"});
			$("#resize-image").css({'height' : ht, 'width' : "auto"});

Hurrah! A new server

I decided to move this blog together into a new VPS to host my personal rails projects :). Now, I’m not sure if this’ll be a permanent thing since I sort of jumped on the offer upon impulse but so far, I’m liking the service.

This server is running Ubuntu 10.4 with Pushion Passenger, Nginx, Ruby Enterprise Edition and PHP-FPM.

So why Nginx and not Apache? Well, aside from having it bundled with the latest version of Passenger, nginx historically has consumed less memory than Apache. The trade off of course is that I’ll still be running ruby 1.8.7 but I guess that’s fine since some of the plugisn I’ve been using have conflicts with 1.9.x.

I’ll be pushing a post detailing how I configured this server in a bit.

Jumping in to the fire

I’ve decided to take a leap forward today and move forward.  My current predicament is that I’m being held back by my current company in terms of personal growth and experience in the field 🙁

That along with several other factors (Google, I love/hate you) is why I decided to update my resume and forward it somewhere I hope will be a fruitful company for me.  While I’ll admit it does entail a hidden cost that I’d rather not mention, I think I can live with it knowing fully that the alternative is far from amiable.

My interview is today ._. Good  luck to me!

Lily is the newest Vocaloid

From the same company the brought Gakuppoido and Meguppoido, the INTERNET Corp has unveiled a new Vocaloid to join Miku and the gang. This new cutey is named Lily, a member of the group “anim.o.v.e.”.

Here’s another artwork of Lily.  I honestly can’t wait to see her in upcoming games/merchandises 😀

Original artist: Kirabagani

source Moetron

Installing the mysql gem on OS X 10.6 (Snow Leopard)

The first thing on my developer itinerary after getting my MacBook Pro is to install my development tools. That includes upgrading the ruby and rails gem versions packaged with OS X 10.6 and installing Xcode which is included on Snow Leopard’s install DVD. Things proceed smoothly until I tried to install the mysql gem.

Ruby threw a fit and dumped this message:

$ sudo gem install mysql
Building native extensions.  This could take a while...
ERROR:  Error installing mysql:
ERROR: Failed to build gem native extension.

Gem files will remain installed in /Library/Ruby/Gems/1.8/gems/mysql-2.8.1 for inspection.
Results logged to /Library/Ruby/Gems/1.8/gems/mysql-2.8.1/ext/mysql_api/gem_make.out

After some google-fu, I found out that when installing the mysql gem on OS X, you need to point it to where your mysql_config file is placed. Below is the complete guide on how to how to install the mysql gem on Snow Leopard.

  • Download your preferred MYSQL version from the community download site. If you’re on Snow Leopard, you may want to install the 64-bit version.
  • Install mysql via dmg or compile it from source.
  • Type ‘which mysql_config’ on the terminal to locate said config. Take note of this location as we’ll use it on the next step.
  • Install the mysql gem with the command below. If the location for your mysql config is different with the one below, use that instead.
     sudo env ARCHFLAGS="-Os -arch x86_64 -fno-common" gem install mysql -- --with-mysql-config=/usr/local/mysql/bin/mysql_config

    Note that if you’re using the 32-bit version, you have to use:

     sudo env ARCHFLAGS="-Os -arch i386 -fno-common" gem install mysql -- --with-mysql-config=/usr/local/mysql/bin/mysql_config
  • And success!
    $  sudo env ARCHFLAGS="-Os -arch x86_64 -fno-common" gem install mysql -- --with-mysql-config=/usr/local/mysql/bin/mysql_config
    Building native extensions.  This could take a while...
    Successfully installed mysql-2.8.1
    1 gem installed
    Installing ri documentation for mysql-2.8.1...

If you are having problems, or have any suggestions, please post a comment.

Using jQuery datepicker with Facebox

Facebox is an interesting jquery plugin but it’s also one of those annoying things on the web that likes to break stuff around it.  For my current project, I needed to use jQuery’s datepicker plugin with facebox. As expected, facebox broke datepicker :(.  I wanted to try several other implementations but since jQuery’s datepicker was the simplest one I could find, I didn’t want to waste time trying make another script work.  So I took a few minutes to debug my problem.

The problem:

Turns out that datequery relies on an elements ID.  The problem?  Facebox duplicates all the contents of the div you wanted to display and all hell breaks loose.

The solution:

Quite simple actually.

Just use jQuery to replace the element id within facebox at run time.

Here’s the script:

$(document).bind('reveal.facebox', function() {
  $('#facebox .datepicker').each( function(intIndex){
    $(this).attr('id',jQuery(this).attr('id') + '-2')

Then just modify your binding for datepicker accordingly:

$(document).bind('reveal.facebox', function() {

And you’re done. 😀

I found this code using google-fu on

On Rails and Loving it :D

I started out my official, programming career as a Java developer for my current company.  At the time, the design team was moving their development interests from purely desktop applications to a a more web-eccentric playing field, ergo web-based applications.  The itinerary was to find out if the web was a viable platform (don’t laugh, we’re being headed by a bunch of old peeps who are still touchy about the current computing trends) for development.  My answer of course was yes, so I took up training as a Java Web developer.

Things were great but like most things Java, the going was SLOW but steady.

ruby_on_rails_logoThen came Rails.

At first, I was really hesitant.  Strong typing (READ excessive typing) was the foundation of a good programming language; at least that’s what countless Java books that I’ve read told me.  So how does a language that puts the fun back in development catches attention?  Well, it might be cliche but…

It all started with Hello World

Nearly all programming languages starts with this old and tired way of displaying the text “Hello World”. Ruby got me interested by it’s simplicity:

puts ‘Hello World’

and that’s it 😀

Of course that really doesn’t say much about the language’s capability but you have to admit that it’s bound to turn heads :D.

So why switch?

At first it was really curiosity… although I will admit that I did already have Ruby experience prior to this via the gem WATIR (don’t ask why:D) but really, at one point I did ask myself, what’s all the fuss about Ruby on Rails? So I started reading, reading… reading and then read some more until I decided that my first rails application would be the project we had for our Software Development lab subject back in college. The result? I’m in love 😀

I’ll try sharing the project some time in the future but I have some re-writing to do 😀  It’s currently in workprint mode… it’s full of notes, comments and rants right in the source code so.. yeah I need to clean it first :D.

– to be edited.  Need to sleep for now 😀