JSignage:InteractiveTutorial1

Description

Simple push button

• Demonstrates how to install basic click handlers.

Source code

$.uiStyle = 'round';

var counter = 0, more, less, counterArea;

$('svg').add([
  more = $.pushButton( { left: 100, top: 100, width: 200, height: 60, fontWeight: 'bold', begin: 0 }, 'More' ),
  less = $.pushButton( { left: 400, top: 100, width: 200, height: 60, fontWeight: 'bold' }, 'Less' ),
  counterArea = $.textArea( {
    left: 700, top: 100, width: 100, height: 60,
    fontSize: 'max',
    fill: 'black',
    textAlign: 'end',
    frame: { frameColor: 'black', padding: 5, frameSize: 2 }
  } ).text( 0 )
]);

more.click( function() {
  counterArea.text( ++counter );
});

less.click( function() {
  counterArea.text( --counter );
});