Score Board


Html

JavaScript
/* Options */
var options = {
  // Sort in ascending or descending order. Use 'asc' for ascending. Use 'desc' for descending.
  order: 'asc', 
  // Row height.
  rowHeight: 40,
  // Vertical space between two rows.
  space: 0,
  // Animation speed.
  speed: 10,
  // Global text font.
  font: '20px Arial'
};

/* Constructor */
var scoreBoard = new zeu.ScoreBoard('score-board', options);

/* Function */
// Add a row to the scoreboad. The rows in the board will be sorted by score.
scoreBoard.add({
  // Unique row id.
  id: 'row-1',
  // Score number.
  score: 10,
  // Background color.
  bgColor: '#f32617',
  // Text.
  text: {
    // Text value.
    value: 'Text Value',
    // Text color.
    color: '#ffffff',
    // X offset from the left of the row.
    xOffset: 15,
    // Y offset from the top of the row.
    yOffset: 28
  }
});

// Update a row by id. The rows in the board will be reordered.
scoreBoard.update({
  // Unique row id.
  id: 'row-1',
  // Score number.
  score: 10,
  // Background color.
  bgColor: '#f32617',
  // Text.
  text: {
    // Text value.
    value: 'Text Value',
    // Text color.
    color: '#ffffff'
  }
});

// Remove a row by id. The rows in the board will be reordered.
scoreBoard.remove('row-1');