EasyRead Wheel of fortune

EasyRead Wheel of fortune

So my Co-founder Anna suddenly had an idea to give out promotion using a fun game of wheel of fortune. So we had decided to built one.

First research Wheel of Fortune.

There is 3 which i think is great.

HTML5+ javascript

  • http://www.dougtesting.net/winwheel
  • http://tech.pro/tutorial/1008/creating-a-roulette-wheel-using-html5-canvas
  • http://www.html5canvastutorials.com/labs/html5-canvas-wheel-of-fortune/



Let’s get crackin

I liked the Jquery one but the Jquery version had some bugs with IE .Decided to go with:

  • http://www.dougtesting.net/winwheel

Unzipped the whole folder into geteasyread

Change info and remove the code to choose the strength

Needed to force javascript refresh instead of keep clearing my cache but you could put your browser in developer mode as well. But i used these one liner instead.

Forced javascript refresh


Ok great the wheel works, now we need user to enter their email and name before proceeding so that they don’t cheat.

Used PureCss to built the page and form.

Used Medoo as micro php framework for database. Important as it has security to Prevent SQL injection. Remember to turn on error report when developing.

After modifying the pureCSS I needed some simple validation.

Ok both items are working well individually.

Now we need to merge them.

First we need to be able to save inputs from form.

Now that we are able to identify who the spinner is, we just need user to spin the wheel and we capture that and automatically save it.

First we need to be able to save the value from the javascript spin. We do that by using javascript to save the value of the price into a hidden field and call form submit after user has read the alert message.


we need the id of  the row added to be able to update the record with the discount value.

so we get the

$ID = mysqli_insert_id($con);

and echo the value into a hidden input to be sent by form.

output a thank you page with facebook share link


Fill in the form below to get the source code. Unfortunately I am unable to provide support but am glad to do freelance work. Good luck!

[email-download download_id=”430″ contact_form_id=”429″]


Submit a Comment