Skip to content

horans/game-feature-board

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

10 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Game: Feature Board

"Game: Feature Board" (or "GFB"), will display icons of feature on an "n x n" board with disguised icons. It will calculate how much time take user to click on all the right icons.

  • Level select.
  • Result list.
  • Game tips.
  • notify parent window.

Basic

Install

Upload everything to your server, eg.:

//sample.com/gfb/

Usage

Embed iframe.html into your page, eg.:

<iframe src="//sample.com/gfb/iframe.html" frameborder="0" width="835" height="650"></iframe>

Advanced

Setup

GFB uses config file to setup everything. Look into the default config.json in asset folder for details. You can also pass your own config file to iframe, eg.:

<iframe src="//sample.com/gfb/iframe.html?config=my-features.json"></iframe>

Icons

Icons have to be svg with flatten path to change color.

APIs

GFB uses dummy jsons for preview only. Setup your own API to add/get results, or get GEOIP country code.

Notices

GFB will notify parent window by window.postMessage(), when each round of game is finished, and when user submit their score.

// with jquery
$(window).on('message', function (e) {
  console.log(e.originalEvent.data)
})
// with native
window.addEventListener('message', function(e) {
  console.log(e.data)
}, false)

Extra

Vendor

Linter

Change Log

210311
# update vendors

180813
+ notify parent window

180811
+ add flags

180810
+ add top scores

180807
+ initial release