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

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

Issue 340443006: Add support for asynchronous event notification to the observatory. (Closed) Base URL: https://dart.googlecode.com/svn/branches/bleeding_edge/dart
Patch Set: Created 6 years, 5 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 <title>Dart VM Observatory</title> 2 <title>Dart VM Observatory</title>
3 <meta charset="utf-8"> 3 <meta charset="utf-8">
4 4
5 5
6 6
7 7
8 8
9 9
10 10
(...skipping 1244 matching lines...) Expand 10 before | Expand all | Expand 10 after
1255 nav ul:after { 1255 nav ul:after {
1256 content: ""; clear: both; display: block; 1256 content: ""; clear: both; display: block;
1257 } 1257 }
1258 .vertical-spacer { 1258 .vertical-spacer {
1259 height: 40px; 1259 height: 40px;
1260 background-color: #0489c3; 1260 background-color: #0489c3;
1261 } 1261 }
1262 </style> 1262 </style>
1263 <nav> 1263 <nav>
1264 <ul> 1264 <ul>
1265 <nav-notify events="{{ app.notifications }}"></nav-notify>
1265 <content></content> 1266 <content></content>
1266 </ul> 1267 </ul>
1267 </nav> 1268 </nav>
1268 <div class="vertical-spacer"> 1269 <div class="vertical-spacer">
1269 </div> 1270 </div>
1270 <template if="{{ pad }}"> 1271 <template if="{{ pad }}">
1271 <br> 1272 <br>
1272 </template> 1273 </template>
1273 </template> 1274 </template>
1274 </polymer-element> 1275 </polymer-element>
(...skipping 173 matching lines...) Expand 10 before | Expand all | Expand 10 after
1448 </polymer-element> 1449 </polymer-element>
1449 1450
1450 <polymer-element name="class-nav-menu" extends="observatory-element"> 1451 <polymer-element name="class-nav-menu" extends="observatory-element">
1451 <template> 1452 <template>
1452 <nav-menu link="{{ cls.link }}" anchor="{{ cls.name }}" last="{{ last }}"> 1453 <nav-menu link="{{ cls.link }}" anchor="{{ cls.name }}" last="{{ last }}">
1453 <content></content> 1454 <content></content>
1454 </nav-menu> 1455 </nav-menu>
1455 </template> 1456 </template>
1456 </polymer-element> 1457 </polymer-element>
1457 1458
1459 <polymer-element name="nav-notify" extends="observatory-element">
1460 <template>
1461 <style>
1462 .menu {
1463 float: right;
1464 }
1465 .menu .list {
1466 display: block;
1467 position: absolute;
1468 top: 98%;
1469 right: 0;
1470 margin: 0;
1471 padding: 0;
1472 width: auto;
1473 z-index: 1000;
1474 font: 400 12px 'Montserrat', sans-serif;
1475 color: white;
1476 background: none;
1477 }
1478 </style>
1479
1480 <div class="menu">
1481 <div class="list">
1482 <template repeat="{{ event in events }}">
1483 <nav-notify-item events="{{ events }}" event="{{ event }}">
1484 </nav-notify-item>
1485 </template>
1486 </div>
1487 </div>
1488 </template>
1489 </polymer-element>
1490
1491 <polymer-element name="nav-notify-item" extends="observatory-element">
1492 <template>
1493 <style>
1494 .item {
1495 position: relative;
1496 padding: 16px;
1497 margin-top: 10px;
1498 margin-right: 10px;
1499 padding-right: 25px;
1500 width: 200px;
1501 color: #ddd;
1502 background: rgba(0,0,0,.6);
1503 border: solid 2px white;
1504 box-shadow: 0 0 5px black;
1505 border-radius: 5px;
1506 animation: fadein 1s;
1507 }
1508
1509 @keyframes fadein {
1510 from { opacity: 0; }
1511 to { opacity: 1; }
1512 }
1513
1514 a.link {
1515 color: white;
1516 text-decoration: none;
1517 }
1518 a.link:hover {
1519 text-decoration: underline;
1520 }
1521
1522 a.boxclose {
1523 position: absolute;
1524 display: block;
1525 top: 4px;
1526 right: 4px;
1527 height: 18px;
1528 width: 18px;
1529 line-height: 16px;
1530 border-radius: 9px;
1531 color: white;
1532 font-size: 18px;
1533 cursor: pointer;
1534 text-align: center;
1535 }
1536 a.boxclose:hover {
1537 background: rgba(255,255,255,0.5);
1538 }
1539 </style>
1540 <template if="{{ event.eventType == 'IsolateInterrupted' }}">
1541 <div class="item">
1542 Isolate
1543 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{ event.isolate.name }}</a>
1544 is paused
1545 <a class="boxclose" on-click="{{ closeItem }}">×</a>
1546 </div>
1547 </template>
1548 <template if="{{ event.eventType == 'BreakpointReached' }}">
1549 <div class="item">
1550 Isolate
1551 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{ event.isolate.name }}</a>
1552 is paused at breakpoint {{ event.breakpoint['id'] }}
1553 <a class="boxclose" on-click="{{ closeItem }}">×</a>
1554 </div>
1555 </template>
1556 <template if="{{ event.eventType == 'ExceptionThrown' }}">
1557 <div class="item">
1558 Isolate
1559 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{ event.isolate.name }}</a>
1560 is paused at exception
1561 <a class="boxclose" on-click="{{ closeItem }}">×</a>
1562 </div>
1563 </template>
1564 </template>
1565 </polymer-element>
1566
1458 1567
1568
1459 <polymer-element name="breakpoint-list" extends="observatory-element"> 1569 <polymer-element name="breakpoint-list" extends="observatory-element">
1460 <template> 1570 <template>
1461 <style> 1571 <style>
1462 /* Global styles */ 1572 /* Global styles */
1463 * { 1573 * {
1464 margin: 0; 1574 margin: 0;
1465 padding: 0; 1575 padding: 0;
1466 font: 400 14px 'Montserrat', sans-serif; 1576 font: 400 14px 'Montserrat', sans-serif;
1467 color: #333; 1577 color: #333;
1468 box-sizing: border-box; 1578 box-sizing: border-box;
(...skipping 10619 matching lines...) Expand 10 before | Expand all | Expand 10 after
12088 </template> 12198 </template>
12089 </polymer-element> 12199 </polymer-element>
12090 12200
12091 12201
12092 12202
12093 12203
12094 12204
12095 12205
12096 12206
12097 12207
12208
12098 <polymer-element name="isolate-summary" extends="observatory-element"> 12209 <polymer-element name="isolate-summary" extends="observatory-element">
12099 <template> 12210 <template>
12100 <style> 12211 <style>
12101 /* Global styles */ 12212 /* Global styles */
12102 * { 12213 * {
12103 margin: 0; 12214 margin: 0;
12104 padding: 0; 12215 padding: 0;
12105 font: 400 14px 'Montserrat', sans-serif; 12216 font: 400 14px 'Montserrat', sans-serif;
12106 color: #333; 12217 color: #333;
12107 box-sizing: border-box; 12218 box-sizing: border-box;
(...skipping 268 matching lines...) Expand 10 before | Expand all | Expand 10 after
12376 <action-link callback="{{ resume }}" label="resume"></action-link> 12487 <action-link callback="{{ resume }}" label="resume"></action-link>
12377 </template> 12488 </template>
12378 12489
12379 <template if="{{ isolate.running }}"> 12490 <template if="{{ isolate.running }}">
12380 <strong>running</strong> 12491 <strong>running</strong>
12381 <action-link callback="{{ pause }}" label="pause"></action-link> 12492 <action-link callback="{{ pause }}" label="pause"></action-link>
12382 </template> 12493 </template>
12383 12494
12384 <template if="{{ isolate.idle }}"> 12495 <template if="{{ isolate.idle }}">
12385 <strong>idle</strong> 12496 <strong>idle</strong>
12497 <action-link callback="{{ pause }}" label="pause"></action-link>
12386 </template> 12498 </template>
12387 12499
12388 <template if="{{ isolate.loading }}"> 12500 <template if="{{ isolate.loading }}">
12389 <strong>loading...</strong> 12501 <strong>loading...</strong>
12390 </template> 12502 </template>
12391 </template> 12503 </template>
12392 </polymer-element> 12504 </polymer-element>
12393 12505
12394 <polymer-element name="isolate-location" extends="observatory-element"> 12506 <polymer-element name="isolate-location" extends="observatory-element">
12395 <template> 12507 <template>
12396 <template if="{{ isolate.pauseEvent != null }}"> 12508 <template if="{{ isolate.pauseEvent != null }}">
12397 <template if="{{ isolate.pauseEvent['eventType'] == 'IsolateCreated' }}"> 12509 <template if="{{ isolate.pauseEvent.eventType == 'IsolateCreated' }}">
12398 at isolate start 12510 at isolate start
12399 </template> 12511 </template>
12400 <template if="{{ isolate.pauseEvent['eventType'] == 'IsolateShutdown' }}"> 12512 <template if="{{ isolate.pauseEvent.eventType == 'IsolateShutdown' }}">
12401 at isolate exit 12513 at isolate exit
12402 </template> 12514 </template>
12403 <template if="{{ isolate.pauseEvent['eventType'] == 'IsolateInterrupted' } }"> 12515 <template if="{{ isolate.pauseEvent.eventType == 'IsolateInterrupted' }}">
12404 at 12516 at
12405 <function-ref ref="{{ isolate.topFrame['function'] }}"> 12517 <function-ref ref="{{ isolate.topFrame['function'] }}">
12406 </function-ref> 12518 </function-ref>
12407 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF rame['tokenPos'] }}"></script-ref>) 12519 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF rame['tokenPos'] }}"></script-ref>)
12408 </template> 12520 </template>
12409 <template if="{{ isolate.pauseEvent['eventType'] == 'BreakpointReached' }} "> 12521 <template if="{{ isolate.pauseEvent.eventType == 'BreakpointReached' }}">
12410 at breakpoint {{ isolate.pauseEvent['breakpoint']['id'] }} 12522 at breakpoint {{ isolate.pauseEvent.breakpoint['id'] }}
12411 <function-ref ref="{{ isolate.topFrame['function'] }}"> 12523 <function-ref ref="{{ isolate.topFrame['function'] }}">
12412 </function-ref> 12524 </function-ref>
12413 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF rame['tokenPos'] }}"></script-ref>) 12525 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF rame['tokenPos'] }}"></script-ref>)
12526 </template>
12527 <template if="{{ isolate.pauseEvent.eventType == 'ExceptionThrown' }}">
12528 at exception
12529 <function-ref ref="{{ isolate.topFrame['function'] }}">
12530 </function-ref>
12531 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF rame['tokenPos'] }}"></script-ref>)
12414 </template> 12532 </template>
12415 </template> 12533 </template>
12416 12534
12417 <template if="{{ isolate.running }}"> 12535 <template if="{{ isolate.running }}">
12418 at 12536 at
12419 <function-ref ref="{{ isolate.topFrame['function'] }}"> 12537 <function-ref ref="{{ isolate.topFrame['function'] }}">
12420 </function-ref> 12538 </function-ref>
12421 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topFra me['tokenPos'] }}"></script-ref>) 12539 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topFra me['tokenPos'] }}"></script-ref>)
12422 </template> 12540 </template>
12423 12541
(...skipping 4129 matching lines...) Expand 10 before | Expand all | Expand 10 after
16553 <a on-click="{{ goto }}" href="{{ url }}">{{ ref.name }}</a> 16671 <a on-click="{{ goto }}" href="{{ url }}">{{ ref.name }}</a>
16554 </template> 16672 </template>
16555 </polymer-element> 16673 </polymer-element>
16556 16674
16557 16675
16558 16676
16559 16677
16560 <observatory-application devtools="true"></observatory-application> 16678 <observatory-application devtools="true"></observatory-application>
16561 16679
16562 <script src="index_devtools.html_bootstrap.dart.js" async=""></script></body></h tml> 16680 <script src="index_devtools.html_bootstrap.dart.js" async=""></script></body></h tml>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698