Logging page

runtime/observatory/lib/src/elements/logging.html

Index: runtime/observatory/lib/src/elements/logging.html
diff --git a/runtime/observatory/lib/src/elements/logging.html b/runtime/observatory/lib/src/elements/logging.html
new file mode 100644
index 0000000000000000000000000000000000000000..a3a36a12a9d6c05a192e46e0a5f99a3763dbde80
--- /dev/null
+++ b/runtime/observatory/lib/src/elements/logging.html
@@ -0,0 +1,77 @@
+<link rel="import" href="../../../../packages/polymer/polymer.html">
+<link rel="import" href="code_ref.html">
+<link rel="import" href="function_ref.html">
+<link rel="import" href="nav_bar.html">
+<link rel="import" href="observatory_element.html">
+<link rel="import" href="sliding_checkbox.html">
+<link rel="import" href="view_footer.html">
+
+<polymer-element name="logging-page" extends="observatory-element">
+  <template>
+    <link rel="stylesheet" href="css/shared.css">
+    <style>
+    .outlined {
+      -webkit-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.75);
+      -moz-box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.75);
+      box-shadow: 0px 0px 2px 1px rgba(0,0,0,0.75);
+      margin: 4px;
+    }
+    .logItem {
+      font: normal 14px consolas, courier, monospace;
+      white-space: pre;
+      line-height: 125%;
+      width: 100%;
+    }
+    .FINEST {
+      background-color: #FAFAFA;
+    }
+    .FINER {
+      background-color: #ECEFF1;
+    }
+    .FINE {
+      background-color: #EFEBE9;
+    }
+    .CONFIG {
+      background-color: #FFF3E0;
+    }
+    .INFO {
+      background-color: #F1F8E9;
+    }
+    .WARNING {
+      background-color: #FFE0B2;
+    }
+    .SEVERE {
+      background-color: #FFCCBC;
+    }
+    .SHOUT {
+      background-color: #FFCDD2;
+    }
+    #log {
+      height: 100%;
+      width: 100%;
+      overflow-y: auto;
+      padding: 8px;
+    }
+    .fill {
+      height: 80%;
+      width: 100%;
+    }
+    </style>
+    <nav-bar>
+      <top-nav-menu></top-nav-menu>
+      <vm-nav-menu vm="{{ isolate.vm }}"></vm-nav-menu>
+      <isolate-nav-menu isolate="{{ isolate }}"></isolate-nav-menu>
+      <nav-menu link="{{ makeLink('/logging', isolate) }}" anchor="logging" last="{{ true }}"></nav-menu>
+      <nav-refresh callback="{{ clear }}" label="Clear"></nav-refresh>
+    </nav-bar>
+    <div id="page" class="content-centered-big">
+      <span>Show messages with severity <select id="severityLevelSelector" value="{{ severityLevel }}"></select> and higher</span>
+      <hr>
+      <div class="flex-row fill">
+        <div id="log" class="outlined"></div>
+      </div>
+    </div>
+  </template>
+</polymer-element>
+
+<script type="application/dart" src="logging.dart"></script>