Note, counters also offer an interface for manipulations through JS.
Checkout: src/UI/templates/js/Counter/counter.js for a complete spec.
15{
17 $f =
$DIC->ui()->factory();
18 $renderer =
$DIC->ui()->renderer();
19
20
21 $like =
$f->symbol()->glyph()->love(
"#")
22 ->withCounter(
$f->counter()->novelty(3))
23 ->withCounter(
$f->counter()->status(0));
24
25 $set_status_button =
$f->button()->bulky($like,
"Set Status Counter to 10 on click.",
"#")
26 ->withAdditionalOnLoadCode(
27 function ($id) {
28 return "
29 $(\"#$id\").click(function() {
30 il.UI.counter.getCounterObject($(this)).setStatusTo(10);
31 });";
32 }
33 );
34
35 $increment_novelty_button =
$f->button()->bulky($like,
"Increment Novelty Counter by on click",
"#")
36 ->withAdditionalOnLoadCode(
37 function ($id) {
38 return "
39 $(\"#$id\").click(function() {
40 il.UI.counter.getCounterObject($(this)).incrementNoveltyCount(1);
41 });";
42 }
43 );
44
45 $set_novelty_count_to_status_button =
$f->button()->bulky($like,
"Set Novelty Count to status on click",
"#")
46 ->withAdditionalOnLoadCode(
47 function ($id) {
48 return "
49 $(\"#$id\").click(function() {
50 il.UI.counter.getCounterObject($(this)).setTotalNoveltyToStatusCount(1);
51 });";
52 }
53 );
54
55
56 $combined_button =
$f->button()->bulky($like,
"Some chained actions",
"#")
57 ->withAdditionalOnLoadCode(
58 function ($id) {
59 return "
60 $(\"#$id\").click(function() {
61 var counter = il.UI.counter.getCounterObject($(this));
62 counter.setNoveltyTo(3);
63 counter.setStatusTo(3);
64 counter.incrementStatusCount(1);
65 counter.setTotalNoveltyToStatusCount();
66 console.log(
67 counter.getStatusCount()
68 );
69 });";
70 }
71 );
72
73 return $renderer->render([$set_status_button,$increment_novelty_button,$set_novelty_count_to_status_button,$combined_button]);
74};