title: Google apps script UI services to HTML services
body: <p>I try to convert this simple google apps script code below to HTML services code. 
  The code below is written with the <strong>deprecated</strong> google apps script UI services!
  Can anyone help me with HTML services example code in this usecase?</p>
  
  <pre><code>// Script with deprecated UI-services
  // How to create this app with HTML-services?!!!?
  //This script runs in a google website.
  //It has one textobject and 1 button.
  //when the button is pressed the value entered is stored in the spreadsheet
  
  ssKey = 'sheetkey....';  
  
  function doGet(){ 
    var app = UiApp.createApplication().setTitle('myApp');
  
    //Create panels en grid
    var MainPanel = app.createVerticalPanel();
    var Vpanel1 = app.createVerticalPanel().setId('Vpanel2');
    var grid = app.createGrid(4, 2).setId('myGrid');
  
    //Vpanel1 widgets
    var nameLabel = app.createLabel('Name');
    var nameTextBox = app.createTextBox().setWidth('400px').setName('name').setId('name');
    var submitButton = app.createButton('Verstuur').setId('submitButton');
      grid.setWidget(0, 0, nameLabel)
      .setWidget(0, 1, nameTextBox)
       .setWidget(1, 1, submitButton);
  
    //Set handlers en callbackelement
    var handler = app.createServerClickHandler('InsertInSS');
    handler.addCallbackElement(Vpanel1);
    submitButton.addClickHandler(handler); 
  
    // build screen
    Vpanel1.add(grid);
    app.add(Vpanel1);
  
    return app;
  }
  
  function InsertInSS(e){
    var app =UiApp.getActiveApplication();
    var collectedData = [new Date(), e.parameter.name] ;
  
    var SS = SpreadsheetApp.openById(ssKey);
    var Sheet = SS.getSheetByName('Contacts');
    Sheet.getRange(Sheet.getLastRow()+1, 1, 1, collectedData.length).setValues([collectedData]);
  
    app.getElementById('submitButton').setVisible(false);
  
    //Reset fields on screen
    app.getElementById('name').setText("");
  
    return app;
  }
  </code></pre>