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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 206213004: Add a VM page to the observatory. (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: 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 144 matching lines...) Expand 10 before | Expand all | Expand 10 after
155 </template> 155 </template>
156 <template if="{{ !active }}"> 156 <template if="{{ !active }}">
157 <button class="idle" on-click="{{ buttonClick }}">{{ label }}</button> 157 <button class="idle" on-click="{{ buttonClick }}">{{ label }}</button>
158 </template> 158 </template>
159 </li> 159 </li>
160 </template> 160 </template>
161 </polymer-element> 161 </polymer-element>
162 162
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="#/vm" 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="{{ isolate.hashLink }}" 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>
(...skipping 546 matching lines...) Expand 10 before | Expand all | Expand 10 after
722 Raw message... <i class="{{ iconClass }}"></i> 722 Raw message... <i class="{{ iconClass }}"></i>
723 </a> 723 </a>
724 <div style="display: {{ displayValue }}" class="well"> 724 <div style="display: {{ displayValue }}" class="well">
725 <content></content> 725 <content></content>
726 </div> 726 </div>
727 </div> 727 </div>
728 </template> 728 </template>
729 729
730 </polymer-element><polymer-element name="error-view" extends="observatory-elemen t"> 730 </polymer-element><polymer-element name="error-view" extends="observatory-elemen t">
731 <template> 731 <template>
732 <nav-bar>
733 <top-nav-menu last="{{ true }}"></top-nav-menu>
734 </nav-bar>
735
732 <div class="row"> 736 <div class="row">
733 <div class="col-md-8 col-md-offset-2"> 737 <div class="col-md-8 col-md-offset-2">
734 <div class="panel panel-danger"> 738 <div class="panel panel-danger">
735 <div class="panel-heading">{{ error.kind }}</div> 739 <div class="panel-heading">{{ error.kind }}</div>
736 <div class="panel-body"> 740 <div class="panel-body">
737 <p>{{ error.message }}</p> 741 <p>{{ error.message }}</p>
738 </div> 742 </div>
739 </div> 743 </div>
740 </div> 744 </div>
741 </div> 745 </div>
742 </template> 746 </template>
743 747
744 </polymer-element><polymer-element name="field-view" extends="observatory-elemen t"> 748 </polymer-element>
749 <polymer-element name="field-view" extends="observatory-element">
745 <template> 750 <template>
746 <nav-bar> 751 <nav-bar>
747 <top-nav-menu></top-nav-menu> 752 <top-nav-menu></top-nav-menu>
748 <isolate-nav-menu isolate="{{ field.isolate }}"></isolate-nav-menu> 753 <isolate-nav-menu isolate="{{ field.isolate }}"></isolate-nav-menu>
749 <template if="{{ field['owner'].serviceType == 'Class' }}"> 754 <template if="{{ field['owner'].serviceType == 'Class' }}">
750 <!-- TODO(turnidge): Add library nav menu here. --> 755 <!-- TODO(turnidge): Add library nav menu here. -->
751 <class-nav-menu cls="{{ field['owner'] }}"></class-nav-menu> 756 <class-nav-menu cls="{{ field['owner'] }}"></class-nav-menu>
752 </template> 757 </template>
753 <template if="{{ field['owner'].serviceType == 'Library' }}"> 758 <template if="{{ field['owner'].serviceType == 'Library' }}">
754 <library-nav-menu library="{{ field['owner'] }}"></library-nav-menu> 759 <library-nav-menu library="{{ field['owner'] }}"></library-nav-menu>
(...skipping 125 matching lines...) Expand 10 before | Expand all | Expand 10 after
880 </template> 885 </template>
881 886
882 </polymer-element> 887 </polymer-element>
883 <polymer-element name="isolate-summary" extends="observatory-element"> 888 <polymer-element name="isolate-summary" extends="observatory-element">
884 <template> 889 <template>
885 <div class="row"> 890 <div class="row">
886 <div class="col-md-1"> 891 <div class="col-md-1">
887 <img src="img/isolate_icon.png" class="img-polaroid"> 892 <img src="img/isolate_icon.png" class="img-polaroid">
888 </div> 893 </div>
889 894
890 <div class="col-md-1">{{ isolate.vmName }}</div> 895 <div class="col-md-1">{{ isolate.mainPort }}</div>
891 896
892 <!-- TODO(turnidge): Use function-ref when it can take isolate param --> 897 <!-- TODO(turnidge): Use function-ref when it can take isolate param -->
893 <div class="col-md-4"> 898 <div class="col-md-4">
894 899
895 <div class="row"> 900 <div class="row">
896 <isolate-ref ref="{{ isolate }}"></isolate-ref> 901 <isolate-ref ref="{{ isolate }}"></isolate-ref>
897 </div> 902 </div>
898 903
899 <div class="row"> 904 <div class="row">
900 <small> 905 <small>
901 (<a href="{{ isolate.rootLib.hashLink }}">library</a>) 906 (<a href="{{ isolate.rootLib.hashLink }}">library</a>)
902 (<a href="{{ isolate.relativeHashLink('debug/breakpoints') }}">break points</a>) 907 (<a href="{{ isolate.relativeHashLink('debug/breakpoints') }}">break points</a>)
903 (<a href="{{ isolate.relativeHashLink('profile') }}">profile</a>) 908 (<a href="{{ isolate.relativeHashLink('profile') }}">profile</a>)
904 </small> 909 </small>
905 </div> 910 </div>
906 </div> 911 </div>
907 912
908 <div class="col-md-2"> 913 <div class="col-md-2">
909 <div class="row"> 914 <div class="row">
910 <div class="col-md-3">{{ isolate.timers['total'] | formatTime }}</div> 915 <div class="col-md-5">{{ isolate.timers['total'] | formatTimePrecise } }</div>
911 <div class="col-md-1"></div> 916 <div class="col-md-1"></div>
912 <div class="col-md-3"><p class="text-muted">total</p></div> 917 <div class="col-md-3"><p class="text-muted">total</p></div>
913 </div> 918 </div>
914 <div class="row"> 919 <div class="row">
915 <div class="col-md-3">{{ isolate.timers['dart'] | formatTime }}</div> 920 <div class="col-md-5">{{ isolate.timers['dart'] | formatTimePrecise }} </div>
916 <div class="col-md-1"></div> 921 <div class="col-md-1"></div>
917 <div class="col-md-3"><p class="text-muted">dart</p></div> 922 <div class="col-md-3"><p class="text-muted">dart</p></div>
918 </div> 923 </div>
919 <div class="row"> 924 <div class="row">
920 <div class="col-md-3">{{ isolate.timers['compile'] | formatTime }}</di v> 925 <div class="col-md-5">{{ isolate.timers['compile'] | formatTimePrecise }}</div>
921 <div class="col-md-1"></div> 926 <div class="col-md-1"></div>
922 <div class="col-md-3"><p class="text-muted">compile</p></div> 927 <div class="col-md-3"><p class="text-muted">compile</p></div>
923 </div> 928 </div>
924 <div class="row"> 929 <div class="row">
925 <div class="col-md-3">{{ isolate.timers['gc'] | formatTime }}</div> 930 <div class="col-md-5">{{ isolate.timers['gc'] | formatTimePrecise }}</ div>
926 <div class="col-md-1"></div> 931 <div class="col-md-1"></div>
927 <div class="col-md-3"><p class="text-muted">gc</p></div> 932 <div class="col-md-3"><p class="text-muted">gc</p></div>
928 </div> 933 </div>
929 <div class="row"> 934 <div class="row">
930 <div class="col-md-3">{{ isolate.timers['init'] | formatTime }}</div> 935 <div class="col-md-5">{{ isolate.timers['init'] | formatTimePrecise }} </div>
931 <div class="col-md-1"></div> 936 <div class="col-md-1"></div>
932 <div class="col-md-3"><p class="text-muted">init</p></div> 937 <div class="col-md-3"><p class="text-muted">init</p></div>
933 </div> 938 </div>
934 </div> 939 </div>
935 <div class="col-md-2"> 940 <div class="col-md-2">
936 <a href="{{ isolate.relativeHashLink('allocationprofile') }}"> 941 <a href="{{ isolate.relativeHashLink('allocationprofile') }}">
937 {{ isolate.newHeapUsed | formatSize }}/{{ isolate.oldHeapUsed | format Size }} 942 {{ isolate.newHeapUsed | formatSize }}/{{ isolate.oldHeapUsed | format Size }}
938 </a> 943 </a>
939 ( <a href="{{ isolate.relativeHashLink('heapmap') }}">map</a> ) 944 ( <a href="{{ isolate.relativeHashLink('heapmap') }}">map</a> )
940 </div> 945 </div>
(...skipping 17 matching lines...) Expand all
958 <br> 963 <br>
959 <pre>{{ isolate.topFrame['line'] }} &nbsp; {{ isolate.topFrame['lineSt ring'] }}</pre> 964 <pre>{{ isolate.topFrame['line'] }} &nbsp; {{ isolate.topFrame['lineSt ring'] }}</pre>
960 </template> 965 </template>
961 </div> 966 </div>
962 <div class="col-md-3"> 967 <div class="col-md-3">
963 </div> 968 </div>
964 </div> 969 </div>
965 </template> 970 </template>
966 971
967 </polymer-element> 972 </polymer-element>
968 <polymer-element name="isolate-list" extends="observatory-element">
969 <template>
970 <nav-bar>
971 <top-nav-menu last="{{ true }}"></top-nav-menu>
972 <!-- TODO(turnidge): Why doesn't "this.refresh" work? -->
973 <nav-refresh callback="{{ refresh } }}"></nav-refresh>
974 </nav-bar>
975 <ul class="list-group">
976 <template repeat="{{ isolate in isolates.isolates.values }}">
977 <li class="list-group-item">
978 <isolate-summary isolate="{{ isolate }}"></isolate-summary>
979 </li>
980 </template>
981 </ul>
982 </template>
983
984 </polymer-element>
985 <polymer-element name="isolate-view" extends="observatory-element"> 973 <polymer-element name="isolate-view" extends="observatory-element">
986 <template> 974 <template>
987 <style> 975 <style>
988 .content { 976 .content {
989 padding-left: 10%; 977 padding-left: 10%;
990 font: 400 14px 'Montserrat', sans-serif; 978 font: 400 14px 'Montserrat', sans-serif;
991 } 979 }
992 h1 { 980 h1 {
993 font: 400 18px 'Montserrat', sans-serif; 981 font: 400 18px 'Montserrat', sans-serif;
994 } 982 }
(...skipping 12 matching lines...) Expand all
1007 .sourceInset { 995 .sourceInset {
1008 padding-left: 15%; 996 padding-left: 15%;
1009 padding-right: 15%; 997 padding-right: 15%;
1010 } 998 }
1011 </style> 999 </style>
1012 1000
1013 <nav-bar> 1001 <nav-bar>
1014 <top-nav-menu></top-nav-menu> 1002 <top-nav-menu></top-nav-menu>
1015 <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}"> 1003 <isolate-nav-menu isolate="{{ isolate }}" last="{{ true }}">
1016 </isolate-nav-menu> 1004 </isolate-nav-menu>
1005 <nav-refresh callback="{{ refresh }}"></nav-refresh>
1017 </nav-bar> 1006 </nav-bar>
1018 1007
1019 <div class="content"> 1008 <div class="content">
1020 <h1>isolate '{{ isolate.name }}'</h1> 1009 <h1>isolate '{{ isolate.name }}'</h1>
1021 <div class="memberList"> 1010 <div class="memberList">
1022 <div class="memberItem"> 1011 <div class="memberItem">
1023 <div class="memberName">status</div> 1012 <div class="memberName">status</div>
1024 <div class="memberValue"> 1013 <div class="memberValue">
1025 <template if="{{ isolate.topFrame == null }}"> 1014 <template if="{{ isolate.pausedOnStart }}">
1026 <strong>idle</strong> 1015 <strong style="color:darkred;">paused</strong> @ isolate start
1016 <span style="padding-left:20px;">
1017 [<a on-click="{{ resume }}">resume</a>]
1018 </span>
1027 </template> 1019 </template>
1028 <template if="{{ isolate.topFrame != null }}"> 1020
1021 <template if="{{ isolate.pausedOnExit }}">
1022 <strong style="color:darkred;">paused</strong> @ isolate exit
1023 <span style="padding-left:20px;">
1024 [<a on-click="{{ resume }}">resume</a>]
1025 </span>
1026 </template>
1027
1028 <template if="{{ isolate.running }}">
1029 <strong>running</strong> 1029 <strong>running</strong>
1030 @ 1030 @
1031 <function-ref ref="{{ isolate.topFrame['function'] }}"> 1031 <function-ref ref="{{ isolate.topFrame['function'] }}">
1032 </function-ref> 1032 </function-ref>
1033 (<script-ref ref="{{ isolate.topFrame['script'] }}" line="{{ isola te.topFrame['line'] }}"></script-ref>) 1033 (<script-ref ref="{{ isolate.topFrame['script'] }}" line="{{ isola te.topFrame['line'] }}"></script-ref>)
1034 </template> 1034 </template>
1035
1036 <template if="{{ isolate.idle }}">
1037 <strong>idle</strong>
1038 </template>
1035 </div> 1039 </div>
1036 </div> 1040 </div>
1037 </div> 1041 </div>
1038 </div> 1042 </div>
1039 1043
1040 <template if="{{ isolate.topFrame != null }}"> 1044 <template if="{{ isolate.topFrame != null }}">
1041 <br> 1045 <br>
1042 <div class="sourceInset"> 1046 <div class="sourceInset">
1043 <pre> {{ isolate.topFrame['line'] }} &nbsp; {{ isolate.topFrame ['lineString'] }}</pre> 1047 <pre> {{ isolate.topFrame['line'] }} &nbsp; {{ isolate.topFrame ['lineString'] }}</pre>
1044 </div> 1048 </div>
(...skipping 12 matching lines...) Expand all
1057 <div class="memberItem"> 1061 <div class="memberItem">
1058 <template if="{{ isolate.entry != null }}"> 1062 <template if="{{ isolate.entry != null }}">
1059 <div class="memberName">entry</div> 1063 <div class="memberName">entry</div>
1060 <div class="memberValue"> 1064 <div class="memberValue">
1061 <function-ref ref="{{ isolate.entry }}"></function-ref> 1065 <function-ref ref="{{ isolate.entry }}"></function-ref>
1062 </div> 1066 </div>
1063 </template> 1067 </template>
1064 </div> 1068 </div>
1065 <div class="memberItem"> 1069 <div class="memberItem">
1066 <div class="memberName">id</div> 1070 <div class="memberName">id</div>
1067 <div class="memberValue">{{ isolate.vmName }}</div> 1071 <div class="memberValue">{{ isolate.mainPort }}</div>
1068 </div> 1072 </div>
1069 <br> 1073 <br>
1070 <div class="memberItem"> 1074 <div class="memberItem">
1071 <div class="memberValue"> 1075 <div class="memberValue">
1072 See <a href="{{ isolate.relativeHashLink('stacktrace') }}">stack tra ce</a> 1076 See <a href="{{ isolate.relativeHashLink('stacktrace') }}">stack tra ce</a>
1073 </div> 1077 </div>
1074 </div> 1078 </div>
1075 <div class="memberItem"> 1079 <div class="memberItem">
1076 <div class="memberValue"> 1080 <div class="memberValue">
1077 See <a href="{{ isolate.relativeHashLink('profile') }}">cpu profile< /a> 1081 See <a href="{{ isolate.relativeHashLink('profile') }}">cpu profile< /a>
(...skipping 28 matching lines...) Expand all
1106 {{ isolate.oldHeapCapacity | formatSize }} 1110 {{ isolate.oldHeapCapacity | formatSize }}
1107 </div> 1111 </div>
1108 </div> 1112 </div>
1109 </div> 1113 </div>
1110 1114
1111 <br> 1115 <br>
1112 1116
1113 <div class="memberList"> 1117 <div class="memberList">
1114 <div class="memberItem"> 1118 <div class="memberItem">
1115 <div class="memberValue"> 1119 <div class="memberValue">
1116 See <a href="{{ isolate.relativeHashLink('allocationprofile') }}">he ap profile</a> 1120 See <a href="{{ isolate.relativeHashLink('allocationprofile') }}">al location profile</a>
1117 </div> 1121 </div>
1118 </div> 1122 </div>
1119 <div class="memberItem"> 1123 <div class="memberItem">
1120 <div class="memberValue"> 1124 <div class="memberValue">
1121 See <a href="{{ isolate.relativeHashLink('heapmap') }}">heap map</a> 1125 See <a href="{{ isolate.relativeHashLink('heapmap') }}">heap map</a>
1122 </div> 1126 </div>
1123 </div> 1127 </div>
1124 </div> 1128 </div>
1125 </div> 1129 </div>
1126 1130
(...skipping 643 matching lines...) Expand 10 before | Expand all | Expand 10 after
1770 <template repeat="{{ frame in trace['members'] }}"> 1774 <template repeat="{{ frame in trace['members'] }}">
1771 <li class="list-group-item"> 1775 <li class="list-group-item">
1772 <stack-frame frame="{{ frame }}"></stack-frame> 1776 <stack-frame frame="{{ frame }}"></stack-frame>
1773 </li> 1777 </li>
1774 </template> 1778 </template>
1775 </ul> 1779 </ul>
1776 </template> 1780 </template>
1777 </template> 1781 </template>
1778 1782
1779 </polymer-element> 1783 </polymer-element>
1784 <polymer-element name="vm-view" extends="observatory-element">
1785 <template>
1786 <style>
1787 .content {
1788 padding-left: 10%;
1789 font: 400 14px 'Montserrat', sans-serif;
1790 }
1791 h1 {
1792 font: 400 18px 'Montserrat', sans-serif;
1793 }
1794 .memberList {
1795 display: table;
1796 }
1797 .memberItem {
1798 display: table-row;
1799 }
1800 .memberName, .memberValue {
1801 display: table-cell;
1802 vertical-align: top;
1803 padding: 3px 0 3px 1em;
1804 font: 400 14px 'Montserrat', sans-serif;
1805 }
1806 .sourceInset {
1807 padding-left: 15%;
1808 padding-right: 15%;
1809 }
1810 </style>
1811
1812 <nav-bar>
1813 <top-nav-menu last="{{ true }}"></top-nav-menu>
1814 <nav-refresh callback="{{ refresh }}"></nav-refresh>
1815 </nav-bar>
1816
1817 <div class="content">
1818 <h1>VM</h1>
1819 <div class="memberList">
1820 <div class="memberItem">
1821 <div class="memberName">version</div>
1822 <div class="memberValue">{{ vm.version }}</div>
1823 </div>
1824 <div class="memberItem">
1825 <div class="memberName">uptime</div>
1826 <div class="memberValue">{{ vm.uptime | formatTime }}</div>
1827 </div>
1828 </div>
1829 </div>
1830
1831 <br>
1832
1833 <ul class="list-group">
1834 <template repeat="{{ isolate in vm.allIsolates }}">
1835 <li class="list-group-item">
1836 <isolate-summary isolate="{{ isolate }}"></isolate-summary>
1837 </li>
1838 </template>
1839 </ul>
1840 </template>
1841
1842 </polymer-element>
1780 <polymer-element name="service-view" extends="observatory-element"> 1843 <polymer-element name="service-view" extends="observatory-element">
1781 <!-- This element explicitly manages the child elements to avoid setting 1844 <!-- This element explicitly manages the child elements to avoid setting
1782 an observable property on the old element to an invalid type. --> 1845 an observable property on the old element to an invalid type. -->
1783 1846
1784 </polymer-element> 1847 </polymer-element>
1785 <polymer-element name="response-viewer" extends="observatory-element"> 1848 <polymer-element name="response-viewer" extends="observatory-element">
1786 <template> 1849 <template>
1787 <service-view object="{{ app.response }}"></service-view> 1850 <service-view object="{{ app.response }}"></service-view>
1788 </template> 1851 </template>
1789 1852
1790 </polymer-element><polymer-element name="observatory-application" extends="obser vatory-element"> 1853 </polymer-element><polymer-element name="observatory-application" extends="obser vatory-element">
1791 <template> 1854 <template>
1792 <response-viewer app="{{ app }}"></response-viewer> 1855 <response-viewer app="{{ app }}"></response-viewer>
1793 </template> 1856 </template>
1794 1857
1795 </polymer-element> 1858 </polymer-element>
1859 <polymer-element name="vm-ref" extends="service-ref">
1860 <template>
1861 <a href="{{ url }}">{{ ref.name }}</a>
1862 </template>
1863
1864 </polymer-element>
1796 1865
1797 1866
1798 <observatory-application devtools="true"></observatory-application> 1867 <observatory-application devtools="true"></observatory-application>
1799 1868
1800 </body></html> 1869 </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