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

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

Issue 197873028: Implement isolate view page. (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: tweak html / gen js 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
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 152 matching lines...) Expand 10 before | Expand all | Expand 10 after
163 <polymer-element name="top-nav-menu"> 163 <polymer-element name="top-nav-menu">
164 <template> 164 <template>
165 <nav-menu link="#" anchor="Observatory" last="{{ last }}"> 165 <nav-menu link="#" anchor="Observatory" last="{{ last }}">
166 <content></content> 166 <content></content>
167 </nav-menu> 167 </nav-menu>
168 </template> 168 </template>
169 </polymer-element> 169 </polymer-element>
170 170
171 <polymer-element name="isolate-nav-menu" extends="observatory-element"> 171 <polymer-element name="isolate-nav-menu" extends="observatory-element">
172 <template> 172 <template>
173 <nav-menu link="#" anchor="{{ isolate.name }}" last="{{ last }}"> 173 <nav-menu link="{{ isolate.hashLink }}" anchor="{{ isolate.name }}" last="{{ last }}">
174 <nav-menu-item link="{{ isolate.relativeHashLink('stacktrace') }}" anchor= "stack trace"></nav-menu-item> 174 <nav-menu-item link="{{ isolate.relativeHashLink('stacktrace') }}" anchor= "stack trace"></nav-menu-item>
175 <nav-menu-item link="{{ isolate.relativeHashLink('profile') }}" anchor="cp u profile"></nav-menu-item> 175 <nav-menu-item link="{{ isolate.relativeHashLink('profile') }}" anchor="cp u profile"></nav-menu-item>
176 <nav-menu-item link="{{ isolate.relativeHashLink('allocationprofile') }}" anchor="heap profile"></nav-menu-item> 176 <nav-menu-item link="{{ isolate.relativeHashLink('allocationprofile') }}" anchor="heap profile"></nav-menu-item>
177 <nav-menu-item link="{{ isolate.relativeHashLink('heapmap') }}" anchor="he ap map"></nav-menu-item> 177 <nav-menu-item link="{{ isolate.relativeHashLink('heapmap') }}" anchor="he ap map"></nav-menu-item>
178 <nav-menu-item link="{{ isolate.relativeHashLink('debug/breakpoints') }}" anchor="breakpoints"></nav-menu-item> 178 <nav-menu-item link="{{ isolate.relativeHashLink('debug/breakpoints') }}" anchor="breakpoints"></nav-menu-item>
179 <content></content> 179 <content></content>
180 </nav-menu> 180 </nav-menu>
181 </template> 181 </template>
182 </polymer-element> 182 </polymer-element>
183 183
(...skipping 682 matching lines...) Expand 10 before | Expand all | Expand 10 after
866 </nav-bar> 866 </nav-bar>
867 <div class="row"> 867 <div class="row">
868 <p style="text-align:center">{{ status }}</p> 868 <p style="text-align:center">{{ status }}</p>
869 </div> 869 </div>
870 <div class="row"> 870 <div class="row">
871 <canvas id="fragmentation" width="1px" height="1px"></canvas> 871 <canvas id="fragmentation" width="1px" height="1px"></canvas>
872 </div> 872 </div>
873 </template> 873 </template>
874 874
875 </polymer-element> 875 </polymer-element>
876 <polymer-element name="isolate-ref" extends="service-ref">
877 <template>
878 <a href="{{ url }}">{{ ref.name }}</a>
879 </template>
880
881 </polymer-element>
876 <polymer-element name="isolate-summary" extends="observatory-element"> 882 <polymer-element name="isolate-summary" extends="observatory-element">
877 <template> 883 <template>
878 <div class="row"> 884 <div class="row">
879 <div class="col-md-1"> 885 <div class="col-md-1">
880 <img src="img/isolate_icon.png" class="img-polaroid"> 886 <img src="img/isolate_icon.png" class="img-polaroid">
881 </div> 887 </div>
882 888
883 <div class="col-md-1">{{ isolate.vmName }}</div> 889 <div class="col-md-1">{{ isolate.vmName }}</div>
884 890
885 <!-- TODO(turnidge): Use function-ref when it can take isolate param --> 891 <!-- TODO(turnidge): Use function-ref when it can take isolate param -->
886 <div class="col-md-4"> 892 <div class="col-md-4">
887 893
888 <div class="row"> 894 <div class="row">
889 <template if="{{ isolate.entry['id'] != null }}"> 895 <isolate-ref ref="{{ isolate }}"></isolate-ref>
890 <a href="{{ isolate.hashLink(isolate.entry['id']) }}">
891 {{ isolate.name }}
892 </a>
893 </template>
894 <template if="{{ isolate.entry['id'] == null }}">
895 {{ isolate.name }}
896 </template>
897 </div> 896 </div>
898 897
899 <div class="row"> 898 <div class="row">
900 <small> 899 <small>
901 (<a href="{{ isolate.rootLib.hashLink }}">library</a>) 900 (<a href="{{ isolate.rootLib.hashLink }}">library</a>)
902 (<a href="{{ isolate.relativeHashLink('debug/breakpoints') }}">break points</a>) 901 (<a href="{{ isolate.relativeHashLink('debug/breakpoints') }}">break points</a>)
903 (<a href="{{ isolate.relativeHashLink('profile') }}">profile</a>) 902 (<a href="{{ isolate.relativeHashLink('profile') }}">profile</a>)
904 </small> 903 </small>
905 </div> 904 </div>
906 </div> 905 </div>
(...skipping 22 matching lines...) Expand all
929 <div class="row"> 928 <div class="row">
930 <div class="col-md-3">{{ isolate.timers['init'] | formatTime }}</div> 929 <div class="col-md-3">{{ isolate.timers['init'] | formatTime }}</div>
931 <div class="col-md-1"></div> 930 <div class="col-md-1"></div>
932 <div class="col-md-3"><p class="text-muted">init</p></div> 931 <div class="col-md-3"><p class="text-muted">init</p></div>
933 </div> 932 </div>
934 </div> 933 </div>
935 <div class="col-md-2"> 934 <div class="col-md-2">
936 <a href="{{ isolate.relativeHashLink('allocationprofile') }}"> 935 <a href="{{ isolate.relativeHashLink('allocationprofile') }}">
937 {{ isolate.newHeapUsed | formatSize }}/{{ isolate.oldHeapUsed | format Size }} 936 {{ isolate.newHeapUsed | formatSize }}/{{ isolate.oldHeapUsed | format Size }}
938 </a> 937 </a>
939 (<a href="{{ isolate.relativeHashLink('heapmap') }}">map</a>) 938 ( <a href="{{ isolate.relativeHashLink('heapmap') }}">map</a> )
940 </div> 939 </div>
941 <div class="col-md-2"> 940 <div class="col-md-2">
942 <template if="{{ isolate.topFrame == null }}"> 941 <template if="{{ isolate.topFrame == null }}">
943 idle 942 idle
944 </template> 943 </template>
945 <template if="{{ isolate.topFrame != null }}"> 944 <template if="{{ isolate.topFrame != null }}">
946 run 945 run
947 </template> 946 </template>
948 ( <a href="{{ isolate.relativeHashLink('stacktrace') }}">stack trace</a> ) 947 ( <a href="{{ isolate.relativeHashLink('stacktrace') }}">stack trace</a> )
949 </div> 948 </div>
(...skipping 25 matching lines...) Expand all
975 <ul class="list-group"> 974 <ul class="list-group">
976 <template repeat="{{ isolate in isolates.isolates.values }}"> 975 <template repeat="{{ isolate in isolates.isolates.values }}">
977 <li class="list-group-item"> 976 <li class="list-group-item">
978 <isolate-summary isolate="{{ isolate }}"></isolate-summary> 977 <isolate-summary isolate="{{ isolate }}"></isolate-summary>
979 </li> 978 </li>
980 </template> 979 </template>
981 </ul> 980 </ul>
982 </template> 981 </template>
983 982
984 </polymer-element> 983 </polymer-element>
984 <polymer-element name="isolate-view" extends="observatory-element">
985 <template>
986 <style>
987 .content {
988 padding-left: 10%;
989 font: 400 14px 'Montserrat', sans-serif;
990 }
991 h1 {
992 font: 400 18px 'Montserrat', sans-serif;
993 }
994 .memberList {
995 display: table;
996 }
997 .memberItem {
998 display: table-row;
999 }
1000 .memberName, .memberValue {
1001 display: table-cell;
1002 vertical-align: top;
1003 padding: 3px 0 3px 1em;
1004 font: 400 14px 'Montserrat', sans-serif;
1005 }
1006 .sourceInset {
1007 padding-left: 15%;
1008 padding-right: 15%;
1009 }
1010 </style>
1011
1012 <nav-bar>
1013 <top-nav-menu></top-nav-menu>
1014 <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}">
1015 </isolate-nav-menu>
1016 </nav-bar>
1017
1018 <div class="content">
1019 <h1>isolate '{{ isolate.name }}'</h1>
1020 <div class="memberList">
1021 <div class="memberItem">
1022 <div class="memberName">status</div>
1023 <div class="memberValue">
1024 <template if="{{ isolate.topFrame == null }}">
1025 <strong>idle</strong>
1026 </template>
1027 <template if="{{ isolate.topFrame != null }}">
1028 <strong>running</strong>
1029 @
1030 <function-ref ref="{{ isolate.topFrame['function'] }}">
1031 </function-ref>
1032 (<script-ref ref="{{ isolate.topFrame['script'] }}" line="{{ isola te.topFrame['line'] }}"></script-ref>)
1033 </template>
1034 </div>
1035 </div>
1036 </div>
1037 </div>
1038
1039 <template if="{{ isolate.topFrame != null }}">
1040 <br>
1041 <div class="sourceInset">
1042 <pre> {{ isolate.topFrame['line'] }} &nbsp; {{ isolate.topFrame ['lineString'] }}</pre>
1043 </div>
1044 </template>
1045
1046 <br>
1047
1048 <div class="content">
1049 <div class="memberList">
1050 <div class="memberItem">
1051 <div class="memberName">root library</div>
1052 <div class="memberValue">
1053 <function-ref ref="{{ isolate.rootLib }}"></function-ref>
1054 </div>
1055 </div>
1056 <div class="memberItem">
1057 <template if="{{ isolate.entry != null }}">
1058 <div class="memberName">entry</div>
1059 <div class="memberValue">
1060 <function-ref ref="{{ isolate.entry }}"></function-ref>
1061 </div>
1062 </template>
1063 </div>
1064 <div class="memberItem">
1065 <div class="memberName">id</div>
1066 <div class="memberValue">{{ isolate.vmName }}</div>
1067 </div>
1068 <br>
1069 <div class="memberItem">
1070 <div class="memberValue">
1071 See <a href="{{ isolate.relativeHashLink('stacktrace') }}">stack tra ce</a>
1072 </div>
1073 </div>
1074 <div class="memberItem">
1075 <div class="memberValue">
1076 See <a href="{{ isolate.relativeHashLink('profile') }}">cpu profile< /a>
1077 </div>
1078 </div>
1079 <div class="memberItem">
1080 <div class="memberValue">
1081 See <a href="{{ isolate.relativeHashLink('debug/breakpoints') }}">br eakpoints</a>
1082
1083 </div>
1084 </div>
1085 </div>
1086 </div>
1087
1088 <hr>
1089
1090 <div class="content">
1091 <div class="memberList">
1092 <div class="memberItem">
1093 <div class="memberName">new heap</div>
1094 <div class="memberValue">
1095 {{ isolate.newHeapUsed | formatSize }}
1096 of
1097 {{ isolate.newHeapCapacity | formatSize }}
1098 </div>
1099 </div>
1100 <div class="memberItem">
1101 <div class="memberName">old heap</div>
1102 <div class="memberValue">
1103 {{ isolate.oldHeapUsed | formatSize }}
1104 of
1105 {{ isolate.oldHeapCapacity | formatSize }}
1106 </div>
1107 </div>
1108 </div>
1109
1110 <br>
1111
1112 <div class="memberList">
1113 <div class="memberItem">
1114 <div class="memberValue">
1115 See <a href="{{ isolate.relativeHashLink('allocationprofile') }}">he ap profile</a>
1116 </div>
1117 </div>
1118 <div class="memberItem">
1119 <div class="memberValue">
1120 See <a href="{{ isolate.relativeHashLink('heapmap') }}">heap map</a>
1121 </div>
1122 </div>
1123 </div>
1124 </div>
1125
1126 <hr>
1127
1128 <div class="content">
1129 <eval-box callback="{{ eval }}"></eval-box>
1130 </div>
1131 <br><br><br><br>
1132 <br><br><br><br>
1133 </template>
1134
1135 </polymer-element>
985 <polymer-element name="instance-view" extends="observatory-element"> 1136 <polymer-element name="instance-view" extends="observatory-element">
986 <template> 1137 <template>
987 <nav-bar> 1138 <nav-bar>
988 <top-nav-menu></top-nav-menu> 1139 <top-nav-menu></top-nav-menu>
989 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu> 1140 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu>
990 <!-- TODO(turnidge): Add library nav menu here. --> 1141 <!-- TODO(turnidge): Add library nav menu here. -->
991 <class-nav-menu cls="{{ instance['class'] }}"></class-nav-menu> 1142 <class-nav-menu cls="{{ instance['class'] }}"></class-nav-menu>
992 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> 1143 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu>
993 <nav-refresh callback="{{ refresh }}"></nav-refresh> 1144 <nav-refresh callback="{{ refresh }}"></nav-refresh>
994 </nav-bar> 1145 </nav-bar>
(...skipping 517 matching lines...) Expand 10 before | Expand all | Expand 10 after
1512 <template> 1663 <template>
1513 <response-viewer app="{{ app }}"></response-viewer> 1664 <response-viewer app="{{ app }}"></response-viewer>
1514 </template> 1665 </template>
1515 1666
1516 </polymer-element> 1667 </polymer-element>
1517 1668
1518 1669
1519 <observatory-application devtools="true"></observatory-application> 1670 <observatory-application devtools="true"></observatory-application>
1520 1671
1521 </body></html> 1672 </body></html>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698