function demoAction1 () {
  if (window.webkit && window.webkit.messageHandlers.sketchPlugin) {
    //    window.webkit.messageHandlers.sketchPlugin.postMessage(JSON.stringify({}));
    window.webkit.messageHandlers.sketchPlugin.postMessage('Button_1 clicked');
  } else {
    console.error("Could not to find 'sketchPlugin' message handler.");
  }
};

function demoAction2 () {
  if (window.webkit && window.webkit.messageHandlers.sketchPlugin) {
    window.webkit.messageHandlers.sketchPlugin.postMessage('Button_2 clicked');
  } else {
    console.error("Could not to find 'sketchPlugin' message handler.");
  }
};

document.addEventListener('DOMContentLoaded', () => {
  document.getElementById('demoButtonID1').addEventListener('click', () => {
    demoAction1();
  });
  document.getElementById('demoButtonID2').addEventListener('click', () => {
    demoAction2();
  });
});
