CheckBox with GUI

checkbox_with_gui.js

// Script-as-app template.
function doGet() {
  // GUIビルダーで初期表示
  var app = UiApp.createApplication();
  var myGui = app.loadComponent("MyGui");
  app.add(myGui);

  // 初期値設定
  UserProperties.setProperty("red"    ,false);
  UserProperties.setProperty("blue"   ,false);
  UserProperties.setProperty("yellow" ,false);
  
  return app;
}

function checkHandler(e) {
  var app = UiApp.getActiveApplication();

  var color;
  // 押されたチェックボックスのIDを調べてどの色のプロパティを変更するか調べる
  switch(e.parameter.source) {
    case "CheckBox1":
      // 赤
      color = "red";
      break;
    case "CheckBox2":
      color = "blue";
      break;
    case "CheckBox3":
      color = "yellow";
      break;
  }
  // 反転
  if (UserProperties.getProperty(color) === "false") {
    UserProperties.setProperty(color, "true");
  } else {
    UserProperties.setProperty(color, "false");
  }

  
  // Labelの色更新
  // 若干冗長だけど...Labelとかの名前付けで回避しないと...
  if (UserProperties.getProperty("red") === "true") {
    app.getElementById("Label1").setStyleAttribute("color", "red");
  } else {
    app.getElementById("Label1").setStyleAttribute("color", "black");
  }  

  if (UserProperties.getProperty("blue") === "true") {
    app.getElementById("Label2").setStyleAttribute("color", "blue");
  } else {
    app.getElementById("Label2").setStyleAttribute("color", "black");
  }  

  if (UserProperties.getProperty("yellow") === "true") {
    app.getElementById("Label3").setStyleAttribute("color", "yellow");
  } else {
    app.getElementById("Label3").setStyleAttribute("color", "black");
  }  
  
  app.close();
  return app;

}