Code

Shoot The Gift Game Template

Shoot The Gift Game Template

Shoot The Gift Game Template

If you are going to give vouchers or coupons to your website users, this game template is the right tool for you. Your website users will play first before they get the voucher you gave. After they win a simple game, you can direct them to the page you want. You can easily customize images, messages, and urls just by modifying the given json file. You can do that even if you don’t have programming skills.

Documentation

Read the documentation here

Installation

You can install the application by running the index.html file via a portable server such as php-cli or placing a folder on the hosting you have.

Modifying the Game

The file structure of the game is like this:


- index.html
+ images
+ js
  - gamedata.json
  - app.js
  - dust.js
  - pixi.js
  - bump.js
  - charm.js

To customize the game you can modify the gamedata.json file. The structure of data is like this:


{
  "screen": "poltrait",
  "showReplayButton": true,
  "spinSpeed": 0.02,
  "shootSpeed": 25,
  "maxArrow": 3,
  "lose": {
    "title": "You Lose!",
    "note": "This is note for player when get lose" 
  },
  "win": {
    "title": "Awesome!",
    "note": "Get your voucher by clicking blue button" 
  },
  "assets": [
    {
      "name": "circle",
      "src": "./images/circle.png" 
    }
  ],
  "gifts": [
    {
      "name": "gift1",
      "src": "./images/gift.png",
      "rotation": 0,
      "data": {
        "url": "http://google.com" 
      }
    }    
  ]
}

screen Orientation of the screen

showReplayButton Boolean. True value will show the replay button when player shoot the box.

spinSpeed Double. Speed of the spin of circle.

shootSpeed Integer. Speed of arrow.

maxArrow Integer. Maximum of arrows.

assets Array of game assets.

gifts.name Name of gift. Required no space.

gifts.src Urls of gift image. Use the small pixel of image.

gifts.rotation Angle in degree. The position of gift asset in circle.

gifts.data Url to redirect when player press the Get Voucher button.

by
by
by
by
by
by