Make life take the lemons back

It’s hard to believe that it’s almost been a year since I graduated from University. This time a year ago I had just completed the epic tome on my final year project and was preparing to revise for my final exams; a grueling and terrifying experience. The time since then has been a very transitional period of my life as I get my head around being out of education for the first time ever (let’s not count those early years where I was banging lego bricks together) and used to the idea of having an adult life.

It’s very easy with a full time job that involves hours of commuting every day to get very complacent and lazy. The simplest way out is always to get home after work and want to do nothing but veg out in front of the television and honestly, I’ve done a lot of that. I ended up as a web developer not because anyone told me there was money in it, but because when I was 15 I accidently created a video game website. It was pretty terrible and the most horrific shade of green, but the next day I went back to it and was blown away to discover that people had started using it. I didn’t realise it at the time, but that website was an incredibly important turning point in my life and I truly don’t know where I would have ended up without it.

Three years ago that website died as I was unable to maintain it during my placement year and the small group of users moving on. Since then I’ve always had the desire to fill that “personal project” shaped hole in my life with something new, but inevitably ended up in front of the television instead. It’s just so much easier.

FWXD.net

And then Mike showed up.

My former co-worker, who has this insane plan to emigrate to Australia, despite the fact I’m reliably informed they eat British people with afternoon tea, suggested one day that we make a video game blog. Mike worked at the company as a professional writer talking about how whisky tastes of “synthetic banana”, and had just gotten into gaming. I guess he just really wanted to write about it and had no outlet to do so. I think I probably agreed with him at the time, because it's easier to agree with people and normally they forget the next day. Except he didn't forget, so I guess the joke's on me now.

Mike’s enthusiasm for the idea is what got me out of my rut. We’ve been working on the site for several months (with the original idea dating back to January) and have put together a crack team to write for it so there will be regular updates. It's been truly awesome to work on and I look forward to seeing it grow.

Welcome to the aviator club

It turns out that naming a website is really hard though. It needs to be memorable and unique while containing as many Google friendly keywords as possible. Unfortunately Video Game Blog dot com was already taken and Mike thought appending the word “Nazi” to it would be considered bad form. We went through a lot of names before arriving on the one we used. Having lived with the name we chose for so long I couldn’t imagine another choice, but there was a long period of time where the best thing we had was “video game creed”. Feel free to take that one when I let the domain expire...

Nazi Clown Fish really wanted to be a website mascot...

I present to you... Gaming With Lemons... dot com.

TL;DR

 
We have a new website. It’s about lemons and video games. And video game lemons.

Intercepting iPhone/iPad keyboard events

So a problem; you have a web app running on iOS that you want to receive keyboard events at any time. The simplest solution would be to make the user put focus on a designated text field that you could watch for keyboard events in JavaScript, however it's a pain in the arse if the user has to keep putting focus back when they loose it. Unfortunately the app itself can't force focus on the text field as mobile safari blocks it (only a touch event triggered by the user will bring up the keyboard). 

The solution, as crazy as it sounds, is to create a native iOS wrapper app that can monitor keyboard events at all times and forward them onto the web app. To do so all you need to do is create is a view controller that displays a UIWebView with your web app inside and implement the UIKeyInput protocol. 

@interface ViewController : UIViewController <UIKeyInput>

In the implementation of your view controller you just need a few of methods.

- (void) insertText:(NSString* )text
{
    NSLog(@"%@", text);
}

- (void)deleteBackward { }

- (BOOL) canBecomeFirstResponder
{
    return YES;
}

- (BOOL) resignFirstResponder
{
    return NO;
}

- (BOOL) hasText
{
    return YES;
}

Insert text is where we will receive keyboard input and resign first responder is the crucial method that returns false to prevent the web app from taking the keyboard if an element receives focus. Obviously the negative to this is you can never type directly into elements in the web app. 

Once the native app receives keyboard events they can be passed onto the web app using JavaScript. You just need to create a receiving method in the web app and call it in the native app like so.

- (void) insertText:(NSString* )text
{
    NSLog(@"%@", text);
    [myWebView stringByEvaluatingJavaScriptFromString:[NSString 
        stringWithFormat:@"receiveText('%@');", text]];
}

And there you have it, intercepting keyboard events for a web app using a native wrapper.

Winter is coming.

A couple posts ago I mentioned that this blog was getting a lot of referrers from folks trying to find out how to do some stuff I mentioned in my final year project and that I might write a couple blog posts explaining what I learned. I am in no way an expert on the subject, but with any luck what I contribute will at least point people in the right direction.

Rather than write a lengthy post however, I decided to produce a video using the newly released Final Cut Pro X. A lot of professional video editors are complaining that the software has lost a lot of features and has changes they disagree with, and I'm sure they are right, but as a casual video editor who was relegated to using iMovie (which didn't do enough) because I didn't understand the complexities of Final Cut Express, I love the power and freedom the new editing software has given me. The new price also did a lot to sell me on the purchase.

So here it is, my first stab at a video tutorial; a guide to creating a simple iPhone application that displays a UITableViewController using Core Data as the data source. This is my first attempt, so I'm sure there are improvements to be made. If folk like it, maybe I will do more. Or perhaps I will make a video on something completely different. Who knows.

In other news, I watched the complete first season of Game of Thrones, which was absolutely incredible. Its certainly up there with one of my favourite TV shows, and even got me back into reading books, as I can't wait an entire year for the next season to arrive. I would recommend the book(s) and the show to anyone who isn't squeamish about a little blood and unnecessary nudity and sex.

At some point in their lives 1 out of 6 children will be abducted by the Dutch.

Instead of doing the sensible thing and actually revise for my exams, I've been working on my little side project the last couple days. As I mentioned in an earlier post, the imaginatively named "my e-penis.com" is a database for tracking game collections and progression. As it stands a user can register for an account, login, search for games and provide basic information about the status of each game, such as ownership (whether you have the game, had the game or want the game), completion progress (if you completed it, gave up on it or if the game is uncompletable in the case of an MMO or puzzle game), completion date and how many hours have been played.

Technology wise, I'm using a combination of PHP and jQuery on the front end and a MySQL database on the back end. I've had very little practical experience with jQuery despite being aware of it for a while now, so the whole thing has been a learning experience. Its also been quite a while since I last designed a site from scratch, so I've had to come up with a fresh design that feels more modern than the last site I built. And yes, I'm making a green website. You have a problem with that?

The internet doesn't have enough green if you ask me.

The site uses Giant Bomb's API (which was a nice crash course in JSON) to provide the game database. Back in the FWXD days one of the major issues with the site was trying to get users to enter game information into the database. Using an external wiki that is always growing and correcting itself is certainly the better solution, especially as the site is really only designed for myself. I would love for others to get some use out of it, however I don't really intend for it to gain traction. If I did, I would have chosen a more politically correct name...

The site is currently in alpha, but if you want to play with it and give me feedback, you can check it out here.

In other news, on Thursday I was offered full time employment at my day job. This July will mark two years with the company. I joined them for my placement year and stayed on part time (currently only a day a week) during my final year of University. This offer marks the first time I will be "employed for reals", and includes the obvious benefit of a pay rise, as well as the promise of 20% time to work on personal side projects that can benefit the company. 

I had done a lot of thinking leading up to this week as to what I wanted to do once I graduated. Should I do a masters degree? Look at what other job opportunities are available? Or maybe live up to my threat and go back to college and do an art degree? After the last year it didn't take me long to decide that I had had enough of the education system, and frankly I don't know how well I would fit in with a more "professional" company. 

Despite the fact they claim to be getting more "proper" (with a real office and everything), you gotta love the idea that your company is making its millions on porn star rum.

So I accepted. If nothing else, I feel more comfortable graduating with a secure job, which will allow me to more casually monitor other opportunities than if I had graduated unemployed. Not that I expect to be leaving them any time soon. They tried and failed to find a replacement for me, so I must be doing something right.

I wont be joining them full time until after graduation at the end of July, so I have some time before then.

On another topic entirely, SEO is a funny thing. I use quotes from TV shows and video games for the title of all my posts. This has resulted in my blog ranking highly in a Google search for "Do you know who I am? I'm the man who's going to burn your house down", which is just wonderful. I found this out when looking at the referrals this site has been getting. Some of the more interesting (and non-SEO abusing) referrals have been for searches such as "nsurl asynchronous download image progress", "uisearchdisplaycontroller coredata" and "iphone development sqlite or core data". I don't claim to be an expert in any of these subjects, but I'm thinking of writing a few posts on how I did a few things in my project to help people searching for these subjects. There was a lot of work involved in understanding some of this stuff, so maybe I can give developers taking on the insane task of learning object-c in the future a hand.

Here come the test results: You are a horrible person. That’s what it says. Horrible person. We weren’t even testing for that.

Poster Day for the project seemed to go well, especially when you bribe your examiners with whisky samples. A few guys from a local company also attended the session and seemed fairly impressed with my work. They offered me the chance to attend an interview day they were holding, which could have led to a job, however I decided not to submit my CV because apparently they build all their websites in perl…

Quite why you would do that, I'm not exactly sure. They said it gets them "deep down" into the hardware, increasing performance, but I don't really believe them. It appears to me that their first developer knew perl and everyone else was forced to continue using it. The same argument could be made for writing everything in machine code, which I have little desire to do either.

In my last post I showed an early version of the flash game we had to build as a group. The game is now finished, however because its a two player game requiring a server, I can't put it online like I did my first one. Instead I have produced this overly dramatic video demonstrating it.

We worked as a team to create the game. My major contributions to the project were the tank controls, timers and turn switching, the start and end sequences and conceptual designs. Other team members produced the assets (graphics and sound, which are far superior to my previous effort), collision detection, random rock layout and the server side work. We had planned to have other weapon types, but ran out of time. I'm really happy with how it came out though, and its surprisingly fun to play.

With that handed in I have officially completed all the coursework for my degree. All that is left is a couple hand written exams next month. Exciting stuff!

In the meantime I've been getting back into the swing of completing video games. I completed Portal 2 twice (with and without commentary) just after my project. The game is without question a must play, and if you didn't play the original you should play both of them immediately. The writing and humour is some of the best video games has to offer, and the puzzles are perfectly play tested. Valve added so many new unique twists to the original concept that I often sound myself banging my head against a puzzle I couldn't solve, and then remembering that I had a portal gun…

I also went back and completed Assassin's Creed: Brotherhood. Back at the start of the year I played and completed the first two games back to back after getting a PS3 at Christmas, however I stopped playing Brotherhood only a few hours into it after getting some fatigue. While improved, Brotherhood is very much a second act of AC2, so its perhaps not wise to play them consecutively. I did really enjoy the entire game though (I don't think the mechanics of scaling rooftops and assassinating will ever get old), and the ending is as unpredictable as the first two. If your new to the series as I was, and want to catch up, I recommend reading the wikipedia article and watching some YouTube videos for the first game, before skipping it and playing the sequel. While you need to know the story to play AC2, the gameplay in AC1 is incredibly repetitive and frustrating and one of those rare occasions where the sequel is 100% better.

With Brotherhood out the way I'm now enjoying L.A. Noire, Rockstar's mix of Grand Theft Auto and Phoenix Wright. So far I'm enjoying it immensely.

Do you know who I am? I'm the man who's gonna burn your house down! With the lemons!

What's up world?

As I showed in the previous post, I completed the documentation for my project, an epic tome of a report. The last month has been a fairly stressful period in which I spent consecutive days in the same room typing away, while being constantly concerned that all the work simply wasn't going to get done. It was certainly close, but I can now happily say it is done. For those interested in reading more about my project than was represented on this blog, you can check out the two main portions of my report in delightful PDF form.

The Exaiminers Report - This is a short report designed to give a complete overview of the project, aimed at the non-technical reader.

The Product Report - This is a more in-depth report designed to explain, in unnecessary detail, how each individual component of the app works.

This Friday is Poster Day, where we get to show of the final product and get questioned about the project. That will draw a close to my final year project as a whole.

In this glorious post-project world we now live in, I'm moving focus to the last waining weeks of the semester. Last week I had to (quickly) complete two more essays for deadlines, and next week I have a presentation and a multiplayer flash game to hand in. The flash game is a team project and has been quite enjoyable after all this essay writing. Our game is going to be a turn based tank game where you play as either Maria Sharapova on the Soviets team or Sarah Palin on the Republican team.

This screenshot shows the development of the game itself. Ignore the rather unsightly grid, that is there for development purposes only. Currently each client can control their own tank (move forward, backward, rotate the tank and rotate the turret), and the movements of your tank is reflected on your opponents screen. The rocks littering the play field are also randomly positioned when the game begins.

Between all this I've also begun working on a little personal side project in the last couple weeks to get away from all this work. It's a website that allows you to build a list of the games you own and track your progression in them, how long you've played them, if you completed it, etc. It's using Giant Bomb's API so that I don't have to build my own game's database and is coming along nicely. I don't intend to really promote or pimp the final product, its really much more for my own OCD, but I will add sign up functionality should anyone else like to use it. If nothing else, its a fun way to get back into PHP and learn some jQuery. I asked Sputin on MSN for a name that I could get the domain for, and after batting ideas back and forth I eventually settled on "My e-penis.com". If you don't get the joke, its the fact gamer's have refereed to achievements and gamer score as your "e-penis". Its hilarious I know...

Speaking of video games, I really want to blog about them some more now that I'm starting to have some time. I finished Portal 2 (twice!) in breaks from writing my project documentation and this weekend I returned to Assassin's Creed: Brotherhood after a long break. Man is that game fun.

Of course, exams are just over three weeks away, so I'm not off the hook yet.

We gotta go to the crappy town where I'm a hero.

Today marks the beginning of the last week of work on my final year project. I've been spending a lot of time recently writing in elaborate detail about very boring things. Documenting everything isn't terribly fun…

I've done nearly 30 pages for my product report. Tomorrow I will add testing and planning to it and it should be mostly done. Then I need to create a short user manual. And then I need to write the 5000 - 7000 word report to the examiners in which I have to explain my project to people who don't know what the Internet is…

While "working on project without really doing any work" I managed to produce the following video. I thought it might help anyone who bothers to look at the disc submitted with my project as its very unlikely they will actually be able to run my code. It will probably also be useful for my portfolio and poster day…



In other news, Portal 2 arrived today. Its awesome.

You've been seeing parts of the life of a barber in Indiana for seven years, and you never mentioned it?

Alo world! 

So I've been silent on here for about a month now. The last month or so has been pretty hard on me emotionally, with the loss of Tabby the cat on Februrary 24th and Hamish, my family dog, on 14th March. 

Tabby was very old for a cat at 19, and she had been increasingly "loosing it", so her eventual death was to be expected, whether I wanted to accept it or not. I think the thing that truly effected me most with Tabby was the fact she had always been there. Being 22 I don't really recall a time when Tabby wasn't around, and as she got older she eventually confined herself to my bedroom, which made us much closer.  

Hamish was a lot less expected. I knew he was old, sure, but up until about a week before his death he seemed perfectly fine and happy. Unfortunately it seems his breed isn't particularly well designed, because they tend to suffer from incredibly itchy skin that causes them to bite and rip at their hair until it bleeds. To stop this he's been on medication for a very long time. He also had arthritis, ear infections and once nearly went blind in one eye from an infection. Eventually it was the medication that simply became to much for his system and his kidneys began to fail. He stopped eating, and the time came when we had to make the decision. Loosing him upset everyone in the family greatly, including my mum who made herself physically ill for over a week and managed to get an eye infection brought on by stress that could have made her blind. 

Add having to deal with work and university onto this and well… I wouldn't say I have been exactly on my game recently. 

As for my final year project, I didn't get every feature I wanted in the app, however with the deadline just a month away, I had to draw a line and start on the laborious documentation process. Its obviously not feature complete and ready for the app store, but that was never the goal of my project. What I've produced allows you to browse a massive collection of whiskies, whether or not your online, add them to one of four lists (wish list, basket, collection or empties) and then proceed into a checkout when you want to buy something.

What the app doesn't currently do is send the order to the server for processing (not within the scope of my app), allow you to add tasting notes, image caching on the local device for when you are offline, or sync the product data after the initial download. The last three are all things I will discuss in my documentation and are things the final product will do, but I simply didn't have the time when developing my project.

So what have I done to the app since I last talked about it? One of the most obvious changes was improving the product list views. Before you couldn't even read the full product name. Now the full name is readable on two lines, and a small third line provides extra information such as ABV, volume, age and price. At some point it would be neat to get images into list views (they would have to be place holders that change into images as they are downloaded to not affect performance), but I don't have this yet.

On the product "page" I replaced the no image image that was displayed before the product image downloaded with a loading indicator as everyone I showed this to was confused with why the no image image switched to a real image. The loading indicator makes much more sense here, telling the user that the image is loading. 

I also added a couple features to the social card on the product page. This is where you will eventually be able to add tasting notes. For now you have a more clear button that adds the product to a list (for people who miss the + button in the top right), as well as a share with friends and email friends option. The share with friends button gives you the ability to share the product on either Facebook or Twitter. This is done by launching the selected website in mobile Safari with the product's URL pre-populated. One day this might be better implemented by using the services API's to keep you inside the app. The other option, email friends, launches an email form with URL pre-populated.

One other small change, the add to list screen now gives a clear indication to the user when a product is out of stock by making the basket button red, however they still have the option to add it to their basket if they wish.

With the small changes covered, we move on to the lists screen, which is where the majority of my time has been consumed. To be honest, this feature took much longer than I had originally anticipated. The list screen was originally four separate instances of the same view accessible in the tab bar along the bottom of the screen, however the client suggested it would be better to consolidate these into one screen to give them the ability to have other options in the tab bar later. I achieved this using a segment control. When you select one of the lists in the segment control, the table view bellow is refreshed with different data.

You can click on an item in a list, which spins the screen to reveal the ability to adjust quantity. I imagine in the future that this screen would also be where you would add accessories or a gift message to a product. When you try to save the quantity the app does a call to the server if the current list is the basket. If the server responds with the product is currently out of stock, the quantity of the product is set to zero and the user is told to remove it from their basket. If the user requests more bottles than we currently have they are alerted of the current stock level and asked to select a different quantity. If there is no internet connection the app will accept whatever quantity the user asks for, and will instead alert the user of any issues with their basket when they try to go to checkout.  

The list view allows you to delete a product by swiping and clicking the delete button, or by clicking edit, the red circle, and then the delete button. By clicking edit they can also re-order the list using the little icon to the right of every item. To achieve this I had to add a rank field to the database that indicates the order of the items in the list. Every time a product is delete or moved, the ranking order has to be re-assigned for the entire list. Add a product simply requires adding one to the current total of list items.

Clicking the checkout button takes you to the checkout. If you are offline you are stopped immediately, as the checkout requires a connection to the server. If your basket has issues (such as an out of stock product or a larger quantity than we can provide), an error message is displayed and the user is required to go and correct it. If everything is successful the server responds with a set of delivery options.

I had a meeting with my client to spec how the delivery options would work. Their currently delivery algorithm is over complicated and in need of a re-write, so I was asked to write a simple algorithm for the iPhone app (which only needs to concern itself with UK orders) until the new one is built.

The business rules for the delivery algorithm I built are:

If all the stock required is available at the local warehouse offer:

1. next day (two day if after 3pm) for £6.95
2. three day for £5.95
3. five day for £4.95 (£3.95 if the order has one bottle)

If some of the stock is only available from the supplier in Scotland offer:

1. Ship each item as it is ready for £13.90 (two deliveries of £6.95)

• the local stock will be delivered next day or two day if after 3pm
• the supplier stock will be delivered in four days

2. One Delivery (saves money)

1. four day for £6.95
2. six day for £5.95
3. eight day for £4.95

If all the stock is only available from the supplier in Scotland offer: 

1. four day for £6.95
2. six day for £5.95
3. eight day for £4.95

I used the UIPicker control to offer these options in the checkout. This particular control caused a lot of problems, mostly due to my inexperience with how it worked. 

If you try to submit the order without providing your details, you will be rejected. The user has the ability to add a delivery address, billing address and payment method to the order. The app keeps a list of every address and payment method added, allowing the user to simply select an existing one if it has already been entered (e.g. from a previous order or if the billing address is the same as the delivery). The screens where these details are entered are probably the least polished part of the app as it stands today, with little validation or enhancements, such as a UIPicker for selecting title and card expiry dates. You also have to click into the address/payment method to have it "selected" for the order. A better way to do with would be having clicking the item in the list select it (with some sort of indicator that it is selected, like a check mark), and the user having to enter an edit mode to have clicking the item take you to the edit screen.

Finally when the completed order is submitted, a confirmation is provided, although as I mentioned before, the order is not sent to the server. For poster day I would like to have a very basic implementation of sending the order to a temp table on the server's database and displaying that on a grid view so I can demo the phone sending the order and the site receiving it just to prove it works (although no processing or charging will have taken place obviously), however I have yet to do this. 

So thats an update. From here on its documentation time.