content/browser/resources/media/media_internals.html - chromium/src - Git at Google

 <!--
 Copyright 2013 The Chromium Authors. All rights reserved.
 Use of this source code is governed by a BSD-style license that can be
 found in the LICENSE file.
 -->
 <!DOCTYPE html>
 <html dir="$i18n{textdirection}" lang="$i18n{language}">
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>Media Internals</title>
   <link rel="stylesheet" href="media_internals.css">
   <script src="chrome://resources/js/cr.js"></script>
   <script src="chrome://resources/js/cr/ui.js"></script>
   <script src="chrome://resources/js/cr/ui/focus_outline_manager.js"></script>
   <script src="chrome://resources/js/util.js"></script>
   <script src="chrome://resources/js/cr/ui/tabs.js"></script>
   <link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
   <link rel="stylesheet" href="chrome://resources/css/tabs.css">
 </head>

 <body>
   <tabbox>
     <tabs>
       <tab>Players</tab>
       <tab>Audio</tab>
       <tab>Video Capture</tab>
       <tab>Audio Focus</tab>
     </tabs>
     <tabpanels>
       <tabpanel id="players">
         <button id="save-log-button" title="Save all player logs into a file." style="display:none">Save log</button>
         <button id="hide-players-button" title="Hide all players in the current view." stype="display:inline-block">Hide players</button>
         <button id="copy-all-player-button">Copy all to clipboard</button>
         <div id="list-wrapper">
           <div id="player-list-wrapper">
             <h2>Recent Players</h2>
             <ul id="player-list" class="show-none-if-empty"></ul>
           </div>
         </div>
         <div class="property-wrapper">
           <h2>
             Player Properties
             <button class="copy-button">Copy to clipboard</button>
           </h2>
           <table id="player-property-table">
             <thead>
               <tr>
                 <th>Property</th>
                 <th>Value</th>
               </tr>
             </thead>
             <tbody></tbody>
           </table>
         </div>
         <div id="log-wrapper">
           <h2>
             Log <input id="filter-text" type="text" placeholder="property filter">
           </h2>
           <table id="log">
             <thead>
               <tr>
                 <th class="timestamp">Timestamp</th>
                 <th>Property</th>
                 <th>Value</th>
               </tr>
             </thead>
             <tbody></tbody>
           </table>
         </div>
         <ul id="graphs"></ul>
       </tabpanel>
       <tabpanel id="audio">
         <button id="copy-all-audio-button">Copy all to clipboard</button>
         <div>
           <h2>General Information</h2>
           <table id="general-audio-info-table">
             <thead>
               <tr>
                 <th>Property</th>
                 <th>Value</th>
               </tr>
             </thead>
             <tbody></tbody>
           </table>
         </div>
         <div id="audio-component-list-wrapper">
           <h2>Input Controllers</h2>
           <ul id="audio-input-controller-list" class="show-none-if-empty"></ul>
         </div>
         <div id="audio-component-list-wrapper">
           <h2>Output Controllers</h2>
           <ul id="audio-output-controller-list" class="show-none-if-empty"></ul>
         </div>
         <div id="audio-component-list-wrapper">
           <h2>Output Streams</h2>
           <ul id="audio-output-stream-list" class="show-none-if-empty"></ul>
         </div>
         <div class="property-wrapper">
           <h2>
             <span id="audio-property-name"></span> Properties
             <button class="copy-button">Copy to clipboard</button>
           </h2>
           <table id="audio-property-table">
             <thead>
               <tr>
                 <th>Property</th>
                 <th>Value</th>
               </tr>
             </thead>
             <tbody></tbody>
           </table>
         </div>
       </tabpanel>
       <tabpanel id="video-capture">
         <div id="video-capture-capabilities-wrapper">
           <h2>
             <span>Video Capture Device Capabilities</span>
             <button id="video-capture-capabilities-copy-button">
               Copy to clipboard
             </button>
           </h2>
           <table id="video-capture-capabilities-table">
             <thead>
               <tr>
                 <th>Device Name</th>
                 <th>Formats</th>
                 <th>Capture API</th>
                 <th>Device ID</th>
               </tr>
             </thead>
             <tbody id="video-capture-capabilities-tbody" class="show-none-if-empty"></tbody>
           </table>
         </div>
       </tabpanel>
       <tabpanel id="players">
         <div id="list-wrapper">
           <h2>Active Sessions</h2>
           <ul id="audio-focus-session-list" class="show-none-if-empty"></ul>
         </div>
         <template id="audio-focus-session-row">
           <li>
             <label class="audio-focus-session">
               <span class="player-name"></span><br />
               <span class="player-frame"></span><br />
               <span class="player-desc"></span>
             </label>
           </li>
         </template>
       </tabpanel>
     </tabpanels>
   </tabbox>
   <dialog id="clipboard-dialog">
     <p>Ctrl+C to copy to clipboard, unfocus to exit.</p>
     <textarea id="clipboard-textarea" rows="30" cols="80"></textarea>
   </dialog>
   <script src="media_internals.js"></script>
 </body>
 </html>
	<!--
	Copyright 2013 The Chromium Authors. All rights reserved.
	Use of this source code is governed by a BSD-style license that can be
	found in the LICENSE file.
	-->
	<!DOCTYPE html>
	<html dir="$i18n{textdirection}" lang="$i18n{language}">
	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Media Internals</title>
	<link rel="stylesheet" href="media_internals.css">
	<script src="chrome://resources/js/cr.js"></script>
	<script src="chrome://resources/js/cr/ui.js"></script>
	<script src="chrome://resources/js/cr/ui/focus_outline_manager.js"></script>
	<script src="chrome://resources/js/util.js"></script>
	<script src="chrome://resources/js/cr/ui/tabs.js"></script>
	<link rel="stylesheet" href="chrome://resources/css/text_defaults.css">
	<link rel="stylesheet" href="chrome://resources/css/tabs.css">
	</head>

	<body>
	<tabbox>
	<tabs>
	<tab>Players</tab>
	<tab>Audio</tab>
	<tab>Video Capture</tab>
	<tab>Audio Focus</tab>
	</tabs>
	<tabpanels>
	<tabpanel id="players">
	<button id="save-log-button" title="Save all player logs into a file." style="display:none">Save log</button>
	<button id="hide-players-button" title="Hide all players in the current view." stype="display:inline-block">Hide players</button>
	<button id="copy-all-player-button">Copy all to clipboard</button>
	<div id="list-wrapper">
	<div id="player-list-wrapper">
	<h2>Recent Players</h2>
	<ul id="player-list" class="show-none-if-empty"></ul>
	</div>
	</div>
	<div class="property-wrapper">
	<h2>
	Player Properties
	<button class="copy-button">Copy to clipboard</button>
	</h2>
	<table id="player-property-table">
	<thead>
	<tr>
	<th>Property</th>
	<th>Value</th>
	</tr>
	</thead>
	<tbody></tbody>
	</table>
	</div>
	<div id="log-wrapper">
	<h2>
	Log <input id="filter-text" type="text" placeholder="property filter">
	</h2>
	<table id="log">
	<thead>
	<tr>
	<th class="timestamp">Timestamp</th>
	<th>Property</th>
	<th>Value</th>
	</tr>
	</thead>
	<tbody></tbody>
	</table>
	</div>
	<ul id="graphs"></ul>
	</tabpanel>
	<tabpanel id="audio">
	<button id="copy-all-audio-button">Copy all to clipboard</button>
	<div>
	<h2>General Information</h2>
	<table id="general-audio-info-table">
	<thead>
	<tr>
	<th>Property</th>
	<th>Value</th>
	</tr>
	</thead>
	<tbody></tbody>
	</table>
	</div>
	<div id="audio-component-list-wrapper">
	<h2>Input Controllers</h2>
	<ul id="audio-input-controller-list" class="show-none-if-empty"></ul>
	</div>
	<div id="audio-component-list-wrapper">
	<h2>Output Controllers</h2>
	<ul id="audio-output-controller-list" class="show-none-if-empty"></ul>
	</div>
	<div id="audio-component-list-wrapper">
	<h2>Output Streams</h2>
	<ul id="audio-output-stream-list" class="show-none-if-empty"></ul>
	</div>
	<div class="property-wrapper">
	<h2>
	<span id="audio-property-name"></span> Properties
	<button class="copy-button">Copy to clipboard</button>
	</h2>
	<table id="audio-property-table">
	<thead>
	<tr>
	<th>Property</th>
	<th>Value</th>
	</tr>
	</thead>
	<tbody></tbody>
	</table>
	</div>
	</tabpanel>
	<tabpanel id="video-capture">
	<div id="video-capture-capabilities-wrapper">
	<h2>
	<span>Video Capture Device Capabilities</span>
	<button id="video-capture-capabilities-copy-button">
	Copy to clipboard
	</button>
	</h2>
	<table id="video-capture-capabilities-table">
	<thead>
	<tr>
	<th>Device Name</th>
	<th>Formats</th>
	<th>Capture API</th>
	<th>Device ID</th>
	</tr>
	</thead>
	<tbody id="video-capture-capabilities-tbody" class="show-none-if-empty"></tbody>
	</table>
	</div>
	</tabpanel>
	<tabpanel id="players">
	<div id="list-wrapper">
	<h2>Active Sessions</h2>
	<ul id="audio-focus-session-list" class="show-none-if-empty"></ul>
	</div>
	<template id="audio-focus-session-row">
	<li>
	<label class="audio-focus-session">
	<span class="player-name"></span><br />
	<span class="player-frame"></span><br />
	<span class="player-desc"></span>
	</label>
	</li>
	</template>
	</tabpanel>
	</tabpanels>
	</tabbox>
	<dialog id="clipboard-dialog">
	<p>Ctrl+C to copy to clipboard, unfocus to exit.</p>
	<textarea id="clipboard-textarea" rows="30" cols="80"></textarea>
	</dialog>
	<script src="media_internals.js"></script>
	</body>
	</html>