16a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com<!DOCTYPE html> 26a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com<html> 36a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <!-- 46a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Copyright 2013 Google Inc. 56a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 66a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Use of this source code is governed by a BSD-style license that can be 76a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com found in the LICENSE file. 86a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com --> 96a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com<head> 106a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <title>Skia Debugger</title> 116a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <link rel="stylesheet" type="text/css" href="debugger.css"/> 126a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <script type="text/javascript"> 136a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com "use strict"; 146a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 156a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var skia_module = null; // Global application object. 166a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var display_right_panel = null; 176a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var display_bottom_row = null; 186a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var overview_text = ""; 196a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var details_text = "Default details text."; 206a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var command_list = []; 216a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var command_types = {}; 226a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var no_filter_text = "--Filter By Available Commands--"; 236a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 246a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function openFileDialog() { 256a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var event = document.createEvent("MouseEvents"); 266a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com event.initEvent("click", true, false); 276a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("file_open").dispatchEvent(event); 286a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 296a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 306a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function updateOverviewDetails() { 316a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var radio_buttons = document.getElementsByName("overviewdetails_radio"); 326a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com for (var i = 0; i < radio_buttons.length; ++i) { 336a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (radio_buttons[i].checked) { 346a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (radio_buttons[i].value == "details") { 356a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("overviewdetails").innerHTML = details_text; 366a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else { 376a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("overviewdetails").innerHTML = overview_text; 386a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 396a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com return; 406a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 416a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 426a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com // If no radio button is checked, check the "overview" button. 436a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com for (var i = 0; i < radio_buttons.length; ++i) { 446a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (radio_buttons[i].value == "overview") { 456a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com radio_buttons[i].checked = true; 466a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("overviewdetails").innerHTML = overview_text; 476a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com return; 486a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 496a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 506a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 516a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 526a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function makeIndentString(indent_amt) { 536a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var indent_str = ""; 546a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com for (var i = 0; i < indent_amt; ++i) { 556a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com indent_str += "--"; 566a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 576a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com return indent_str; 586a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 596a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 606a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function updateCommandList(filter) { 616a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var command_list_display = document.getElementById("command_list"); 626a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list_display.options.length = 0; 636a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var indent = 0; 646a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var indent_str = ""; 656a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com for (var i = 0; i < command_list.length; ++i) { 666a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (command_list[i] == "Restore") { 676a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com indent--; 686a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com indent_str = makeIndentString(indent); 696a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 706a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (!filter || filter == no_filter_text || command_list[i] == filter) { 716a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list_display.options.add(new Option(indent_str + command_list[i], i)); 726a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 736a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (command_list[i] == "Save" || command_list[i] == "Save Layer") { 746a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com indent++; 756a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com indent_str = makeIndentString(indent); 766a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 776a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 786a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list_display.selectedIndex = command_list_display.length - 1; 796a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 806a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com // TODO(borenet): Should the SKP re-draw when the command list is updated? 816a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com //commandSelected(); 826a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 836a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 846a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function updateFilterList() { 856a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var filter_list_display = document.getElementById("command_filter"); 866a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com filter_list_display.options.length = 0; 876a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com filter_list_display.options.add(new Option(no_filter_text, no_filter_text)); 886a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com for (var command_type in command_types) { 896a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (command_types.hasOwnProperty(command_type)) { 906a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com filter_list_display.options.add(new Option(command_type, command_type)); 916a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 926a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 936a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 946a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 956a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function openFile(event) { 966a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("overviewdetails").innerHTML = ""; 976a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var files = event.target.files; 986a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (files.length != 1) { 996a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com return; 1006a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1016a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var file = files[0]; 1026a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var reader = new FileReader(); 1036a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com reader.onload = (function(theFile) { 1046a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com return function(e) { 1056a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var data_prefix = "data:;base64,"; 1066a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com skia_module.postMessage("LoadSKP" + e.target.result.slice(data_prefix.length)); 1076a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com }; 1086a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com })(file); 1096a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com reader.readAsDataURL(file); 1106a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1116a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1126a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function toggleInspector() { 1136a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var right_panel = document.getElementById("right_panel"); 1146a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var bottom_row = document.getElementById("bottom_row"); 1156a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (right_panel.style.display == display_right_panel) { 1166a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com right_panel.style.display = "none"; 1176a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com bottom_row.style.display = "none"; 1186a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else { 1196a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com right_panel.style.display = display_right_panel; 1206a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com bottom_row.style.display = display_bottom_row; 1216a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1226a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1236a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1246a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function onLoad() { 1256a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("file_open").addEventListener("change", openFile, false); 1266a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var right_panel = document.getElementById("right_panel"); 1276a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var bottom_row = document.getElementById("bottom_row"); 1286a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com display_right_panel = right_panel.style.display; 1296a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com display_bottom_row = bottom_row.style.display; 1306a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateOverviewDetails(); 1316a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateFilterList(); 1326a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1336a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1346a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com // When the module loads, begin running the application. 1356a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function moduleDidLoad() { 1366a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com skia_module = document.getElementById("skia_nacl"); 1376a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("init"); 1386a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1396a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1406a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function handleMessage(message_event) { 1416a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var cmd_skdebugf = "SkDebugf:"; 1426a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var cmd_clear_commands = "ClearCommands"; 1436a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var cmd_add_command = "AddCommand:"; 1446a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var cmd_update_commands = "UpdateCommands"; 1456a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var cmd_set_overview = "SetOverview:"; 1466a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var cmd_add_filter_option = "AddFilterOption"; 1476a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (message_event.data.indexOf(cmd_skdebugf) == 0) { 1486a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var msg_contents = message_event.data.slice(cmd_skdebugf.length) 1496a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com console.log("Skia: " + msg_contents); 1506a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else if (message_event.data.indexOf(cmd_clear_commands) == 0) { 1516a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list = []; 1526a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_types = {}; 1536a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateCommandList(); 1546a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateFilterList(); 1556a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else if (message_event.data.indexOf(cmd_add_command) == 0) { 1566a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var command = message_event.data.slice(cmd_add_command.length); 1576a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list.push(command); 1586a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (command_types[command] == undefined) { 1596a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_types[command] = 1; 1606a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else { 1616a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_types[command]++; 1626a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1636a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else if (message_event.data.indexOf(cmd_update_commands) == 0) { 1646a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateCommandList(); 1656a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateFilterList(); 1666a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else if (message_event.data.indexOf(cmd_set_overview) == 0) { 1676a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com overview_text = message_event.data.slice(cmd_set_overview.length); 1686a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com document.getElementById("overview_radio").checked = true; 1696a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com updateOverviewDetails(); 1706a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else { 1716a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com alert(message_event.data); 1726a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1736a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1746a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1756a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com // Send a message to the plugin. 1766a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function sendMsg(msg) { 1776a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (skia_module) { 1786a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com //console.log("Sending msg:" + msg); 1796a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com skia_module.postMessage(msg); 1806a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } else { 1816a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com alert("The Skia module has not properly loaded..."); 1826a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1836a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1846a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1856a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function commandSelected() { 1866a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var command_list = document.getElementById("command_list"); 1876a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var selected_index = command_list.options[command_list.selectedIndex].value; 1886a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (selected_index >= 0) { 1896a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("CommandSelected:" + selected_index); 1906a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1916a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1926a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1936a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function rewind() { 1946a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list.selectedIndex = 0; 1956a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("Rewind"); 1966a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 1976a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 1986a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function stepBack() { 1996a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (command_list.selectedIndex > 0) { 2006a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list.selectedIndex = command_list.selectedIndex - 1; 2016a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 2026a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("StepBack"); 2036a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 2046a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 2056a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function pause() { 2066a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("Pause"); 2076a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 2086a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 2096a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function stepForward() { 2106a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com if (command_list.selectedIndex < command_list.length - 1) { 2116a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list.selectedIndex = command_list.selectedIndex + 1; 2126a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 2136a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("StepForward"); 2146a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 2156a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com 2166a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com function play() { 2176a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com command_list.selectedIndex = command_list.length - 1; 2186a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com sendMsg("Play"); 2196a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com } 2206a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </script> 2216a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com</head> 2226a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com<body onLoad="javascript:onLoad()"> 2236a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com<div id="content" class="row-set"> 2246a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="menu" class="row"> 2256a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <ul id="menu-bar" class="dropdown-menu"> 2266a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">File</a> 2276a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <ul> 2286a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#" onClick="javascript:openFileDialog()">Open</a></li> 2296a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Save</a></li> 2306a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Save As</a></li> 2316a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Exit</a></li> 2326a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </ul> 2336a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </li> 2346a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Edit</a> 2356a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <ul> 2366a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Delete Command</a></li> 2376a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Clear Deletes</a></li> 2386a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Set Breakpoint</a></li> 2396a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Clear Breakpoints</a></li> 2406a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </ul> 2416a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </li> 2426a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">View</a> 2436a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <ul> 2446a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Breakpoints</a></li> 2456a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Deleted Commands</a></li> 2466a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Zoom In</a></li> 2476a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Zoom Out</a></li> 2486a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </ul> 2496a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </li> 2506a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Navigate</a> 2516a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <ul> 2526a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#" onClick="javascript:rewind()">Rewind</a></li> 2536a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#" onClick="javascript:stepBack()">Step Back</a></li> 2546a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#" onClick="javascript:stepForward()">Step Forward</a></li> 2556a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#" onClick="javascript:play()">Play</a></li> 2566a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#" onClick="javascript:pause()">Pause</a></li> 2576a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Go to Line...</a></li> 2586a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </ul> 2596a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </li> 2606a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Window</a> 2616a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <ul> 2626a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Inspector</a></li> 2636a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <li><a href="#">Directory</a></li> 2646a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </ul> 2656a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </li> 2666a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </ul> 2676a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2686a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="buttons" class="row"> 2696a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 2706a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column"> 2716a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:rewind()"><img src="icons/rewind.png"/><br/>Rewind</button> 2726a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:stepBack()"><img src="icons/previous.png"/><br/>Step Back</button> 2736a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:pause()"><img src="icons/pause.png"/><br/>Pause</button> 2746a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:stepForward()"><img src="icons/next.png"/><br/>Step Forward</button> 2756a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:play()"><img src="icons/play.png"/><br/>Play</button> 2766a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2776a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column"> 2786a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:toggleInspector()"><img src="icons/inspector.png"/><br/>Inspector</button> 2796a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2806a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column"> 2816a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button><img src="icons/profile.png"/><br/>Profile</button> 2826a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2836a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right; vertical-align:middle;"> 2846a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <select id="command_filter" onChange="javascript:updateCommandList(this.options[this.selectedIndex].value)"></select> 2856a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <button onClick="javascript:updateCommandList()"><img src="icons/reload.png" /><br/>Clear Filter</button> 2866a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2876a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2886a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 2896a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 2906a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 2916a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="left_column" class="column"> 2926a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row-set"> 2936a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="command_list_div" class="row"> 2946a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <form id="command_list_form"> 2956a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <select id="command_list" size="2" onChange="javascript:commandSelected()"> 2966a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <option value="-1">Commands go here...</option> 2976a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </select> 2986a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </form> 2996a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3006a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3016a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3026a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="right_column" class="row-set"> 3036a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="top_row" class="row"> 3046a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="display_pane" class="column"> 3056a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="listener" style="width:100%; height:100%;"> 3066a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <script type="text/javascript"> 3076a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com var listener = document.getElementById('listener'); 3086a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com listener.addEventListener('load', moduleDidLoad, true); 3096a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com listener.addEventListener('message', handleMessage, true); 3106a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </script> 3116a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <embed name="nacl_module" 3126a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com id="skia_nacl" 3136a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com src="debugger.nmf" 3146a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com type="application/x-nacl" 3156a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com width="100%" 3166a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com height="100%" 3176a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com style="width:100%, height:100%;"/> 3186a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3196a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3206a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="right_panel" class="column"> 3216a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="thin_outline"> 3226a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="visibility_filter" class="settings_block"> 3236a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Visibility Filter<br/> 3246a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="thin_outline"> 3256a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <form id="visibility_filter_form"> 3266a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="radio" name="visibility_filter_radio" value="on">On<br/> 3276a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="radio" name="visibility_filter_radio" value="off" checked>Off 3286a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </form> 3296a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3306a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3316a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="command_scrolling" class="settings_block"> 3326a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Command Scrolling Preferences<br/> 3336a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="thin_outline"> 3346a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row-set"> 3356a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 3366a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 3376a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column"> 3386a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Current Command: 3396a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3406a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right; width:35%;"> 3416a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="text" style="width:100%;"/> 3426a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3436a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3446a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3456a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 3466a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 3476a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column"> 3486a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Command HitBox: 3496a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3506a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right; width:35%;"> 3516a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="text" style="width:100%;"/> 3526a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3536a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3546a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3556a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3566a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3576a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3586a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="render_targets" class="settings_block"> 3596a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Render Targets<br/> 3606a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="thin_outline"> 3616a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <form id="render_targets_form"> 3626a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row-set"> 3636a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 3646a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 3656a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column">Raster:</div> 3666a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right;"> 3676a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="checkbox" name="render_targets_checkbox" value="raster" checked/> 3686a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3696a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3706a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3716a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 3726a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 3736a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="padding-left:30px;">Overdraw Viz:</div> 3746a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right;"> 3756a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="checkbox" name="render_targets_checkbox" value="overdraw"/> 3766a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3776a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3786a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3796a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 3806a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 3816a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column">OpenGL</div> 3826a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right;"> 3836a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="checkbox" name="render_targets_checkbox" value="opengl"/> 3846a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3856a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3866a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3876a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3886a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </form> 3896a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3906a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3916a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="zoom_level" class="settings_block"> 3926a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="thin_outline"> 3936a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row-set"> 3946a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 3956a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column-set"> 3966a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column"> 3976a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Zoom Level: 3986a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 3996a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="column" style="text-align:right; width:35%;"> 4006a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="text" style="width:100%;"/> 4016a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4026a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4036a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4046a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4056a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4066a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4076a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4086a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="small_window_wrapper" class="settings_block"> 4096a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="thin_outline" style="padding:0px;"> 4106a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="small_window"> 4116a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4126a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4136a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4146a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4156a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4166a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="bottom_row" class="row"> 4176a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="tabview" class="column"> 4186a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row-set"> 4196a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row" style="height:5px; overflow:auto;"> 4206a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <form id="overviewdetails_form"> 4216a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="radio" name="overviewdetails_radio" onChange="javascript:updateOverviewDetails()" id="overview_radio" value="overview" checked>Overview 4226a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <input type="radio" name="overviewdetails_radio" onChange="javascript:updateOverviewDetails()" id="details_radio" value="details">Details 4236a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </form> 4246a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4256a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div class="row"> 4266a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="overviewdetails"></div> 4276a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4286a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4296a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4306a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <div id="matrixclip" class="column"> 4316a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Current Matrix 4326a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <table> 4336a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <tr> 4346a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix00" class="matrix" /></td> 4356a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix01" class="matrix" /></td> 4366a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix02" class="matrix" /></td> 4376a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </tr> 4386a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <tr> 4396a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix10" class="matrix" /></td> 4406a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix11" class="matrix" /></td> 4416a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix12" class="matrix" /></td> 4426a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </tr> 4436a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <tr> 4446a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix20" class="matrix" /></td> 4456a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix21" class="matrix" /></td> 4466a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="matrix22" class="matrix" /></td> 4476a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </tr> 4486a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </table> 4496a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com Current Clip 4506a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <table> 4516a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <tr> 4526a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="clip00" class="matrix" /></td> 4536a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="clip01" class="matrix" /></td> 4546a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </tr> 4556a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <tr> 4566a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="clip10" class="matrix" /></td> 4576a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com <td><input type="text" id="clip11" class="matrix" /></td> 4586a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </tr> 4596a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </table> 4606a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4616a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4626a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4636a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4646a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com </div> 4656a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com</div> 4666a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com<input type="file" id="file_open" style="display:none;"/> 4676a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com</body> 4686a98b8c0b5ffe1a23902cdf7e692f702b703eaebborenet@google.com</html> 469
