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

Side by Side Diff: runtime/bin/vmservice/client/deployed/web/index_devtools.html

Issue 148153007: Add Google Charts to Observatory and use it in allocation profiler (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Created 6 years, 10 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 unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 <!DOCTYPE html><html><head><script src="packages/shadow_dom/shadow_dom.debug.js" ></script> 1 <!DOCTYPE html><html><head>
2 <script src="packages/custom_element/custom-elements.debug.js"></script> 2
3 <script src="packages/browser/interop.js"></script>
4 3
5 <title>Dart VM Observatory</title> 4 <title>Dart VM Observatory</title>
6 <meta charset="utf-8"> 5 <meta charset="utf-8">
7 <link type="text/css" rel="stylesheet" href="bootstrap_css/css/bootstrap.min.c ss"> 6 <link type="text/css" rel="stylesheet" href="bootstrap_css/css/bootstrap.min.c ss">
7 <script type="text/javascript" src="https://www.google.com/jsapi"></script>
8
8 9
9 <script src="index_devtools.html_bootstrap.dart.js"></script> 10 <script src="index_devtools.html_bootstrap.dart.js"></script>
10 11
11 </head> 12 </head>
12 <body><polymer-element name="observatory-element"> 13 <body><polymer-element name="observatory-element">
13 14
14 </polymer-element><polymer-element name="breakpoint-list" extends="observatory-e lement"> 15 </polymer-element><polymer-element name="breakpoint-list" extends="observatory-e lement">
15 <template> 16 <template>
16 <template if="{{ msg['breakpoints'].isEmpty }}"> 17 <template if="{{ msg['breakpoints'].isEmpty }}">
17 <div class="panel panel-warning"> 18 <div class="panel panel-warning">
(...skipping 279 matching lines...) Expand 10 before | Expand all | Expand 10 after
297 </div> 298 </div>
298 </div> 299 </div>
299 </div> 300 </div>
300 </div> 301 </div>
301 </template> 302 </template>
302 303
303 </polymer-element><polymer-element name="isolate-summary" extends="observatory-e lement"> 304 </polymer-element><polymer-element name="isolate-summary" extends="observatory-e lement">
304 <template> 305 <template>
305 <div class="row"> 306 <div class="row">
306 <div class="col-md-1"> 307 <div class="col-md-1">
307 <img src="packages/observatory/src/observatory_elements/img/isolate_icon .png" class="img-polaroid"> 308 <img src="img/isolate_icon.png" class="img-polaroid">
308 </div> 309 </div>
309 310
310 <div class="col-md-1">{{ isolate.name }}</div> 311 <div class="col-md-1">{{ isolate.name }}</div>
311 312
312 <!-- TODO(turnidge): Use function-ref when it can take isolate param --> 313 <!-- TODO(turnidge): Use function-ref when it can take isolate param -->
313 <div class="col-md-4"> 314 <div class="col-md-4">
314 315
315 <div class="row"> 316 <div class="row">
316 <template if="{{ isolate.entry['id'] != null }}"> 317 <template if="{{ isolate.entry['id'] != null }}">
317 <a href="{{ app.locationManager.relativeLink(isolate.id, isolate.ent ry['id']) }}"> 318 <a href="{{ app.locationManager.relativeLink(isolate.id, isolate.ent ry['id']) }}">
(...skipping 231 matching lines...) Expand 10 before | Expand all | Expand 10 after
549 </table> 550 </table>
550 551
551 </template> 552 </template>
552 553
553 </polymer-element> 554 </polymer-element>
554 <polymer-element name="heap-profile" extends="observatory-element"> 555 <polymer-element name="heap-profile" extends="observatory-element">
555 <template> 556 <template>
556 <div> 557 <div>
557 <button type="button" on-click="{{refreshData}}">Refresh</button> 558 <button type="button" on-click="{{refreshData}}">Refresh</button>
558 </div> 559 </div>
559 <div> 560 <div class="row">
560 <span>New Space </span> 561 <div id="newPieChart" class="col-md-4" style="height: 400px">
561 <span>{{ status(true) }}</span> 562 </div>
563 <div id="newStatus" class="col-md-2">
564 <table class="table">
565 <tbody>
566 <tr>
567 <td>Collections</td>
568 <td>{{ formattedCollections(true) }}</td>
569 </tr>
570 <tr>
571 <td>Average Collection Time</td>
572 <td>{{ formattedAverage(true) }}</td>
573 </tr>
574 <tr>
575 <td>Cumulative Collection Time</td>
576 <td>{{ formattedTotalCollectionTime(true) }}</td>
577 </tr>
578 </tbody>
579 </table>
580 </div>
581 <div id="oldPieChart" class="col-md-4" style="height: 400px">
582 </div>
583 <div id="oldStatus" class="col-md-2">
584 <table class="table">
585 <tbody>
586 <tr>
587 <td>Collections</td>
588 <td>{{ formattedCollections(true) }}</td>
589 </tr>
590 <tr>
591 <td>Average Collection Time</td>
592 <td>{{ formattedAverage(true) }}</td>
593 </tr>
594 <tr>
595 <td>Cumulative Collection Time</td>
596 <td>{{ formattedTotalCollectionTime(true) }}</td>
597 </tr>
598 </tbody>
599 </table>
600 </div>
562 </div> 601 </div>
563 <div> 602 <div class="row">
564 <span>Old Space </span> 603 <div id="table" class="col-md-12" style="height: 800px"></div>
565 <span>{{ status(false) }}</span>
566 </div> 604 </div>
567 <table class="table table-hover">
568 <thead>
569 <tr>
570 <th>Class</th>
571 <th><button on-click="{{changeSortColumn}}" data-msg="1">Current (new)</ button></th>
572 <th><button on-click="{{changeSortColumn}}" data-msg="2">Allocated since GC (new)</button></th>
573 <th><button on-click="{{changeSortColumn}}" data-msg="3">Total before la st GC (new)</button></th>
574 <th><button on-click="{{changeSortColumn}}" data-msg="4">Total after las t GC (new)</button></th>
575 <th><button on-click="{{changeSortColumn}}" data-msg="5">Current (old)</ button></th>
576 <th><button on-click="{{changeSortColumn}}" data-msg="6">Allocated since GC (old)</button></th>
577 <th><button on-click="{{changeSortColumn}}" data-msg="7">Total before la st GC (old)</button></th>
578 <th><button on-click="{{changeSortColumn}}" data-msg="8">Total after las t GC (old)</button></th>
579 </tr>
580 </thead>
581 <tbody>
582 <tr template="" repeat="{{ cls in sortedProfile }}">
583 <td><class-ref app="{{ app }}" ref="{{ cls['class'] }}"></class-ref></td>
584 <td>{{ current(cls, true) }}</td>
585 <td>{{ allocated(cls, true) }}</td>
586 <td>{{ beforeGC(cls, true) }}</td>
587 <td>{{ afterGC(cls, true) }}</td>
588 <td>{{ current(cls, false) }}</td>
589 <td>{{ allocated(cls, false) }}</td>
590 <td>{{ beforeGC(cls, false) }}</td>
591 <td>{{ afterGC(cls, false) }}</td>
592 </tr>
593 </tbody>
594 </table>
595 </template> 605 </template>
596 606
597 </polymer-element><polymer-element name="script-view" extends="observatory-eleme nt"> 607 </polymer-element>
608 <polymer-element name="script-view" extends="observatory-element">
598 <template> 609 <template>
599 <div class="row"> 610 <div class="row">
600 <div class="col-md-8 col-md-offset-2"> 611 <div class="col-md-8 col-md-offset-2">
601 <div class="panel-heading"> 612 <div class="panel-heading">
602 <button on-click="{{refreshCoverage}}">Refresh Coverage</button> 613 <button on-click="{{refreshCoverage}}">Refresh Coverage</button>
603 {{ script.scriptRef['user_name'] }} 614 {{ script.scriptRef['user_name'] }}
604 {{ script.coveredPercentageFormatted() }} 615 {{ script.coveredPercentageFormatted() }}
605 </div> 616 </div>
606 <div class="panel-body"> 617 <div class="panel-body">
607 <table style="width:100%"> 618 <table style="width:100%">
(...skipping 197 matching lines...) Expand 10 before | Expand all | Expand 10 after
805 </template> 816 </template>
806 <template if="{{ app.locationManager.profile == false }}"> 817 <template if="{{ app.locationManager.profile == false }}">
807 <response-viewer app="{{ app }}"></response-viewer> 818 <response-viewer app="{{ app }}"></response-viewer>
808 </template> 819 </template>
809 </template> 820 </template>
810 821
811 </polymer-element> 822 </polymer-element>
812 <observatory-application devtools="true"></observatory-application> 823 <observatory-application devtools="true"></observatory-application>
813 824
814 </body></html> 825 </body></html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698