1<!doctype html> 2<html> 3 <head> 4 <title>Provided File Systems</title> 5 <meta charset="utf-8"> 6 <link rel="stylesheet" href="provided_file_systems.css"> 7 <script src="chrome://provided-file-systems/provided_file_systems.js"> 8 </script> 9 </head> 10 <body> 11 <polymer-element name="file-systems"> 12 <template> 13 <link rel="stylesheet" 14 href="chrome://provided-file-systems/provided_file_systems.css"> 15 <div id="fileSystems"> 16 <table> 17 <thead> 18 <tr> 19 <th>ID</th> 20 <th>Name</th> 21 <th>Extension ID</th> 22 <th>Active Requests</th> 23 </tr> 24 </thead> 25 <tbody> 26 <template id="file-system" repeat="{{item in model}}"> 27 <tr on-click="{{rowClicked}}" data-id="{{item.id}}" 28 data-extension-id="{{item.extensionId}}"> 29 <td>{{item.id}}</td> 30 <td>{{item.name}}</td> 31 <td> 32 <div class="icon" style="background-image: 33 -webkit-image-set( 34 url(chrome://extension-icon/{{item.extensionId}}/24/1) 35 1x, 36 url(chrome://extension-icon/{{item.extensionId}}/48/1) 37 2x)"></div> 38 {{item.extensionId}} 39 </td> 40 <td>{{item.activeRequests}}</td> 41 </tr> 42 </template> 43 </tbody> 44 </table> 45 </div> 46 </template> 47 </polymer-element> 48 49 <polymer-element name="request-timeline"> 50 <template> 51 <link rel="stylesheet" 52 href="chrome://provided-file-systems/provided_file_systems.css"> 53 <div id="requestTimeline"> 54 <div class="request-timeline-toolbar"> 55 <button on-click="{{zoomOutClicked}}">–</button> 56 <button on-click="{{zoomInClicked}}">+</button> 57 </div> 58 <div class="request-timeline-scroller"> 59 <div class="request-timeline-padding" 60 style="min-height: {{rows.length * ROW_HEIGHT}}px"> 61 <div class="request-timeline-scroller"> 62 <template id="request-timeline-request" 63 repeat="{{request in chart}}"> 64 <div class="request-timeline-request" 65 title="{{request.id}}" 66 data-state="{{request.state}}" 67 data-request-type="{{request.requestType}}" 68 style="-webkit-margin-start: {{request.left * scale}}px; 69 top: {{request.row * ROW_HEIGHT}}px; 70 width: {{request.length * scale}}px"> 71 </div> 72 </template> 73 </div> 74 </div> 75 </div> 76 </template> 77 </polymer-element> 78 79 <polymer-element name="request-events"> 80 <template> 81 <link rel="stylesheet" 82 href="chrome://provided-file-systems/provided_file_systems.css"> 83 <div id="requestEvents"> 84 <table> 85 <thead> 86 <tr> 87 <th>Time</th> 88 <th>Request ID</th> 89 <th>Request Type</th> 90 <th>Event Type</th> 91 <th>Error</th> 92 <th>Has Next</th> 93 </tr> 94 </thead> 95 <tbody> 96 <template id="request-event" repeat="{{item in model}}"> 97 <tr> 98 <td> 99 <a id="request-{{item.id}}"></a> 100 {{item.time | formatTime}} 101 </td> 102 <td>{{item.id}}</td> 103 <td data-request-type="{{item.requestType}}"> 104 <span>{{item.requestType}}</span> 105 </td> 106 <td>{{item.eventType}}</td> 107 <td data-error="{{item.error}}"> 108 <span>{{item.error}}</span> 109 </td> 110 <td>{{item.hasMore | formatHasMore}}</td> 111 </tr> 112 </template> 113 </tbody> 114 </table> 115 </div> 116 </template> 117 </polymer-element> 118 119 <file-systems id="file-systems"> 120 </file-systems> 121 122 <request-timeline hidden id="request-timeline"> 123 </request-timeline> 124 125 <request-events hidden id="request-events"> 126 </request-events> 127 </body> 128</html> 129