Rewrite LogDog log viewer app.

web/apps/logdog-view/elements/logdog-view/logdog-view.html

 <!--
   Copyright 2016 The LUCI Authors. All rights reserved.
   Use of this source code is governed under the Apache License, Version 2.0
   that can be found in the LICENSE file.
 -->
 
 <link rel="import" href="../../inc/bower_components/polymer/polymer.html">
 
 <link rel="import" href="../../inc/bower_components/paper-styles/default-theme.html">
 <link rel="import" href="../../inc/bower_components/paper-styles/typography.html">
@@ skipping 14 matching lines @@
 
 <template>
   <style>
     :host {
       @apply(--paper-font-common-base);
     }
 
     #banner {
       background-color: #FAFAFA;
       overflow: hidden;
-      vertical-align: center;
+      border-color: lightcoral;
+      border-width: 0px 0px 2px 0px;
+      border-style: solid;
     }
 
     .banner-content {
       width: auto;
       display: inline-block;
       padding-left: 5px;
       padding-right: 5px;
       overflow: hidden;
     }
 
     .banner-content h1 {
       font-size: 18px;
     }
 
     #auth-bubble {
       float: right;
       display: inline-block;
-      border: solid #AAAAAA;
-      border-radius: 5px;
-      border-width: 1px;
-      padding: 2px;
-      margin-left: auto;
-      margin-right: 0;
+      border: none;
     }
   </style>
 
   <div>
     <div id="banner">
       <span class="banner-content">
         <h1><a href="/">LogDog</a>
           <template is="dom-if" if="{{_hasStreams}}">
             : [[streams]]
           </template>
           <template is="dom-if" if="{{!_hasStreams}}">
             (No Streams Provided)
           </template>
         </h1>
       </span>
       <template is="dom-if" if="{{clientId}}">
         <span id="auth-bubble">
           <auth-signin
               client-id="[[clientId]]"></auth-signin>
         </span>
       </template>
     </div>
 
-    <template is="dom-if" if="{{_hasStreams}}">
-      <logdog-stream-view
-        id="view"
-        host="[[host]]"
-        streams="[[streams]]"></logdog-stream-view>
-    </template>
+    <logdog-stream-view
+      id="streamView"
+      host="[[host]]"
+      mobile="[[mobile]]"
+      metadata="[[metadata]]"
+      toolbar-anchor="{{banner}}"
+      toolbarAnchor="{{banner}}"
+      streams="[[streams]]"></logdog-stream-view>
   </div>
 </template>
 
 </dom-module>
 
 <script>
   Polymer({
     is: "logdog-view",
     properties: {
       host: {
         type: String,
         notify: true,
+        value: null,
       },
+
       clientId: {
         type: String,
-        nofity: true,
+        value: null,
       },
-      accessToken: {
-        type: String,
-        notify: true,
+
+      streams: {
+        type: Array,
+        value: [],
         readOnly: true,
       },
-      streams: {
-        type: Array,
-        notify: true,
+
+      metadata: {
+        type: String,
+        value: false,
         readOnly: true,
       },
 
+      mobile: {
+        type: Boolean,
+        value: false,
+      },
+
       _hasStreams: {
         computed: '_arrayHasElements(streams)',
       },
     },
 
-    attached: function() {
+    ready: function() {
+      // Test if we're mobile.
+      this.mobile = false;
+      if ( window.matchMedia ) {
+        this.mobile = window.matchMedia(
+            "only screen and (max-width: 760px)").maches;

[Ryan Tseng, 2016/12/06 03:38:11]

matches?

+      }
+
       // Parse the stream names from the "s" query parameter.
       var queryString = window.location.search.replace(/^\?/, "");
       var streams = logdog.getQueryValues(queryString, "s").
           map(logdog.correctStreamPath);
       this._setStreams(streams);
+
+      // Parse the metadata option.
+      this._setMetadata(!!logdog.getQueryValue(queryString, "m", false));

[Ryan Tseng, 2016/12/06 03:38:11]

!!?

     },
 
     _onSignin: function(e) {
       this._setAccessToken(e.detail.access_token);
     },
     _onSignout: function(e) {
       this._setAccessToken(null);
     },
 
     _arrayHasElements: function(v) {
       return (v && v.length);
     },
   });
 
   (function(i,s,o,g,r,a,m){i['CrDXObject']=r;i[r]=i[r]||function(){
   (i[r].q=i[r].q||[]).push(arguments)},a=s.createElement(o),
   m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
   })(window,document,'script','https://storage.googleapis.com/crdx-feedback.appspot.com/feedback.js','crdx');
 
   crdx('setFeedbackButtonLink', 'https://bugs.chromium.org/p/chromium/issues/entry?components=Infra>Platform>LogDog&labels=Infra-DX');
 </script>