| OLD | NEW |
|---|
| (Empty) |
| 1 <link rel="import" href="../../../../packages/polymer/polymer.html"> | |
| 2 <link rel="import" href="nav_bar.html"> | |
| 3 <link rel="import" href="observatory_element.html"> | |
| 4 | |
| 5 <polymer-element name="metrics-page" extends="observatory-element"> | |
| 6 <template> | |
| 7 <link rel="stylesheet" href="css/shared.css"> | |
| 8 <style> | |
| 9 ul li:hover:not(.selected) { | |
| 10 background-color: #FFF3E3; | |
| 11 } | |
| 12 .selected { | |
| 13 background-color: #0489c3; | |
| 14 } | |
| 15 .graph { | |
| 16 min-height: 600px; | |
| 17 } | |
| 18 </style> | |
| 19 <nav-bar> | |
| 20 <top-nav-menu last="{{ true }}"></top-nav-menu> | |
| 21 <nav-refresh callback="{{ refresh }}"></nav-refresh> | |
| 22 <nav-control></nav-control> | |
| 23 </nav-bar> | |
| 24 <div class="flex-row"> | |
| 25 <div class="flex-item-20-percent"> | |
| 26 <ul> | |
| 27 <template repeat="{{ metric in isolate.dartMetrics.values }}"> | |
| 28 <template if="{{ metric == selectedMetric }}"> | |
| 29 <li class="selected"> | |
| 30 {{ metric.name }} | |
| 31 </li> | |
| 32 </template> | |
| 33 <template if="{{ metric != selectedMetric }}"> | |
| 34 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> | |
| 35 {{ metric.name }} | |
| 36 </li> | |
| 37 </template> | |
| 38 </template> | |
| 39 <template repeat="{{ metric in isolate.vmMetrics.values }}"> | |
| 40 <template if="{{ metric == selectedMetric }}"> | |
| 41 <li class="selected"> | |
| 42 {{ metric.name }} | |
| 43 </li> | |
| 44 </template> | |
| 45 <template if="{{ metric != selectedMetric }}"> | |
| 46 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> | |
| 47 {{ metric.name }} | |
| 48 </li> | |
| 49 </template> | |
| 50 </template> | |
| 51 </ul> | |
| 52 </div> | |
| 53 <div class="flex-item-80-percent"> | |
| 54 <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}"> | |
| 55 </metrics-graph> | |
| 56 <div> | |
| 57 <metric-details page="{{ page }}" metric="{{ selectedMetric }}"> | |
| 58 </metric-details> | |
| 59 </div> | |
| 60 </div> | |
| 61 </div> | |
| 62 </template> | |
| 63 </polymer-element> | |
| 64 | |
| 65 <polymer-element name="metric-details" extends="observatory-element"> | |
| 66 <template> | |
| 67 <link rel="stylesheet" href="css/shared.css"> | |
| 68 <div class="content-centered"> | |
| 69 <div class="memberList"> | |
| 70 <div class="memberItem"> | |
| 71 <div class="memberName">name</div> | |
| 72 <div class="memberValue">{{ metric.name }}</div> | |
| 73 </div> | |
| 74 <div class="memberItem"> | |
| 75 <div class="memberName">description</div> | |
| 76 <div class="memberValue">{{ metric.description }}</div> | |
| 77 </div> | |
| 78 <div class="memberItem"> | |
| 79 <div class="memberName">current value</div> | |
| 80 <div class="memberValue">{{ metric.value }}</div> | |
| 81 </div> | |
| 82 <template if="{{ (metric != null) && (metric.min != null) }}"> | |
| 83 <div class="memberItem"> | |
| 84 <div class="memberName">minimum</div> | |
| 85 <div class="memberValue">{{ metric.min }}</div> | |
| 86 </div> | |
| 87 </template> | |
| 88 <template if="{{ (metric != null) && (metric.max != null) }}"> | |
| 89 <div class="memberItem"> | |
| 90 <div class="memberName">maximum</div> | |
| 91 <div class="memberValue">{{ metric.max }}</div> | |
| 92 </div> | |
| 93 </template> | |
| 94 <div class="memberItem"> | |
| 95 <div class="memberName">refresh rate</div> | |
| 96 <div class="memberValue"> | |
| 97 <select id="refreshrate" on-change="{{ refreshRateChange }}"> | |
| 98 <!-- These must be kept in sync with POLL_PERIODS in MetricsPage | |
| 99 in object.dart --> | |
| 100 <option value="8000">Every eight seconds</option> | |
| 101 <option value="4000">Every four seconds</option> | |
| 102 <option value="2000">Every two seconds</option> | |
| 103 <option value="1000">Once a second</option> | |
| 104 <option value="100">Ten times per second</option> | |
| 105 <option value="0" selected="selected">Never</option> | |
| 106 </select> | |
| 107 </div> | |
| 108 </div> | |
| 109 <div class="memberItem"> | |
| 110 <div class="memberName">sample buffer size</div> | |
| 111 <div class="memberValue"> | |
| 112 <select id="buffersize" on-change="{{ sampleBufferSizeChange }}"> | |
| 113 <option value="10">10</option> | |
| 114 <option value="100" selected="selected">100</option> | |
| 115 <option value="1000">1000</option> | |
| 116 </select> | |
| 117 </div> | |
| 118 </div> | |
| 119 </div> | |
| 120 </div> | |
| 121 </template> | |
| 122 </polymer-element> | |
| 123 | |
| 124 <polymer-element name="metrics-graph" extends="observatory-element"> | |
| 125 <template> | |
| 126 <link rel="stylesheet" href="css/shared.css"> | |
| 127 <style> | |
| 128 .graph { | |
| 129 min-height: 600px; | |
| 130 } | |
| 131 </style> | |
| 132 <div id="graph" class="graph"> | |
| 133 </div> | |
| 134 </template> | |
| 135 </polymer-element> | |
| 136 | |
| 137 <script type="application/dart" src="metrics.dart"></script> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 837723004:
Build Observatory as part of runtime (Closed)
Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart