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

Side by Side Diff: runtime/bin/vmservice/client/lib/src/elements/instance_view.html

Issue 194623006: Improve the instance-view page in 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
OLDNEW
1 <head> 1 <head>
2 <link rel="import" href="class_ref.html"> 2 <link rel="import" href="class_ref.html">
3 <link rel="import" href="error_view.html"> 3 <link rel="import" href="error_view.html">
4 <link rel="import" href="eval_box.html">
4 <link rel="import" href="field_ref.html"> 5 <link rel="import" href="field_ref.html">
5 <link rel="import" href="instance_ref.html"> 6 <link rel="import" href="instance_ref.html">
6 <link rel="import" href="observatory_element.html"> 7 <link rel="import" href="observatory_element.html">
7 <link rel="import" href="nav_bar.html"> 8 <link rel="import" href="nav_bar.html">
8 </head> 9 </head>
9 <polymer-element name="instance-view" extends="observatory-element"> 10 <polymer-element name="instance-view" extends="observatory-element">
10 <template> 11 <template>
11 <nav-bar> 12 <nav-bar>
12 <top-nav-menu></top-nav-menu> 13 <top-nav-menu></top-nav-menu>
13 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu> 14 <isolate-nav-menu isolate="{{ instance.isolate }}"></isolate-nav-menu>
14 <!-- TODO(turnidge): Add library nav menu here. --> 15 <!-- TODO(turnidge): Add library nav menu here. -->
15 <class-nav-menu cls="{{ instance['class'] }}"></class-nav-menu> 16 <class-nav-menu cls="{{ instance['class'] }}"></class-nav-menu>
16 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu> 17 <nav-menu link="." anchor="instance" last="{{ true }}"></nav-menu>
17 <!-- TODO(turnidge): Add nav refresh here. --> 18 <nav-refresh callback="{{ refresh }}"></nav-refresh>
18 </nav-bar> 19 </nav-bar>
19 20
20 <div class="row"> 21 <style>
21 <div class="col-md-8 col-md-offset-2"> 22 .content {
22 <div class="panel panel-warning"> 23 padding-left: 10%;
23 <div class="panel-heading"> 24 font: 400 14px 'Montserrat', sans-serif;
24 Instance of 25 }
25 <class-ref ref="{{ instance['class'] }}"></class-ref> 26 h1 {
26 </div> 27 font: 400 18px 'Montserrat', sans-serif;
27 <div class="panel-body"> 28 }
28 <template if="{{ instance['error'] == null }}"> 29 .member {
29 <table class="table table-hover"> 30 vertical-align: top;
30 <tbody> 31 padding: 3px 0 3px 1em;
31 <tr> 32 font: 400 14px 'Montserrat', sans-serif;
32 <td>Preview</td><td>{{ instance['preview'] }}</td> 33 }
33 </tr> 34 .memberBold {
34 </tbody> 35 vertical-align: top;
36 padding: 3px 0 3px 1em;
37 font: 400 14px 'Montserrat', sans-serif;
38 }
39 </style>
40
41 <template if="{{ instance['error'] != null }}">
42 <error-view error_obj="{{ instance['error'] }}"></error-view>
43 </template>
44
45 <template if="{{ instance['error'] == null }}">
46 <div class="content">
47 <!-- TODO(turnidge): Handle null instances. -->
48 <h1>instance of {{ instance['class']['user_name'] }}</h1>
49 <table>
50 <tr>
51 <td class="memberBold">class</td>
52 <td class="member">
53 <class-ref ref="{{ instance['class'] }}">
54 </class-ref>
55 </td>
56 </tr>
57 <template if="{{ instance['preview'] != null }}">
58 <tr>
59 <td class="memberBold">preview</td>
60 <td class="member">{{ instance['preview'] }}</td>
61 </tr>
62 </template>
63 <tr>
64 <td class="memberBold">size</td>
65 <td class="member">{{ instance['size'] | formatSize }}</td>
66 </tr>
67 </table>
68 </div>
69
70 <hr>
71
72 <div class="content">
73 <template if="{{ instance['fields'].isNotEmpty }}">
74 fields ({{ instance['fields'].length }})
75 <curly-block>
76 <table>
77 <tr template repeat="{{ field in instance['fields'] }}">
78 <td class="member">
79 <field-ref ref="{{ field['decl'] }}"></field-ref>
80 </td>
81 <td class="member">
82 <instance-ref ref="{{ field['value'] }}"></instance-ref>
83 </td>
84 </tr>
35 </table> 85 </table>
36 <blockquote><strong>Fields</strong></blockquote> 86 </curly-block>
37 <table class="table table-hover"> 87 </template>
38 <tbody> 88
39 <tr template repeat="{{ field in instance['fields'] }}"> 89 <template if="{{ instance['nativeFields'].isNotEmpty }}">
40 <td><field-ref ref="{{ field['decl'] }}"></field-ref></td> 90 native fields ({{ instance['nativeFields'].length }})
41 <td><instance-ref ref="{{ field['value'] }}"></instance-ref></ td> 91 <curly-block>
42 </tr> 92 <table>
43 </tbody> 93 <tr template repeat="{{ field in instance['nativeFields'] }}">
94 <td class="member">[{{ field['index']}}]</td>
95 <td class="member">[{{ field['value']}}]</td>
96 </tr>
44 </table> 97 </table>
45 </template> 98 </curly-block>
46 <template if="{{ instance['error'] != null }}"> 99 </template>
47 <error-view error_obj="{{ instance['error'] }}"></error-view> 100
48 </template> 101 <template if="{{ instance['elements'].isNotEmpty }}">
49 </div> 102 elements ({{ instance['elements'].length }})
103 <curly-block>
104 <table>
105 <tr template repeat="{{ element in instance['elements'] }}">
106 <td class="member">[{{ element['index']}}]</td>
107 <td class="member">
108 <instance-ref ref="{{ element['value'] }}">
109 </instance-ref>
110 </td>
111 </tr>
112 </table>
113 </curly-block>
114 </template>
50 </div> 115 </div>
51 </div> 116
52 </div> 117 <hr>
118
119 <div class="content">
120 <eval-box callback="{{ eval }}"></eval-box>
121 </div>
122 <br><br><br><br>
123 <br><br><br><br>
124 </template>
53 </template> 125 </template>
54 <script type="application/dart" src="instance_view.dart"></script> 126 <script type="application/dart" src="instance_view.dart"></script>
55 </polymer-element> 127 </polymer-element>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698