Archive for July, 2008

Metallica Live in Sofia (2008 Bulgaria)

Sunday, July 27th, 2008

Usually I don’t blog much about non-technical daily stuff but this is something that changed the world for more than 50 000 people.

1. Entrance – Entering the Stadium was as always adventure. After passing the first check point we turned the wrong direction and went round the whole stadium. Because of this at the end we were stuck in big mass of people which slowed us down with a hour and a half. We missed both Down and Sword but happily arrived around 8:40 early enough not to miss anything from Metallica.

2. Spot – The spot we occupied was great – 20m from the stage a bit to the left (generally heading the most left microphone) with great view and…

3. Sound – With the very first song I was amazed. There are many comments for bad sound but where we were – it was PERFECT. Not moving my pants from the sound waves but quite clear. I had never attended a concert with such good sound quality.

4. Track list – Just great. No new crap only head banging classics –

Creeping Death, Fuel, Ride The Lightning, For Whom The Bell Tolls, Welcome Home (Sanitarium), Leper Messiah, …And Justice For All, Wherever I May Roam, Fade To Black, Master Of Puppets, Motorbreath(muutafrat ….), Nothing Else Matters, Sad But True, One, Enter Sandman, Last Caress, Stone Cold Crazy, Seek And Destroy (Sucheeen seek and distroy oi oi oi)

5. Crowd – I believe we were insanly good. Everyone was shouting and singing on all songs and with the stadium totally full I hope Metallica will remember Bulgaria for quite long

6. Pyro – There were great flames and pyro that heated up the close to the stage people.

7. Metallica – great performance (hey James stop spitting you almost hit me), great musicians, great attitude – Thanks for the Flag at the end

Can not wish for something more (heh except next year again – Lars you promised)!

Dynamic Increase / Decrease Font Size Box with Javascript

Sunday, July 20th, 2008

Web Accessibility is important aspect of the modern websites and including functionality for increasing / decreasing the font-size of the body text is a good step for achieving it. With all recent A grade browsers this is kind of unneeded since they have build in zoom functionality (ctrl + / ctrl -) but still there are couple of advantages for using custom solution:

  1. Preventing broken design due to resizing displacements
  2. Easier for less experienced users who don’t know how to zoom from the browser
  3. Looks kind of cool 🙂

The script I’ve written has the following features:

  1. Stores settings (increase/decrease value) in cookie
  2. Uses style switching (overwriting) so there is no font resizing after page load
  3. Limits the resizing to three steps in each way

Here is the code and example. Note that I’m changing only the body font-size because all paragraphs are using relative units (em). If you prefer to use absolute units (px) you will need to declare all CSS selectors you are using.

dynamic font resizing

Of course there are couple of things which can be improved but I wanted a simple script working under all major browsers : IE 6+, FF, Opera, Safari.

Firebug / Web Developer Toolbar Alternative for Safari

Saturday, July 19th, 2008

Most of the recent projects I’m working on have requirement to support Safari (under Windows, OS X and iPhone) which unfortunately has some strange rendering biases.

After couple of hours googling around I found the solution and strangely enough it is build in Safari.  It is the so called Web Inspector which in terms of functionality and look is very close to Firebug (with no live editing capabilities) but with quite good net profiler.

However to enable it you have to add couple of lines in one xml file (instructions taken from the Webkit’s site see link bellow):

On Windows, you’ll have make sure that the following lines are in your preferences file at the location

C:\Documents and Settings\<USERNAME>\Application Data\Apple Computer\Safari\WebKitPreferences.plist

(where <USERNAME> should be your Windows user name):

<key>WebKitDeveloperExtras</key>
<true/>

For more information and details check the Web Inspector page

Happy debugging!

Customizable Form Select / Dropdown Replacement with Mootools

Thursday, July 17th, 2008

After seeing couple of implementations of replacing the default form checkboxes and radio buttons I was on a search for cross-platform select dropdown which can be fully styled with CSS. Unfortunately there are not so many options and the best I could find is elSelect:


elSelect is a great tool that allows you to visually change look and feel of usual select, keeping its functionality.

However I believe there is plenty of space for improvements.

1. Porting to Mootools v1.2

You need to replace setHTML, setText and other deprecated stuff to the new syntax.

2. Instead of creating new input just move the original (otherwise all events connected with the DOM element are lost and it does not work with .NET forms) –

Replace:

this.hiddenInput = new Element('input').setProperties({
			type  : 'hidden',
			name  : this.source.getProperty('name')
		}).injectInside($(this.options.container))

with:

this.hiddenInput = this.source.injectAfter($(this.options.container));

3. Various optimizations + autocomplete functionality and keyboard shortcuts (Tab-ing through the form).

Also I’m checking the browser agent since under iPhone it is better not to replace the select and adding some code graceful degradation:

var addCustomSelect = function(wrapper){
	if(!Browser.Platform.ipod){
		try{
			var mySelect = new elSelect( {container : wrapper});
		}catch(e){}
	}
	if ($(wrapper).getElement('select')) $(wrapper).getElement('select').setStyle('display','inline'); // Select is still here - degrade gracefully
}
if($('cust-sel')) addCustomSelect('cust-sel'); // Call as soon as possible

Other good tip is to have the select (you are replacing) with style visibility:hidden so it does not flicker when loading.

You can download my modified version from here. It has 1 and 2 applied plus some other minor changes. Still it is a good idea to diff the original and my version since I have custom modification that you might not need.