| OLD | NEW |
| (Empty) |
| 1 <link rel="import" href="../../../../packages/polymer/polymer.html"> | |
| 2 <link rel="import" href="observatory_element.html"> | |
| 3 | |
| 4 <polymer-element name="script-inset" extends="observatory-element"> | |
| 5 <template> | |
| 6 <style> | |
| 7 .sourceInset { | |
| 8 padding-left: 15%; | |
| 9 padding-right: 15%; | |
| 10 } | |
| 11 .sourceBox { | |
| 12 width: 100%; | |
| 13 background-color: #f5f5f5; | |
| 14 border: 1px solid #ccc; | |
| 15 padding: 10px; | |
| 16 overflow-y: auto; | |
| 17 } | |
| 18 .sourceTable { | |
| 19 display: table; | |
| 20 } | |
| 21 .sourceRow { | |
| 22 display: table-row; | |
| 23 } | |
| 24 .sourceItem, .sourceItemCurrent { | |
| 25 display: table-cell; | |
| 26 vertical-align: top; | |
| 27 font: 400 14px consolas, courier, monospace; | |
| 28 line-height: 125%; | |
| 29 white-space: pre; | |
| 30 } | |
| 31 .sourceItemCurrent { | |
| 32 background-color: #6cf; | |
| 33 } | |
| 34 .hitsNone, .hitsNotExecuted, .hitsExecuted { | |
| 35 min-width: 32px; | |
| 36 text-align: right; | |
| 37 } | |
| 38 .hitsNotExecuted { | |
| 39 background-color: #e66; | |
| 40 } | |
| 41 .hitsExecuted { | |
| 42 background-color: #6d6; | |
| 43 } | |
| 44 </style> | |
| 45 <div class="sourceInset"> | |
| 46 <content></content> | |
| 47 <div class="sourceBox" style="height:{{height}}"> | |
| 48 <div class="sourceTable"> | |
| 49 <template if="{{ linesReady }}"> | |
| 50 <template repeat="{{ line in lines }}"> | |
| 51 <div class="sourceRow" id="{{ makeLineId(line.line) }}"> | |
| 52 <breakpoint-toggle line="{{ line }}"></breakpoint-toggle> | |
| 53 | |
| 54 <div class="sourceItem"> </div> | |
| 55 | |
| 56 <template if="{{ line.hits == null || | |
| 57 line.hits < 0 }}"> | |
| 58 <div class="hitsNone">{{ line.line }}</div> | |
| 59 </template> | |
| 60 <template if="{{ line.hits == 0 }}"> | |
| 61 <div class="hitsNotExecuted">{{ line.line }}</div> | |
| 62 </template> | |
| 63 <template if="{{ line.hits > 0 }}"> | |
| 64 <div class="hitsExecuted">{{ line.line }}</div> | |
| 65 </template> | |
| 66 | |
| 67 <div class="sourceItem"> </div> | |
| 68 | |
| 69 <template if="{{ line.line == currentLine }}"> | |
| 70 <div class="sourceItemCurrent">{{line.text}}</div> | |
| 71 </template> | |
| 72 <template if="{{ line.line != currentLine }}"> | |
| 73 <div class="sourceItem">{{line.text}}</div> | |
| 74 </template> | |
| 75 </div> | |
| 76 </template> | |
| 77 </template> | |
| 78 | |
| 79 <template if="{{ !linesReady }}"> | |
| 80 <div class="sourceRow"> | |
| 81 <div class="sourceItem">loading...</div> | |
| 82 </div> | |
| 83 </template> | |
| 84 </div> | |
| 85 </div> | |
| 86 </div> | |
| 87 </template> | |
| 88 </polymer-element> | |
| 89 | |
| 90 <polymer-element name="breakpoint-toggle" extends="observatory-element"> | |
| 91 <template> | |
| 92 <style> | |
| 93 .emptyBreakpoint, .possibleBreakpoint, .busyBreakpoint, .unresolvedBreakpo
int, .resolvedBreakpoint { | |
| 94 display: table-cell; | |
| 95 vertical-align: top; | |
| 96 font: 400 14px consolas, courier, monospace; | |
| 97 min-width: 1em; | |
| 98 text-align: center; | |
| 99 cursor: pointer; | |
| 100 } | |
| 101 .possibleBreakpoint { | |
| 102 color: #e0e0e0; | |
| 103 } | |
| 104 .possibleBreakpoint:hover { | |
| 105 color: white; | |
| 106 background-color: #777; | |
| 107 } | |
| 108 .busyBreakpoint { | |
| 109 color: white; | |
| 110 background-color: black; | |
| 111 cursor: wait; | |
| 112 } | |
| 113 .unresolvedBreakpoint { | |
| 114 color: white; | |
| 115 background-color: #cac; | |
| 116 } | |
| 117 .resolvedBreakpoint { | |
| 118 color: white; | |
| 119 background-color: #e66; | |
| 120 } | |
| 121 </style> | |
| 122 | |
| 123 <template if="{{ line.possibleBpt && busy}}"> | |
| 124 <div class="busyBreakpoint">B</div> | |
| 125 </template> | |
| 126 | |
| 127 <template if="{{ line.bpt == null && !line.possibleBpt }}"> | |
| 128 <div class="emptyBreakpoint"> </div> | |
| 129 </template> | |
| 130 | |
| 131 <template if="{{ line.bpt == null && line.possibleBpt && !busy}}"> | |
| 132 <div class="possibleBreakpoint"> | |
| 133 <a on-click="{{ toggleBreakpoint }}">B</a> | |
| 134 </div> | |
| 135 </template> | |
| 136 | |
| 137 <template if="{{ line.bpt != null && !line.bpt['resolved'] && !busy}}"> | |
| 138 <div class="unresolvedBreakpoint"> | |
| 139 <a on-click="{{ toggleBreakpoint }}">B</a> | |
| 140 </div> | |
| 141 </template> | |
| 142 | |
| 143 <template if="{{ line.bpt != null && line.bpt['resolved'] && !busy}}"> | |
| 144 <div class="resolvedBreakpoint"> | |
| 145 <a on-click="{{ toggleBreakpoint }}">B</a> | |
| 146 </div> | |
| 147 </template> | |
| 148 | |
| 149 </template> | |
| 150 </polymer-element> | |
| 151 | |
| 152 <script type="application/dart" src="script_inset.dart"></script> | |
| OLD | NEW |