Skip to content

Instantly share code, notes, and snippets.

@zaki-yama
Last active May 24, 2018 20:08
Show Gist options
  • Select an option

  • Save zaki-yama/3845d9b1cda77e202f96 to your computer and use it in GitHub Desktop.

Select an option

Save zaki-yama/3845d9b1cda77e202f96 to your computer and use it in GitHub Desktop.
Google Apps Script (HtmlService) + Polymer でwebアプリケーションのサンプル
<!DOCTYPE html>
<html>
<head>
<script src="//polymerstaticfiles.appspot.com/bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="//polymerstaticfiles.appspot.com/bower_components/font-roboto/roboto.html">
<link rel="import" href="//polymerstaticfiles.appspot.com/bower_components/core-header-panel/core-header-panel.html">
<link rel="import" href="//polymerstaticfiles.appspot.com/bower_components/core-toolbar/core-toolbar.html">
<link rel="import" href="//polymerstaticfiles.appspot.com/bower_components/paper-tabs/paper-tabs.html">
<meta name="viewport"
content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<?!= include('index.css'); ?>
</head>
<body unresolved fullbleed layout vertical>
<core-header-panel flex>
<core-toolbar>
<paper-tabs class="fit" selected="messages" flex>
<paper-tab name="messages">Messages</paper-tab>
<paper-tab name="favorites">Favorites</paper-tab>
</paper-tabs>
</core-toolbar>
</core-header-panel>
<?!= include('index.js'); ?>
</body>
</html>
<style>
core-toolbar {
background: #03a9f4;
color: white;
}
paper-tabs {
text-transform: uppercase;
}
</style>
<script>
var tabs = document.querySelector('paper-tabs');
tabs.addEventListener('core-select', function() {
console.log("Selected: " + tabs.selected);
});
</script>
function doGet() {
return HtmlService.createTemplateFromFile('index')
.evaluate()
.setTitle('Polymer Sample') // <title> タグでなくこのようにセットする
.setSandboxMode(HtmlService.SandboxMode.IFRAME);
}
function include(filename) {
return HtmlService.createHtmlOutputFromFile(filename)
.setSandboxMode(HtmlService.SandboxMode.IFRAME)
.getContent();
}
@jobdiogenes
Copy link

I think that file names is "index".html where is Code.gs, and where is "main.js" is "Code.gs"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment