Use button to open URL in new window with Google A

Question

I am writing an application for the new Google Sheets to integrate another API with Sheets. I need to authorize the user by opening a new window allowing the user to login to authorize my app.

So far the only way I have found to do this is with a simple hyperlink. Is there a way to do this with a button that calls a function on the backend? I can't figure out anything that works to open a link in a new window when a user clicks on a button.

NOTE: I want to do this to be consistent with the UI. I need to add an "authorize" and a "deauthorize" button. The deauthorize button just calls a function to delete the access token from the users account, but the authorize button needs to open a new URL to send the user to another site to login.

Answer 1

Here is a possible solution using an auto open sidebar, it looks like this :

and the code below :

function onOpen() {
  var shUi = SpreadsheetApp.getUi();
  var app = UiApp.createApplication().setTitle('Custom functions');
  var panel = app.createVerticalPanel().add(app.createHTML('please select an option below').setStyleAttribute('padding','10px'));
  var grid = app.createGrid(1,2).setWidth('200');
  var dHandler = app.createServerHandler('removeAuth');
  var b1 = app.createButton("Authorize");
  var b2 = app.createButton("De-authorize",dHandler).setTitle('remove authorization');
  var link = app.createAnchor('XXXXX','http://www.google.com').setStyleAttributes({'zIndex':'1' , 'position':'fixed' , 'top':'45' , 'left':'20', 'color':'transparent' }).setTitle('proceed in a new tab');
  var G1 = app.createVerticalPanel().add(b1).add(link);
  grid.setWidget(0,0,G1).setWidget(0,1,b2);
  app.add(panel).add(grid)
  shUi.showSidebar(app);
}

function removeAuth(){
  // some code
}

Answer 2

In Apps-script you can't open a new tab with button click events, But this can be made through Anchors. So create a anchor and set the Href with the link to be opened in a new tab. To get a Button feel you can set the StyleAttribute for the anchor with a background-image property.

var anchor1 = app.createAnchor('Authorize','http://www.google.com')
                 .setStyleAttribute('backgroundImage','url('tree.png')');