| <link rel="import" href="../../../../packages/polymer/polymer.html"> |
| <link rel="import" href="observatory_element.html"> |
| |
| <polymer-element name="script-inset" extends="observatory-element"> |
| <template> |
| <style> |
| .sourceInset { |
| } |
| .sourceBox { |
| background-color: #f5f5f5; |
| border: 1px solid #ccc; |
| padding: 10px; |
| overflow-y: auto; |
| } |
| .sourceTable { |
| display: table; |
| } |
| .sourceRow { |
| display: table-row; |
| } |
| .sourceItem, .sourceItemCurrent { |
| display: table-cell; |
| vertical-align: top; |
| font: 400 14px consolas, courier, monospace; |
| line-height: 125%; |
| white-space: pre; |
| } |
| .sourceItemCurrent { |
| background-color: #6cf; |
| } |
| .hitsNone, .hitsNotExecuted, .hitsExecuted { |
| min-width: 32px; |
| text-align: right; |
| } |
| .hitsNotExecuted { |
| background-color: #e66; |
| } |
| .hitsExecuted { |
| background-color: #6d6; |
| } |
| </style> |
| <div class="sourceInset"> |
| <content></content> |
| <div class="sourceBox" style="max-height:{{height}}"> |
| <div class="sourceTable"> |
| <template if="{{ linesReady }}"> |
| <template repeat="{{ line in lines }}"> |
| <div class="sourceRow" id="{{ makeLineId(line.line) }}"> |
| <breakpoint-toggle line="{{ line }}"></breakpoint-toggle> |
| |
| <div class="sourceItem"> </div> |
| |
| <template if="{{ line.hits == null || |
| line.hits < 0 }}"> |
| <div class="hitsNone">{{ line.line }}</div> |
| </template> |
| <template if="{{ line.hits == 0 }}"> |
| <div class="hitsNotExecuted">{{ line.line }}</div> |
| </template> |
| <template if="{{ line.hits > 0 }}"> |
| <div class="hitsExecuted">{{ line.line }}</div> |
| </template> |
| |
| <div class="sourceItem"> </div> |
| |
| <template if="{{ line.line == currentLine }}"> |
| <div class="sourceItemCurrent">{{line.text}}</div> |
| </template> |
| <template if="{{ line.line != currentLine }}"> |
| <div class="sourceItem">{{line.text}}</div> |
| </template> |
| </div> |
| </template> |
| </template> |
| |
| <template if="{{ !linesReady }}"> |
| <div class="sourceRow"> |
| <div class="sourceItem">loading...</div> |
| </div> |
| </template> |
| </div> |
| </div> |
| </div> |
| </template> |
| </polymer-element> |
| |
| <polymer-element name="breakpoint-toggle" extends="observatory-element"> |
| <template> |
| <style> |
| .emptyBreakpoint, .possibleBreakpoint, .busyBreakpoint, .unresolvedBreakpoint, .resolvedBreakpoint { |
| display: table-cell; |
| vertical-align: top; |
| font: 400 14px consolas, courier, monospace; |
| min-width: 1em; |
| text-align: center; |
| cursor: pointer; |
| } |
| .possibleBreakpoint { |
| color: #e0e0e0; |
| } |
| .possibleBreakpoint:hover { |
| color: white; |
| background-color: #777; |
| } |
| .busyBreakpoint { |
| color: white; |
| background-color: black; |
| cursor: wait; |
| } |
| .unresolvedBreakpoint { |
| color: white; |
| background-color: #cac; |
| } |
| .resolvedBreakpoint { |
| color: white; |
| background-color: #e66; |
| } |
| </style> |
| |
| <template if="{{ line.possibleBpt && busy}}"> |
| <div class="busyBreakpoint">B</div> |
| </template> |
| |
| <template if="{{ line.bpt == null && !line.possibleBpt }}"> |
| <div class="emptyBreakpoint"> </div> |
| </template> |
| |
| <template if="{{ line.bpt == null && line.possibleBpt && !busy}}"> |
| <div class="possibleBreakpoint"> |
| <a on-click="{{ toggleBreakpoint }}">B</a> |
| </div> |
| </template> |
| |
| <template if="{{ line.bpt != null && !line.bpt['resolved'] && !busy}}"> |
| <div class="unresolvedBreakpoint"> |
| <a on-click="{{ toggleBreakpoint }}">B</a> |
| </div> |
| </template> |
| |
| <template if="{{ line.bpt != null && line.bpt['resolved'] && !busy}}"> |
| <div class="resolvedBreakpoint"> |
| <a on-click="{{ toggleBreakpoint }}">B</a> |
| </div> |
| </template> |
| |
| </template> |
| </polymer-element> |
| |
| <script type="application/dart" src="script_inset.dart"></script> |