OLD | NEW |
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 |
(...skipping 960 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
971 </span> | 971 </span> |
972 </template> | 972 </template> |
973 </polymer-element> | 973 </polymer-element> |
974 | 974 |
975 <polymer-element name="action-link"> | 975 <polymer-element name="action-link"> |
976 <template> | 976 <template> |
977 <style> | 977 <style> |
978 .idle { | 978 .idle { |
979 color: #0489c3; | 979 color: #0489c3; |
980 cursor: pointer; | 980 cursor: pointer; |
| 981 text-decoration: none; |
| 982 } |
| 983 .idle:hover { |
| 984 text-decoration: underline; |
981 } | 985 } |
982 .busy { | 986 .busy { |
983 color: #aaa; | 987 color: #aaa; |
984 cursor: wait; | 988 cursor: wait; |
| 989 text-decoration: none; |
985 } | 990 } |
986 </style> | 991 </style> |
987 | 992 |
988 <template if="{{ busy }}"> | 993 <template if="{{ busy }}"> |
989 <span class="busy">[{{ label }}]</span> | 994 <span class="busy">[{{ label }}]</span> |
990 </template> | 995 </template> |
991 <template if="{{ !busy }}"> | 996 <template if="{{ !busy }}"> |
992 <span class="idle"><a on-click="{{ doAction }}">[{{ label }}]</a></span> | 997 <template if="{{ color == null }}"> |
| 998 <span class="idle"><a on-click="{{ doAction }}">[{{ label }}]</a></span> |
| 999 </template> |
| 1000 <template if="{{ color != null }}"> |
| 1001 <span class="idle" style="color:{{ color }}"><a on-click="{{ doAction }}
">[{{ label }}]</a></span> |
| 1002 </template> |
993 </template> | 1003 </template> |
994 </template> | 1004 </template> |
995 </polymer-element> | 1005 </polymer-element> |
996 | 1006 |
997 | 1007 |
998 | 1008 |
999 | 1009 |
1000 | 1010 |
1001 | 1011 |
1002 | 1012 |
1003 | 1013 |
1004 | 1014 |
| 1015 |
1005 <polymer-element name="nav-bar" extends="observatory-element"> | 1016 <polymer-element name="nav-bar" extends="observatory-element"> |
1006 <template> | 1017 <template> |
1007 <style> | 1018 <style> |
1008 /* Global styles */ | 1019 /* Global styles */ |
1009 * { | 1020 * { |
1010 margin: 0; | 1021 margin: 0; |
1011 padding: 0; | 1022 padding: 0; |
1012 font: 400 14px 'Montserrat', sans-serif; | 1023 font: 400 14px 'Montserrat', sans-serif; |
1013 color: #333; | 1024 color: #333; |
1014 box-sizing: border-box; | 1025 box-sizing: border-box; |
(...skipping 534 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1549 border-radius: 9px; | 1560 border-radius: 9px; |
1550 color: white; | 1561 color: white; |
1551 font-size: 18px; | 1562 font-size: 18px; |
1552 cursor: pointer; | 1563 cursor: pointer; |
1553 text-align: center; | 1564 text-align: center; |
1554 } | 1565 } |
1555 a.boxclose:hover { | 1566 a.boxclose:hover { |
1556 background: rgba(255,255,255,0.5); | 1567 background: rgba(255,255,255,0.5); |
1557 } | 1568 } |
1558 </style> | 1569 </style> |
1559 <template if="{{ event.eventType == 'IsolateInterrupted' }}"> | 1570 <template if="{{ event.eventType == 'IsolateInterrupted' || |
| 1571 event.eventType == 'BreakpointReached' || |
| 1572 event.eventType == 'ExceptionThrown' }}"> |
1560 <div class="item"> | 1573 <div class="item"> |
1561 Isolate | 1574 Isolate |
1562 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{
event.isolate.name }}</a> | 1575 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{
event.isolate.name }}</a> |
1563 is paused | 1576 is paused |
| 1577 <template if="{{ event.breakpoint != null }}"> |
| 1578 at breakpoint |
| 1579 </template> |
| 1580 <template if="{{ event.eventType == 'ExceptionThrown' }}"> |
| 1581 at exception |
| 1582 </template> |
| 1583 |
| 1584 <br><br> |
| 1585 <action-link callback="{{ resume }}" label="resume" color="white"> |
| 1586 </action-link> |
| 1587 <action-link callback="{{ stepInto }}" label="step" color="white"> |
| 1588 </action-link> |
| 1589 <action-link callback="{{ stepOver }}" label="step over" color="whi
te"></action-link> |
| 1590 <action-link callback="{{ stepOut }}" label="step out" color="white
"></action-link> |
1564 <a class="boxclose" on-click="{{ closeItem }}">×</a> | 1591 <a class="boxclose" on-click="{{ closeItem }}">×</a> |
1565 </div> | 1592 </div> |
1566 </template> | 1593 </template> |
1567 <template if="{{ event.eventType == 'BreakpointReached' }}"> | |
1568 <div class="item"> | |
1569 Isolate | |
1570 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{
event.isolate.name }}</a> | |
1571 is paused at breakpoint {{ event.breakpoint['id'] }} | |
1572 <a class="boxclose" on-click="{{ closeItem }}">×</a> | |
1573 </div> | |
1574 </template> | |
1575 <template if="{{ event.eventType == 'ExceptionThrown' }}"> | |
1576 <div class="item"> | |
1577 Isolate | |
1578 <a class="link" on-click="{{ goto }}" href="{{ event.isolate.link }}">{{
event.isolate.name }}</a> | |
1579 is paused at exception | |
1580 <a class="boxclose" on-click="{{ closeItem }}">×</a> | |
1581 </div> | |
1582 </template> | |
1583 </template> | 1594 </template> |
1584 </polymer-element> | 1595 </polymer-element> |
1585 | 1596 |
1586 | 1597 |
1587 | 1598 |
1588 <polymer-element name="breakpoint-list" extends="observatory-element"> | 1599 <polymer-element name="breakpoint-list" extends="observatory-element"> |
1589 <template> | 1600 <template> |
1590 <style> | 1601 <style> |
1591 /* Global styles */ | 1602 /* Global styles */ |
1592 * { | 1603 * { |
(...skipping 1850 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
3443 background-color: #e66; | 3454 background-color: #e66; |
3444 } | 3455 } |
3445 .hitsExecuted { | 3456 .hitsExecuted { |
3446 background-color: #6d6; | 3457 background-color: #6d6; |
3447 } | 3458 } |
3448 </style> | 3459 </style> |
3449 <div class="sourceInset"> | 3460 <div class="sourceInset"> |
3450 <content></content> | 3461 <content></content> |
3451 <div class="sourceBox" style="height:{{height}}"> | 3462 <div class="sourceBox" style="height:{{height}}"> |
3452 <div class="sourceTable"> | 3463 <div class="sourceTable"> |
3453 <template repeat="{{ line in lines }}"> | 3464 <template if="{{ linesReady }}"> |
3454 <div class="sourceRow" id="{{ makeLineId(line.line) }}"> | 3465 <template repeat="{{ line in lines }}"> |
3455 <template if="{{ line.hits == null }}"> | 3466 <div class="sourceRow" id="{{ makeLineId(line.line) }}"> |
3456 <div class="hitsNone">{{ line.line }}</div> | 3467 <breakpoint-toggle line="{{ line }}"></breakpoint-toggle> |
3457 </template> | 3468 |
3458 <template if="{{ line.hits == 0 }}"> | 3469 <div class="sourceItem"> </div> |
3459 <div class="hitsNotExecuted">{{ line.line }}</div> | 3470 |
3460 </template> | 3471 <template if="{{ line.hits == null || |
3461 <template if="{{ line.hits > 0 }}"> | 3472 line.hits < 0 }}"> |
3462 <div class="hitsExecuted">{{ line.line }}</div> | 3473 <div class="hitsNone">{{ line.line }}</div> |
3463 </template> | 3474 </template> |
3464 <div class="sourceItem"> </div> | 3475 <template if="{{ line.hits == 0 }}"> |
3465 <template if="{{ line.line == currentLine }}"> | 3476 <div class="hitsNotExecuted">{{ line.line }}</div> |
3466 <div id="currentLine" class="sourceItemCurrent">{{line.text}}</d
iv> | 3477 </template> |
3467 </template> | 3478 <template if="{{ line.hits > 0 }}"> |
3468 <template if="{{ line.line != currentLine }}"> | 3479 <div class="hitsExecuted">{{ line.line }}</div> |
3469 <div class="sourceItem">{{line.text}}</div> | 3480 </template> |
3470 </template> | 3481 |
| 3482 <div class="sourceItem"> </div> |
| 3483 |
| 3484 <template if="{{ line.line == currentLine }}"> |
| 3485 <div class="sourceItemCurrent">{{line.text}}</div> |
| 3486 </template> |
| 3487 <template if="{{ line.line != currentLine }}"> |
| 3488 <div class="sourceItem">{{line.text}}</div> |
| 3489 </template> |
| 3490 </div> |
| 3491 </template> |
| 3492 </template> |
| 3493 |
| 3494 <template if="{{ !linesReady }}"> |
| 3495 <div class="sourceRow"> |
| 3496 <div class="sourceItem">loading...</div> |
3471 </div> | 3497 </div> |
3472 </template> | 3498 </template> |
3473 </div> | 3499 </div> |
3474 </div> | 3500 </div> |
3475 </div> | 3501 </div> |
3476 </template> | 3502 </template> |
3477 </polymer-element> | 3503 </polymer-element> |
3478 | 3504 |
| 3505 <polymer-element name="breakpoint-toggle" extends="observatory-element"> |
| 3506 <template> |
| 3507 <style> |
| 3508 .emptyBreakpoint, .possibleBreakpoint, .busyBreakpoint, .unresolvedBreakpo
int, .resolvedBreakpoint { |
| 3509 display: table-cell; |
| 3510 vertical-align: top; |
| 3511 font: 400 14px consolas, courier, monospace; |
| 3512 min-width: 1em; |
| 3513 text-align: center; |
| 3514 cursor: pointer; |
| 3515 } |
| 3516 .possibleBreakpoint { |
| 3517 color: #e0e0e0; |
| 3518 } |
| 3519 .possibleBreakpoint:hover { |
| 3520 color: white; |
| 3521 background-color: #777; |
| 3522 } |
| 3523 .busyBreakpoint { |
| 3524 color: white; |
| 3525 background-color: black; |
| 3526 cursor: wait; |
| 3527 } |
| 3528 .unresolvedBreakpoint { |
| 3529 color: white; |
| 3530 background-color: #cac; |
| 3531 } |
| 3532 .resolvedBreakpoint { |
| 3533 color: white; |
| 3534 background-color: #e66; |
| 3535 } |
| 3536 </style> |
| 3537 |
| 3538 <template if="{{ line.possibleBpt && busy}}"> |
| 3539 <div class="busyBreakpoint">B</div> |
| 3540 </template> |
| 3541 |
| 3542 <template if="{{ line.bpt == null && !line.possibleBpt }}"> |
| 3543 <div class="emptyBreakpoint"> </div> |
| 3544 </template> |
| 3545 |
| 3546 <template if="{{ line.bpt == null && line.possibleBpt && !bu
sy}}"> |
| 3547 <div class="possibleBreakpoint"> |
| 3548 <a on-click="{{ toggleBreakpoint }}">B</a> |
| 3549 </div> |
| 3550 </template> |
| 3551 |
| 3552 <template if="{{ line.bpt != null && !line.bpt['resolved'] &&
; !busy}}"> |
| 3553 <div class="unresolvedBreakpoint"> |
| 3554 <a on-click="{{ toggleBreakpoint }}">B</a> |
| 3555 </div> |
| 3556 </template> |
| 3557 |
| 3558 <template if="{{ line.bpt != null && line.bpt['resolved'] &&
!busy}}"> |
| 3559 <div class="resolvedBreakpoint"> |
| 3560 <a on-click="{{ toggleBreakpoint }}">B</a> |
| 3561 </div> |
| 3562 </template> |
| 3563 |
| 3564 </template> |
| 3565 </polymer-element> |
| 3566 |
3479 | 3567 |
3480 | 3568 |
3481 | 3569 |
3482 | 3570 |
3483 | 3571 |
3484 <polymer-element name="script-ref" extends="service-ref"> | 3572 <polymer-element name="script-ref" extends="service-ref"> |
3485 <template> | 3573 <template> |
3486 <style> | 3574 <style> |
3487 /* Global styles */ | 3575 /* Global styles */ |
3488 * { | 3576 * { |
(...skipping 9255 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
12744 word-wrap: break-word; | 12832 word-wrap: break-word; |
12745 } | 12833 } |
12746 </style> | 12834 </style> |
12747 <div class="flex-row"> | 12835 <div class="flex-row"> |
12748 <div class="flex-item-10-percent"> | 12836 <div class="flex-item-10-percent"> |
12749 <img src="packages/observatory/src/elements/img/isolate_icon.png"> | 12837 <img src="packages/observatory/src/elements/img/isolate_icon.png"> |
12750 </div> | 12838 </div> |
12751 <div class="flex-item-10-percent"> | 12839 <div class="flex-item-10-percent"> |
12752 <isolate-ref ref="{{ isolate }}"></isolate-ref> | 12840 <isolate-ref ref="{{ isolate }}"></isolate-ref> |
12753 </div> | 12841 </div> |
12754 <div class="flex-item-20-percent"> | 12842 <div class="flex-item-30-percent"> |
12755 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> | 12843 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> |
12756 </div> | 12844 </div> |
12757 <div class="flex-item-50-percent"> | 12845 <div class="flex-item-40-percent"> |
12758 <isolate-location isolate="{{ isolate }}"></isolate-location> | 12846 <isolate-location isolate="{{ isolate }}"></isolate-location> |
12759 </div> | 12847 </div> |
12760 <div class="flex-item-10-percent"> | 12848 <div class="flex-item-10-percent"> |
12761 </div> | 12849 </div> |
12762 </div> | 12850 </div> |
12763 | 12851 |
12764 <div class="flex-row"> | 12852 <div class="flex-row"> |
12765 <div class="flex-item-20-percent"></div> | 12853 <div class="flex-item-20-percent"></div> |
12766 <div class="flex-item-60-percent"> | 12854 <div class="flex-item-60-percent"> |
12767 <hr> | 12855 <hr> |
12768 </div> | 12856 </div> |
12769 <div class="flex-item-20-percent"></div> | 12857 <div class="flex-item-20-percent"></div> |
12770 </div> | 12858 </div> |
12771 | 12859 |
12772 <isolate-shared-summary isolate="{{ isolate }}"></isolate-shared-summary> | 12860 <isolate-shared-summary isolate="{{ isolate }}"></isolate-shared-summary> |
12773 | 12861 |
12774 </template> | 12862 </template> |
12775 </polymer-element> | 12863 </polymer-element> |
12776 | 12864 |
12777 <polymer-element name="isolate-run-state" extends="observatory-element"> | 12865 <polymer-element name="isolate-run-state" extends="observatory-element"> |
12778 <template> | 12866 <template> |
12779 <template if="{{ isolate.pauseEvent != null }}"> | 12867 <template if="{{ isolate.pauseEvent != null }}"> |
12780 <strong>paused</strong> | 12868 <strong>paused</strong> |
12781 <action-link callback="{{ resume }}" label="resume"></action-link> | 12869 <action-link callback="{{ resume }}" label="resume"></action-link> |
| 12870 |
| 12871 <action-link callback="{{ stepInto }}" label="step"></action-link> |
| 12872 <action-link callback="{{ stepOver }}" label="step over"></action-lin
k> |
| 12873 <action-link callback="{{ stepOut }}" label="step out"></action-link> |
12782 </template> | 12874 </template> |
12783 | 12875 |
12784 <template if="{{ isolate.running }}"> | 12876 <template if="{{ isolate.running }}"> |
12785 <strong>running</strong> | 12877 <strong>running</strong> |
12786 <action-link callback="{{ pause }}" label="pause"></action-link> | 12878 <action-link callback="{{ pause }}" label="pause"></action-link> |
12787 </template> | 12879 </template> |
12788 | 12880 |
12789 <template if="{{ isolate.idle }}"> | 12881 <template if="{{ isolate.idle }}"> |
12790 <strong>idle</strong> | 12882 <strong>idle</strong> |
12791 <action-link callback="{{ pause }}" label="pause"></action-link> | 12883 <action-link callback="{{ pause }}" label="pause"></action-link> |
12792 </template> | 12884 </template> |
12793 | 12885 |
12794 <template if="{{ isolate.loading }}"> | 12886 <template if="{{ isolate.loading }}"> |
12795 <strong>loading...</strong> | 12887 <strong>loading...</strong> |
12796 </template> | 12888 </template> |
12797 </template> | 12889 </template> |
12798 </polymer-element> | 12890 </polymer-element> |
12799 | 12891 |
12800 <polymer-element name="isolate-location" extends="observatory-element"> | 12892 <polymer-element name="isolate-location" extends="observatory-element"> |
12801 <template> | 12893 <template> |
12802 <template if="{{ isolate.pauseEvent != null }}"> | 12894 <template if="{{ isolate.pauseEvent != null }}"> |
12803 <template if="{{ isolate.pauseEvent.eventType == 'IsolateCreated' }}"> | 12895 <template if="{{ isolate.pauseEvent.eventType == 'IsolateCreated' }}"> |
12804 at isolate start | 12896 at isolate start |
12805 </template> | 12897 </template> |
| 12898 |
12806 <template if="{{ isolate.pauseEvent.eventType == 'IsolateShutdown' }}"> | 12899 <template if="{{ isolate.pauseEvent.eventType == 'IsolateShutdown' }}"> |
12807 at isolate exit | 12900 at isolate exit |
12808 </template> | 12901 </template> |
12809 <template if="{{ isolate.pauseEvent.eventType == 'IsolateInterrupted' }}"> | 12902 |
| 12903 <template if="{{ isolate.pauseEvent.eventType == 'IsolateInterrupted' || |
| 12904 isolate.pauseEvent.eventType == 'BreakpointReached' || |
| 12905 isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> |
| 12906 <template if="{{ isolate.pauseEvent.breakpoint != null }}"> |
| 12907 by breakpoint |
| 12908 </template> |
| 12909 <template if="{{ isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> |
| 12910 by exception |
| 12911 </template> |
12810 at | 12912 at |
12811 <function-ref ref="{{ isolate.topFrame['function'] }}"> | 12913 <function-ref ref="{{ isolate.topFrame['function'] }}"> |
12812 </function-ref> | 12914 </function-ref> |
12813 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF
rame['tokenPos'] }}"></script-ref>) | 12915 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF
rame['tokenPos'] }}"></script-ref>) |
12814 </template> | 12916 </template> |
12815 <template if="{{ isolate.pauseEvent.eventType == 'BreakpointReached' }}"> | |
12816 at breakpoint {{ isolate.pauseEvent.breakpoint['id'] }} | |
12817 <function-ref ref="{{ isolate.topFrame['function'] }}"> | |
12818 </function-ref> | |
12819 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF
rame['tokenPos'] }}"></script-ref>) | |
12820 </template> | |
12821 <template if="{{ isolate.pauseEvent.eventType == 'ExceptionThrown' }}"> | |
12822 at exception | |
12823 <function-ref ref="{{ isolate.topFrame['function'] }}"> | |
12824 </function-ref> | |
12825 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topF
rame['tokenPos'] }}"></script-ref>) | |
12826 </template> | |
12827 </template> | 12917 </template> |
12828 | 12918 |
12829 <template if="{{ isolate.running }}"> | 12919 <template if="{{ isolate.running }}"> |
12830 at | 12920 at |
12831 <function-ref ref="{{ isolate.topFrame['function'] }}"> | 12921 <function-ref ref="{{ isolate.topFrame['function'] }}"> |
12832 </function-ref> | 12922 </function-ref> |
12833 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topFra
me['tokenPos'] }}"></script-ref>) | 12923 (<script-ref ref="{{ isolate.topFrame['script'] }}" pos="{{ isolate.topFra
me['tokenPos'] }}"></script-ref>) |
12834 </template> | 12924 </template> |
12835 | 12925 |
12836 </template> | 12926 </template> |
(...skipping 622 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
13459 </nav-bar> | 13549 </nav-bar> |
13460 | 13550 |
13461 <div class="content"> | 13551 <div class="content"> |
13462 <h1>isolate '{{ isolate.name }}'</h1> | 13552 <h1>isolate '{{ isolate.name }}'</h1> |
13463 </div> | 13553 </div> |
13464 | 13554 |
13465 <br> | 13555 <br> |
13466 <div class="flex-row"> | 13556 <div class="flex-row"> |
13467 <div class="flex-item-10-percent"> | 13557 <div class="flex-item-10-percent"> |
13468 </div> | 13558 </div> |
13469 <div class="flex-item-20-percent"> | 13559 <div class="flex-item-30-percent"> |
13470 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> | 13560 <isolate-run-state isolate="{{ isolate }}"></isolate-run-state> |
13471 </div> | 13561 </div> |
13472 <div class="flex-item-60-percent"> | 13562 <div class="flex-item-50-percent"> |
13473 <isolate-location isolate="{{ isolate }}"></isolate-location> | 13563 <isolate-location isolate="{{ isolate }}"></isolate-location> |
13474 </div> | 13564 </div> |
13475 <div class="flex-item-10-percent"> | 13565 <div class="flex-item-10-percent"> |
13476 </div> | 13566 </div> |
13477 </div> | 13567 </div> |
13478 <br> | 13568 <br> |
13479 | 13569 |
13480 <template if="{{ isolate.topFrame != null }}"> | 13570 <template if="{{ isolate.topFrame != null }}"> |
13481 <br> | 13571 <br> |
13482 <script-inset script="{{ isolate.topFrame['script'] }}" currentpos="{{ iso
late.topFrame['tokenPos'] }}" height="200px"> | 13572 <script-inset script="{{ isolate.topFrame['script'] }}" currentpos="{{ iso
late.topFrame['tokenPos'] }}" height="200px"> |
(...skipping 4160 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
17643 </style> | 17733 </style> |
17644 <a on-click="{{ goto }}" href="{{ url }}">{{ ref.name }}</a> | 17734 <a on-click="{{ goto }}" href="{{ url }}">{{ ref.name }}</a> |
17645 </template> | 17735 </template> |
17646 </polymer-element> | 17736 </polymer-element> |
17647 | 17737 |
17648 | 17738 |
17649 | 17739 |
17650 <observatory-application></observatory-application> | 17740 <observatory-application></observatory-application> |
17651 | 17741 |
17652 <script src="index.html_bootstrap.dart.js" async=""></script></body></html> | 17742 <script src="index.html_bootstrap.dart.js" async=""></script></body></html> |
OLD | NEW |