// sample-2-checkboxes-processing.js
// This sample shows processing of checkboxes after they have been set.

// onload set the body's color and background color, and reset each checkbox
function loaded()
  {

  // reset division colors
  var my_div = document.getElementById("my-div");
  my_div.style.color = "green";
  my_div.style.backgroundColor = "white";

  // reset checked in each checkbox
  var my_border_checkbox = document.getElementById("my-border-checkbox");
  my_border_checkbox.checked = false;
  var my_background_checkbox = document.getElementById("my-background-checkbox");
  my_background_checkbox.checked = false;
  var my_color_checkbox = document.getElementById("my-color-checkbox");
  my_color_checkbox.checked = false;
  }

// onclick Execute changes button will process the checkboxes
function my_execute_changes()
  {
  var my_div = document.getElementById("my-div");

  // set background to gray if checked, otherwise set background to white
  var my_background_checkbox = document.getElementById("my-background-checkbox");
  if(my_background_checkbox.checked)
    {
    my_div.style.backgroundColor = "#cccccc";
    }
  else    
    {
    my_div.style.backgroundColor = "white";
    }

  // set border style to dashed if checked, otherwise set border style to double
  var my_border_checkbox = document.getElementById("my-border-checkbox");
  if(my_border_checkbox.checked)
    {
    my_div.style.borderStyle = "dashed";
    }
  else    
    {
    my_div.style.borderStyle = "double";
    }

  // set color to red if checked, otherwise set color to black
  var my_color_checkbox = document.getElementById("my-color-checkbox");
  if(my_color_checkbox.checked)
    {
    my_div.style.color = "red";
    }
  else    
    {
    my_div.style.color = "black";
    }

  }