Developing Time Killer the app

After creating the designs for my app it was now time for the tricky part, coding the thing! Firstly though, in order for my app to make a final decision I created a database with all the possible end results and a rating system based on all of the answers to the questions I’ll be asking. The database can later be attached to my code via jQuery.

As I knew the tricky part of coding my app would be linking up the spreadsheet and the jQuery involved in making the final decision, I decided to start by making something that somewhat resembled the designs I created in Photoshop.

I created the first page using HTML and CSS but later found that I would need to incorporate some JavaScript to create the question pages for my app. As I was unfamilar with JavaScript I searched around and eventually found a jQuery Show/Hide tutorial which was perfect for what I needed to do: http://www.w3schools.com/jquery/jquery_hide_show.asp. After a couple of tries I successfully incorporated this jQuery into my code enabling me to show and hide HTML divs on button clicks.

Line 67 allowed me to select which button I wanted to have the function. In this case it was the button with the id “start”.

Line 68 shows the id of the div that I wanted to hide on the button click.

Line 68 shows the id of the div that I wanted to show on the button click.

Once the first hide/show jQuery was working, getting more pages to work was rather simple and involved a lot of copy and pasting eventually linking up all my pages on button clicks.

Below is a video of a screen capture showing that the jQuery works. Some of the questions and answers may still need to be changed but at least the code works!