Add autoroll server

res/imp/9/app-sk.html

 <!--
 `app-sk` provides general application layout, introducing a
 responsive scaffold containing a header, toolbar, menu, title and
 areas for application content, as well as automatic inclusion of
 common menu items, login status, and version tag.
 
 Example:
 
     <app-sk mode="standard" responsive_width="600px" drawer_width="230px">
       <h1 header>Title goes here</h1>
@@ skipping 10 matching lines @@
       Change this if the header accepts a different class for toggling height,
       e.g. "medium-tall"
 
   drawer_width - Width of the drawer panel, eg. "200px".
 
   force_narrow - Whether or not to force the paper-drawer-panel into narrow
       mode.
 
   narrow - Whether or not the paper-drawer-panel is currently in narrow mode.
 
+  no_drawer - If true, no drawer panel is displayed at all.
+
   responsive_width - Screen width at which the paper-drawer-panel switches into
       narrow mode.
 
 Methods:
   None.
 
 Events:
   None.
 -->
 <link rel="import" href="/res/imp/bower_components/iron-flex-layout/iron-flex-layout.html">
 <link rel="import" href="/res/imp/bower_components/iron-icons/iron-icons.html">
 <link rel="import" href="/res/imp/bower_components/paper-drawer-panel/paper-drawer-panel.html">
 <link rel="import" href="/res/imp/bower_components/paper-header-panel/paper-header-panel.html">
 <link rel="import" href="/res/imp/bower_components/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="/res/imp/bower_components/paper-toolbar/paper-toolbar.html">
 <link rel="import" href="app-menu-sk.html">
+<link rel="import" href="error-toast-sk.html">
 <link rel="import" href="login.html">
 <link rel="import" href="version-sk.html">
 <dom-module id="app-sk">
   <style>
   #drawer {
     box-shadow: 1px 0 1px rgba(0, 0, 0, 0.1);
   }
   #mainContent {
     overflow: scroll;
   }
   #menuButton {
     padding-right: 18px;
   }
   paper-toolbar {
     @apply(--app-sk-toolbar);
   }
   paper-drawer-panel {
     --paper-drawer-panel-main-container: {
       @apply(--app-sk-main);
     };
     --paper-drawer-panel-left-drawer-container: {
       @apply(--app-sk-drawer);
     };
   }
   </style>
   <template>
     <paper-header-panel id="headerPanel" mode="{{mode}}" tallClass="{{tall_class}}">
       <paper-toolbar>
-        <template is="dom-if" if="{{narrow}}">
+        <template is="dom-if" if="{{_showMenuButton}}">
           <paper-icon-button id="menuButton" icon="icons:menu" on-tap="_togglePanel"></paper-icon-button>
         </template>
         <content select="[header], header, [toolbar], toolbar"></content>
         <div class="flex"></div>
         <app-menu-sk></app-menu-sk>
         <login-sk></login-sk>
       </paper-toolbar>
-      <paper-drawer-panel id="drawerPanel" drawer-width$="{{drawer_width}}"  responsive-width$="{{responsive_width}}" force-narrow$="{{force_narrow}}">
-        <div drawer id="drawer" class="vertical layout">
-          <content select="[navigation], nav, [drawer], drawer"></content>
-          <div class="flex"></div>
-          <version-sk></version-sk>
+      <template is="dom-if" if="{{no_drawer}}">
+        <div main id="maincontent" class="layout vertical">
+          <content select="*"></content>
+          <div class="layout horizontal">
+            <div class="flex"></div>
+            <version-sk></version-sk>
+          </div>
         </div>
-        <div main id="mainContent" class="layout vertical">
-          <content select="*"></content>
-        </div>
-      </paper-drawer-panel>
+      </template>
+      <template is="dom-if" if="{{!no_drawer}}">
+        <paper-drawer-panel id="drawerPanel" drawer-width$="{{drawer_width}}"  responsive-width$="{{responsive_width}}" force-narrow$="{{force_narrow}}">
+          <div drawer id="drawer" class="vertical layout">
+            <content id="navContent" select="[navigation], nav, [drawer], drawer"></content>
+            <div class="flex"></div>
+            <version-sk></version-sk>
+          </div>
+          <div main id="mainContent" class="layout vertical">
+            <content select="*"></content>
+          </div>
+        </paper-drawer-panel>
+      </template>
     </paper-header-panel>
+    <error-toast-sk></error-toast-sk>
   </template>
   <script>
   (function() {
     Polymer({
       is: "app-sk",
 
       properties: {
         mode: {
           type: String,
           value: "standard",
         },
         tall_class: {
           type: String,
           value: "waterfall-tall",
         },
         drawer_width: {
           type: String,
           value: "200px",
         },
         force_narrow: {
           type: Boolean,
           value: false,
         },
         narrow: {
           type: Boolean,
           notify: true,
           readOnly: true,
         },
+        no_drawer: {
+          type: Boolean,
+          value: false,
+        },
         responsive_width: {
           type: String,
           value: "800px",
         },
+        _showMenuButton: {
+          type: Boolean,
+          computed: "_computeShowMenuButton(narrow, no_drawer)",
+        },
       },
 
       ready: function() {
-        this._setNarrow(this.$.drawerPanel.narrow);
-        this.$.drawerPanel.addEventListener("narrow-changed", function() {
-          this._setNarrow(this.$.drawerPanel.narrow);
+        window.addEventListener("WebComponentsReady", function() {
+          if (!this.no_drawer) {
+            var drawerPanel = this.$$("#drawerPanel");
+            this._setNarrow(drawerPanel.narrow);
+            drawerPanel.addEventListener("narrow-changed", function() {
+              this._setNarrow(this.$$("#drawerPanel").narrow);
+            }.bind(this));
+          }
         }.bind(this));
       },
 
+      _computeShowMenuButton: function(narrow, no_drawer) {
+        if (no_drawer) {
+          return false;
+        }
+        return narrow;
+      },
+
       _togglePanel: function() {
         this.$.drawerPanel.togglePanel();
       },
     });
   }());
   </script>
 </dom-module>