Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/folletto/ding
A little gamification technique code gimmick
https://github.com/folletto/ding
Last synced: 10 days ago
JSON representation
A little gamification technique code gimmick
- Host: GitHub
- URL: https://github.com/folletto/ding
- Owner: folletto
- Created: 2011-08-26T23:54:44.000Z (about 13 years ago)
- Default Branch: master
- Last Pushed: 2012-01-02T17:50:31.000Z (almost 13 years ago)
- Last Synced: 2024-10-24T17:10:05.200Z (25 days ago)
- Language: JavaScript
- Homepage: http://intenseminimalism.com
- Size: 160 KB
- Stars: 5
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Project Ding
============**Simple gamification technique gimmick "coin" engine.**
WHAT IS DING
------------Ding is a tiny javascript that create the HTML equivalent of the coin box in Super Mario, but instead of hitting it with the head of Mario, you click. When you reach the last click, the action triggers.
USAGE
-----Ding has a very simple basic usage.
1. Define the .ding-sprite CSS class, specifying the image and effects you'd like to show.
2. Include ding.js in the page.
3. Initialize Ding, passing an hash of ids and the number of clicks required to trigger them:
```
Ding.init({
"#id": 1,
"#id2": 5
});
```That's all... but of course, you might want to do something more with it. That's why it supports extensions.
EXTENSIONS
----------A Ding extension will be executed every time a user clicks on a Ding-enabled link.
The syntax is as follows:
```
Ding.x.extensionName = function(selector, countdown) {
// do your stuff here
return 5; // optional
}
```The return value is optional. If specified, it replaces the current countdown value for the clicked object.
COMPATIBILITY
-------------Tested on:
- Chrome 13 - 16 _(should work since Chrome 3)_
- Firefox 3.5 - 7.0
- Safari 5.1 _(should work since Safari 3)_
- Opera 10.10
- _should work in IE9_TODO
----- Test properly on multiple browser
- Add some kind of CSS sprite extension hooks
- Fallback compatibility for audio (not only HTML5)LICENSE
-------_Copyright (C) 2011, Davide Casali_
_Licensed under **BSD Opensource License** (free for personal and commercial use)_> _Ding! Ding! Ding! Ding!_