What Was Our Project Scope Again?

Recently JK and I hit a roadblock that we simply cannot walk around. The spacing problem that I showed in the last post could only be fixed one way: turning the white link list (userBar) into a drop down menu in the CSS. Unfortunately, the only way this can be done is with an unordered list. "Well, that's perfect!" I thought, "The blue link list (navList) was an unordered list, so surely userBar would be as well." Wrong! userBar turned out to be a series of spans. Yuck! So we decided that despite our attempts to do a purely CSS operation, we were going to have to mess with the HTML. Being a "skilled" web designer (meaning an undergrad who had taken an Internet Development course), I wisely suggested that we validate the HTML before we start editing, so we don't throw errors on top of errors. Heh, first mistake. It turned out that the page (yes, this is just the home page, not the entire site, which we must also work on), whose DOCTYPE header claimed to be XHTML 1.0 Transitional, had 73 errors and 1 warning! In our local copy of the HTML we managed to eventually boil this down to 3. Now, remember, this is just the home page. One of the remaining errors was an autocomplete attribute we didn't want to mess with (you know, the kind you put in forms that all the major web browsers understand but for some reason isn't standard even though there is no reasonable workaround?). The other two errors were tell-tale signs that the HTML had been generated on the server side. Not good! This means that now JK and I will have to dig down into the MVC that OpenMRS uses to manage their project and find out which piece exactly generates the HTML and we can go about changing it so that it generates it the way we need it to. Sound fun? JK isn't looking forward to it. Personally, I'm excited, but I must admit it is daunting.

So now our project has gone from "create the mobile stylesheet" to "digging down in the MVC to regenerate the HTML." Meanwhile, the rest of our class is laughing at us because we finally have to do some "real" coding.

More Problems

Remember how beautiful the page looked before logging in?



Yeah, then you log in.

Mobile Home Page Finished

The home page for the mobile site is finally finished. It wasn't that hard to edit for the most part--it took a lot to get it to work in the Windows Mobile Internet Explorer, though. The finished product is to the left. Yeah, it still has an ugly white space in the navList. Unfortunately there was no workaround for this. It took long enough just to get that OpenMRS logo in the corner to stay in the corner. Windows Mobile IE has no support for the position property in CSS.

In order to get this to work we had to float that Log In bar in the corner:

#userBar {
position: absolute;
top: 0px;
right: 0px;
float: right;
width: 60%;
text-align: right;
padding: 0px;
margin: 0px;
z-index: 5;
color: #333333;
line-height: 26px;
background-color: #ffffff;
}

Then we had to float the image left:

#banner img{
height: 1.25em;
float: left;
margin: 5px 0 0 0;
padding-top: 0px;
}

When that was all done, I played for a while trying to get that white space to go away to no avail. It is functional now though and it looks sufficiently good.

Emulators

JK and I have been working on setting up emulators for testing our mobile pages in. We have Windows Mobile and Blackberry emulators configured, and we have an Android emulator that we don't have ready yet.

Google Image Swirl

Google has a new experiment to toy around with: http://image-swirl.googlelabs.com/. Image Swirl sorts images contextually and offers a much cleaner GUI for searching through the results. It is only a demo right now, but it looks promising.

Mobile Emulators

Yesterday, JK and I went on a hunt for smartphone emulators online. JK installed a Blackberry emulator that he is having trouble configuring. I installed the Windows Mobile 6 emulator. I will also have to install Virtual PC 2007 in order to enable the wireless feature of the emulator. I have not yet done that, though the setup is sitting in my Shared Documents.