src/chrome/browser/resources/chromeos/provided_file_systems.html

   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}}">&ndash;</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>