Filed under My Activities

My best 7 free JS modal boxes

I have been working on a new iteration of HOT (follow @hotelotravel for more info) for last few weeks and thought of changing the existing JQuery UI Dialog box for something bit fancy and solid (on other hand I may have just wanted to get a break from usual PHP stuff and to play with JQuery a bit after some time). I did have some popular JS modal box names such as Lightbox, Facebox and Thickbox that I wanted to test and found some few new names on the way.Certainly there will be many more modal boxes out there that I’ve missed and not to mention my requirement will be different from yours, but here is the gist of each modal box in my opinion of those I’ve tested so it may help someone to pick the right one at the right moment.

JQuery UI Dialog

JQUery UI in Hotelotravel

JQUery UI in Hotelotravel

This is the dialog box that I’ve used in most cases and of course it’s great. Few years back when I started working with it I noticed few issues when closing the dialog and such but by now they have all been fixed. Also it’s continuously maintained by JQuery community so you can be sure it is solid. What I like mostly about it is its simplicity as well as customization power through various callbacks when you need more action (you can define what to do when a drag starts, drag stops, box shows up, box closes. etc) through various option settings.

This is all you have to do to get a simple dialog box if you have a div with the id of “myDialog”.

$("div#myDialog").dialog();

Another perk of this modal box is its file size, which is quite small (about 10KB and minimized version is about 6KB) and when doing a complex site with numerous CSS and JS scripts, size of each file becomes crucial to maintain a small load size to reduce the load time as well as save server bandwidth. Only seemingly downside of this box is that it doesn’t come with any fancy preloaded stuff (themes, effects, preload-images.etc) but for someone interested (and with a bit of JS and CSS knowledge) can customize them.

LightBox

Light box

Light box

This is focused mainly on presenting pictures and does a good job at it. If you are interested in creating something like a picture gallery without touching much JS, this could be the ideal JQuery plugin for you. Also it has a relatively low size with a size around 19KB and packed version is about 6KB. But since I was looking for something more with raw customization power, this wasn’t the choice for me.

FaceBox

Facebox

Facebox

Another popular choice for a modal boxes and it deserves the name. It has a very small file size and a simple code. It also comes with a default theme and can be a convenient choice for hasty tasks or people :P But the downside I noticed is that it gives very small customizing power to the user through JQuery code (which is the case with Light box also btw).

It’s simple to a fault and you just have to name the class name of the link you are going to pop the box as “facebox”. It could have had few more options such as to define the basepath of the project as I couldn’t find a way to define it for pre-loading images without hacking the code nor a way to give width and height manually or pass callbacks. Also this project seems to have been abandoned for a while now and if you are considering adapting this box for your whole site check it thoroughly.

ThickBox

ThickBox 3.1

ThickBox 3.1

ThickBox is really a cool JS box. It’s simplicity and extremely small file size makes it very adorable. This modal box gives some customizing power but still focuses mainly on simplicity and link naming as “thickbox” which is its magic word. However as mentioned earlier this has a better customizing power through JS than FaceBox or LightBox so it’s more flexible. With some hacking you can also give your own callbacks and options as you like.

LightWindow

LightWindow

LightWindow

This is an all purpose, very fancy looking modal box done using script.aculo.us and prototype libraries. It can host all kind of media types and even flash clips which is really impressive. But the obvious downside is its huge file size of about 60KB which is a huge amount when considering this will be just a small part of Hotelotravel.com and for general use it’s not tolerable IMHO. It is not compressed or packed by default so you can manually minimize it using something like YUI compresser to bring it to somewhere around 30KB but even then it’s too large for me. But this is ideal for a site that has tons of ajax stuff and in need of a very customizable modal box with lot of options and callbacks that can be used throughout the site.

SimpleModal

SimpleModal

SimpleModal

This is the smallest JQuery modal box I’ve seen and if you need to customize your modal box to the extreme I’d suggest this. Downside is that you will have to write a lot to get something done through this modal box but extreme small size complements that.

NyroModal

NyroModal

NyroModal

This is also a very good looking JQuery based modal box with a reasonable file size(about 14KB for packed version) and gives considerable customizing power to the user. Also it comes with a packed theme and all that so you can use it easily without much coding which is a plus. In fact, I had some trouble deciding whether to use this one or JQuery UI for my task but finally settled on using JQuery UI because my familiarity with it and community backing. So I guess in my case JQuery UI is the rightful winner :)
[digg=http://digg.com/programming/Best_7_free_JS_model_boxes]

Tagged , ,

PHP + Large files

I was working on the project Hotelotravel for last few months and as usual in many cases it involved working with large database files because when you consider all hotels, locations and images all over the world it means a lot. But if we want to do large file uploads or database updates with PHP there are few configurations to be done to default settings and I’m putting this as a note to myself (I’m always keep forgetting this) as well as to any one who may find this useful like when importing a large backup file through phpMyAdmin.

In your php.ini check for these settings and change them as you need.

  • post_max_size (The maximum size of post data you can send in one submission)
  • upload_max_filesize (Maximum size of file that can be uploaded)
  • memory_limit (Maximum memory limit that can be allocated for a script execution)
  • max_execution_time (Maximum time limit for a script execution)

As a side note, if you trying to import large files (backups.etc) through phpMyAdmin and it refuses, you may need to edit config.inc.php file and change these settings to 0 which means no limit.

  • $cfg[‘ExecTimeLimit’]
  • $cfg[‘MemoryLimit’]

As a final note, these settings are there for a purpose. So my advice is change them in whatever manner  you want in a development environment but be very careful when setting them in a production environment because an endless execution of a script can cause your servers to waste bandwidth and even crash.  So I guess this is my disclaimer ;)

Tagged ,

Back to politics

It has been a very long time since I’ve had any interest in politics whether it’s local or world.

I was damn disappointed and angry with local politics because frankly there’s no party to support IMHO. There’s no one with a clear vision, all leaping from one party to other in a blink of an eye just for political or personal gains, democracy has become a joke with some ministers, Police has become just a tool of the government to control the opposition, people looking at television while live crimes being telecast…so the list goes on.

I was throughly fed up with international politics also mainly because of activities of Bush administration in US. Whether we like or not U.S. always had a say in where the world was heading in recent history and world seemed to be going on the wrong trail with Bush leading the way to the gates of hell. Invading other countries and later saying “Oops sorry, it was a mistake. Our evidences were bunch of lies“, hell-bent on trying to destroy the environment like it was Bin Laden, torture camps and secret prisons, possibility of a war with Iran..and this list also goes on.

So it was refreshing to see some new movements in politics and of course I’m talking about the intense US election that came to an end in last week. I was somewhat intrigued by this Obama guy when I heard about his ideas and his background at the beginning of this year. At that time he was in tough primaries with Sen. Hilary Clinton  who most believed is the de facto for 2008 nominations from Democratic party (of course I’m talking from what I saw from news), but that seemed the general consensus. So it was a great surprise to see him winning primaries and hearing him talking at Democratic convention in last August accepting the nomination.

But the bump in polling (I usually follow Gallup) that followed after the Democratic convention was soon ended with the Republican convention in the coming week and McCain seemed to be winning. I thought this will be a repetition of 2004 or 2000 where Democratics were ahead in days before the election and losing it at the end. Talking about McCain, he seemed to be a traditional politician, talking to people like children, going after slogans, changing positions all time, doing a rash choice for a running mate and continuing same Bush policies in almost every aspect, saying things like “bomb, bomb, bomb Iran”…which clearly didn’t give any good feeling about the guy (Btw, I had had enough of hearing the word ‘Maverick’ in last few weeks).

On the other hand the position Obama took clearly impressed me. First and foremost his ideology about Iraq war (he opposed it since its beginning), his idea for a more peaceful world, getting away from ‘Shoot first ask second” system, more understanding with Muslim countries…so IMO he was the better choice for the future of the world.

Also the way he ran his campaign really impressed me and gave a good indication that he can handle tough situations well (with the global economic crisis it certainly won’t be a walk in the park. Although I don’t believe Obama nor any other single person will be able to solve this mess). I have never seen a politician using the power of web to such an extreme level to get to the voters like done by Obama’s campaign.  Since he had been campaigning for nearly 2 years, he had a massive user base around his web site and he used that very effectively for almost everything ranging from organizing community activities, canvasing, fighting smears, carrying his message globally, GOTV campaigns and what not.  Also he had realized the importance of viral marketing and used all popular social networks and micro blogging services like Twitter to their fullest limits. According to recent numbers he had more than 100K followers in Twitter and about a million users in Facebook.

So finally when election results started coming in last Wednesday morning it seemed all projected Toss-up states like Virginia, Indiana and Florida which he had been leading in polls going the other way around. But within few minutes results of PA came and a bit after that Ohio came and the game was set. Then after some time I watched the historical acceptance speech by U.S. president-elect Barack Obama and it was truly a beautiful sight.

We have been reading about legends of Mahatma Gandhi and  Civil right movements of Martin Luther King, Jr in world history and how it changed the world. To me the last US election could be seen as another changing moment in the history after 100 years later or become just another lost chance. According to Arthur C. Clarke (I’m taking from his 3001-space odyssey) as human civilization evolves there should be less violence because of greater understanding and increased intelligence. I truly hope this new “Change” will be a turning point of the world in to a global peaceful environment even though at the moment it’s looking pretty gloomy.

[youtube=http://www.youtube.com/watch?v=6qiRwCuQmZA]

Btw, I thought of writing how US election can relate to Sri Lankan context also (there are many similarities, differences and a thing or two that we can try to adapt) but it will be insanely long  if it added up to this already elongated post so I’ll post that later separately.

Tagged , ,

Closing Tributes

It’s bit late for for a closing tribute on SoC, but something is better than nothing, right ? So here we go.

Google Summer of Code 2008 was the second SoC I participated in and last year with Gnome was my first. This time the SoC was with Eclipse and it was in one word ‘Awsome’.

In more details, the summer with Eclipse community was a great experience, Specially my mentor David Carver who supported me in every stciky situation in the process and believe me when I say without his support it would have been a nightmare for me (one badspot with Eclipse is its lack of up-to-date documentation in certain areas). So my heartfelt thanks go to David and all the Eclipse community who helped me to have an easy learning curve.

You can check all 2008 SoC Eclipse projects here. More info on the project I was working on – Eclipse XQuery editor can be found here. The code can be checked out from Eclipse incubator repo from here – eclipse-incub.cvs.sourceforge.net/cvsroot/eclipse-incub/org.eclipse.wst.xquery. Also we have setup a download site for the plugin. If you are interested, please get a copy for yourself and check it out and let me know what you think of it.

Lastly, I’m hoping to continue the project and already have a long todo list prepared. Also my thanks go to all who voted me in as an official commiter for the project. Currently paper works are being carried out and hopefully I will soon get CVS access to Eclipse repo as an official commiter.

Btw, I got my SoC shirt and certificate last week and they will be great mementos to remember this summer with Eclipse. For all these great stuff a big thank goes to Google and specially its Open Source division.

GSoC 2008 mementos

Tagged ,

Trying to start rolling the dice…

Blogging is much like a metallic engine, where when it’s not properly maintained and sustained it starts eroding and it’s same in the case of blogging. When you don’t blog for a long time your writing become eroded and hand becomes heavier and heavier to start writing something. So I finally felt like start rolling the dice and hope it goes in a slope.

Writing is like a metalic engine

Tagged ,