Home | History | Annotate | Download | only in chromeos 
      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>
    129