Array Studio Reading List - a list of useful books

How to sort MySQL results ignoring definite and indefinite articles (the, a, an) July 14, 2006

We recently had a problem - we needed to sort MySQL result based on Title column, but while sorting we needed to ignore both definite and indefinite articles (i.e. ‘a’, ‘an’, ‘the’).

Although this is an frequent request (people mostly want to ignore articles when sorting), we didn’t find a lot of solutions. Those which we found usually involved suggestions like “just put ‘the’ in the end when inputting data” or “add another column in which you can enter whatever you want and use it to sort”… All those solutions work and can be used, but also all of them are unacceptable because they unnecessarily ask from user to perform additional operations.

Finally we stumbled onto a thread on Site point MySQL: Proper sorting of a column which has a solution in a very last post.

Here is the query (slightly modified/formatted) that performs sorting ignoring articles:

SELECT Title,
	CASE WHEN SUBSTRING_INDEX(Title, ' ', 1)
			IN ('a', 'an', 'the')
		THEN CONCAT(
			SUBSTRING(Title, INSTR(Title, ' ') + 1),
			', ',
			SUBSTRING_INDEX(Title, ' ', 1)
		)
		ELSE Title
	END AS TitleSort
FROM music
ORDER BY TitleSort

What it basically does is that beside actual Title column it also adds a second column called TitleSort which contains Title without articles and so it can be used for proper sorting.

The query logic is simple. First determine if the first word (i.e. everything from start to first space) of the Title is ‘a’, ‘an’ or ‘the’. If it is, then it will move it to the end of the string (for example, “The Best Of” will become “Best Of, The”). Otherwise it won’t touch Title and TitleSort will be exactly the same. Of course in the end it sorts everything according to values in TitleSort.

How to use lorem ipsum July 10, 2006

Few days ago I read this article on Signal vs Noise Blog. Even though I respect their work and oppinions (after all, we are using their products), this particular article I coundn’t completelly agree on.

As you’ll be able to read - they are strongly suggesting you shouldn’t use Lorem Ipsum as your “content-here” text.

Well, why not? Specially when you are working on some client’s project where material is always late at least for few days or even months.

You can always try to guess which text would client like to place, but 95% of the time, you’ll be wrong — and more importantly, you’ll spend few hours explaining WHY you placed that text there - instead of using the meeting time discussing usability and design issues.

So, my idea is to create a mockup layout with Lorem Ipsum text in place of paragraphs only. I always use regular text for headlines, navigation buttons, etc in order to present true website functionality. However, when you know there should be a paragraph of text explaining your client’s marketing strategy, mission statement, or some other blah-blah — put Lorem Ipsum paragraph there. You can check provided sample so you can see what I had in mind.

As you can see, I used Lorem Ipsum as paragraphs in places that are not much important for site functionality - (not in headlines, navigation, links…). Additionally, I used some bold and red elements - things that client will most certanly use in real life.

It cuts your working time, it works, it doesn’t create confusion - just use it properly.

However, when you are creating your own application, then forget about Lorem Ipsum.

Best lorem ipsum generator I stumbled upon in the past you can find on Lipsum.com.

How to add multiple files to Subversion

After switching completely to Ubuntu I also had to switch from TortoiseSVN to plain svn command line. The problem I have is that I don’t see any way to add multiple files to SVN with one command.

I want to be able to add ALL files that aren’t under Subversion version control and use a single command to do it (as opposed to issuing bunch of ’svn add file1 file2…’ commands). I’d like to have something like:

svn add ./*

Now since I’m lazy and not exactly an shell scripting expert I found a someone else’s solution to this problem. In a blog post add multiple files in subversion at once proposed solution is to use following line (it’s a slightly modified version of original line):

svn st | grep "^?" | awk '{ print $2}' | while read f; do svn add "$f"; done

Basically, it will first list all files that have been changed, then filter out those that have ? as status (hint: files that aren’t under version control), extract file names and then for each file issue a separate ’svn add’ command. I just tried it and it works great.

Install Ruby and Ruby On Rails on Ubuntu July 2, 2006

Recently I started messing around with Ruby and I wanted to set it up on our local server, so I gave InstantRails a go - and it worked perfectly.

Meanwhile we changed our operating system and switched from Windows to Linux (Ubuntu Dapper), so now I needed Rails for Ubuntu. Unfortunately (or luckily) there is no InstantRails for Ubuntu. The only way to go was to install “real” Ruby and Rails, so I had to figure out how to install it once again.

Again I tried to find a meaningful and complete tutorial, but I didn’t found it so I had to glue pieces from different sources (you have a complete list of articles I used at the end). I wanted to do this as simple as possible and without any compiling.
(more…)

Predefined CSS rules in most browsers June 26, 2006

Each and every time I start working on a new (X)HTML / CSS project - same problems turn up. As you probably know, every browser has some predifined CSS rules that you might need to override in order for your page to appear correctly on most of them. I say most of them because some of them I consider as waste of time (IEs older than 5, Netscape 4, etc. and their long lost relatives). While reading one cool and very useful article about prototype coding, led by few clicks I got this W3C page in my favorite browser (use Firefox!) I found very useful. It explains what rules most of browsers apply as they default CSS. Even the page states that the list is informative, not normative, I found points where should I focus my attention while overriding defaults.

As you can see below, I dig through that W3C page and copy pasted most used (X)HTML elements (I skipped some I never heard before) in more organized way - so I can print them out on single piece of paper I’ll keep on my desk in the future. Here is the list:

These are only the most used. Apart from this, you should always kill predifined FORM margin and padding values since IE iapplies them (and ruins my page). I’m sure there are some IE margins for BODY too, so pay attention on them. body {margin:0} won’t kill you.

For complete list of suggested predefined values visit http://www.w3.org/TR/REC-CSS2/sample.html.

Banner ads with HTML elements – banners that actually work June 19, 2006

Banners are one of the most used marketing tools on the Web for ages – you can see them on almost every commercial site. Some of them are successful, some are not. Some of them are truly annoying, some interesting.

No matter how they look and feel, people are still using them. One thing that’s important for any web designer is – there is still need for them and you’ll be creating them for a long time.

Key point you need to understand when you are creating a banner ad is – it doesn’t have to be good looking. Over-animated, shiny banners won’t do you any good if they are not clickable.
(more…)

Disable ctrl + n and other ctrl + key combinations in JavaScript June 17, 2006

Few days ago Vijay asked if there’s a way to disable ctrl + n combination (open the new window shortcut. So I set out to create a small Java Script that disables any ctrl + key combination (e.g. ctrl + v, ctrl + c, ctrl + a, etc.).

Script is a bit more complicated than Disable form submit on enter keypress and it should work in both Fire Fox and Internet Explorer.

And you just add this to the field where you’d like to disable keys:

Although the key combinations are disabled only on one field the same script can be easily modified to disable ctrl + key combinations on whole page.

Also if you are looking for something more sophisticated and with more features you might want to take a look at a visitor comment that contains DisableKeys.js script that gives you more control and you can disable almost any key and/or key combination, including ctrl + key and alt + key.

Control your color gradient tool! June 12, 2006

There is one thing you should know about gradients no matter what application you use – it is a tricky business. You can create nice color harmony or ruin your layout in 3 mouse clicks.

Back in 2002 I was avoiding it wherever possible from various reasons:

• Page load was longer
• It looked unprofessional and lame
• 2 of 3 gradients throughout the Web were followed with some horror looking headline, 3D rotating logo and/or heavy JPEG compression

Of course, those days CSS was used for changing colors in anchor tags - rarely for something more. Now it’s different – we use style like background-image, background-repeat, background-position and whoohoo – with a 0.1KB GIF image of 50×1 pixels in gradient, we have a cool looking header background. If we use some cool font, sometimes it’s more than enough for good start in our design.

So, now we know what we need and I am more than sure you know how to create gradient in your favorite application. You pick two colors, you draw a direction line and that’s it! Gradient is here. We just need to learn how to control it.

Here are some ideas how to refresh your current web sites…
(more…)

Ruby installation on Windows June 10, 2006

Recently I’ve started playing around with Ruby and Ruby On Rails on our hosted server. Since I liked it a lot I have finally decided to try to install it on our local Windows server. While I was doing it I found that most of the online tutorials are not all completely accurate, i.e. they need a bit of tweaking… So I started logging every step I did.
(more…)

NiceForms with even nicer select September 11, 2005

UPDATE 31-Jan-2007: There’s a new version of Niceforms. For more info see this post.

Few months ago I stumbled upon a great piece of JavaScript called NiceForms by Lucian Slatineanu. The idea of script is to replace all form elements with visually much nicer and more controllable elements. Great thing about it is that it replaces all form elements automatically, meaning that you don’t need to make any changes to your form. As a consequence if JavaScript is turned off it just degrade to ordinary form.

NiceForms still has some problems - for example with accessibility such as tab element switching, with changing text size manually in FireFox, etc. (for more info visit Lucian’s site).

One particular problem it has is with select elements:

- You can only open select by clicking on right arrow
- It doesn’t close automatically (i.e. when you click somewhere else), you either need to select an option or click right arrow again. This can create some strange effects, for example you can have more then one drop down option list open at the time.
- When first loaded it has some default text instead of currently selected option, which can lead to problems if you have pre-selected an option in HTML.

So, I had some time and decided to try to fix this. Hopefully these fixes will be included in following versions.

If you don’t want to read all the details you can just see modified NiceForms in action or download a ZIP containing the whole modified NiceForms example.

If you want to read everything, then here is what I did…
(more…)