Google Script: set status message on a label with ClientHandler

I wrote a handy Google Script that is useful for time-consuming tasks that run on Google Servers. The script knows four states: Idle, Loading, There was an error, Done and it is triggered if you click on the button. Feel free to test the script here!

Here is my code:

function doGet() {
  var app = UiApp.createApplication();

  var panel = app.createVerticalPanel();

  var button = app.createButton('Submit');
  panel.add(button);

  var label = app.createLabel('Idle.')
                 .setId('statusLabel');
  panel.add(label);

  var sHandler1 = app.createServerHandler('submitChange');
  sHandler1.addCallbackElement(panel);

  var sHandler2 = app.createServerHandler('setOkStatus');
  sHandler2.addCallbackElement(panel);

  var checkbox = app.createCheckBox()
      .setId('statusCheckbox')
      .setName('statusCheckbox')
      .addValueChangeHandler(sHandler2)
      .setVisible(false);
  panel.add(checkbox);

  var cHandler1 = app.createClientHandler()
      .forTargets(label)
      .setText('Loading…');

  var cHandler2 = app.createClientHandler()
      .forTargets(checkbox)
      .setValue(false);

  button.addClickHandler(cHandler1);
  button.addClickHandler(cHandler2);
  button.addClickHandler(sHandler1);

  app.add(panel);

  return app;
}

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

  var label = app.getElementById('statusLabel');
  label.setText('Saving…');

  var checkbox = app.getElementById('statusCheckbox');
  checkbox.setVisible(false);

  var yourStatus = true;

  if(yourStatus) {
    checkbox.setValue(true, true);
  } else {
    label.setText('There was an error…');
  }

  return app;
}

function setOkStatus(e) {
  var app = UiApp.getActiveApplication();
  var label = app.getElementById('statusLabel');

  if(e.parameter.statusCheckbox) {
    label.setText("Done.");
  }

  return app;
}

Now discuss! :)

links

social