Archive for March, 2007

Javascript fading effects with MooTools

Thursday, March 29th, 2007

As well as using MooTools for validation, I am also using it for effects. Its nice to the the error boxes fade in and out. I think its just one of those touches that people appreciate (whether they really call it out or not). Anyway, MooTools makes it really easy as you can tell by this code.

function showErrorMessage() {
    exampleFx = new Fx.Style(’error-message’, ‘opacity’, {
    duration: 500,
    transition: Fx.Transitions.quartInOut
    });

    exampleFx.start(0,1); /*fade it in*/
}

MooTools Javascript framework

Friday, March 23rd, 2007

Let me start by saying, I dont like Javascript but I love MooTools. Its not that I dont think Javascript is great and highly powerful, I just hate dealing with it especially when my job is the backend. I would do anything for a stacktrace like there is in Java!

Anywho, MooTools is a Javascript framework developed by a fellow coworker at CNET. Much like Prototype, Dojo, Scriptaculous and others it offers and extensible and extendable framework on which to build upon. I will cover more of my toilings when I have the time. I would highly recommend looking into it even if you have already used other frameworks. Here is a link to the MooTools site.

Solr configuration

Thursday, March 22nd, 2007

Solr is quite easy to setup once you understand it. It is much like any other database setup. So given the following the table, we have to mimic something similar in Solr. It need to know what is “stored” versus what is “indexed” as well as facets and many other options. I will explain more later. Here is my MySQL table representing ‘things’.

things-table.gif

Okay. Simple enough right? So we want to do here is store most of this data; however, for facets we dont really need to store them. What does that mean? Well we want to be able to search through them and index them but when we ask for all columns of a given field it wont return this field. This will come into play later when I discuss faceting. Here is the schema.xml file for the above MySQL table:

<field name=”id” type=”string” indexed=”true” stored=”true”/>
<field name=”name” type=”text” indexed=”true” stored=”true”/>
<field name=”fileName” type=”text” indexed=”false” stored=”true”/>
<field name=”tags” type=”text” indexed=”true” stored=”true” multiValued=”true”/>
<field name=”isBackground” type=”text” indexed=”false” stored=”true”/>
<field name=”dateCreated” type=”text” indexed=”false” stored=”true”/>
<field name=”dateModified” type=”date” indexed=”false” stored=”true”/>
<!– for faceting –>
<field name=”tagsFaceted” type=”string” indexed=”true” stored=”false” multiValued=”true”/>


Now that we are complete with our basic table structure we have to tell Solr a few things about our index. It wants to know the primary key, or in Solr terms, the unique key. Also we have to tell it our default search field.


<uniqueKey>id</uniqueKey>
<defaultSearchField>tags</defaultSearchField>


Now we have one more very important variable that we have to tackle if want proper faceting on tags. We have to make sure that any time we write to the tags text field we also write to the tags string field. The difference is that the ‘tags’ field is stemmed, i.e. searching for ‘kids’ returns ‘kid’ and so forth. The ‘tagsFaceted’ field will return the whole words. One is human readable and the other is for the machines.


<copyField source=”tags” dest=”tagsFaceted”/>

Starting to work with SOLR

Wednesday, March 14th, 2007

solr-head.gifSOLR, a wrapper for Lucene, was developed by a fellow coworker at CNET. It has recently graduated from the Apache incubation cycle and is now a full fledge project. It not only does it wrap Lucene with a simpler interface it more importantly creates a Restful type of API. I only been using this for a few months now but I love it. It will be launching it into production at work and for my own personal project.

So what is SOLR/Lucene

Lucene is an indexing system, much like a database, except faster and narrower. Narrower? Well essentially an index is a single table with a primary key per entry. It allows extremely fast full text searching with stemming that other databases cannot handle, or even support. MySQL for example, especially MySQL 5 will fall over under heavy load no ifs-ands-or-buts. I’ve seen it happen at work in the lab as well as in production.

Lucene, as well as Solr, are built in Java but Solr needs a servlet container to run like Tomcat, Resin, WebLogic, etc. It runs “next to” your database. All the data in the Lucene index is the same as 1 table in your database. When you write to your DB you will write to Lucene (via SOLR). When you delete, same thing. Updating, yes. You get the point.

Faceting

Solr, and Lucene of course, also support faceting which is very powerful. You have seen this on many sites especially in the world of online shopping comparison. It allows you to see how many other entries also share the same common attributes. In the example of shopping comparison you can see how many other products are also, under 20 dollars, made of cotton, and from Amazon Marketplace. This is very powerful feature and it is perfect for allowing users to drill down through the data.


I will post more findings when I have the time, including configurations.

A1 Imports Photo Gallery added

Monday, March 12th, 2007

I implemented Gallery 2 on the site in hopes of increasing page churns as well as pages indexed. It was very easy to implement and is much better than most PHP open source software I have dealt with. It only took a few hours to wrap it with the current site template and voila. Done! I will report back on the SEO implications. Unfortunately the URL’s a riddled with query parameters but thats okay for now. The gallery is located here

Spring binding many-to-many

Sunday, March 4th, 2007

Wow. This was a lot more complicated than I thought. After several days of research and questions I finally discovered how to make this work. Its all about custom property editors. Please note that many-to-many relationships are not the best thing to use in a production environment. They dont scale well and they are not easy to manage. I later on replaced with Solr, my new favorite implementation.

In this example, many ‘things’ have many ‘tags’ and inversely many ‘tags’ have many ‘things’.

protected void initBinder(HttpServletRequest request, ServletRequestDataBinder binder) {
   binder.registerCustomEditor(Set.class, “tags”, new CustomCollectionEditor(Set.class) {
     protected Object convertElement(Object element) {
       long id = NumberUtils.parseNumber((String) element, Long.class).longValue();
       Tag tag = tagMgr.getTag(element.toString());

       return new Tag(id, tag.getName);
     }
   });
}

A1 Imports Autoworks Case Study begins

Thursday, March 1st, 2007

250px-a1-website.pngJP Cadoux, the owner and operator of A-1 Imports Autoworks, came to me in a quest to grow his business. He has been in business for himself for over 10 years, specializing in all car repairs, especially Europeans cars. He wants his business to grow as a whole but he wants to focus more on the custom fabrication portion. The cars he creates are extremely clean and meticulously fabricated making him famous, especially in the world of 1970’s BMW’s.

Although I did not design the site, I rebuilt the current design from scratch to lighten the page weight. It had originally been built by a friend of his who used Adobe’s GoLive which doesnt exactly output lightweight xHTML code. As always, the progress will be documented on my wiki, but the updates will occur here.


Here is what we are starting with
A great business with years of skill
Loyal clientele
Small web site (un-optimized and not indexed)
No logo


Our mission
Our mission is simple. Grow the business as whole in reach as well as appeal to the high performance tuner industry that JP knows so much about.


Goals
-Create a solid brand identity around performance and reliability
-Use the Internet as the medium to find and interact with the high performance car community (think YouTube).
-Build cutting edge “blog-worthy” cars to increase buzz and traffic to the web site
-Properly tune the website for the market we are after and optimize for search engines (SEO).