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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 194623006: Improve the instance-view page in observatory. (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: gen js / fix stuff Created 6 years, 9 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
« no previous file with comments | « runtime/bin/vmservice/client/deployed/web/index.html_bootstrap.dart.js ('k') | runtime/bin/vmservice/client/deployed/web/index_devtools.html_bootstrap.dart.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE html><html><head> 1 <!DOCTYPE html><html><head>
2 2
3 3
4 <title>Dart VM Observatory</title> 4 <title>Dart VM Observatory</title>
5 <meta charset="utf-8"> 5 <meta charset="utf-8">
6 <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> 7 <script type="text/javascript" src="https://www.google.com/jsapi"></script>
8 8
9 9
10 <script src="index_devtools.html_bootstrap.dart.js"></script> 10 <script src="index_devtools.html_bootstrap.dart.js"></script>
(...skipping 290 matching lines...) Expand 10 before | Expand all | Expand 10 after
301 </template> 301 </template>
302 </template> 302 </template>
303 </template> 303 </template>
304 304
305 </polymer-element> 305 </polymer-element>
306 <polymer-element name="instance-ref" extends="service-ref"> 306 <polymer-element name="instance-ref" extends="service-ref">
307 <template> 307 <template>
308 <style> 308 <style>
309 .member { 309 .member {
310 vertical-align: top; 310 vertical-align: top;
311 padding: 0 0 0 1em; 311 padding: 1px 0 1px 1em;
312 } 312 }
313 </style> 313 </style>
314 <div> 314 <div>
315 <template if="{{ isUnexpected(ref.serviceType) }}"> 315 <template if="{{ isUnexpected(ref.serviceType) }}">
316 unexpected reference type &lt;{{ ref['type'] }}&gt; 316 unexpected reference type &lt;{{ ref.serviceType }}&gt;
317 </template>
318
319 <template if="{{ isError(ref.serviceType) }}">
320 <pre>{{ ref.message }}</pre>
317 </template> 321 </template>
318 322
319 <template if="{{ isNull(ref.serviceType) }}"> 323 <template if="{{ isNull(ref.serviceType) }}">
320 <div title="{{ hoverText }}">{{ ref['preview'] }}</div> 324 <div title="{{ hoverText }}">{{ ref['preview'] }}</div>
321 </template> 325 </template>
322 326
323 <template if="{{ (isString(ref.serviceType) || 327 <template if="{{ (isString(ref.serviceType) ||
324 isBool(ref.serviceType) || 328 isBool(ref.serviceType) ||
325 isInt(ref.serviceType)) }}"> 329 isInt(ref.serviceType)) }}">
326 <a href="{{ url }}">{{ ref['preview'] }}</a> 330 <a href="{{ url }}">{{ ref['preview'] }}</a>
(...skipping 132 matching lines...) Expand 10 before | Expand all | Expand 10 after
459 <template> 463 <template>
460 <style> 464 <style>
461 .monospace { 465 .monospace {
462 font-family: consolas, courier, monospace; 466 font-family: consolas, courier, monospace;
463 font-size: 1em; 467 font-size: 1em;
464 line-height: 1.2em; 468 line-height: 1.2em;
465 white-space: nowrap; 469 white-space: nowrap;
466 } 470 }
467 </style> 471 </style>
468 <div class="row"> 472 <div class="row">
469 <div class="col-md-2 monospace">{{ instruction.formattedAddress() }}</div>
470 <div class="col-md-2 monospace">{{ instruction.formattedInclusive(code) }} </div> 473 <div class="col-md-2 monospace">{{ instruction.formattedInclusive(code) }} </div>
471 <div class="col-md-2 monospace">{{ instruction.formattedExclusive(code) }} </div> 474 <div class="col-md-2 monospace">{{ instruction.formattedExclusive(code) }} </div>
475 <div class="col-md-2 monospace">{{ instruction.formattedAddress() }}</div>
472 <div class="col-md-6 monospace">{{ instruction.human }}</div> 476 <div class="col-md-6 monospace">{{ instruction.human }}</div>
473 </div> 477 </div>
474 </template> 478 </template>
475 479
476 </polymer-element><polymer-element name="code-view" extends="observatory-element "> 480 </polymer-element><polymer-element name="code-view" extends="observatory-element ">
477 <template> 481 <template>
478 <nav-bar> 482 <nav-bar>
479 <top-nav-menu></top-nav-menu> 483 <top-nav-menu></top-nav-menu>
480 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu> 484 <isolate-nav-menu isolate="{{ code.isolate }}"></isolate-nav-menu>
481 <nav-menu link="." anchor="{{ code.name }}" last="{{ true }}"></nav-menu> 485 <nav-menu link="." anchor="{{ code.name }}" last="{{ true }}"></nav-menu>
482 <nav-refresh callback="{{ refresh }}"></nav-refresh> 486 <nav-refresh callback="{{ refresh }}"></nav-refresh>
483 </nav-bar> 487 </nav-bar>
484 488
485 <div class="row"> 489 <div class="row">
486 <div class="col-md-8 col-md-offset-2"> 490 <div class="col-md-8 col-md-offset-2">
487 <div class="{{ cssPanelClass }}"> 491 <div class="{{ cssPanelClass }}">
488 <div class="panel-heading"> 492 <div class="panel-heading">
489 <span>Disassembled code for function: </span> 493 <span>Disassembled code for function: </span>
490 <function-ref ref="{{ code.function }}"></function-ref> 494 <function-ref ref="{{ code.function }}"></function-ref>
491 </div> 495 </div>
492 <div class="panel-body"> 496 <div class="panel-body">
493 <div class="row"> 497 <div class="row">
494 <div class="col-md-2"><strong>Address</strong></div>
495 <div class="col-md-2"><strong>Inclusive</strong></div> 498 <div class="col-md-2"><strong>Inclusive</strong></div>
496 <div class="col-md-2"><strong>Exclusive</strong></div> 499 <div class="col-md-2"><strong>Exclusive</strong></div>
500 <div class="col-md-2"><strong>Address</strong></div>
497 <div class="col-md-6"><strong>Disassembly</strong></div> 501 <div class="col-md-6"><strong>Disassembly</strong></div>
498 </div> 502 </div>
499 <template repeat="{{ instruction in code.instructions }}"> 503 <template repeat="{{ instruction in code.instructions }}">
500 <disassembly-entry code="{{ code }}" instruction="{{ instruction }}" > 504 <disassembly-entry code="{{ code }}" instruction="{{ instruction }}" >
501 </disassembly-entry> 505 </disassembly-entry>
502 </template> 506 </template>
503 </div> 507 </div>
504 </div> 508 </div>
505 </div> 509 </div>
506 </div> 510 </div>
507 </template> 511 </template>
508 512
509 </polymer-element> 513 </polymer-element>
510 <polymer-element name="collapsible-content" extends="observatory-element"> 514 <polymer-element name="collapsible-content" extends="observatory-element">
511 <template> 515 <template>
512 <div class="well row"> 516 <div class="well row">
513 <a on-click="toggleDisplay" class="btn muted unselectable"> 517 <a on-click="toggleDisplay" class="btn muted unselectable">
514 Raw message... <i class="{{ iconClass }}"></i> 518 Raw message... <i class="{{ iconClass }}"></i>
515 </a> 519 </a>
516 <div style="display: {{ displayValue }}" class="well"> 520 <div style="display: {{ displayValue }}" class="well">
517 <content></content> 521 <content></content>
518 </div> 522 </div>
519 </div> 523 </div>
520 </template> 524 </template>
521 525
522 </polymer-element><polymer-element name="field-view" extends="observatory-elemen t"> 526 </polymer-element><polymer-element name="eval-box" extends="observatory-element" >
527 <template>
528 <style>
529 .textbox {
530 width: 80ex;
531 font: 400 16px 'Montserrat', sans-serif;
532 }
533 .bigtextbox {
534 font: 400 16px 'Montserrat', sans-serif;
535 }
536 .button {
537 font: 400 16px 'Montserrat', sans-serif;
538 }
539 .radios {
540 display: inline;
541 }
542 .radios label{
543 padding-left: 15px;
544 }
545 .historyExpr, .historyValue {
546 vertical-align: text-top;
547 font: 400 14px 'Montserrat', sans-serif;
548 }
549 .historyExpr a {
550 display: block;
551 color: black;
552 text-decoration: none;
553 padding: 6px 6px;
554 cursor: pointer;
555 white-space: pre-line;
556 }
557 .historyExpr a:hover {
558 background-color: #e1f5fe
559 }
560 .historyValue {
561 display: block;
562 padding: 6px 6px;
563 }
564 </style>
565 <form>
566 <template if="{{ lineMode == '1-line' }}">
567 <input class="textbox" type="text" value="{{ text }}">
568 </template>
569 <template if="{{ lineMode == 'N-line' }}">
570 <textarea class="bigtextbox" rows="5" cols="80" value="{{ text }}"></tex tarea>
571 </template>
572
573 <input class="button" type="submit" value="Evaluate" on-click="{{ eval }}" >
574 <div class="radios" on-change="{{ updateLineMode }}">
575 <label for="1-line">1-line
576 <input type="radio" name="lineMode" value="1-line" checked="">
577 </label>
578 <label for="N-line">N-line
579 <input type="radio" name="lineMode" value="N-line">
580 </label>
581 </div>
582 </form>
583
584 <br>
585 <template if="{{ results.isNotEmpty }}">
586 <table>
587 <tbody><tr template="" repeat="{{ result in results }}">
588 <td class="historyExpr">
589 <a class="expr" on-click="{{ selectExpr }}" expr="{{ result['expr'] }}">{{ result['expr'] }}</a>
590 </td>
591 <td class="historyValue">
592 <template if="{{ result['value'] == null }}">
593 <div style="color:#aaa;cursor:wait;">&lt;pending&gt;</div>
594 </template>
595 <template if="{{ result['value'] != null }}">
596 <instance-ref isolate="{{ isolate }}" ref="{{ result['value'] }}">
597 </instance-ref>
598 </template>
599 </td>
600 </tr>
601 </tbody></table>
602 </template>
603 </template>
604 </polymer-element>
605
606
607 <polymer-element name="field-view" extends="observatory-element">
523 <template> 608 <template>
524 <nav-bar> 609 <nav-bar>
525 <top-nav-menu></top-nav-menu> 610 <top-nav-menu></top-nav-menu>
526 <isolate-nav-menu isolate="{{ field.isolate }}"></isolate-nav-menu> 611 <isolate-nav-menu isolate="{{ field.isolate }}"></isolate-nav-menu>
527 <template if="{{ field['owner'].serviceType == 'Class' }}"> 612 <template if="{{ field['owner'].serviceType == 'Class' }}">
528 <!-- TODO(turnidge): Add library nav menu here. --> 613 <!-- TODO(turnidge): Add library nav menu here. -->
529 <class-nav-menu cls="{{ field['owner'] }}"></class-nav-menu> 614 <class-nav-menu cls="{{ field['owner'] }}"></class-nav-menu>
530 </template> 615 </template>
531 <template if="{{ field['owner'].serviceType == 'Library' }}"> 616 <template if="{{ field['owner'].serviceType == 'Library' }}">
532 <library-nav-menu library="{{ field['owner'] }}"></library-nav-menu> 617 <library-nav-menu library="{{ field['owner'] }}"></library-nav-menu>
(...skipping 217 matching lines...) Expand 10 before | Expand all | Expand 10 after
750 835
751 </polymer-element> 836 </polymer-element>
752 <polymer-element name="instance-view" extends="observatory-element"> 837 <polymer-element name="instance-view" extends="observatory-element">
753 <template> 838 <template>
754 <nav-bar> 839 <nav-bar>
755 <top-nav-menu></top-nav-menu> 840 <top-nav-menu></top-nav-menu>
756 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu> 841 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu>
757 <!-- TODO(turnidge): Add library nav menu here. --> 842 <!-- TODO(turnidge): Add library nav menu here. -->
758 <class-nav-menu cls="{{ instance['class'] }}"></class-nav-menu> 843 <class-nav-menu cls="{{ instance['class'] }}"></class-nav-menu>
759 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> 844 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu>
760 <!-- TODO(turnidge): Add nav refresh here. --> 845 <nav-refresh callback="{{ refresh }}"></nav-refresh>
761 </nav-bar> 846 </nav-bar>
762 847
763 <div class="row"> 848 <style>
764 <div class="col-md-8 col-md-offset-2"> 849 .content {
765 <div class="panel panel-warning"> 850 padding-left: 10%;
766 <div class="panel-heading"> 851 font: 400 14px 'Montserrat', sans-serif;
767 Instance of 852 }
768 <class-ref ref="{{ instance['class'] }}"></class-ref> 853 h1 {
769 </div> 854 font: 400 18px 'Montserrat', sans-serif;
770 <div class="panel-body"> 855 }
771 <template if="{{ instance['error'] == null }}"> 856 .member {
772 <table class="table table-hover"> 857 vertical-align: top;
773 <tbody> 858 padding: 3px 0 3px 1em;
774 <tr> 859 font: 400 14px 'Montserrat', sans-serif;
775 <td>Preview</td><td>{{ instance['preview'] }}</td> 860 }
776 </tr> 861 .memberBold {
777 </tbody> 862 vertical-align: top;
778 </table> 863 padding: 3px 0 3px 1em;
779 <blockquote><strong>Fields</strong></blockquote> 864 font: 400 14px 'Montserrat', sans-serif;
780 <table class="table table-hover"> 865 }
781 <tbody> 866 </style>
782 <tr template="" repeat="{{ field in instance['fields'] }}"> 867
783 <td><field-ref ref="{{ field['decl'] }}"></field-ref></td> 868 <template if="{{ instance['error'] != null }}">
784 <td><instance-ref ref="{{ field['value'] }}"></instance-ref></ td> 869 <error-view error_obj="{{ instance['error'] }}"></error-view>
785 </tr> 870 </template>
786 </tbody> 871
787 </table> 872 <template if="{{ instance['error'] == null }}">
788 </template> 873 <div class="content">
789 <template if="{{ instance['error'] != null }}"> 874 <!-- TODO(turnidge): Handle null instances. -->
790 <error-view error_obj="{{ instance['error'] }}"></error-view> 875 <h1>instance of {{ instance['class']['user_name'] }}</h1>
791 </template> 876 <table>
792 </div> 877 <tbody><tr>
878 <td class="memberBold">class</td>
879 <td class="member">
880 <class-ref ref="{{ instance['class'] }}">
881 </class-ref>
882 </td>
883 </tr>
884 <tr template="" if="{{ instance['preview'] != null }}">
885 <td class="memberBold">preview</td>
886 <td class="member">{{ instance['preview'] }}</td>
887 </tr>
888 <tr>
889 <td class="memberBold">size</td>
890 <td class="member">{{ instance['size'] | formatSize }}</td>
891 </tr>
892 </tbody></table>
793 </div> 893 </div>
794 </div> 894
795 </div> 895 <hr>
896
897 <div class="content">
898 <template if="{{ instance['fields'].isNotEmpty }}">
899 fields ({{ instance['fields'].length }})
900 <curly-block>
901 <table>
902 <tbody><tr template="" repeat="{{ field in instance['fields'] }}">
903 <td class="member">
904 <field-ref ref="{{ field['decl'] }}"></field-ref>
905 </td>
906 <td class="member">
907 <instance-ref ref="{{ field['value'] }}"></instance-ref>
908 </td>
909 </tr>
910 </tbody></table>
911 </curly-block>
912 </template>
913
914 <template if="{{ instance['nativeFields'].isNotEmpty }}">
915 native fields ({{ instance['nativeFields'].length }})
916 <curly-block>
917 <table>
918 <tbody><tr template="" repeat="{{ field in instance['nativeFields' ] }}">
919 <td class="member">[{{ field['index']}}]</td>
920 <td class="member">[{{ field['value']}}]</td>
921 </tr>
922 </tbody></table>
923 </curly-block>
924 </template>
925
926 <template if="{{ instance['elements'].isNotEmpty }}">
927 elements ({{ instance['elements'].length }})
928 <curly-block>
929 <table>
930 <tbody><tr template="" repeat="{{ element in instance['elements'] }}">
931 <td class="member">[{{ element['index']}}]</td>
932 <td class="member">
933 <instance-ref ref="{{ element['value'] }}">
934 </instance-ref>
935 </td>
936 </tr>
937 </tbody></table>
938 </curly-block>
939 </template>
940 </div>
941
942 <hr>
943
944 <div class="content">
945 <eval-box callback="{{ eval }}"></eval-box>
946 </div>
947 <br><br><br><br>
948 <br><br><br><br>
949 </template>
796 </template> 950 </template>
797 951
798 </polymer-element> 952 </polymer-element>
799 <polymer-element name="json-view" extends="observatory-element"> 953 <polymer-element name="json-view" extends="observatory-element">
800 <template> 954 <template>
801 <template bind="" if="{{ valueType == 'Primitive' }}"> 955 <template bind="" if="{{ valueType == 'Primitive' }}">
802 <span>{{primitiveString}}</span> 956 <span>{{primitiveString}}</span>
803 </template> 957 </template>
804 <template bind="" if="{{ valueType == 'List' }}"> 958 <template bind="" if="{{ valueType == 'List' }}">
805 <table class="table table-condensed table-bordered"> 959 <table class="table table-condensed table-bordered">
(...skipping 381 matching lines...) Expand 10 before | Expand all | Expand 10 after
1187 <template> 1341 <template>
1188 <response-viewer app="{{ app }}"></response-viewer> 1342 <response-viewer app="{{ app }}"></response-viewer>
1189 </template> 1343 </template>
1190 1344
1191 </polymer-element> 1345 </polymer-element>
1192 1346
1193 1347
1194 <observatory-application devtools="true"></observatory-application> 1348 <observatory-application devtools="true"></observatory-application>
1195 1349
1196 </body></html> 1350 </body></html>
OLDNEW
« no previous file with comments | « runtime/bin/vmservice/client/deployed/web/index.html_bootstrap.dart.js ('k') | runtime/bin/vmservice/client/deployed/web/index_devtools.html_bootstrap.dart.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698