1 <!DOCTYPE HTML> 2 <html> 3 <!-- 4 Copyright (c) 2013 The Chromium Authors. All rights reserved. 5 Use of this source code is governed by a BSD-style license that can be 6 found in the LICENSE file. 7 --> 8 <head> 9 <title>Skia Debugger</title> 10 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 11 12 <script src="/components/webcomponentsjs/webcomponents.js"></script> 13 14 <link rel="import" href="/components/polymer/polymer.html"> 15 <link rel="import" href="/extras/chrome/cc/picture.html"> 16 <link rel="import" href="/ui/extras/chrome/cc/picture_debugger.html"> 17 18 <script src="string_convert.js"></script> 19 <style> 20 picture-ops-list-view { 21 height: 500px; 22 overflow-y: auto; 23 } 24 </style> 25 </head> 26 <body> 27 <div class="header"> 28 <select id="skp_file"></select> 29 </div> 30 31 <div class="view"></div> 32 <script> 33 'use strict'; 34 35 var debuggerEl; 36 37 function getPicture(skp64) { 38 if (!tr.e.cc.PictureSnapshot.CanGetInfo()) { 39 console.error(tr.e.cc.PictureSnapshot.HowToEnablePictureDebugging()); 40 41 var infoBar = document.createElement('tr-ui-b-info-bar'); 42 var view = document.querySelector('.view'); 43 44 view.removeChild(debuggerEl); 45 debuggerEl = undefined; 46 47 view.appendChild(infoBar); 48 49 infoBar.message = tr.e.cc.PictureSnapshot.HowToEnablePictureDebugging(); 50 infoBar.visible = true; 51 return undefined; 52 } 53 54 var size = chrome.skiaBenchmarking.getInfo(skp64); 55 if (size === undefined) 56 throw new Error('Unable to get picture information'); 57 58 return new tr.e.cc.Picture(skp64, 59 tr.Rect.fromXYWH(0, 0, size.width, size.height), 60 tr.Rect.fromXYWH(0, 0, size.width, size.height)); 61 } 62 63 function utf8_to_b64(str) { 64 return window.btoa(unescape(encodeURIComponent(str))); 65 } 66 67 function loadSkp(filename, onSkpLoaded) { 68 getAsync(filename, function(arr) { 69 var view = new Uint8Array(arr); 70 var data = base64EncArr(view, 1); 71 onSkpLoaded(filename, data); 72 },'arraybuffer'); 73 } 74 function YloadSkp(filename, onSkpLoaded) { 75 getAsync(filename, function(data) { 76 var data64 = utf8_to_b64(data); 77 onSkpLoaded(filename, data64); 78 }); 79 } 80 81 function getAsync(url, callback, opt_responseType) { 82 var req = new XMLHttpRequest(); 83 if (opt_responseType) 84 req.responseType = opt_responseType; 85 req.open('GET', url, true); 86 req.onreadystatechange = function(aEvt) { 87 if (req.readyState === 4) { 88 window.setTimeout(function() { 89 if (req.status === 200) { 90 if (opt_responseType === undefined) 91 callback(req.responseText); 92 else 93 callback(req.response); 94 } else { 95 console.log('Failed to load ' + url); 96 } 97 }, 0); 98 } 99 }; 100 req.send(null); 101 } 102 103 function createViewFromSkp(filename, skp) { 104 var p = getPicture(skp); 105 if (p === undefined) 106 return; 107 debuggerEl.picture = p; 108 } 109 110 function onSelectionChange() { 111 var select = document.querySelector('#skp_file'); 112 window.location.hash = '#' + select[select.selectedIndex].value; 113 } 114 115 function onHashChange() { 116 var file = window.location.hash.substr(1); 117 var select = document.querySelector('#skp_file'); 118 if (select[select.selectedIndex].value != file) { 119 for (var i = 0; i < select.children.length; i++) { 120 if (select.children[i].value == file) { 121 select.selectedIndex = i; 122 break; 123 } 124 } 125 } 126 reload(); 127 } 128 129 function cleanFilename(file) { 130 function upcase(letter) { 131 return ' ' + letter.toUpperCase(); 132 } 133 return file.replace(/_/g, ' ') 134 .replace(/\.[^\.]*$/, '') 135 .replace(/ ([a-z])/g, upcase) 136 .replace(/^[a-z]/, upcase); 137 } 138 139 function reload() { 140 var file = window.location.hash.substr(1); 141 var filename = '/skp_data/' + file; 142 loadSkp(filename, createViewFromSkp); 143 } 144 145 function onLoad() { 146 debuggerEl = new tr.ui.e.chrome.cc.PictureDebugger(); 147 document.querySelector('.view').appendChild(debuggerEl); 148 149 getAsync('/json/examples/skp', function(data) { 150 var select = document.querySelector('#skp_file'); 151 var files = JSON.parse(data); 152 153 for (var i = 0; i < files.length; ++i) { 154 var opt = document.createElement('option'); 155 opt.value = files[i]; 156 opt.textContent = cleanFilename(files[i]); 157 select.appendChild(opt); 158 } 159 select.selectedIndex = 0; 160 select.onchange = onSelectionChange; 161 162 if (!window.location.hash) { 163 // This will trigger an onHashChange so no need to reload directly. 164 window.location.hash = '#' + select[select.selectedIndex].value; 165 } else { 166 onHashChange(); 167 } 168 }); 169 } 170 171 window.addEventListener('hashchange', onHashChange); 172 window.addEventListener('load', onLoad); 173 </script> 174 </body> 175 </html> 176