Creates a counter object that holds a numeric value that can be increased and decreased using actions, running lists of actions contextually and when reaching a specific target value.
This is perfect for creating games or gamification experiences: in the following example, the end user has to drag the correct ingredients to cook a risotto with tomato and beans, dropping the right ingredients on the pot increases the counter, while dropping the wrong ones does not. When the counter reaches the target value, set to 3 like the number of the correct ingredients, the Reached Target Value event of the counter is triggered and its actions are executed, moving the chef inside the page.
Counter object supports all Generic Controller Properties, plus the ones listed below. To edit properties of a Counter object, select it and use the selection inspector at the right of your project window.
|Target Value||Defines the counter target value: when the counter reaches this value, the Reached Target Value event is triggered|
|Initial Value||The initial value of the counter when the page loads|
|Can Exceed Target Value||If enabled, calling action Increase on a counter that has already reached its target value will still increase the counter value, otherwise it will have no effect|
Counter object responds to all Generic Controller Events, plus the ones listed below. To edit event handlers for a counter object, select it and use the Interactivity Panel on the right side of the project window.
Triggered when the value of the counter is triggered using a Decrease Counter action
Triggered when the value of the counter is triggered using a Increase Counter action
Reached Target Value
Triggered when the value of the counter is reached
Triggered when the value of the counter changes
Counter object can be used as a target of the following actions:
|Target||Counter object to increase value to|
|Amount||Number to be added to the value of the target counter|
|Target||Counter object to decrease value to|
|Amount||Number to be subtracted to the value of the target counter|
Set Counter Value
|Target||Counter object to set value to|
|Value||The new value to assign to the target counter|
Though not visible to the end user, each Counter object is exported as an invisible
div element on the html page:
<div id="obj4" class="SCPageObject SCCounter"></div>
var counterValue = PubCoder.getCounterValue("#obj4");