Hello There, Guest! Register

Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Dev Diary - Order Form (11/11/08)
11-11-2008, 05:32 AM, (This post was last modified: 11-11-2008, 02:13 PM by Jimmie.)
#1
Star  Dev Diary - Order Form (11/11/08)
Welcome to the first dev diary. What is it? Well the dev diaries are places I spew all my thoughts and ideas into one thread about the development of THT. I'll mostly post these in the mornings when my brain is too lazy to actually look at code. So today, I'll be doing about the:

Order Form
My idea for a order form in a script is what gave birth to THT. The order form idea was the spark for this script, It was just running around in my mind to be created. What was the idea then? Well the idea was simple. A one loading, fully JS/AJAX order form that once loaded didn't have to load again, even when creating the account. Was that achieved? Sure was. This order form, personally, is the best work myself has ever done. It flows well, I can't spot any easy bugs, unlike order forms in my previous work. It loads one, and that's just to load the order form up. All this didn't come without alot of hard work, new skills, new languages. Now I'll explain the steps.

Step One
Step one is titled "Choose Hosting". What this simply, is it's the place where you select either if your domain/subdomain and your package. Package is on the same page as domain/subdomain..Why? Well, unlike my previous work where I did the package at the start, THT includes it on the first step of the order form, with a description box including a nice slide effect for when a different package is selected. If a package isn't selected and next is tried to be clicked, then it will show a cross between back and next buttons. You'll also notice the tooltip, these tooltips are on every step minus creating and the guide the user into what every box does. Here's a preview:
[Image: steponeoy9.png]

Step Two
Step Two is titled "Terms of Service". This step is simple really and doesn't need a hefty description. It retrieves the TOS that is fully HTML welcomed and editable from the ACP and displays it on the page and makes sure the user agrees to it. If the box isn't clicked, a cross will display underneath and won't carry on. Here's a preview:
[Image: steptwoel2.png]

Step Three
Step Three is title "Client Account". This step is where the user enters all their details in for their client account. Its a very AJAX filled help form that is perfected so it doesn't have any annoying stupid bugs or doesn't work properly. It checks if the username is valid and doesn't exist, the password and confirm password are the same and valid and it checks if the email is right format but doesn't exist. It doesn't check if the email exists because I'm allowing the power to have multi accounts really, and if more than one account is made by the user, then the user would like to use the same email really. This step includes tootips on every box and explains the stage pretty well. Here's a preview, you'll notice that I deliberately got something wrong, this is because I wanted to show you the little cross at the bottom Wink. It doesn't allow Jonny because there's already an account on there with that username.
[Image: stepthreerc9.png]

Step Four
Step Four is titled "Hosting Account". This is simple because this is the area where you enter your domain/subdomain and any package type forms. So this could be your Forum Username and Forum Password for example. After this step, there's the creating account stage, doesn't really need explaining. Here's a preview of step four:
[Image: stepfourcv6.png]

Why I love it..
I simply love this piece of work. I'm trying not to be big headed here while explaining. I love this piece of work because it includes nice effects, this can be slide effects or the fade in/out between steps. This can only be given justice by using it. Also, it includes back step. This is VERY useful since when you click back on ANY step it includes all the data you entered on the previous step. So for example, if creating account was denied for any reason, you simply can browse back steps, change it, and go back to step 5.

Thanks for your time into reading this diary. I'll be looking forward to releasing this to the public. The estimated area for the release of THT is the end of November. Feedback is warmly appreciated.

Thanks alot,
Jonny H - The Main Developer for THT
Jonny H - THT Main Developer & Founder


11-11-2008, 02:15 PM,
#2
RE: Dev Diary - Order Form (11/11/08)
Great Diary Jonny Smile
Just updated your post to show the images directly, because a few people get into imageshack and it gets full of popups and sound ads o_O

Keep up the good work, I'm always here to cheer you up and to help you Wink
Jimmie Lin - Community Manager & THT.Next Developer


Forum Jump:


Users browsing this thread: 1 Guest(s)