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

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: runtime/bin/vmservice/observatory/deployed/web/index.html

Issue 532063002: Teach the Observatory about Contexts. Factor out object graph information from the instance view. (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Created 6 years, 3 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 | « no previous file | runtime/bin/vmservice/observatory/deployed/web/index.html._data » ('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 <meta charset="utf-8"> 2 <meta charset="utf-8">
3 <title>Dart VM Observatory</title> 3 <title>Dart VM Observatory</title>
4 4
5 5
6 6
7 7
8 8
9 9
10 10
11 </head> 11 </head>
12 <body><script src="packages/web_components/platform.js"></script> 12 <body><script src="packages/web_components/platform.js"></script>
13 13
14 14
15 <!-- unminfied for debugging: 15 <!-- unminified for debugging:
16 <link rel="import" href="src/js/polymer/layout.html"> 16 <link rel="import" href="src/js/polymer/layout.html">
17 <script src="src/js/polymer/polymer.concat.js"></script> 17 <script src="src/js/polymer/polymer.concat.js"></script>
18 --> 18 -->
19 19
20 20
21 21
22 <style shim-shadowdom=""> 22 <style shim-shadowdom="">
23 /******************************* 23 /*******************************
24 Flex Layout 24 Flex Layout
25 *******************************/ 25 *******************************/
(...skipping 933 matching lines...) Expand 10 before | Expand all | Expand 10 after
959 </template> 959 </template>
960 960
961 <template if="{{ ref.isList }}"> 961 <template if="{{ ref.isList }}">
962 <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em> ({{ ref.length }})</a> 962 <a on-click="{{ goto }}" _href="{{ url }}"><em>{{ ref.clazz.name }}</em> ({{ ref.length }})</a>
963 <curly-block callback="{{ expander() }}"> 963 <curly-block callback="{{ expander() }}">
964 <div class="memberList"> 964 <div class="memberList">
965 <template repeat="{{ element in ref.elements }}"> 965 <template repeat="{{ element in ref.elements }}">
966 <div class="memberItem"> 966 <div class="memberItem">
967 <div class="memberName">[{{ element['index']}}]</div> 967 <div class="memberName">[{{ element['index']}}]</div>
968 <div class="memberValue"> 968 <div class="memberValue">
969 <any-service-ref ref="{{ element['value'] }}"> 969 <any-service-ref ref="{{ element['value'] }}"></any-service-re f>
970 </any-service-ref></div> 970 </div>
971 </div> 971 </div>
972 </template> 972 </template>
973 </div> 973 </div>
974 </curly-block> 974 </curly-block>
975 </template> 975 </template>
976 </span> 976 </span>
977 </template> 977 </template>
978 </polymer-element> 978 </polymer-element>
979 979
980 980
(...skipping 1838 matching lines...) Expand 10 before | Expand all | Expand 10 after
2819 <span> 2819 <span>
2820 <pre class="errorBox">{{ ref.kind }}: {{ ref.message }}</pre> 2820 <pre class="errorBox">{{ ref.kind }}: {{ ref.message }}</pre>
2821 </span> 2821 </span>
2822 </template> 2822 </template>
2823 </polymer-element> 2823 </polymer-element>
2824 2824
2825 <polymer-element name="eval-box" extends="observatory-element"> 2825 <polymer-element name="eval-box" extends="observatory-element">
2826 <template> 2826 <template>
2827 <style> 2827 <style>
2828 .textbox { 2828 .textbox {
2829 width: 80ex; 2829 flex-grow: 1;
2830 font: 400 16px 'Montserrat', sans-serif; 2830 font: 400 16px 'Montserrat', sans-serif;
2831 } 2831 }
2832 .bigtextbox { 2832 .bigtextbox {
2833 font: 400 16px 'Montserrat', sans-serif; 2833 font: 400 16px 'Montserrat', sans-serif;
2834 } 2834 }
2835 .button { 2835 .button {
2836 font: 400 16px 'Montserrat', sans-serif; 2836 font: 400 16px 'Montserrat', sans-serif;
2837 } 2837 }
2838 .radios { 2838 .radios {
2839 display: inline; 2839 display: inline;
2840 padding-right: 30px;
2840 } 2841 }
2841 .radios label{ 2842 .radios label{
2842 padding-left: 15px; 2843 padding-left: 10px;
2843 } 2844 }
2844 .historyExpr, .historyValue { 2845 .historyExpr, .historyValue {
2845 vertical-align: text-top; 2846 vertical-align: text-top;
2846 font: 400 14px 'Montserrat', sans-serif; 2847 font: 400 14px 'Montserrat', sans-serif;
2847 } 2848 }
2848 .historyExpr a { 2849 .historyExpr a {
2849 display: block; 2850 display: block;
2850 color: black; 2851 color: black;
2851 text-decoration: none; 2852 text-decoration: none;
2852 padding: 6px 6px; 2853 padding: 6px 6px;
2853 cursor: pointer; 2854 cursor: pointer;
2854 white-space: pre-line; 2855 white-space: pre-line;
2855 } 2856 }
2856 .historyExpr a:hover { 2857 .historyExpr a:hover {
2857 background-color: #fff3e3; 2858 background-color: #fff3e3;
2858 } 2859 }
2859 .historyValue { 2860 .historyValue {
2860 display: block; 2861 display: block;
2861 padding: 6px 6px; 2862 padding: 6px 6px;
2862 } 2863 }
2863 </style> 2864 </style>
2864 <form> 2865 <form style="display:flex; flex-direction:row; align-items:flex-end">
2865 <template if="{{ lineMode == '1-line' }}"> 2866 <template if="{{ lineMode == '1-line' }}">
2866 <input class="textbox" type="text" value="{{ text }}"> 2867 <input class="textbox" type="text" value="{{ text }}">
2867 </template> 2868 </template>
2868 <template if="{{ lineMode == 'N-line' }}"> 2869 <template if="{{ lineMode == 'N-line' }}">
2869 <textarea class="bigtextbox" rows="5" cols="80" value="{{ text }}"></tex tarea> 2870 <textarea class="bigtextbox" rows="5" cols="80" value="{{ text }}"></tex tarea>
2870 </template> 2871 </template>
2871 2872
2872 <input class="button" type="submit" value="Evaluate" on-click="{{ eval }}" > 2873 <input class="button" type="submit" value="Evaluate" on-click="{{ eval }}" >
2873 <div class="radios" on-change="{{ updateLineMode }}"> 2874 <div class="radios" on-change="{{ updateLineMode }}">
2874 <label for="1-line">1-line 2875 <label for="1-line">
2875 <input type="radio" name="lineMode" value="1-line" checked=""> 2876 <input type="radio" name="lineMode" value="1-line" checked="">
2877 1-line
2876 </label> 2878 </label>
2877 <label for="N-line">N-line 2879 <label for="N-line">
2878 <input type="radio" name="lineMode" value="N-line"> 2880 <input type="radio" name="lineMode" value="N-line">
2881 N-line
2879 </label> 2882 </label>
2880 </div> 2883 </div>
2881 </form> 2884 </form>
2882 2885
2883 <br> 2886 <br>
2884 <template if="{{ results.isNotEmpty }}"> 2887 <template if="{{ results.isNotEmpty }}">
2885 <table> 2888 <table>
2886 <tbody><tr template="" repeat="{{ result in results }}"> 2889 <tbody><tr template="" repeat="{{ result in results }}">
2887 <td class="historyExpr"> 2890 <td class="historyExpr">
2888 <a class="expr" on-click="{{ selectExpr }}" expr="{{ result['expr'] }}">{{ result['expr'] }}</a> 2891 <a class="expr" on-click="{{ selectExpr }}" expr="{{ result['expr'] }}">{{ result['expr'] }}</a>
(...skipping 1606 matching lines...) Expand 10 before | Expand all | Expand 10 after
4495 <template if="{{ cls.name != cls.vmName }}"> 4498 <template if="{{ cls.name != cls.vmName }}">
4496 <div class="memberItem"> 4499 <div class="memberItem">
4497 <div class="memberName">vm name</div> 4500 <div class="memberName">vm name</div>
4498 <div class="memberValue">{{ cls.vmName }}</div> 4501 <div class="memberValue">{{ cls.vmName }}</div>
4499 </div> 4502 </div>
4500 </template> 4503 </template>
4501 </div> 4504 </div>
4502 </div> 4505 </div>
4503 4506
4504 <template if="{{ cls.error != null }}"> 4507 <template if="{{ cls.error != null }}">
4505 <error-ref ref="{{ cls.error }}"> 4508 <error-ref ref="{{ cls.error }}"></error-ref>
4506 </error-ref></template> 4509 </template>
4507 4510
4508 <hr> 4511 <hr>
4509 4512
4510 <div class="content"> 4513 <div class="content">
4511 <template if="{{ cls.fields.isNotEmpty }}"> 4514 <template if="{{ cls.fields.isNotEmpty }}">
4512 fields ({{ cls.fields.length }}) 4515 fields ({{ cls.fields.length }})
4513 <curly-block expand="{{ cls.fields.length <= 8 }}"> 4516 <curly-block expand="{{ cls.fields.length <= 8 }}">
4514 <div class="memberList"> 4517 <div class="memberList">
4515 <template repeat="{{ field in cls.fields }}"> 4518 <template repeat="{{ field in cls.fields }}">
4516 <div class="memberItem"> 4519 <div class="memberItem">
(...skipping 9730 matching lines...) Expand 10 before | Expand all | Expand 10 after
14247 14250
14248 14251
14249 14252
14250 14253
14251 14254
14252 14255
14253 14256
14254 14257
14255 14258
14256 14259
14260
14261
14257 <polymer-element name="inbound-reference" extends="service-ref"> 14262 <polymer-element name="inbound-reference" extends="service-ref">
14258 <template> 14263 <template>
14259 <style> 14264 <style>
14260 /* Global styles */ 14265 /* Global styles */
14261 * { 14266 * {
14262 margin: 0; 14267 margin: 0;
14263 padding: 0; 14268 padding: 0;
14264 font: 400 14px 'Montserrat', sans-serif; 14269 font: 400 14px 'Montserrat', sans-serif;
14265 color: #333; 14270 color: #333;
14266 box-sizing: border-box; 14271 box-sizing: border-box;
(...skipping 258 matching lines...) Expand 10 before | Expand all | Expand 10 after
14525 </template> 14530 </template>
14526 </div> 14531 </div>
14527 </div> 14532 </div>
14528 </div> 14533 </div>
14529 </curly-block> 14534 </curly-block>
14530 </div> 14535 </div>
14531 </template> 14536 </template>
14532 </polymer-element> 14537 </polymer-element>
14533 14538
14534 14539
14535 <polymer-element name="instance-view" extends="observatory-element"> 14540
14541
14542
14543
14544
14545
14546
14547
14548
14549
14550
14551 <polymer-element name="object-common" extends="observatory-element">
14536 <template> 14552 <template>
14537 <style> 14553 <style>
14538 /* Global styles */ 14554 /* Global styles */
14539 * { 14555 * {
14540 margin: 0; 14556 margin: 0;
14541 padding: 0; 14557 padding: 0;
14542 font: 400 14px 'Montserrat', sans-serif; 14558 font: 400 14px 'Montserrat', sans-serif;
14543 color: #333; 14559 color: #333;
14544 box-sizing: border-box; 14560 box-sizing: border-box;
14545 } 14561 }
(...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after
14782 background-color: #f5f5f5; 14798 background-color: #f5f5f5;
14783 border: 1px solid #e3e3e3; 14799 border: 1px solid #e3e3e3;
14784 border-radius: 4px; 14800 border-radius: 4px;
14785 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); 14801 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
14786 } 14802 }
14787 14803
14788 .break-wrap { 14804 .break-wrap {
14789 word-wrap: break-word; 14805 word-wrap: break-word;
14790 } 14806 }
14791 </style> 14807 </style>
14792 <nav-bar> 14808 <div class="memberList">
14793 <top-nav-menu></top-nav-menu>
14794 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu>
14795 <!-- TODO(turnidge): Add library nav menu here. -->
14796 <class-nav-menu cls="{{ instance.clazz }}"></class-nav-menu>
14797 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu>
14798 <nav-refresh callback="{{ refresh }}"></nav-refresh>
14799 <nav-control></nav-control>
14800 </nav-bar>
14801 14809
14802 <template if="{{ instance.isError }}"> 14810 <div class="memberItem">
14803 <error-view error_obj="{{ instance['error'] }}"></error-view> 14811 <div class="memberName">class</div>
14804 </template> 14812 <div class="memberValue">
14805 14813 <class-ref ref="{{ object.clazz }}"></class-ref>
14806 <template if="{{ !instance.isError }}">
14807 <div class="content">
14808 <template if="{{ instance.isType }}">
14809 <h1>type {{ instance.name }}</h1>
14810 </template>
14811 <template if="{{ !instance.isType }}">
14812 <h1>instance of {{ instance.clazz.name }}</h1>
14813 </template>
14814 <div class="memberList">
14815 <div class="memberItem">
14816 <div class="memberName">class</div>
14817 <div class="memberValue">
14818 <class-ref ref="{{ instance.clazz }}">
14819 </class-ref>
14820 </div>
14821 </div>
14822 <template if="{{ instance.valueAsString != null }}">
14823 <div class="memberItem">
14824 <div class="memberName">value</div>
14825 <div class="memberValue">{{ instance.valueAsString }}</div>
14826 </div>
14827 </template>
14828 <div class="memberItem" title="Space for this object in memory">
14829 <div class="memberName">size</div>
14830 <div class="memberValue">{{ instance.size | formatSize }}</div>
14831 </div>
14832 <div class="memberItem" title="Space that would be reclaimed if refere nces to this object were replaced with null">
14833 <div class="memberName">retained size</div>
14834 <div class="memberValue">
14835 <template if="{{ retainedBytes == null }}">
14836 <eval-link callback="{{ retainedSize }}" label="[calculate]">
14837 </eval-link>
14838 </template>
14839 <template if="{{ retainedBytes != null }}">
14840 {{ retainedBytes | formatSize }}
14841 </template>
14842 </div>
14843 </div>
14844 <div class="memberItem">
14845 <div class="memberName">retaining path</div>
14846 <div class="memberValue">
14847 <template if="{{ path == null }}">
14848 <eval-link callback="{{ retainingPath }}" label="[find]" expr="1 0">
14849 </eval-link>
14850 </template>
14851 <template if="{{ path != null }}">
14852 <template repeat="{{ element in path['elements'] }}">
14853 <div class="memberItem">
14854 <div class="memberName">[{{ element['index']}}]</div>
14855 <div class="memberValue">
14856 <any-service-ref ref="{{ element['value'] }}"></any-service- ref>
14857 <template if="{{ element['parentField'] != null }}">
14858 in <field-ref ref="{{ element['parentField'] }}"></field-r ef> of
14859 </template>
14860 <template if="{{ element['parentListIndex'] != null }}">
14861 in [{{ element['parentListIndex'] }}] of
14862 </template>
14863 </div>
14864 </div>
14865 </template>
14866 <template if="{{ path['length'] > path['elements'].length }}">
14867 showing {{ path['elements'].length }} of {{ path['length'] }}
14868 <eval-link callback="{{ retainingPath }}" label="[find more]" expr="{{ path['elements'].length * 2 }}">
14869 </eval-link>
14870 </template>
14871 </template>
14872 </div>
14873 </div>
14874 <div class="memberItem" title="Objects which directly reference this o bject">
14875 <div class="memberName">inbound references</div>
14876 <div class="memberValue">
14877 <template if="{{ inboundReferences == null }}">
14878 <eval-link callback="{{ fetchInboundReferences }}" label="[find] " expr="100">
14879 </eval-link>
14880 </template>
14881 <template if="{{ inboundReferences != null }}">
14882 <template repeat="{{ reference in inboundReferences['references' ] }}">
14883 <inbound-reference ref="{{ reference }}"></inbound-reference>
14884 </template>
14885 </template>
14886 </div>
14887 </div>
14888 <template if="{{ instance.typeClass != null }}">
14889 <div class="memberItem">
14890 <div class="memberName">type class</div>
14891 <div class="memberValue">
14892 <class-ref ref="{{ instance.typeClass }}">
14893 </class-ref>
14894 </div>
14895 </div>
14896 </template>
14897 <template if="{{ instance.isClosure }}">
14898 <div class="memberItem">
14899 <div class="memberName">closure function</div>
14900 <div class="memberValue">
14901 <function-ref ref="{{ instance.closureFunc }}">
14902 </function-ref>
14903 </div>
14904 </div>
14905 </template>
14906
14907 <div class="memberItem">&nbsp;</div>
14908
14909 <div class="memberItem">
14910 <div class="memberName">toString()</div>
14911 <div class="memberValue">
14912 <eval-link callback="{{ eval }}" expr="toString()"></eval-link>
14913 </div>
14914 </div>
14915 </div> 14814 </div>
14916 </div> 14815 </div>
14917 14816
14918 <hr> 14817 <div class="memberItem" title="Space for this object in memory">
14919 14818 <div class="memberName">size</div>
14920 <div class="content"> 14819 <div class="memberValue">{{ object.size | formatSize }}</div>
14921 <template if="{{ instance.fields.isNotEmpty }}">
14922 fields ({{ instance.fields.length }})
14923 <curly-block expand="{{ instance.fields.length <= 8 }}">
14924 <div class="memberList">
14925 <template repeat="{{ field in instance.fields }}">
14926 <div class="memberItem">
14927 <div class="memberName">
14928 <field-ref ref="{{ field['decl'] }}"></field-ref>
14929 </div>
14930 <div class="memberValue">
14931 <any-service-ref ref="{{ field['value'] }}"></any-service-re f>
14932 </div>
14933 </div>
14934 </template>
14935 </div>
14936 </curly-block><br><br>
14937 </template>
14938
14939 <template if="{{ instance.nativeFields.isNotEmpty }}">
14940 native fields ({{ instance.nativeFields.length }})
14941 <curly-block expand="{{ instance.nativeFields.length <= 8 }}">
14942 <div class="memberList">
14943 <template repeat="{{ field in instance.nativeFields }}">
14944 <div class="memberItem">
14945 <div class="memberName">[{{ field['index']}}]</div>
14946 <div class="memberValue">[{{ field['value']}}]</div>
14947 </div>
14948 </template>
14949 </div>
14950 </curly-block><br><br>
14951 </template>
14952
14953 <template if="{{ instance.elements.isNotEmpty }}">
14954 elements ({{ instance.elements.length }})
14955 <curly-block expand="{{ instance.elements.length <= 8 }}">
14956 <div class="memberList">
14957 <template repeat="{{ element in instance.elements }}">
14958 <div class="memberItem">
14959 <div class="memberName">[{{ element['index']}}]</div>
14960 <div class="memberValue">
14961 <any-service-ref ref="{{ element['value'] }}">
14962
14963 </any-service-ref></div>
14964 </div>
14965 </template>
14966 </div>
14967 </curly-block><br><br>
14968 </template>
14969 </div> 14820 </div>
14970 14821
14971 <hr> 14822 <div class="memberItem" title="Space that would be reclaimed if references to this object were replaced with null">
14823 <div class="memberName">retained size</div>
14824 <div class="memberValue">
14825 <template if="{{ retainedBytes == null }}">
14826 <eval-link callback="{{ retainedSize }}" label="[calculate]">
14827 </eval-link>
14828 </template>
14829 <template if="{{ retainedBytes != null }}">
14830 {{ retainedBytes | formatSize }}
14831 </template>
14832 </div>
14833 </div>
14972 14834
14973 <div class="content"> 14835 <div class="memberItem">
14974 <eval-box callback="{{ eval }}"></eval-box> 14836 <div class="memberName">retaining path</div>
14837 <div class="memberValue">
14838 <template if="{{ path == null }}">
14839 <eval-link callback="{{ retainingPath }}" label="[find]" expr="10">
14840 </eval-link>
14841 </template>
14842 <template if="{{ path != null }}">
14843 <template repeat="{{ element in path['elements'] }}">
14844 <div class="memberItem">
14845 <div class="memberName">[{{ element['index']}}]</div>
14846 <div class="memberValue">
14847 <any-service-ref ref="{{ element['value'] }}"></any-service-ref>
14848 <template if="{{ element['parentField'] != null }}">
14849 in <field-ref ref="{{ element['parentField'] }}"></field-ref> of
14850 </template>
14851 <template if="{{ element['parentListIndex'] != null }}">
14852 in [{{ element['parentListIndex'] }}] of
14853 </template>
14854 </div>
14855 </div>
14856 </template>
14857 <template if="{{ path['length'] > path['elements'].length }}">
14858 showing {{ path['elements'].length }} of {{ path['length'] }}
14859 <eval-link callback="{{ retainingPath }}" label="[find more]" expr ="{{ path['elements'].length * 2 }}">
14860 </eval-link>
14861 </template>
14862 </template>
14863 </div>
14975 </div> 14864 </div>
14976 <br><br><br><br>
14977 <br><br><br><br>
14978 14865
14979 </template> 14866 <div class="memberItem" title="Objects which directly reference this objec t">
14867 <div class="memberName">inbound references</div>
14868 <div class="memberValue">
14869 <template if="{{ inboundReferences == null }}">
14870 <eval-link callback="{{ fetchInboundReferences }}" label="[find]" ex pr="100">
14871 </eval-link>
14872 </template>
14873 <template if="{{ inboundReferences != null }}">
14874 <template repeat="{{ reference in inboundReferences['references'] }} ">
14875 <inbound-reference ref="{{ reference }}"></inbound-reference>
14876 </template>
14877 </template>
14878 </div>
14879 </div>
14880
14881 </div>
14980 </template> 14882 </template>
14981 </polymer-element> 14883 </polymer-element>
14982 14884
14983
14984
14985
14986
14987 <polymer-element name="json-view" extends="observatory-element">
14988 <template>
14989 <nav-bar>
14990 <top-nav-menu last="{{ true }}"></top-nav-menu>
14991 </nav-bar>
14992 <pre>{{ mapAsString }}</pre>
14993 </template>
14994 </polymer-element>
14995
14996 14885
14997 14886
14998 14887
14999 14888
15000 14889
15001 14890
15002 14891 <polymer-element name="context-ref" extends="service-ref">
15003
15004
15005
15006
15007
15008
15009 <polymer-element name="library-view" extends="observatory-element">
15010 <template> 14892 <template>
15011 <style> 14893 <style>
15012 /* Global styles */ 14894 /* Global styles */
15013 * { 14895 * {
15014 margin: 0; 14896 margin: 0;
15015 padding: 0; 14897 padding: 0;
15016 font: 400 14px 'Montserrat', sans-serif; 14898 font: 400 14px 'Montserrat', sans-serif;
15017 color: #333; 14899 color: #333;
15018 box-sizing: border-box; 14900 box-sizing: border-box;
15019 } 14901 }
(...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after
15256 background-color: #f5f5f5; 15138 background-color: #f5f5f5;
15257 border: 1px solid #e3e3e3; 15139 border: 1px solid #e3e3e3;
15258 border-radius: 4px; 15140 border-radius: 4px;
15259 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); 15141 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
15260 } 15142 }
15261 15143
15262 .break-wrap { 15144 .break-wrap {
15263 word-wrap: break-word; 15145 word-wrap: break-word;
15264 } 15146 }
15265 </style> 15147 </style>
15148 <span>
15149 <a on-click="{{ goto }}" _href="{{ url }}"><em>Context</em> ({{ ref.length }})</a>
15150 <curly-block callback="{{ expander() }}">
15151 <div class="memberList">
15152 <div class="memberItem">
15153 <div class="memberName">parent</div>
15154 <div class="memberValue">
15155 <any-service-ref ref="{{ ref.parentContext }}"></any-service-ref>
15156 </div>
15157 </div>
15158 <template repeat="{{ variable in ref.variables }}">
15159 <div class="memberItem">
15160 <div class="memberName">[{{ variable['index']}}]</div>
15161 <div class="memberValue">
15162 <any-service-ref ref="{{ variable['value'] }}"></any-service-ref >
15163 </div>
15164 </div>
15165 </template>
15166 </div>
15167 </curly-block>
15168 </span>
15169 </template>
15170 </polymer-element>
15171
15172
15173 <polymer-element name="instance-view" extends="observatory-element">
15174 <template>
15175 <style>
15176 /* Global styles */
15177 * {
15178 margin: 0;
15179 padding: 0;
15180 font: 400 14px 'Montserrat', sans-serif;
15181 color: #333;
15182 box-sizing: border-box;
15183 }
15184
15185 .content {
15186 padding-left: 10%;
15187 font: 400 14px 'Montserrat', sans-serif;
15188 }
15189
15190 .content-centered {
15191 padding-left: 10%;
15192 padding-right: 10%;
15193 font: 400 14px 'Montserrat', sans-serif;
15194 }
15195
15196 .content-centered-big {
15197 padding-left: 5%;
15198 padding-right: 5%;
15199 font: 400 14px 'Montserrat', sans-serif;
15200 }
15201
15202 h1 {
15203 font: 400 18px 'Montserrat', sans-serif;
15204 }
15205
15206 .memberList {
15207 display: table;
15208 }
15209
15210 .memberItem {
15211 display: table-row;
15212 }
15213
15214 .memberName, .memberValue {
15215 display: table-cell;
15216 vertical-align: top;
15217 padding: 3px 0 3px 1em;
15218 font: 400 14px 'Montserrat', sans-serif;
15219 }
15220
15221 .memberSmall {
15222 display: table-cell;
15223 vertical-align: top;
15224 padding: 3px 0 3px 1em;
15225 font: 400 12px 'Montserrat', sans-serif;
15226 }
15227
15228 .monospace {
15229 font-family: consolas, courier, monospace;
15230 font-size: 1em;
15231 line-height: 1.2em;
15232 white-space: nowrap;
15233 }
15234
15235 a {
15236 color: #0489c3;
15237 text-decoration: none;
15238 }
15239
15240 a:hover {
15241 text-decoration: underline;
15242 }
15243
15244 em {
15245 color: inherit;
15246 font-style: italic;
15247 }
15248
15249 b {
15250 color: inherit;
15251 font-weight: bold;
15252 }
15253
15254 hr {
15255 margin-top: 20px;
15256 margin-bottom: 20px;
15257 border: 0;
15258 border-top: 1px solid #eee;
15259 height: 0;
15260 box-sizing: content-box;
15261 }
15262
15263 .list-group {
15264 padding-left: 0;
15265 margin-bottom: 20px;
15266 }
15267
15268 .list-group-item {
15269 position: relative;
15270 display: block;
15271 padding: 10px 15px;
15272 margin-bottom: -1px;
15273 background-color: #fff;
15274 }
15275
15276 .list-group-item:first-child {
15277 /* rounded top corners */
15278 border-top-right-radius:4px;
15279 border-top-left-radius:4px;
15280 }
15281
15282 .list-group-item:last-child {
15283 margin-bottom: 0;
15284 /* rounded bottom corners */
15285 border-bottom-right-radius: 4px;
15286 border-bottom-left-radius:4px;
15287 }
15288
15289 /* Flex row container */
15290 .flex-row {
15291 display: flex;
15292 flex-direction: row;
15293 }
15294
15295 /* Flex column container */
15296 .flex-column {
15297 display: flex;
15298 flex-direction: column;
15299 }
15300
15301 .flex-item-fit {
15302 flex-grow: 1;
15303 flex-shrink: 1;
15304 flex-basis: auto;
15305 }
15306
15307 .flex-item-no-shrink {
15308 flex-grow: 0;
15309 flex-shrink: 0;
15310 flex-basis: auto;
15311 }
15312
15313 .flex-item-fill {
15314 flex-grow: 0;
15315 flex-shrink: 1; /* shrink when pressured */
15316 flex-basis: 100%; /* try and take 100% */
15317 }
15318
15319 .flex-item-fixed-1-12 {
15320 flex-grow: 0;
15321 flex-shrink: 0;
15322 flex-basis: 8.3%;
15323 }
15324
15325 .flex-item-fixed-2-12 {
15326 flex-grow: 0;
15327 flex-shrink: 0;
15328 flex-basis: 16.6%;
15329 }
15330
15331 .flex-item-fixed-4-12 {
15332 flex-grow: 0;
15333 flex-shrink: 0;
15334 flex-basis: 33.3333%;
15335 }
15336
15337 .flex-item-fixed-6-12, .flex-item-50-percent {
15338 flex-grow: 0;
15339 flex-shrink: 0;
15340 flex-basis: 50%;
15341 }
15342
15343 .flex-item-fixed-8-12 {
15344 flex-grow: 0;
15345 flex-shrink: 0;
15346 flex-basis: 66.6666%;
15347 }
15348
15349 .flex-item-fixed-9-12 {
15350 flex-grow: 0;
15351 flex-shrink: 0;
15352 flex-basis: 75%;
15353 }
15354
15355
15356 .flex-item-fixed-12-12 {
15357 flex-grow: 0;
15358 flex-shrink: 0;
15359 flex-basis: 100%;
15360 }
15361
15362 .flex-item-10-percent {
15363 flex-grow: 0;
15364 flex-shrink: 0;
15365 flex-basis: 10%;
15366 }
15367
15368 .flex-item-15-percent {
15369 flex-grow: 0;
15370 flex-shrink: 0;
15371 flex-basis: 15%;
15372 }
15373
15374 .flex-item-20-percent {
15375 flex-grow: 0;
15376 flex-shrink: 0;
15377 flex-basis: 20%;
15378 }
15379
15380 .flex-item-30-percent {
15381 flex-grow: 0;
15382 flex-shrink: 0;
15383 flex-basis: 30%;
15384 }
15385
15386 .flex-item-40-percent {
15387 flex-grow: 0;
15388 flex-shrink: 0;
15389 flex-basis: 40%;
15390 }
15391
15392 .flex-item-50-percent {
15393 flex-grow: 0;
15394 flex-shrink: 0;
15395 flex-basis: 50%;
15396 }
15397
15398 .flex-item-60-percent {
15399 flex-grow: 0;
15400 flex-shrink: 0;
15401 flex-basis: 60%;
15402 }
15403
15404 .flex-item-70-percent {
15405 flex-grow: 0;
15406 flex-shrink: 0;
15407 flex-basis: 70%;
15408 }
15409
15410 .flex-item-80-percent {
15411 flex-grow: 0;
15412 flex-shrink: 0;
15413 flex-basis: 80%;
15414 }
15415
15416 .well {
15417 min-height: 20px;
15418 padding: 19px;
15419 margin-bottom: 20px;
15420 background-color: #f5f5f5;
15421 border: 1px solid #e3e3e3;
15422 border-radius: 4px;
15423 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
15424 }
15425
15426 .break-wrap {
15427 word-wrap: break-word;
15428 }
15429 </style>
15430 <nav-bar>
15431 <top-nav-menu></top-nav-menu>
15432 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu>
15433 <!-- TODO(turnidge): Add library nav menu here. -->
15434 <class-nav-menu cls="{{ instance.clazz }}"></class-nav-menu>
15435 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu>
15436 <nav-refresh callback="{{ refresh }}"></nav-refresh>
15437 <nav-control></nav-control>
15438 </nav-bar>
15439
15440 <template if="{{ instance.isError }}">
15441 <error-view error_obj="{{ instance['error'] }}"></error-view>
15442 </template>
15443
15444 <template if="{{ !instance.isError }}">
15445 <div class="content">
15446 <template if="{{ instance.isType }}">
15447 <h1>type {{ instance.name }}</h1>
15448 </template>
15449 <template if="{{ !instance.isType }}">
15450 <h1>instance of {{ instance.clazz.name }}</h1>
15451 </template>
15452
15453 <object-common object="{{ instance }}"></object-common>
15454
15455 <div class="memberList">
15456 <div class="memberItem">&nbsp;</div>
15457
15458 <template if="{{ instance.valueAsString != null }}">
15459 <div class="memberItem">
15460 <div class="memberName">value</div>
15461 <div class="memberValue">{{ instance.valueAsString }}</div>
15462 </div>
15463 </template>
15464
15465 <template if="{{ instance.typeClass != null }}">
15466 <div class="memberItem">
15467 <div class="memberName">type class</div>
15468 <div class="memberValue">
15469 <class-ref ref="{{ instance.typeClass }}">
15470 </class-ref>
15471 </div>
15472 </div>
15473 </template>
15474
15475 <template if="{{ instance.isClosure }}">
15476 <div class="memberItem">
15477 <div class="memberName">closure function</div>
15478 <div class="memberValue">
15479 <function-ref ref="{{ instance.closureFunc }}">
15480 </function-ref>
15481 </div>
15482 </div>
15483 </template>
15484 <template if="{{ instance.isClosure }}">
15485 <div class="memberItem">
15486 <div class="memberName">closure context</div>
15487 <div class="memberValue">
15488 <any-service-ref ref="{{ instance.closureCtxt }}">
15489 </any-service-ref>
15490 </div>
15491 </div>
15492 </template>
15493
15494 <div class="memberItem">
15495 <div class="memberName">toString()</div>
15496 <div class="memberValue">
15497 <eval-link callback="{{ eval }}" expr="toString()"></eval-link>
15498 </div>
15499 </div>
15500 </div>
15501 </div>
15502
15503 <hr>
15504
15505 <div class="content">
15506 <template if="{{ instance.nativeFields.isNotEmpty }}">
15507 native fields ({{ instance.nativeFields.length }})
15508 <curly-block expand="{{ instance.nativeFields.length <= 8 }}">
15509 <div class="memberList">
15510 <template repeat="{{ field in instance.nativeFields }}">
15511 <div class="memberItem">
15512 <div class="memberName">[{{ field['index']}}]</div>
15513 <div class="memberValue">[{{ field['value']}}]</div>
15514 </div>
15515 </template>
15516 </div>
15517 </curly-block><br><br>
15518 </template>
15519
15520 <template if="{{ instance.fields.isNotEmpty }}">
15521 fields ({{ instance.fields.length }})
15522 <curly-block expand="{{ instance.fields.length <= 8 }}">
15523 <div class="memberList">
15524 <template repeat="{{ field in instance.fields }}">
15525 <div class="memberItem">
15526 <div class="memberName">
15527 <field-ref ref="{{ field['decl'] }}"></field-ref>
15528 </div>
15529 <div class="memberValue">
15530 <any-service-ref ref="{{ field['value'] }}"></any-service-re f>
15531 </div>
15532 </div>
15533 </template>
15534 </div>
15535 </curly-block><br><br>
15536 </template>
15537
15538 <template if="{{ instance.elements.isNotEmpty }}">
15539 elements ({{ instance.elements.length }})
15540 <curly-block expand="{{ instance.elements.length <= 8 }}">
15541 <div class="memberList">
15542 <template repeat="{{ element in instance.elements }}">
15543 <div class="memberItem">
15544 <div class="memberName">[{{ element['index']}}]</div>
15545 <div class="memberValue">
15546 <any-service-ref ref="{{ element['value'] }}"></any-service- ref>
15547 </div>
15548 </div>
15549 </template>
15550 </div>
15551 </curly-block><br><br>
15552 </template>
15553 </div>
15554
15555 <hr>
15556
15557 <div class="content">
15558 <eval-box callback="{{ eval }}"></eval-box>
15559 </div>
15560
15561 <br><br><br><br>
15562 <br><br><br><br>
15563
15564 </template>
15565 </template>
15566 </polymer-element>
15567
15568
15569
15570
15571
15572 <polymer-element name="json-view" extends="observatory-element">
15573 <template>
15574 <nav-bar>
15575 <top-nav-menu last="{{ true }}"></top-nav-menu>
15576 </nav-bar>
15577 <pre>{{ mapAsString }}</pre>
15578 </template>
15579 </polymer-element>
15580
15581
15582
15583
15584
15585
15586
15587
15588
15589
15590
15591
15592
15593
15594 <polymer-element name="library-view" extends="observatory-element">
15595 <template>
15596 <style>
15597 /* Global styles */
15598 * {
15599 margin: 0;
15600 padding: 0;
15601 font: 400 14px 'Montserrat', sans-serif;
15602 color: #333;
15603 box-sizing: border-box;
15604 }
15605
15606 .content {
15607 padding-left: 10%;
15608 font: 400 14px 'Montserrat', sans-serif;
15609 }
15610
15611 .content-centered {
15612 padding-left: 10%;
15613 padding-right: 10%;
15614 font: 400 14px 'Montserrat', sans-serif;
15615 }
15616
15617 .content-centered-big {
15618 padding-left: 5%;
15619 padding-right: 5%;
15620 font: 400 14px 'Montserrat', sans-serif;
15621 }
15622
15623 h1 {
15624 font: 400 18px 'Montserrat', sans-serif;
15625 }
15626
15627 .memberList {
15628 display: table;
15629 }
15630
15631 .memberItem {
15632 display: table-row;
15633 }
15634
15635 .memberName, .memberValue {
15636 display: table-cell;
15637 vertical-align: top;
15638 padding: 3px 0 3px 1em;
15639 font: 400 14px 'Montserrat', sans-serif;
15640 }
15641
15642 .memberSmall {
15643 display: table-cell;
15644 vertical-align: top;
15645 padding: 3px 0 3px 1em;
15646 font: 400 12px 'Montserrat', sans-serif;
15647 }
15648
15649 .monospace {
15650 font-family: consolas, courier, monospace;
15651 font-size: 1em;
15652 line-height: 1.2em;
15653 white-space: nowrap;
15654 }
15655
15656 a {
15657 color: #0489c3;
15658 text-decoration: none;
15659 }
15660
15661 a:hover {
15662 text-decoration: underline;
15663 }
15664
15665 em {
15666 color: inherit;
15667 font-style: italic;
15668 }
15669
15670 b {
15671 color: inherit;
15672 font-weight: bold;
15673 }
15674
15675 hr {
15676 margin-top: 20px;
15677 margin-bottom: 20px;
15678 border: 0;
15679 border-top: 1px solid #eee;
15680 height: 0;
15681 box-sizing: content-box;
15682 }
15683
15684 .list-group {
15685 padding-left: 0;
15686 margin-bottom: 20px;
15687 }
15688
15689 .list-group-item {
15690 position: relative;
15691 display: block;
15692 padding: 10px 15px;
15693 margin-bottom: -1px;
15694 background-color: #fff;
15695 }
15696
15697 .list-group-item:first-child {
15698 /* rounded top corners */
15699 border-top-right-radius:4px;
15700 border-top-left-radius:4px;
15701 }
15702
15703 .list-group-item:last-child {
15704 margin-bottom: 0;
15705 /* rounded bottom corners */
15706 border-bottom-right-radius: 4px;
15707 border-bottom-left-radius:4px;
15708 }
15709
15710 /* Flex row container */
15711 .flex-row {
15712 display: flex;
15713 flex-direction: row;
15714 }
15715
15716 /* Flex column container */
15717 .flex-column {
15718 display: flex;
15719 flex-direction: column;
15720 }
15721
15722 .flex-item-fit {
15723 flex-grow: 1;
15724 flex-shrink: 1;
15725 flex-basis: auto;
15726 }
15727
15728 .flex-item-no-shrink {
15729 flex-grow: 0;
15730 flex-shrink: 0;
15731 flex-basis: auto;
15732 }
15733
15734 .flex-item-fill {
15735 flex-grow: 0;
15736 flex-shrink: 1; /* shrink when pressured */
15737 flex-basis: 100%; /* try and take 100% */
15738 }
15739
15740 .flex-item-fixed-1-12 {
15741 flex-grow: 0;
15742 flex-shrink: 0;
15743 flex-basis: 8.3%;
15744 }
15745
15746 .flex-item-fixed-2-12 {
15747 flex-grow: 0;
15748 flex-shrink: 0;
15749 flex-basis: 16.6%;
15750 }
15751
15752 .flex-item-fixed-4-12 {
15753 flex-grow: 0;
15754 flex-shrink: 0;
15755 flex-basis: 33.3333%;
15756 }
15757
15758 .flex-item-fixed-6-12, .flex-item-50-percent {
15759 flex-grow: 0;
15760 flex-shrink: 0;
15761 flex-basis: 50%;
15762 }
15763
15764 .flex-item-fixed-8-12 {
15765 flex-grow: 0;
15766 flex-shrink: 0;
15767 flex-basis: 66.6666%;
15768 }
15769
15770 .flex-item-fixed-9-12 {
15771 flex-grow: 0;
15772 flex-shrink: 0;
15773 flex-basis: 75%;
15774 }
15775
15776
15777 .flex-item-fixed-12-12 {
15778 flex-grow: 0;
15779 flex-shrink: 0;
15780 flex-basis: 100%;
15781 }
15782
15783 .flex-item-10-percent {
15784 flex-grow: 0;
15785 flex-shrink: 0;
15786 flex-basis: 10%;
15787 }
15788
15789 .flex-item-15-percent {
15790 flex-grow: 0;
15791 flex-shrink: 0;
15792 flex-basis: 15%;
15793 }
15794
15795 .flex-item-20-percent {
15796 flex-grow: 0;
15797 flex-shrink: 0;
15798 flex-basis: 20%;
15799 }
15800
15801 .flex-item-30-percent {
15802 flex-grow: 0;
15803 flex-shrink: 0;
15804 flex-basis: 30%;
15805 }
15806
15807 .flex-item-40-percent {
15808 flex-grow: 0;
15809 flex-shrink: 0;
15810 flex-basis: 40%;
15811 }
15812
15813 .flex-item-50-percent {
15814 flex-grow: 0;
15815 flex-shrink: 0;
15816 flex-basis: 50%;
15817 }
15818
15819 .flex-item-60-percent {
15820 flex-grow: 0;
15821 flex-shrink: 0;
15822 flex-basis: 60%;
15823 }
15824
15825 .flex-item-70-percent {
15826 flex-grow: 0;
15827 flex-shrink: 0;
15828 flex-basis: 70%;
15829 }
15830
15831 .flex-item-80-percent {
15832 flex-grow: 0;
15833 flex-shrink: 0;
15834 flex-basis: 80%;
15835 }
15836
15837 .well {
15838 min-height: 20px;
15839 padding: 19px;
15840 margin-bottom: 20px;
15841 background-color: #f5f5f5;
15842 border: 1px solid #e3e3e3;
15843 border-radius: 4px;
15844 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
15845 }
15846
15847 .break-wrap {
15848 word-wrap: break-word;
15849 }
15850 </style>
15266 15851
15267 <nav-bar> 15852 <nav-bar>
15268 <top-nav-menu></top-nav-menu> 15853 <top-nav-menu></top-nav-menu>
15269 <isolate-nav-menu isolate="{{ library.isolate }}"></isolate-nav-menu> 15854 <isolate-nav-menu isolate="{{ library.isolate }}"></isolate-nav-menu>
15270 <library-nav-menu library="{{ library }}" last="{{ true }}"></library-nav- menu> 15855 <library-nav-menu library="{{ library }}" last="{{ true }}"></library-nav- menu>
15271 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n av-refresh> 15856 <nav-refresh callback="{{ refreshCoverage }}" label="Refresh Coverage"></n av-refresh>
15272 <nav-refresh callback="{{ refresh }}"></nav-refresh> 15857 <nav-refresh callback="{{ refresh }}"></nav-refresh>
15273 <nav-control></nav-control> 15858 <nav-control></nav-control>
15274 </nav-bar> 15859 </nav-bar>
15275 15860
(...skipping 117 matching lines...) Expand 10 before | Expand all | Expand 10 after
15393 15978
15394 15979
15395 15980
15396 15981
15397 15982
15398 15983
15399 <polymer-element name="metrics-page" extends="observatory-element"> 15984 <polymer-element name="metrics-page" extends="observatory-element">
15400 <template> 15985 <template>
15401 <style> 15986 <style>
15402 /* Global styles */ 15987 /* Global styles */
15988 * {
15989 margin: 0;
15990 padding: 0;
15991 font: 400 14px 'Montserrat', sans-serif;
15992 color: #333;
15993 box-sizing: border-box;
15994 }
15995
15996 .content {
15997 padding-left: 10%;
15998 font: 400 14px 'Montserrat', sans-serif;
15999 }
16000
16001 .content-centered {
16002 padding-left: 10%;
16003 padding-right: 10%;
16004 font: 400 14px 'Montserrat', sans-serif;
16005 }
16006
16007 .content-centered-big {
16008 padding-left: 5%;
16009 padding-right: 5%;
16010 font: 400 14px 'Montserrat', sans-serif;
16011 }
16012
16013 h1 {
16014 font: 400 18px 'Montserrat', sans-serif;
16015 }
16016
16017 .memberList {
16018 display: table;
16019 }
16020
16021 .memberItem {
16022 display: table-row;
16023 }
16024
16025 .memberName, .memberValue {
16026 display: table-cell;
16027 vertical-align: top;
16028 padding: 3px 0 3px 1em;
16029 font: 400 14px 'Montserrat', sans-serif;
16030 }
16031
16032 .memberSmall {
16033 display: table-cell;
16034 vertical-align: top;
16035 padding: 3px 0 3px 1em;
16036 font: 400 12px 'Montserrat', sans-serif;
16037 }
16038
16039 .monospace {
16040 font-family: consolas, courier, monospace;
16041 font-size: 1em;
16042 line-height: 1.2em;
16043 white-space: nowrap;
16044 }
16045
16046 a {
16047 color: #0489c3;
16048 text-decoration: none;
16049 }
16050
16051 a:hover {
16052 text-decoration: underline;
16053 }
16054
16055 em {
16056 color: inherit;
16057 font-style: italic;
16058 }
16059
16060 b {
16061 color: inherit;
16062 font-weight: bold;
16063 }
16064
16065 hr {
16066 margin-top: 20px;
16067 margin-bottom: 20px;
16068 border: 0;
16069 border-top: 1px solid #eee;
16070 height: 0;
16071 box-sizing: content-box;
16072 }
16073
16074 .list-group {
16075 padding-left: 0;
16076 margin-bottom: 20px;
16077 }
16078
16079 .list-group-item {
16080 position: relative;
16081 display: block;
16082 padding: 10px 15px;
16083 margin-bottom: -1px;
16084 background-color: #fff;
16085 }
16086
16087 .list-group-item:first-child {
16088 /* rounded top corners */
16089 border-top-right-radius:4px;
16090 border-top-left-radius:4px;
16091 }
16092
16093 .list-group-item:last-child {
16094 margin-bottom: 0;
16095 /* rounded bottom corners */
16096 border-bottom-right-radius: 4px;
16097 border-bottom-left-radius:4px;
16098 }
16099
16100 /* Flex row container */
16101 .flex-row {
16102 display: flex;
16103 flex-direction: row;
16104 }
16105
16106 /* Flex column container */
16107 .flex-column {
16108 display: flex;
16109 flex-direction: column;
16110 }
16111
16112 .flex-item-fit {
16113 flex-grow: 1;
16114 flex-shrink: 1;
16115 flex-basis: auto;
16116 }
16117
16118 .flex-item-no-shrink {
16119 flex-grow: 0;
16120 flex-shrink: 0;
16121 flex-basis: auto;
16122 }
16123
16124 .flex-item-fill {
16125 flex-grow: 0;
16126 flex-shrink: 1; /* shrink when pressured */
16127 flex-basis: 100%; /* try and take 100% */
16128 }
16129
16130 .flex-item-fixed-1-12 {
16131 flex-grow: 0;
16132 flex-shrink: 0;
16133 flex-basis: 8.3%;
16134 }
16135
16136 .flex-item-fixed-2-12 {
16137 flex-grow: 0;
16138 flex-shrink: 0;
16139 flex-basis: 16.6%;
16140 }
16141
16142 .flex-item-fixed-4-12 {
16143 flex-grow: 0;
16144 flex-shrink: 0;
16145 flex-basis: 33.3333%;
16146 }
16147
16148 .flex-item-fixed-6-12, .flex-item-50-percent {
16149 flex-grow: 0;
16150 flex-shrink: 0;
16151 flex-basis: 50%;
16152 }
16153
16154 .flex-item-fixed-8-12 {
16155 flex-grow: 0;
16156 flex-shrink: 0;
16157 flex-basis: 66.6666%;
16158 }
16159
16160 .flex-item-fixed-9-12 {
16161 flex-grow: 0;
16162 flex-shrink: 0;
16163 flex-basis: 75%;
16164 }
16165
16166
16167 .flex-item-fixed-12-12 {
16168 flex-grow: 0;
16169 flex-shrink: 0;
16170 flex-basis: 100%;
16171 }
16172
16173 .flex-item-10-percent {
16174 flex-grow: 0;
16175 flex-shrink: 0;
16176 flex-basis: 10%;
16177 }
16178
16179 .flex-item-15-percent {
16180 flex-grow: 0;
16181 flex-shrink: 0;
16182 flex-basis: 15%;
16183 }
16184
16185 .flex-item-20-percent {
16186 flex-grow: 0;
16187 flex-shrink: 0;
16188 flex-basis: 20%;
16189 }
16190
16191 .flex-item-30-percent {
16192 flex-grow: 0;
16193 flex-shrink: 0;
16194 flex-basis: 30%;
16195 }
16196
16197 .flex-item-40-percent {
16198 flex-grow: 0;
16199 flex-shrink: 0;
16200 flex-basis: 40%;
16201 }
16202
16203 .flex-item-50-percent {
16204 flex-grow: 0;
16205 flex-shrink: 0;
16206 flex-basis: 50%;
16207 }
16208
16209 .flex-item-60-percent {
16210 flex-grow: 0;
16211 flex-shrink: 0;
16212 flex-basis: 60%;
16213 }
16214
16215 .flex-item-70-percent {
16216 flex-grow: 0;
16217 flex-shrink: 0;
16218 flex-basis: 70%;
16219 }
16220
16221 .flex-item-80-percent {
16222 flex-grow: 0;
16223 flex-shrink: 0;
16224 flex-basis: 80%;
16225 }
16226
16227 .well {
16228 min-height: 20px;
16229 padding: 19px;
16230 margin-bottom: 20px;
16231 background-color: #f5f5f5;
16232 border: 1px solid #e3e3e3;
16233 border-radius: 4px;
16234 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
16235 }
16236
16237 .break-wrap {
16238 word-wrap: break-word;
16239 }
16240 </style>
16241 <style>
16242 ul li:hover:not(.selected) {
16243 background-color: #FFF3E3;
16244 }
16245 .selected {
16246 background-color: #0489c3;
16247 }
16248 .graph {
16249 min-height: 600px;
16250 }
16251 </style>
16252 <nav-bar>
16253 <top-nav-menu last="{{ true }}"></top-nav-menu>
16254 <nav-refresh callback="{{ refresh }}"></nav-refresh>
16255 <nav-control></nav-control>
16256 </nav-bar>
16257 <div class="flex-row">
16258 <div class="flex-item-20-percent">
16259 <ul>
16260 <template repeat="{{ metric in isolate.dartMetrics.values }}">
16261 <template if="{{ metric == selectedMetric }}">
16262 <li class="selected">
16263 {{ metric.name }}
16264 </li>
16265 </template>
16266 <template if="{{ metric != selectedMetric }}">
16267 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}">
16268 {{ metric.name }}
16269 </li>
16270 </template>
16271 </template>
16272 <template repeat="{{ metric in isolate.vmMetrics.values }}">
16273 <template if="{{ metric == selectedMetric }}">
16274 <li class="selected">
16275 {{ metric.name }}
16276 </li>
16277 </template>
16278 <template if="{{ metric != selectedMetric }}">
16279 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}">
16280 {{ metric.name }}
16281 </li>
16282 </template>
16283 </template>
16284 </ul>
16285 </div>
16286 <div class="flex-item-80-percent">
16287 <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}">
16288 </metrics-graph>
16289 <div>
16290 <metric-details page="{{ page }}" metric="{{ selectedMetric }}">
16291 </metric-details>
16292 </div>
16293 </div>
16294 </div>
16295 </template>
16296 </polymer-element>
16297
16298 <polymer-element name="metric-details" extends="observatory-element">
16299 <template>
16300 <style>
16301 /* Global styles */
15403 * { 16302 * {
15404 margin: 0; 16303 margin: 0;
15405 padding: 0; 16304 padding: 0;
15406 font: 400 14px 'Montserrat', sans-serif; 16305 font: 400 14px 'Montserrat', sans-serif;
15407 color: #333; 16306 color: #333;
15408 box-sizing: border-box; 16307 box-sizing: border-box;
15409 } 16308 }
15410 16309
15411 .content { 16310 .content {
15412 padding-left: 10%; 16311 padding-left: 10%;
(...skipping 233 matching lines...) Expand 10 before | Expand all | Expand 10 after
15646 background-color: #f5f5f5; 16545 background-color: #f5f5f5;
15647 border: 1px solid #e3e3e3; 16546 border: 1px solid #e3e3e3;
15648 border-radius: 4px; 16547 border-radius: 4px;
15649 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); 16548 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
15650 } 16549 }
15651 16550
15652 .break-wrap { 16551 .break-wrap {
15653 word-wrap: break-word; 16552 word-wrap: break-word;
15654 } 16553 }
15655 </style> 16554 </style>
15656 <style> 16555 <div class="content-centered">
15657 ul li:hover:not(.selected) { 16556 <div class="memberList">
15658 background-color: #FFF3E3; 16557 <div class="memberItem">
15659 } 16558 <div class="memberName">name</div>
15660 .selected { 16559 <div class="memberValue">{{ metric.name }}</div>
15661 background-color: #0489c3; 16560 </div>
15662 } 16561 <div class="memberItem">
15663 .graph { 16562 <div class="memberName">description</div>
15664 min-height: 600px; 16563 <div class="memberValue">{{ metric.description }}</div>
15665 } 16564 </div>
15666 </style> 16565 <div class="memberItem">
15667 <nav-bar> 16566 <div class="memberName">current value</div>
15668 <top-nav-menu last="{{ true }}"></top-nav-menu> 16567 <div class="memberValue">{{ metric.value }}</div>
15669 <nav-refresh callback="{{ refresh }}"></nav-refresh> 16568 </div>
15670 <nav-control></nav-control> 16569 <template if="{{ (metric != null) &amp;&amp; (metric.min != null) }}">
15671 </nav-bar> 16570 <div class="memberItem">
15672 <div class="flex-row"> 16571 <div class="memberName">minimum</div>
15673 <div class="flex-item-20-percent"> 16572 <div class="memberValue">{{ metric.min }}</div>
15674 <ul> 16573 </div>
15675 <template repeat="{{ metric in isolate.dartMetrics.values }}"> 16574 </template>
15676 <template if="{{ metric == selectedMetric }}"> 16575 <template if="{{ (metric != null) &amp;&amp; (metric.max != null) }}">
15677 <li class="selected"> 16576 <div class="memberItem">
15678 {{ metric.name }} 16577 <div class="memberName">maximum</div>
15679 </li> 16578 <div class="memberValue">{{ metric.max }}</div>
15680 </template> 16579 </div>
15681 <template if="{{ metric != selectedMetric }}"> 16580 </template>
15682 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> 16581 <div class="memberItem">
15683 {{ metric.name }} 16582 <div class="memberName">refresh rate</div>
15684 </li> 16583 <div class="memberValue">
15685 </template> 16584 <select id="refreshrate" on-change="{{ refreshRateChange }}">
15686 </template> 16585 <!-- These must be kept in sync with POLL_PERIODS in MetricsPage
15687 <template repeat="{{ metric in isolate.vmMetrics.values }}"> 16586 in object.dart -->
15688 <template if="{{ metric == selectedMetric }}"> 16587 <option value="8000">Every eight seconds</option>
15689 <li class="selected"> 16588 <option value="4000">Every four seconds</option>
15690 {{ metric.name }} 16589 <option value="2000">Every two seconds</option>
15691 </li> 16590 <option value="1000">Once a second</option>
15692 </template> 16591 <option value="100">Ten times per second</option>
15693 <template if="{{ metric != selectedMetric }}"> 16592 <option value="0" selected="selected">Never</option>
15694 <li on-click="{{ selectMetric }}" data-id="{{ metric.id }}"> 16593 </select>
15695 {{ metric.name }} 16594 </div>
15696 </li> 16595 </div>
15697 </template> 16596 <div class="memberItem">
15698 </template> 16597 <div class="memberName">sample buffer size</div>
15699 </ul> 16598 <div class="memberValue">
15700 </div> 16599 <select id="buffersize" on-change="{{ sampleBufferSizeChange }}">
15701 <div class="flex-item-80-percent"> 16600 <option value="10">10</option>
15702 <metrics-graph isolate="{{ isolate }}" metric="{{ selectedMetric }}"> 16601 <option value="100" selected="selected">100</option>
15703 </metrics-graph> 16602 <option value="1000">1000</option>
15704 <div> 16603 </select>
15705 <metric-details page="{{ page }}" metric="{{ selectedMetric }}"> 16604 </div>
15706 </metric-details>
15707 </div> 16605 </div>
15708 </div> 16606 </div>
15709 </div> 16607 </div>
15710 </template> 16608 </template>
15711 </polymer-element> 16609 </polymer-element>
15712 16610
15713 <polymer-element name="metric-details" extends="observatory-element"> 16611 <polymer-element name="metrics-graph" extends="observatory-element">
15714 <template> 16612 <template>
15715 <style> 16613 <style>
15716 /* Global styles */ 16614 /* Global styles */
15717 * { 16615 * {
15718 margin: 0; 16616 margin: 0;
15719 padding: 0; 16617 padding: 0;
15720 font: 400 14px 'Montserrat', sans-serif; 16618 font: 400 14px 'Montserrat', sans-serif;
15721 color: #333; 16619 color: #333;
15722 box-sizing: border-box; 16620 box-sizing: border-box;
15723 } 16621 }
(...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after
15960 background-color: #f5f5f5; 16858 background-color: #f5f5f5;
15961 border: 1px solid #e3e3e3; 16859 border: 1px solid #e3e3e3;
15962 border-radius: 4px; 16860 border-radius: 4px;
15963 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); 16861 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
15964 } 16862 }
15965 16863
15966 .break-wrap { 16864 .break-wrap {
15967 word-wrap: break-word; 16865 word-wrap: break-word;
15968 } 16866 }
15969 </style> 16867 </style>
15970 <div class="content-centered"> 16868 <style>
15971 <div class="memberList"> 16869 .graph {
15972 <div class="memberItem"> 16870 min-height: 600px;
15973 <div class="memberName">name</div> 16871 }
15974 <div class="memberValue">{{ metric.name }}</div> 16872 </style>
15975 </div> 16873 <div id="graph" class="graph">
15976 <div class="memberItem">
15977 <div class="memberName">description</div>
15978 <div class="memberValue">{{ metric.description }}</div>
15979 </div>
15980 <div class="memberItem">
15981 <div class="memberName">current value</div>
15982 <div class="memberValue">{{ metric.value }}</div>
15983 </div>
15984 <template if="{{ (metric != null) &amp;&amp; (metric.min != null) }}">
15985 <div class="memberItem">
15986 <div class="memberName">minimum</div>
15987 <div class="memberValue">{{ metric.min }}</div>
15988 </div>
15989 </template>
15990 <template if="{{ (metric != null) &amp;&amp; (metric.max != null) }}">
15991 <div class="memberItem">
15992 <div class="memberName">maximum</div>
15993 <div class="memberValue">{{ metric.max }}</div>
15994 </div>
15995 </template>
15996 <div class="memberItem">
15997 <div class="memberName">refresh rate</div>
15998 <div class="memberValue">
15999 <select id="refreshrate" on-change="{{ refreshRateChange }}">
16000 <!-- These must be kept in sync with POLL_PERIODS in MetricsPage
16001 in object.dart -->
16002 <option value="8000">Every eight seconds</option>
16003 <option value="4000">Every four seconds</option>
16004 <option value="2000">Every two seconds</option>
16005 <option value="1000">Once a second</option>
16006 <option value="100">Ten times per second</option>
16007 <option value="0" selected="selected">Never</option>
16008 </select>
16009 </div>
16010 </div>
16011 <div class="memberItem">
16012 <div class="memberName">sample buffer size</div>
16013 <div class="memberValue">
16014 <select id="buffersize" on-change="{{ sampleBufferSizeChange }}">
16015 <option value="10">10</option>
16016 <option value="100" selected="selected">100</option>
16017 <option value="1000">1000</option>
16018 </select>
16019 </div>
16020 </div>
16021 </div>
16022 </div> 16874 </div>
16023 </template> 16875 </template>
16024 </polymer-element> 16876 </polymer-element>
16025 16877
16026 <polymer-element name="metrics-graph" extends="observatory-element"> 16878
16879
16880
16881
16882
16883
16884
16885
16886
16887
16888
16889
16890
16891
16892
16893
16894
16895
16896
16897
16898
16899
16900
16901
16902
16903
16904
16905
16906
16907
16908
16909 <polymer-element name="context-view" extends="observatory-element">
16027 <template> 16910 <template>
16028 <style> 16911 <style>
16029 /* Global styles */ 16912 /* Global styles */
16030 * { 16913 * {
16031 margin: 0; 16914 margin: 0;
16032 padding: 0; 16915 padding: 0;
16033 font: 400 14px 'Montserrat', sans-serif; 16916 font: 400 14px 'Montserrat', sans-serif;
16034 color: #333; 16917 color: #333;
16035 box-sizing: border-box; 16918 box-sizing: border-box;
16036 } 16919 }
(...skipping 236 matching lines...) Expand 10 before | Expand all | Expand 10 after
16273 background-color: #f5f5f5; 17156 background-color: #f5f5f5;
16274 border: 1px solid #e3e3e3; 17157 border: 1px solid #e3e3e3;
16275 border-radius: 4px; 17158 border-radius: 4px;
16276 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05); 17159 box-shadow: inset 0 1px 1px rgba(0,0,0,0.05);
16277 } 17160 }
16278 17161
16279 .break-wrap { 17162 .break-wrap {
16280 word-wrap: break-word; 17163 word-wrap: break-word;
16281 } 17164 }
16282 </style> 17165 </style>
16283 <style> 17166 <nav-bar>
16284 .graph { 17167 <top-nav-menu></top-nav-menu>
16285 min-height: 600px; 17168 <isolate-nav-menu isolate="{{ context.isolate }}"></isolate-nav-menu>
16286 } 17169 <!-- TODO(turnidge): Add library nav menu here. -->
16287 </style> 17170 <class-nav-menu cls="{{ context.clazz }}"></class-nav-menu>
16288 <div id="graph" class="graph"> 17171 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu>
16289 </div> 17172 <nav-refresh callback="{{ refresh }}"></nav-refresh>
17173 <nav-control></nav-control>
17174 </nav-bar>
17175
17176 <template if="{{ !context.isError }}">
17177 <div class="content">
17178 <h1>instance of Context</h1>
17179
17180 <object-common object="{{ context }}"></object-common>
17181
17182 <div class="memberList">
17183 <div class="memberItem">&nbsp;</div>
17184
17185 <div class="memberItem">
17186 <div class="memberName">parent context</div>
17187 <div class="memberValue">
17188 <any-service-ref ref="{{ context.parentContext }}"></any-service-r ef>
17189 </div>
17190 </div>
17191 </div>
17192 </div>
17193
17194 <hr>
17195
17196 <div class="content">
17197 <template if="{{ context.variables.isNotEmpty }}">
17198 variables ({{ context.variables.length }})
17199 <curly-block expand="{{ context.variables.length <= 8 }}">
17200 <div class="memberList">
17201 <template repeat="{{ variable in context.variables }}">
17202 <div class="memberItem">
17203 <div class="memberName">[{{ variable['index']}}]</div>
17204 <div class="memberValue">
17205 <any-service-ref ref="{{ variable['value'] }}"></any-service -ref>
17206 </div>
17207 </div>
17208 </template>
17209 </div>
17210 </curly-block><br><br>
17211 </template>
17212 </div>
17213
17214 <br><br><br><br>
17215 <br><br><br><br>
17216
17217 </template>
16290 </template> 17218 </template>
16291 </polymer-element> 17219 </polymer-element>
16292 17220
16293 17221
16294 17222
16295
16296
16297
16298
16299
16300
16301
16302
16303
16304
16305
16306
16307
16308
16309
16310
16311
16312
16313
16314 17223
16315 17224
16316 17225
16317 17226
16318 <polymer-element name="heap-profile" extends="observatory-element"> 17227 <polymer-element name="heap-profile" extends="observatory-element">
16319 <template> 17228 <template>
16320 <style> 17229 <style>
16321 /* Global styles */ 17230 /* Global styles */
16322 * { 17231 * {
16323 margin: 0; 17232 margin: 0;
(...skipping 4123 matching lines...) Expand 10 before | Expand all | Expand 10 after
20447 </style> 21356 </style>
20448 <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a> 21357 <a on-click="{{ goto }}" _href="{{ url }}">{{ ref.name }}</a>
20449 </template> 21358 </template>
20450 </polymer-element> 21359 </polymer-element>
20451 21360
20452 21361
20453 21362
20454 <observatory-application></observatory-application> 21363 <observatory-application></observatory-application>
20455 21364
20456 <script src="index.html_bootstrap.dart.js" async=""></script></body></html> 21365 <script src="index.html_bootstrap.dart.js" async=""></script></body></html>
OLDNEW
« no previous file with comments | « no previous file | runtime/bin/vmservice/observatory/deployed/web/index.html._data » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698