Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(648)

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: runtime/bin/vmservice/observatory/deployed/web/index.html

Issue 560503002: Add support for TokenStream, LocalVarDescriptors, and PcDescriptors to service lib and generic obje… (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Created 6 years, 3 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
« no previous file with comments | « no previous file | runtime/bin/vmservice/observatory/deployed/web/index.html._data » ('j') | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: runtime/bin/vmservice/observatory/deployed/web/index.html
diff --git a/runtime/bin/vmservice/observatory/deployed/web/index.html b/runtime/bin/vmservice/observatory/deployed/web/index.html
index 8b368eb6b24c80c9dd27cc28ac4d9b3fb6245387..34223b486602866b6803ed4cbce5ce78a2be4a4f 100644
--- a/runtime/bin/vmservice/observatory/deployed/web/index.html
+++ b/runtime/bin/vmservice/observatory/deployed/web/index.html
@@ -12,7 +12,7 @@
<body><script src="packages/web_components/platform.js"></script>
-<!-- unminified for debugging:
+<!-- unminfied for debugging:
<link rel="import" href="src/js/polymer/layout.html">
<script src="src/js/polymer/polymer.concat.js"></script>
-->
@@ -597,6 +597,8 @@ hr {
+
+
<polymer-element name="curly-block">
<template>
<style>
@@ -652,9 +654,8 @@ hr {
<polymer-element name="any-service-ref" extends="observatory-element">
</polymer-element>
-<polymer-element name="instance-ref" extends="service-ref">
- <template>
- <style>
+<polymer-element name="object-ref" extends="service-ref">
+ <template><style>
/* Global styles */
* {
margin: 0;
@@ -909,157 +910,16 @@ hr {
word-wrap: break-word;
}
</style>
- <style>
- .errorBox {
- background-color: #f5f5f5;
- border: 1px solid #ccc;
- padding: 10px;
- font-family: consolas, courier, monospace;
- font-size: 1em;
- line-height: 1.2em;
- white-space: pre;
- }
- </style>
- <span>
- <template if="{{ ref.isSentinel }}">
- <div title="{{ hoverText }}">{{ ref.valueAsString }}</div>
- </template>
-
- <template if="{{ ref.isBool || ref.isInt ||
- ref.isDouble || ref.isNull }}">
- <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.valueAsString }}</a>
- </template>
-
- <template if="{{ ref.isString }}">
- <a on-click="{{ goto }}" _href="{{ url }}">{{ asStringLiteral(ref.valueAsString, ref.valueAsStringIsTruncated) }}</a>
- </template>
-
-
- <template if="{{ ref.isAbstractType }}">
- <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a>
- </template>
-
- <template if="{{ ref.isClosure }}">
- <a on-click="{{ goto }}" _href="{{ url }}">
- <!-- TODO(turnidge): Switch this to fully-qualified function -->
- {{ ref.closureFunc.name }}
- </a>
- </template>
-
- <template if="{{ ref.isPlainInstance }}">
- <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em></a>
- <curly-block callback="{{ expander() }}">
- <div class="memberList">
- <template repeat="{{ field in ref.fields }}">
- <div class="memberItem">
- <div class="memberName">
- {{ field['decl'].name }}
- </div>
- <div class="memberValue">
- <any-service-ref ref="{{ field['value'] }}"></any-service-ref>
- </div>
- </div>
- </template>
- </div>
- </curly-block>
- </template>
-
- <template if="{{ ref.isList }}">
- <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em> ({{ ref.length }})</a>
- <curly-block callback="{{ expander() }}">
- <div class="memberList">
- <template repeat="{{ element in ref.elements }}">
- <div class="memberItem">
- <div class="memberName">[{{ element['index']}}]</div>
- <div class="memberValue">
- <any-service-ref ref="{{ element['value'] }}"></any-service-ref>
- </div>
- </div>
- </template>
- </div>
- </curly-block>
- </template>
-
- <template if="{{ ref.isMirrorReference }}">
- <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em></a>
- <curly-block callback="{{ expander() }}">
- <div class="memberList">
- <div class="memberItem">
- <div class="memberName">referent</div>
- <div class="memberValue">
- <any-service-ref ref="{{ ref.referent }}"></any-service-ref>
- </div>
- </div>
- </div>
- </curly-block>
- </template>
-
- <template if="{{ ref.isWeakProperty }}">
- <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em></a>
- <curly-block callback="{{ expander() }}">
- <div class="memberList">
- <div class="memberItem">
- <div class="memberName">key</div>
- <div class="memberValue">
- <any-service-ref ref="{{ ref.key }}"></any-service-ref>
- </div>
- </div>
- <div class="memberItem">
- <div class="memberName">value</div>
- <div class="memberValue">
- <any-service-ref ref="{{ ref.value }}"></any-service-ref>
- </div>
- </div>
- </div>
- </curly-block>
- </template>
- </span>
- </template>
-</polymer-element>
-
-
-<polymer-element name="action-link">
- <template>
- <style>
- .idle {
- color: #0489c3;
- cursor: pointer;
- text-decoration: none;
- }
- .idle:hover {
- text-decoration: underline;
- }
- .busy {
- color: #aaa;
- cursor: wait;
- text-decoration: none;
- }
- </style>
-
- <template if="{{ busy }}">
- <span class="busy">[{{ label }}]</span>
+ <template if="{{ nameIsEmpty }}">
+ <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.vmType }}</em></a>
</template>
- <template if="{{ !busy }}">
- <template if="{{ color == null }}">
- <span class="idle"><a on-click="{{ doAction }}">[{{ label }}]</a></span>
- </template>
- <template if="{{ color != null }}">
- <span class="idle" style="color:{{ color }}"><a on-click="{{ doAction }}">[{{ label }}]</a></span>
- </template>
+ <template if="{{ !nameIsEmpty }}">
+ <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ name }}</em></a>
</template>
</template>
</polymer-element>
-
-
-
-
-
-
-
-
-
-<polymer-element name="nav-bar" extends="observatory-element">
+<polymer-element name="instance-ref" extends="service-ref">
<template>
<style>
/* Global styles */
@@ -1317,94 +1177,501 @@ hr {
}
</style>
<style>
- nav {
- position: fixed;
- width: 100%;
- z-index: 1000;
- }
- nav ul {
- display: inline-table;
- position: relative;
- list-style: none;
- padding-left: 0;
- margin-left: 0;
- width: 100%;
- z-index: 1000;
- font: 400 16px 'Montserrat', sans-serif;
- color: white;
- background-color: #0489c3;
- }
- nav ul:after {
- content: ""; clear: both; display: block;
- }
- .vertical-spacer {
- height: 40px;
- background-color: #0489c3;
+ .errorBox {
+ background-color: #f5f5f5;
+ border: 1px solid #ccc;
+ padding: 10px;
+ font-family: consolas, courier, monospace;
+ font-size: 1em;
+ line-height: 1.2em;
+ white-space: pre;
}
</style>
- <nav>
- <ul>
- <nav-notify events="{{ app.notifications }}"></nav-notify>
- <content></content>
- </ul>
- </nav>
- <div class="vertical-spacer">
- </div>
- <template if="{{ pad }}">
- <br>
- </template>
- </template>
-</polymer-element>
+ <span>
+ <template if="{{ ref.isSentinel }}">
+ <div title="{{ hoverText }}">{{ ref.valueAsString }}</div>
+ </template>
-<polymer-element name="nav-menu" extends="observatory-element">
- <template>
- <style>
- .menu, .spacer {
- float: left;
- }
- .menu a, .spacer {
- display: block;
- padding: 12px 8px;
- color: White;
- text-decoration: none;
- }
- .menu:hover {
- background: #455;
- }
- .menu ul {
- display: none;
- position: absolute;
- top: 98%;
- list-style: none;
- margin: 0;
- padding: 0;
- width: auto;
- z-index: 1000;
- font: 400 16px 'Montserrat', sans-serif;
- color: white;
- background: #567;
- }
- .menu ul:after {
- content: ""; clear: both; display: block;
- }
- .menu:hover > ul {
- display: block;
- }
- </style>
+ <template if="{{ ref.isBool || ref.isInt ||
+ ref.isDouble || ref.isNull }}">
+ <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.valueAsString }}</a>
+ </template>
- <li class="menu">
- <a on-click="{{ goto }}" _href="{{ gotoLink(link) }}">{{ anchor }}</a>
- <ul><content></content></ul>
- </li>
- <template if="{{ !last }}">
- <li class="spacer">&gt;</li>
- </template>
+ <template if="{{ ref.isString }}">
+ <a on-click="{{ goto }}" _href="{{ url }}">{{ asStringLiteral(ref.valueAsString, ref.valueAsStringIsTruncated) }}</a>
+ </template>
- </template>
-</polymer-element>
-<polymer-element name="nav-menu-item" extends="observatory-element">
- <template>
+ <template if="{{ ref.isAbstractType }}">
+ <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a>
+ </template>
+
+ <template if="{{ ref.isClosure }}">
+ <a on-click="{{ goto }}" _href="{{ url }}">
+ <!-- TODO(turnidge): Switch this to fully-qualified function -->
+ {{ ref.closureFunc.name }}
+ </a>
+ </template>
+
+ <template if="{{ ref.isPlainInstance }}">
+ <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em></a>
+ <curly-block callback="{{ expander() }}">
+ <div class="memberList">
+ <template repeat="{{ field in ref.fields }}">
+ <div class="memberItem">
+ <div class="memberName">
+ {{ field['decl'].name }}
+ </div>
+ <div class="memberValue">
+ <any-service-ref ref="{{ field['value'] }}"></any-service-ref>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block>
+ </template>
+
+ <template if="{{ ref.isList }}">
+ <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em> ({{ ref.length }})</a>
+ <curly-block callback="{{ expander() }}">
+ <div class="memberList">
+ <template repeat="{{ element in ref.elements }}">
+ <div class="memberItem">
+ <div class="memberName">[{{ element['index']}}]</div>
+ <div class="memberValue">
+ <any-service-ref ref="{{ element['value'] }}"></any-service-ref>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block>
+ </template>
+
+ <template if="{{ ref.isMirrorReference }}">
+ <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em></a>
+ <curly-block callback="{{ expander() }}">
+ <div class="memberList">
+ <div class="memberItem">
+ <div class="memberName">referent</div>
+ <div class="memberValue">
+ <any-service-ref ref="{{ ref.referent }}"></any-service-ref>
+ </div>
+ </div>
+ </div>
+ </curly-block>
+ </template>
+
+ <template if="{{ ref.isWeakProperty }}">
+ <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em></a>
+ <curly-block callback="{{ expander() }}">
+ <div class="memberList">
+ <div class="memberItem">
+ <div class="memberName">key</div>
+ <div class="memberValue">
+ <any-service-ref ref="{{ ref.key }}"></any-service-ref>
+ </div>
+ </div>
+ <div class="memberItem">
+ <div class="memberName">value</div>
+ <div class="memberValue">
+ <any-service-ref ref="{{ ref.value }}"></any-service-ref>
+ </div>
+ </div>
+ </div>
+ </curly-block>
+ </template>
+ </span>
+ </template>
+</polymer-element>
+
+
+<polymer-element name="action-link">
+ <template>
+ <style>
+ .idle {
+ color: #0489c3;
+ cursor: pointer;
+ text-decoration: none;
+ }
+ .idle:hover {
+ text-decoration: underline;
+ }
+ .busy {
+ color: #aaa;
+ cursor: wait;
+ text-decoration: none;
+ }
+ </style>
+
+ <template if="{{ busy }}">
+ <span class="busy">[{{ label }}]</span>
+ </template>
+ <template if="{{ !busy }}">
+ <template if="{{ color == null }}">
+ <span class="idle"><a on-click="{{ doAction }}">[{{ label }}]</a></span>
+ </template>
+ <template if="{{ color != null }}">
+ <span class="idle" style="color:{{ color }}"><a on-click="{{ doAction }}">[{{ label }}]</a></span>
+ </template>
+ </template>
+ </template>
+</polymer-element>
+
+
+
+
+
+
+
+
+
+
+<polymer-element name="nav-bar" extends="observatory-element">
+ <template>
+ <style>
+/* Global styles */
+* {
+ margin: 0;
+ padding: 0;
+ font: 400 14px 'Montserrat', sans-serif;
+ color: #333;
+ box-sizing: border-box;
+}
+
+.content {
+ padding-left: 10%;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+.content-centered {
+ padding-left: 10%;
+ padding-right: 10%;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+.content-centered-big {
+ padding-left: 5%;
+ padding-right: 5%;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+h1 {
+ font: 400 18px 'Montserrat', sans-serif;
+}
+
+.memberList {
+ display: table;
+}
+
+.memberItem {
+ display: table-row;
+}
+
+.memberName, .memberValue {
+ display: table-cell;
+ vertical-align: top;
+ padding: 3px 0 3px 1em;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+.memberSmall {
+ display: table-cell;
+ vertical-align: top;
+ padding: 3px 0 3px 1em;
+ font: 400 12px 'Montserrat', sans-serif;
+}
+
+.monospace {
+ font-family: consolas, courier, monospace;
+ font-size: 1em;
+ line-height: 1.2em;
+ white-space: nowrap;
+}
+
+a {
+ color: #0489c3;
+ text-decoration: none;
+}
+
+a:hover {
+ text-decoration: underline;
+}
+
+em {
+ color: inherit;
+ font-style: italic;
+}
+
+b {
+ color: inherit;
+ font-weight: bold;
+}
+
+hr {
+ margin-top: 20px;
+ margin-bottom: 20px;
+ border: 0;
+ border-top: 1px solid #eee;
+ height: 0;
+ box-sizing: content-box;
+}
+
+.list-group {
+ padding-left: 0;
+ margin-bottom: 20px;
+}
+
+.list-group-item {
+ position: relative;
+ display: block;
+ padding: 10px 15px;
+ margin-bottom: -1px;
+ background-color: #fff;
+}
+
+.list-group-item:first-child {
+ /* rounded top corners */
+ border-top-right-radius:4px;
+ border-top-left-radius:4px;
+}
+
+.list-group-item:last-child {
+ margin-bottom: 0;
+ /* rounded bottom corners */
+ border-bottom-right-radius: 4px;
+ border-bottom-left-radius:4px;
+}
+
+/* Flex row container */
+.flex-row {
+ display: flex;
+ flex-direction: row;
+}
+
+/* Flex column container */
+.flex-column {
+ display: flex;
+ flex-direction: column;
+}
+
+.flex-item-fit {
+ flex-grow: 1;
+ flex-shrink: 1;
+ flex-basis: auto;
+}
+
+.flex-item-no-shrink {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: auto;
+}
+
+.flex-item-fill {
+ flex-grow: 0;
+ flex-shrink: 1; /* shrink when pressured */
+ flex-basis: 100%; /* try and take 100% */
+}
+
+.flex-item-fixed-1-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 8.3%;
+}
+
+.flex-item-fixed-2-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 16.6%;
+}
+
+.flex-item-fixed-4-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 33.3333%;
+}
+
+.flex-item-fixed-6-12, .flex-item-50-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 50%;
+}
+
+.flex-item-fixed-8-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 66.6666%;
+}
+
+.flex-item-fixed-9-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 75%;
+}
+
+
+.flex-item-fixed-12-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 100%;
+}
+
+.flex-item-10-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 10%;
+}
+
+.flex-item-15-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 15%;
+}
+
+.flex-item-20-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 20%;
+}
+
+.flex-item-30-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 30%;
+}
+
+.flex-item-40-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 40%;
+}
+
+.flex-item-50-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 50%;
+}
+
+.flex-item-60-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 60%;
+}
+
+.flex-item-70-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 70%;
+}
+
+.flex-item-80-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 80%;
+}
+
+.well {
+ min-height: 20px;
+ padding: 19px;
+ margin-bottom: 20px;
+ background-color: #f5f5f5;
+ border: 1px solid #e3e3e3;
+ border-radius: 4px;
+ box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
+}
+
+.break-wrap {
+ word-wrap: break-word;
+}
+</style>
+ <style>
+ nav {
+ position: fixed;
+ width: 100%;
+ z-index: 1000;
+ }
+ nav ul {
+ display: inline-table;
+ position: relative;
+ list-style: none;
+ padding-left: 0;
+ margin-left: 0;
+ width: 100%;
+ z-index: 1000;
+ font: 400 16px 'Montserrat', sans-serif;
+ color: white;
+ background-color: #0489c3;
+ }
+ nav ul:after {
+ content: ""; clear: both; display: block;
+ }
+ .vertical-spacer {
+ height: 40px;
+ background-color: #0489c3;
+ }
+ </style>
+ <nav>
+ <ul>
+ <nav-notify events="{{ app.notifications }}"></nav-notify>
+ <content></content>
+ </ul>
+ </nav>
+ <div class="vertical-spacer">
+ </div>
+ <template if="{{ pad }}">
+ <br>
+ </template>
+ </template>
+</polymer-element>
+
+<polymer-element name="nav-menu" extends="observatory-element">
+ <template>
+ <style>
+ .menu, .spacer {
+ float: left;
+ }
+ .menu a, .spacer {
+ display: block;
+ padding: 12px 8px;
+ color: White;
+ text-decoration: none;
+ }
+ .menu:hover {
+ background: #455;
+ }
+ .menu ul {
+ display: none;
+ position: absolute;
+ top: 98%;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ width: auto;
+ z-index: 1000;
+ font: 400 16px 'Montserrat', sans-serif;
+ color: white;
+ background: #567;
+ }
+ .menu ul:after {
+ content: ""; clear: both; display: block;
+ }
+ .menu:hover > ul {
+ display: block;
+ }
+ </style>
+
+ <li class="menu">
+ <a on-click="{{ goto }}" _href="{{ gotoLink(link) }}">{{ anchor }}</a>
+ <ul><content></content></ul>
+ </li>
+ <template if="{{ !last }}">
+ <li class="spacer">&gt;</li>
+ </template>
+
+ </template>
+</polymer-element>
+
+<polymer-element name="nav-menu-item" extends="observatory-element">
+ <template>
<style>
li {
float: none;
@@ -14854,10 +15121,19 @@ hr {
</div>
</div>
- <div class="memberItem" title="Space for this object in memory">
- <div class="memberName">size</div>
- <div class="memberValue">{{ object.size | formatSize }}</div>
- </div>
+ <template if="{{ object.size != null }}">
+ <div class="memberItem" title="Space for this object in memory">
+ <div class="memberName">size</div>
+ <div class="memberValue">{{ object.size | formatSize }}</div>
+ </div>
+ </template>
+
+ <template if="{{ object.size == null }}">
+ <div class="memberItem" title="Space for this object in memory">
+ <div class="memberName">size</div>
+ <div class="memberValue">0</div>
+ </div>
+ </template>
<div class="memberItem" title="Space that would be reclaimed if references to this object were replaced with null">
<div class="memberName">retained size</div>
@@ -15643,29 +15919,419 @@ hr {
-<polymer-element name="json-view" extends="observatory-element">
- <template>
+<polymer-element name="json-view" extends="observatory-element">
+ <template>
+ <nav-bar>
+ <top-nav-menu last="{{ true }}"></top-nav-menu>
+ </nav-bar>
+ <pre>{{ mapAsString }}</pre>
+ </template>
+</polymer-element>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<polymer-element name="library-view" extends="observatory-element">
+ <template>
+ <style>
+/* Global styles */
+* {
+ margin: 0;
+ padding: 0;
+ font: 400 14px 'Montserrat', sans-serif;
+ color: #333;
+ box-sizing: border-box;
+}
+
+.content {
+ padding-left: 10%;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+.content-centered {
+ padding-left: 10%;
+ padding-right: 10%;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+.content-centered-big {
+ padding-left: 5%;
+ padding-right: 5%;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+h1 {
+ font: 400 18px 'Montserrat', sans-serif;
+}
+
+.memberList {
+ display: table;
+}
+
+.memberItem {
+ display: table-row;
+}
+
+.memberName, .memberValue {
+ display: table-cell;
+ vertical-align: top;
+ padding: 3px 0 3px 1em;
+ font: 400 14px 'Montserrat', sans-serif;
+}
+
+.memberSmall {
+ display: table-cell;
+ vertical-align: top;
+ padding: 3px 0 3px 1em;
+ font: 400 12px 'Montserrat', sans-serif;
+}
+
+.monospace {
+ font-family: consolas, courier, monospace;
+ font-size: 1em;
+ line-height: 1.2em;
+ white-space: nowrap;
+}
+
+a {
+ color: #0489c3;
+ text-decoration: none;
+}
+
+a:hover {
+ text-decoration: underline;
+}
+
+em {
+ color: inherit;
+ font-style: italic;
+}
+
+b {
+ color: inherit;
+ font-weight: bold;
+}
+
+hr {
+ margin-top: 20px;
+ margin-bottom: 20px;
+ border: 0;
+ border-top: 1px solid #eee;
+ height: 0;
+ box-sizing: content-box;
+}
+
+.list-group {
+ padding-left: 0;
+ margin-bottom: 20px;
+}
+
+.list-group-item {
+ position: relative;
+ display: block;
+ padding: 10px 15px;
+ margin-bottom: -1px;
+ background-color: #fff;
+}
+
+.list-group-item:first-child {
+ /* rounded top corners */
+ border-top-right-radius:4px;
+ border-top-left-radius:4px;
+}
+
+.list-group-item:last-child {
+ margin-bottom: 0;
+ /* rounded bottom corners */
+ border-bottom-right-radius: 4px;
+ border-bottom-left-radius:4px;
+}
+
+/* Flex row container */
+.flex-row {
+ display: flex;
+ flex-direction: row;
+}
+
+/* Flex column container */
+.flex-column {
+ display: flex;
+ flex-direction: column;
+}
+
+.flex-item-fit {
+ flex-grow: 1;
+ flex-shrink: 1;
+ flex-basis: auto;
+}
+
+.flex-item-no-shrink {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: auto;
+}
+
+.flex-item-fill {
+ flex-grow: 0;
+ flex-shrink: 1; /* shrink when pressured */
+ flex-basis: 100%; /* try and take 100% */
+}
+
+.flex-item-fixed-1-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 8.3%;
+}
+
+.flex-item-fixed-2-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 16.6%;
+}
+
+.flex-item-fixed-4-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 33.3333%;
+}
+
+.flex-item-fixed-6-12, .flex-item-50-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 50%;
+}
+
+.flex-item-fixed-8-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 66.6666%;
+}
+
+.flex-item-fixed-9-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 75%;
+}
+
+
+.flex-item-fixed-12-12 {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 100%;
+}
+
+.flex-item-10-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 10%;
+}
+
+.flex-item-15-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 15%;
+}
+
+.flex-item-20-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 20%;
+}
+
+.flex-item-30-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 30%;
+}
+
+.flex-item-40-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 40%;
+}
+
+.flex-item-50-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 50%;
+}
+
+.flex-item-60-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 60%;
+}
+
+.flex-item-70-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 70%;
+}
+
+.flex-item-80-percent {
+ flex-grow: 0;
+ flex-shrink: 0;
+ flex-basis: 80%;
+}
+
+.well {
+ min-height: 20px;
+ padding: 19px;
+ margin-bottom: 20px;
+ background-color: #f5f5f5;
+ border: 1px solid #e3e3e3;
+ border-radius: 4px;
+ box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
+}
+
+.break-wrap {
+ word-wrap: break-word;
+}
+</style>
+
<nav-bar>
- <top-nav-menu last="{{ true }}"></top-nav-menu>
+ <top-nav-menu></top-nav-menu>
+ <isolate-nav-menu isolate="{{ library.isolate }}"></isolate-nav-menu>
+ <library-nav-menu library="{{ library }}" last="{{ true }}"></library-nav-menu>
+ <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></nav-refresh>
+ <nav-refresh callback="{{ refresh }}"></nav-refresh>
+ <nav-control></nav-control>
</nav-bar>
- <pre>{{ mapAsString }}</pre>
- </template>
-</polymer-element>
+ <div class="content">
+ <h1>
+ <!-- TODO(turnidge): Handle unnamed libraries -->
+ library {{ library.name }}
+ </h1>
+ <div class="memberList">
+ <div class="memberItem">
+ <div class="memberName">url</div>
+ <div class="memberValue">{{ library.url }}</div>
+ </div>
+ <template if="{{ library.name != library.vmName }}">
+ <div class="memberItem">
+ <div class="memberName">vm name</div>
+ <div class="memberValue">{{ library.vmName }}</div>
+ </div>
+ </template>
+ </div>
+ </div>
+
+ <hr>
+ <div class="content">
+ <template if="{{ library.imports.isNotEmpty }}">
+ imports ({{ library.imports.length }})
+ <curly-block expand="{{ library.imports.length <= 8 }}">
+ <div class="memberList">
+ <template repeat="{{ imp in library.imports }}">
+ <div class="memberItem">
+ <div class="memberValue">
+ <library-ref ref="{{ imp }}"></library-ref>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block><br>
+ <br>
+ </template>
+ <template if="{{ library.scripts.isNotEmpty }}">
+ scripts ({{ library.scripts.length }})
+ <curly-block expand="{{ library.scripts.length <= 8 }}">
+ <div class="memberList">
+ <template repeat="{{ script in library.scripts }}">
+ <div class="memberItem">
+ <div class="memberValue">
+ <script-ref ref="{{ script }}"></script-ref>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block><br>
+ <br>
+ </template>
+ <template if="{{ library.classes.isNotEmpty }}">
+ classes ({{ library.classes.length }})
+ <curly-block expand="{{ library.classes.length <= 8 }}">
+ <div class="memberList">
+ <template repeat="{{ cls in library.classes }}">
+ <div class="memberItem">
+ <div class="memberValue">
+ <class-ref ref="{{ cls }}"></class-ref>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block><br>
+ <br>
+ </template>
+ <template if="{{ library.variables.isNotEmpty }}">
+ variables ({{ library.variables.length }})
+ <curly-block expand="{{ library.variables.length <= 8 }}">
+ <div class="memberList">
+ <template repeat="{{ field in library.variables }}">
+ <div class="memberItem">
+ <div class="memberName">
+ <field-ref ref="{{ field }}"></field-ref>
+ </div>
+ <div class="memberValue">
+ <template if="{{ field['value'] != null }}">
+ <any-service-ref ref="{{ field['value'] }}"></any-service-ref>
+ </template>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block><br>
+ <br>
+ </template>
+ <template if="{{ library.functions.isNotEmpty }}">
+ functions ({{ library.functions.length }})
+ <curly-block expand="{{ library.functions.length <= 8 }}">
+ <div class="memberList">
+ <template repeat="{{ function in library.functions }}">
+ <div class="memberItem">
+ <div class="memberValue">
+ <function-ref ref="{{ function }}"></function-ref>
+ </div>
+ </div>
+ </template>
+ </div>
+ </curly-block><br>
+ <br>
+ </template>
+ </div>
+ <hr>
+ <div class="content">
+ <eval-box callback="{{ eval }}"></eval-box>
+ </div>
+ <br><br><br><br>
+ <br><br><br><br>
+ </template>
+</polymer-element>
-<polymer-element name="library-view" extends="observatory-element">
+<polymer-element name="metrics-page" extends="observatory-element">
<template>
<style>
/* Global styles */
@@ -15922,140 +16588,64 @@ hr {
word-wrap: break-word;
}
</style>
-
+ <style>
+ ul li:hover:not(.selected) {
+ background-color: #FFF3E3;
+ }
+ .selected {
+ background-color: #0489c3;
+ }
+ .graph {
+ min-height: 600px;
+ }
+ </style>
<nav-bar>
- <top-nav-menu></top-nav-menu>
- <isolate-nav-menu isolate="{{ library.isolate }}"></isolate-nav-menu>
- <library-nav-menu library="{{ library }}" last="{{ true }}"></library-nav-menu>
- <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></nav-refresh>
+ <top-nav-menu last="{{ true }}"></top-nav-menu>
<nav-refresh callback="{{ refresh }}"></nav-refresh>
<nav-control></nav-control>
</nav-bar>
-
- <div class="content">
- <h1>
- <!-- TODO(turnidge): Handle unnamed libraries -->
- library {{ library.name }}
- </h1>
- <div class="memberList">
- <div class="memberItem">
- <div class="memberName">url</div>
- <div class="memberValue">{{ library.url }}</div>
- </div>
- <template if="{{ library.name != library.vmName }}">
- <div class="memberItem">
- <div class="memberName">vm name</div>
- <div class="memberValue">{{ library.vmName }}</div>
- </div>
- </template>
- </div>
- </div>
-
- <hr>
-
- <div class="content">
- <template if="{{ library.imports.isNotEmpty }}">
- imports ({{ library.imports.length }})
- <curly-block expand="{{ library.imports.length <= 8 }}">
- <div class="memberList">
- <template repeat="{{ imp in library.imports }}">
- <div class="memberItem">
- <div class="memberValue">
- <library-ref ref="{{ imp }}"></library-ref>
- </div>
- </div>
- </template>
- </div>
- </curly-block><br>
- <br>
- </template>
-
- <template if="{{ library.scripts.isNotEmpty }}">
- scripts ({{ library.scripts.length }})
- <curly-block expand="{{ library.scripts.length <= 8 }}">
- <div class="memberList">
- <template repeat="{{ script in library.scripts }}">
- <div class="memberItem">
- <div class="memberValue">
- <script-ref ref="{{ script }}"></script-ref>
- </div>
- </div>
- </template>
- </div>
- </curly-block><br>
- <br>
- </template>
-
- <template if="{{ library.classes.isNotEmpty }}">
- classes ({{ library.classes.length }})
- <curly-block expand="{{ library.classes.length <= 8 }}">
- <div class="memberList">
- <template repeat="{{ cls in library.classes }}">
- <div class="memberItem">
- <div class="memberValue">
- <class-ref ref="{{ cls }}"></class-ref>
- </div>
- </div>
- </template>
- </div>
- </curly-block><br>
- <br>
- </template>
-
- <template if="{{ library.variables.isNotEmpty }}">
- variables ({{ library.variables.length }})
- <curly-block expand="{{ library.variables.length <= 8 }}">
- <div class="memberList">
- <template repeat="{{ field in library.variables }}">
- <div class="memberItem">
- <div class="memberName">
- <field-ref ref="{{ field }}"></field-ref>
- </div>
- <div class="memberValue">
- <template if="{{ field['value'] != null }}">
- <any-service-ref ref="{{ field['value'] }}"></any-service-ref>
- </template>
- </div>
- </div>
+ <div class="flex-row">
+ <div class="flex-item-20-percent">
+ <ul>
+ <template repeat="{{ metric in isolate.dartMetrics.values }}">
+ <template if="{{ metric == selectedMetric }}">
+ <li class="selected">
+ {{ metric.name }}
+ </li>
</template>
- </div>
- </curly-block><br>
- <br>
- </template>
-
- <template if="{{ library.functions.isNotEmpty }}">
- functions ({{ library.functions.length }})
- <curly-block expand="{{ library.functions.length <= 8 }}">
- <div class="memberList">
- <template repeat="{{ function in library.functions }}">
- <div class="memberItem">
- <div class="memberValue">
- <function-ref ref="{{ function }}"></function-ref>
- </div>
- </div>
+ <template if="{{ metric != selectedMetric }}">
+ <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}">
+ {{ metric.name }}
+ </li>
</template>
- </div>
- </curly-block><br>
- <br>
- </template>
- </div>
-
- <hr>
-
- <div class="content">
- <eval-box callback="{{ eval }}"></eval-box>
+ </template>
+ <template repeat="{{ metric in isolate.vmMetrics.values }}">
+ <template if="{{ metric == selectedMetric }}">
+ <li class="selected">
+ {{ metric.name }}
+ </li>
+ </template>
+ <template if="{{ metric != selectedMetric }}">
+ <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}">
+ {{ metric.name }}
+ </li>
+ </template>
+ </template>
+ </ul>
+ </div>
+ <div class="flex-item-80-percent">
+ <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}">
+ </metrics-graph>
+ <div>
+ <metric-details page="{{ page }}" metric="{{ selectedMetric }}">
+ </metric-details>
+ </div>
+ </div>
</div>
- <br><br><br><br>
- <br><br><br><br>
</template>
</polymer-element>
-
-
-
-
-
-<polymer-element name="metrics-page" extends="observatory-element">
+<polymer-element name="metric-details" extends="observatory-element">
<template>
<style>
/* Global styles */
@@ -16312,64 +16902,63 @@ hr {
word-wrap: break-word;
}
</style>
- <style>
- ul li:hover:not(.selected) {
- background-color: #FFF3E3;
- }
- .selected {
- background-color: #0489c3;
- }
- .graph {
- min-height: 600px;
- }
- </style>
- <nav-bar>
- <top-nav-menu last="{{ true }}"></top-nav-menu>
- <nav-refresh callback="{{ refresh }}"></nav-refresh>
- <nav-control></nav-control>
- </nav-bar>
- <div class="flex-row">
- <div class="flex-item-20-percent">
- <ul>
- <template repeat="{{ metric in isolate.dartMetrics.values }}">
- <template if="{{ metric == selectedMetric }}">
- <li class="selected">
- {{ metric.name }}
- </li>
- </template>
- <template if="{{ metric != selectedMetric }}">
- <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}">
- {{ metric.name }}
- </li>
- </template>
- </template>
- <template repeat="{{ metric in isolate.vmMetrics.values }}">
- <template if="{{ metric == selectedMetric }}">
- <li class="selected">
- {{ metric.name }}
- </li>
- </template>
- <template if="{{ metric != selectedMetric }}">
- <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}">
- {{ metric.name }}
- </li>
- </template>
- </template>
- </ul>
- </div>
- <div class="flex-item-80-percent">
- <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}">
- </metrics-graph>
- <div>
- <metric-details page="{{ page }}" metric="{{ selectedMetric }}">
- </metric-details>
+ <div class="content-centered">
+ <div class="memberList">
+ <div class="memberItem">
+ <div class="memberName">name</div>
+ <div class="memberValue">{{ metric.name }}</div>
+ </div>
+ <div class="memberItem">
+ <div class="memberName">description</div>
+ <div class="memberValue">{{ metric.description }}</div>
+ </div>
+ <div class="memberItem">
+ <div class="memberName">current value</div>
+ <div class="memberValue">{{ metric.value }}</div>
+ </div>
+ <template if="{{ (metric != null) &amp;&amp; (metric.min != null) }}">
+ <div class="memberItem">
+ <div class="memberName">minimum</div>
+ <div class="memberValue">{{ metric.min }}</div>
+ </div>
+ </template>
+ <template if="{{ (metric != null) &amp;&amp; (metric.max != null) }}">
+ <div class="memberItem">
+ <div class="memberName">maximum</div>
+ <div class="memberValue">{{ metric.max }}</div>
+ </div>
+ </template>
+ <div class="memberItem">
+ <div class="memberName">refresh rate</div>
+ <div class="memberValue">
+ <select id="refreshrate" on-change="{{ refreshRateChange }}">
+ <!-- These must be kept in sync with POLL_PERIODS in MetricsPage
+ in object.dart -->
+ <option value="8000">Every eight seconds</option>
+ <option value="4000">Every four seconds</option>
+ <option value="2000">Every two seconds</option>
+ <option value="1000">Once a second</option>
+ <option value="100">Ten times per second</option>
+ <option value="0" selected="selected">Never</option>
+ </select>
+ </div>
+ </div>
+ <div class="memberItem">
+ <div class="memberName">sample buffer size</div>
+ <div class="memberValue">
+ <select id="buffersize" on-change="{{ sampleBufferSizeChange }}">
+ <option value="10">10</option>
+ <option value="100" selected="selected">100</option>
+ <option value="1000">1000</option>
+ </select>
+ </div>
</div>
</div>
</div>
</template>
</polymer-element>
-<polymer-element name="metric-details" extends="observatory-element">
+<polymer-element name="metrics-graph" extends="observatory-element">
<template>
<style>
/* Global styles */
@@ -16626,63 +17215,30 @@ hr {
word-wrap: break-word;
}
</style>
- <div class="content-centered">
- <div class="memberList">
- <div class="memberItem">
- <div class="memberName">name</div>
- <div class="memberValue">{{ metric.name }}</div>
- </div>
- <div class="memberItem">
- <div class="memberName">description</div>
- <div class="memberValue">{{ metric.description }}</div>
- </div>
- <div class="memberItem">
- <div class="memberName">current value</div>
- <div class="memberValue">{{ metric.value }}</div>
- </div>
- <template if="{{ (metric != null) &amp;&amp; (metric.min != null) }}">
- <div class="memberItem">
- <div class="memberName">minimum</div>
- <div class="memberValue">{{ metric.min }}</div>
- </div>
- </template>
- <template if="{{ (metric != null) &amp;&amp; (metric.max != null) }}">
- <div class="memberItem">
- <div class="memberName">maximum</div>
- <div class="memberValue">{{ metric.max }}</div>
- </div>
- </template>
- <div class="memberItem">
- <div class="memberName">refresh rate</div>
- <div class="memberValue">
- <select id="refreshrate" on-change="{{ refreshRateChange }}">
- <!-- These must be kept in sync with POLL_PERIODS in MetricsPage
- in object.dart -->
- <option value="8000">Every eight seconds</option>
- <option value="4000">Every four seconds</option>
- <option value="2000">Every two seconds</option>
- <option value="1000">Once a second</option>
- <option value="100">Ten times per second</option>
- <option value="0" selected="selected">Never</option>
- </select>
- </div>
- </div>
- <div class="memberItem">
- <div class="memberName">sample buffer size</div>
- <div class="memberValue">
- <select id="buffersize" on-change="{{ sampleBufferSizeChange }}">
- <option value="10">10</option>
- <option value="100" selected="selected">100</option>
- <option value="1000">1000</option>
- </select>
- </div>
- </div>
- </div>
+ <style>
+ .graph {
+ min-height: 600px;
+ }
+ </style>
+ <div id="graph" class="graph">
</div>
</template>
</polymer-element>
-<polymer-element name="metrics-graph" extends="observatory-element">
+
+
+
+
+
+
+
+
+
+
+
+
+
+<polymer-element name="object-view" extends="observatory-element">
<template>
<style>
/* Global styles */
@@ -16939,13 +17495,19 @@ hr {
word-wrap: break-word;
}
</style>
- <style>
- .graph {
- min-height: 600px;
- }
- </style>
- <div id="graph" class="graph">
+ <nav-bar>
+ <top-nav-menu></top-nav-menu>
+ <isolate-nav-menu isolate="{{ object.isolate }}"></isolate-nav-menu>
+ <nav-menu link="." anchor="object" last="{{ true }}"></nav-menu>
+ <nav-refresh callback="{{ refresh }}"></nav-refresh>
+ <nav-control></nav-control>
+ </nav-bar>
+
+ <div class="content">
+ <object-common object="{{ object }}"></object-common>
</div>
+
+ <hr>
</template>
</polymer-element>
« no previous file with comments | « no previous file | runtime/bin/vmservice/observatory/deployed/web/index.html._data » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698