Build Observatory as part of runtime

runtime/bin/vmservice/observatory/lib/src/elements/debugger.html

Index: runtime/bin/vmservice/observatory/lib/src/elements/debugger.html
diff --git a/runtime/bin/vmservice/observatory/lib/src/elements/debugger.html b/runtime/bin/vmservice/observatory/lib/src/elements/debugger.html
deleted file mode 100644
index 0eeaaa90d7958f26e8d867ee7c76ff42cf207888..0000000000000000000000000000000000000000
--- a/runtime/bin/vmservice/observatory/lib/src/elements/debugger.html
+++ /dev/null
@@ -1,226 +0,0 @@
-<link rel="import" href="../../../../packages/polymer/polymer.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="script_inset.html">
-<link rel="import" href="script_ref.html">
-
-<!-- TODO(turnidge): Use core-icon once core_elements work properly in
-     devtools -->
-<polymer-element name="icon-expand-less" noscript>
-  <template>
-    <svg width="24" height="24">
-      <polygon points="12,8 6,14 7.4,15.4 12,10.8 16.6,15.4 18,14 "/>
-    </svg>
-  </template>
-</polymer-element>
-
-<polymer-element name="icon-expand-more" noscript>
-  <template>
-    <svg width="24" height="24">
-      <polygon points="16.6,8.6 12,13.2 7.4,8.6 6,10 12,16 18,10 "/>
-    </svg>
-  </template>
-</polymer-element>
-
-<polymer-element name="debugger-page" extends="observatory-element">
-  <template>
-    <link rel="stylesheet" href="css/shared.css">
-    <style>
-      .container {
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        justify-content: space-between;
-      }
-      nav-bar {
-        flex: 0 0 auto;
-      }
-      .stack {
-        flex: 0 0 auto;
-        overflow-y: auto;
-      }
-      core-splitter {
-        flex: 0 0 auto;
-      }
-      .console {
-        flex: 1 1 auto;
-        overflow-y: auto;
-      }
-      .commandline {
-        flex: 0 0 auto;
-      }
-    </style>
-
-    <div class="container">
-      <nav-bar>
-	<top-nav-menu last="{{ true }}"></top-nav-menu>
-	<isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}">
-	</isolate-nav-menu>
-	<nav-control></nav-control>
-      </nav-bar>
-
-      <div id="stack" class="stack">
-	<debugger-stack isolate="{{ isolate }}"></debugger-stack>
-      </div>
-      <!--
-      <core-splitter direction="up" allowOverflow=true></core-splitter>
-      <div class="console">
-	<debugger-console isolate="{{ isolate }}"></debugger-console>
-      </div>
-      <div class="commandline">
-	<debugger-input isolate="{{ isolate }}"></debugger-input>
-      </div>
-      -->
-    </div>
-  </template>
-</polymer-element>
-
-<polymer-element name="debugger-stack" extends="observatory-element">
-  <template>
-    <link rel="stylesheet" href="css/shared.css">
-    <template if="{{ stack == null }}">
-      Loading stack frames
-    </template>
-    <template if="{{ stack != null }}">
-      <ul class="list-group">
-        <template repeat="{{ frame in stack['members'] }}">
-          <li class="list-group-item">
-            <debugger-frame frame="{{ frame }}"
-                            expand="{{ frame['depth'] == activeFrame }}">
-            </debugger-frame>
-          </li>
-        </template>
-      </ul>
-    </template>
-  </template>
-</polymer-element>
-
-
-<polymer-element name="debugger-frame" extends="observatory-element">
-  <template>
-    <link rel="stylesheet" href="css/shared.css">
-    <style>
-      .frameOuter {
-        position: relative;
-        padding: 5px;
-        border: 1px solid white;
-      }
-      .frameOuter:hover {
-        border: 1px solid #e0e0e0;
-      }
-      .shadow {
-        box-shadow:  0 2px 10px 0 rgba(0, 0, 0, 0.16),
-                     0 2px 5px 0 rgba(0, 0, 0, 0.26);
-      }
-      .frameSummaryText {
-        display: inline-block;
-        padding: 5px;
-      }
-      .frameId {
-        display: inline-block;
-        width: 60px;
-      }
-      .frameOuter .frameExpander {
-        position: absolute;
-        right: 5px;
-        top: 5px;
-        display: none;
-      }
-      .frameOuter:hover .frameExpander{
-        display: inline-block;
-      }
-      .frameContractor {
-        position: absolute;
-        right: 5px;
-        bottom: 5px;
-        display: inline-block;
-      }
-    </style>
-    <div id="frameOuter" class="frameOuter">
-      <a on-click="{{ toggleExpand }}">
-        <div class="frameSummary">
-          <div class="frameSummaryText">
-            <div class="frameId"><b>frame {{ frame['depth'] }}</b></div>
-            <function-ref ref="{{ frame['function'] }}"></function-ref>
-            ( <script-ref ref="{{ frame['script'] }}"
-                          pos="{{ frame['tokenPos'] }}">
-            </script-ref> )
-          </div>
-          <template if="{{ !expanded }}">
-            <div class="frameExpander">
-              <icon-expand-more></icon-expand-more>
-            </div>
-          </template>
-        </div>
-      </a>
-
-      <template if="{{expanded}}">
-        <div class="frameDetails">
-          <div class="flex-row">
-            <div class="flex-item-60-percent">
-              <script-inset height="{{ scriptHeight }}"
-			    script="{{ frame['function'].script }}"
-                            startPos="{{ frame['function'].tokenPos }}"
-                            endPos="{{ frame['function'].endTokenPos }}"
-                            currentPos="{{ frame['tokenPos'] }}">
-              </script-inset>
-            </div>
-            <div class="flex-item-40-percent">
-              <div style="padding:10px;" class="memberList">
-                <template repeat="{{ v in frame['vars'] }}">
-                  <div class="memberItem">
-                    <div class="memberName">{{ v['name']}}</div>
-                    <div class="memberValue">
-                      <any-service-ref ref="{{ v['value'] }}">
-                      </any-service-ref>
-                    </div>
-                  </div>
-                </template>
-              </div>
-            </div>
-          </div>
-          <!-- TODO(turnidge): Add eval box here? -->
-          <div class="frameContractor">
-            <template if="{{expanded}}">
-              <a on-click="{{ toggleExpand }}">
-                <icon-expand-less></icon-expand-less>
-              </a>
-            </template>
-          </div>
-        </div>
-      </template>
-    </div>
-  </template>
-</polymer-element>
-
-<polymer-element name="debugger-console" extends="observatory-element">
-  <template>
-    <link rel="stylesheet" href="css/shared.css">
-    <style>
-      .textBox {
-        position: absolute;
-        bottom: 0px;
-        width: 100%;
-      }
-    </style>
-    <div>
-      Debugging console is not yet implemented.<br>
-    </div>
-  </template>
-</polymer-element>
-
-<polymer-element name="debugger-input" extends="observatory-element">
-  <template>
-    <link rel="stylesheet" href="css/shared.css">
-    <style>
-      .textBox {
-        font: 400 16px 'Montserrat', sans-serif;
-        width: 100%;
-      }
-    </style>
-    <input id="textBox" class="textBox" type="text" value="{{ text }}">
-  </template>
-</polymer-element>
-
-<script type="application/dart" src="debugger.dart"></script>