Index: platform_tools/nacl/debugger/index.html |
diff --git a/platform_tools/nacl/debugger/index.html b/platform_tools/nacl/debugger/index.html |
deleted file mode 100644 |
index 9d4644d956bd284fd0db02c38a08fb9a9ad4a073..0000000000000000000000000000000000000000 |
--- a/platform_tools/nacl/debugger/index.html |
+++ /dev/null |
@@ -1,468 +0,0 @@ |
-<!DOCTYPE html> |
-<html> |
- <!-- |
- Copyright 2013 Google Inc. |
- |
- Use of this source code is governed by a BSD-style license that can be |
- found in the LICENSE file. |
- --> |
-<head> |
- <title>Skia Debugger</title> |
- <link rel="stylesheet" type="text/css" href="debugger.css"/> |
- <script type="text/javascript"> |
- "use strict"; |
- |
- var skia_module = null; // Global application object. |
- var display_right_panel = null; |
- var display_bottom_row = null; |
- var overview_text = ""; |
- var details_text = "Default details text."; |
- var command_list = []; |
- var command_types = {}; |
- var no_filter_text = "--Filter By Available Commands--"; |
- |
- function openFileDialog() { |
- var event = document.createEvent("MouseEvents"); |
- event.initEvent("click", true, false); |
- document.getElementById("file_open").dispatchEvent(event); |
- } |
- |
- function updateOverviewDetails() { |
- var radio_buttons = document.getElementsByName("overviewdetails_radio"); |
- for (var i = 0; i < radio_buttons.length; ++i) { |
- if (radio_buttons[i].checked) { |
- if (radio_buttons[i].value == "details") { |
- document.getElementById("overviewdetails").innerHTML = details_text; |
- } else { |
- document.getElementById("overviewdetails").innerHTML = overview_text; |
- } |
- return; |
- } |
- } |
- // If no radio button is checked, check the "overview" button. |
- for (var i = 0; i < radio_buttons.length; ++i) { |
- if (radio_buttons[i].value == "overview") { |
- radio_buttons[i].checked = true; |
- document.getElementById("overviewdetails").innerHTML = overview_text; |
- return; |
- } |
- } |
- } |
- |
- function makeIndentString(indent_amt) { |
- var indent_str = ""; |
- for (var i = 0; i < indent_amt; ++i) { |
- indent_str += "--"; |
- } |
- return indent_str; |
- } |
- |
- function updateCommandList(filter) { |
- var command_list_display = document.getElementById("command_list"); |
- command_list_display.options.length = 0; |
- var indent = 0; |
- var indent_str = ""; |
- for (var i = 0; i < command_list.length; ++i) { |
- if (command_list[i] == "Restore") { |
- indent--; |
- indent_str = makeIndentString(indent); |
- } |
- if (!filter || filter == no_filter_text || command_list[i] == filter) { |
- command_list_display.options.add(new Option(indent_str + command_list[i], i)); |
- } |
- if (command_list[i] == "Save" || command_list[i] == "Save Layer") { |
- indent++; |
- indent_str = makeIndentString(indent); |
- } |
- } |
- command_list_display.selectedIndex = command_list_display.length - 1; |
- |
- // TODO(borenet): Should the SKP re-draw when the command list is updated? |
- //commandSelected(); |
- } |
- |
- function updateFilterList() { |
- var filter_list_display = document.getElementById("command_filter"); |
- filter_list_display.options.length = 0; |
- filter_list_display.options.add(new Option(no_filter_text, no_filter_text)); |
- for (var command_type in command_types) { |
- if (command_types.hasOwnProperty(command_type)) { |
- filter_list_display.options.add(new Option(command_type, command_type)); |
- } |
- } |
- } |
- |
- function openFile(event) { |
- document.getElementById("overviewdetails").innerHTML = ""; |
- var files = event.target.files; |
- if (files.length != 1) { |
- return; |
- } |
- var file = files[0]; |
- var reader = new FileReader(); |
- reader.onload = (function(theFile) { |
- return function(e) { |
- var data_prefix = "data:;base64,"; |
- skia_module.postMessage("LoadSKP" + e.target.result.slice(data_prefix.length)); |
- }; |
- })(file); |
- reader.readAsDataURL(file); |
- } |
- |
- function toggleInspector() { |
- var right_panel = document.getElementById("right_panel"); |
- var bottom_row = document.getElementById("bottom_row"); |
- if (right_panel.style.display == display_right_panel) { |
- right_panel.style.display = "none"; |
- bottom_row.style.display = "none"; |
- } else { |
- right_panel.style.display = display_right_panel; |
- bottom_row.style.display = display_bottom_row; |
- } |
- } |
- |
- function onLoad() { |
- document.getElementById("file_open").addEventListener("change", openFile, false); |
- var right_panel = document.getElementById("right_panel"); |
- var bottom_row = document.getElementById("bottom_row"); |
- display_right_panel = right_panel.style.display; |
- display_bottom_row = bottom_row.style.display; |
- updateOverviewDetails(); |
- updateFilterList(); |
- } |
- |
- // When the module loads, begin running the application. |
- function moduleDidLoad() { |
- skia_module = document.getElementById("skia_nacl"); |
- sendMsg("init"); |
- } |
- |
- function handleMessage(message_event) { |
- var cmd_skdebugf = "SkDebugf:"; |
- var cmd_clear_commands = "ClearCommands"; |
- var cmd_add_command = "AddCommand:"; |
- var cmd_update_commands = "UpdateCommands"; |
- var cmd_set_overview = "SetOverview:"; |
- var cmd_add_filter_option = "AddFilterOption"; |
- if (message_event.data.indexOf(cmd_skdebugf) == 0) { |
- var msg_contents = message_event.data.slice(cmd_skdebugf.length) |
- console.log("Skia: " + msg_contents); |
- } else if (message_event.data.indexOf(cmd_clear_commands) == 0) { |
- command_list = []; |
- command_types = {}; |
- updateCommandList(); |
- updateFilterList(); |
- } else if (message_event.data.indexOf(cmd_add_command) == 0) { |
- var command = message_event.data.slice(cmd_add_command.length); |
- command_list.push(command); |
- if (command_types[command] == undefined) { |
- command_types[command] = 1; |
- } else { |
- command_types[command]++; |
- } |
- } else if (message_event.data.indexOf(cmd_update_commands) == 0) { |
- updateCommandList(); |
- updateFilterList(); |
- } else if (message_event.data.indexOf(cmd_set_overview) == 0) { |
- overview_text = message_event.data.slice(cmd_set_overview.length); |
- document.getElementById("overview_radio").checked = true; |
- updateOverviewDetails(); |
- } else { |
- alert(message_event.data); |
- } |
- } |
- |
- // Send a message to the plugin. |
- function sendMsg(msg) { |
- if (skia_module) { |
- //console.log("Sending msg:" + msg); |
- skia_module.postMessage(msg); |
- } else { |
- alert("The Skia module has not properly loaded..."); |
- } |
- } |
- |
- function commandSelected() { |
- var command_list = document.getElementById("command_list"); |
- var selected_index = command_list.options[command_list.selectedIndex].value; |
- if (selected_index >= 0) { |
- sendMsg("CommandSelected:" + selected_index); |
- } |
- } |
- |
- function rewind() { |
- command_list.selectedIndex = 0; |
- sendMsg("Rewind"); |
- } |
- |
- function stepBack() { |
- if (command_list.selectedIndex > 0) { |
- command_list.selectedIndex = command_list.selectedIndex - 1; |
- } |
- sendMsg("StepBack"); |
- } |
- |
- function pause() { |
- sendMsg("Pause"); |
- } |
- |
- function stepForward() { |
- if (command_list.selectedIndex < command_list.length - 1) { |
- command_list.selectedIndex = command_list.selectedIndex + 1; |
- } |
- sendMsg("StepForward"); |
- } |
- |
- function play() { |
- command_list.selectedIndex = command_list.length - 1; |
- sendMsg("Play"); |
- } |
- </script> |
-</head> |
-<body onLoad="javascript:onLoad()"> |
-<div id="content" class="row-set"> |
- <div id="menu" class="row"> |
- <ul id="menu-bar" class="dropdown-menu"> |
- <li><a href="#">File</a> |
- <ul> |
- <li><a href="#" onClick="javascript:openFileDialog()">Open</a></li> |
- <li><a href="#">Save</a></li> |
- <li><a href="#">Save As</a></li> |
- <li><a href="#">Exit</a></li> |
- </ul> |
- </li> |
- <li><a href="#">Edit</a> |
- <ul> |
- <li><a href="#">Delete Command</a></li> |
- <li><a href="#">Clear Deletes</a></li> |
- <li><a href="#">Set Breakpoint</a></li> |
- <li><a href="#">Clear Breakpoints</a></li> |
- </ul> |
- </li> |
- <li><a href="#">View</a> |
- <ul> |
- <li><a href="#">Breakpoints</a></li> |
- <li><a href="#">Deleted Commands</a></li> |
- <li><a href="#">Zoom In</a></li> |
- <li><a href="#">Zoom Out</a></li> |
- </ul> |
- </li> |
- <li><a href="#">Navigate</a> |
- <ul> |
- <li><a href="#" onClick="javascript:rewind()">Rewind</a></li> |
- <li><a href="#" onClick="javascript:stepBack()">Step Back</a></li> |
- <li><a href="#" onClick="javascript:stepForward()">Step Forward</a></li> |
- <li><a href="#" onClick="javascript:play()">Play</a></li> |
- <li><a href="#" onClick="javascript:pause()">Pause</a></li> |
- <li><a href="#">Go to Line...</a></li> |
- </ul> |
- </li> |
- <li><a href="#">Window</a> |
- <ul> |
- <li><a href="#">Inspector</a></li> |
- <li><a href="#">Directory</a></li> |
- </ul> |
- </li> |
- </ul> |
- </div> |
- <div id="buttons" class="row"> |
- <div class="column-set"> |
- <div class="column"> |
- <button onClick="javascript:rewind()"><img src="icons/rewind.png"/><br/>Rewind</button> |
- <button onClick="javascript:stepBack()"><img src="icons/previous.png"/><br/>Step Back</button> |
- <button onClick="javascript:pause()"><img src="icons/pause.png"/><br/>Pause</button> |
- <button onClick="javascript:stepForward()"><img src="icons/next.png"/><br/>Step Forward</button> |
- <button onClick="javascript:play()"><img src="icons/play.png"/><br/>Play</button> |
- </div> |
- <div class="column"> |
- <button onClick="javascript:toggleInspector()"><img src="icons/inspector.png"/><br/>Inspector</button> |
- </div> |
- <div class="column"> |
- <button><img src="icons/profile.png"/><br/>Profile</button> |
- </div> |
- <div class="column" style="text-align:right; vertical-align:middle;"> |
- <select id="command_filter" onChange="javascript:updateCommandList(this.options[this.selectedIndex].value)"></select> |
- <button onClick="javascript:updateCommandList()"><img src="icons/reload.png" /><br/>Clear Filter</button> |
- </div> |
- </div> |
- </div> |
- <div class="row"> |
- <div class="column-set"> |
- <div id="left_column" class="column"> |
- <div class="row-set"> |
- <div id="command_list_div" class="row"> |
- <form id="command_list_form"> |
- <select id="command_list" size="2" onChange="javascript:commandSelected()"> |
- <option value="-1">Commands go here...</option> |
- </select> |
- </form> |
- </div> |
- </div> |
- </div> |
- <div id="right_column" class="row-set"> |
- <div id="top_row" class="row"> |
- <div id="display_pane" class="column"> |
- <div id="listener" style="width:100%; height:100%;"> |
- <script type="text/javascript"> |
- var listener = document.getElementById('listener'); |
- listener.addEventListener('load', moduleDidLoad, true); |
- listener.addEventListener('message', handleMessage, true); |
- </script> |
- <embed name="nacl_module" |
- id="skia_nacl" |
- src="debugger.nmf" |
- type="application/x-nacl" |
- width="100%" |
- height="100%" |
- style="width:100%, height:100%;"/> |
- </div> |
- </div> |
- <div id="right_panel" class="column"> |
- <div class="thin_outline"> |
- <div id="visibility_filter" class="settings_block"> |
- Visibility Filter<br/> |
- <div class="thin_outline"> |
- <form id="visibility_filter_form"> |
- <input type="radio" name="visibility_filter_radio" value="on">On<br/> |
- <input type="radio" name="visibility_filter_radio" value="off" checked>Off |
- </form> |
- </div> |
- </div> |
- <div id="command_scrolling" class="settings_block"> |
- Command Scrolling Preferences<br/> |
- <div class="thin_outline"> |
- <div class="row-set"> |
- <div class="row"> |
- <div class="column-set"> |
- <div class="column"> |
- Current Command: |
- </div> |
- <div class="column" style="text-align:right; width:35%;"> |
- <input type="text" style="width:100%;"/> |
- </div> |
- </div> |
- </div> |
- <div class="row"> |
- <div class="column-set"> |
- <div class="column"> |
- Command HitBox: |
- </div> |
- <div class="column" style="text-align:right; width:35%;"> |
- <input type="text" style="width:100%;"/> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
- <div id="render_targets" class="settings_block"> |
- Render Targets<br/> |
- <div class="thin_outline"> |
- <form id="render_targets_form"> |
- <div class="row-set"> |
- <div class="row"> |
- <div class="column-set"> |
- <div class="column">Raster:</div> |
- <div class="column" style="text-align:right;"> |
- <input type="checkbox" name="render_targets_checkbox" value="raster" checked/> |
- </div> |
- </div> |
- </div> |
- <div class="row"> |
- <div class="column-set"> |
- <div class="column" style="padding-left:30px;">Overdraw Viz:</div> |
- <div class="column" style="text-align:right;"> |
- <input type="checkbox" name="render_targets_checkbox" value="overdraw"/> |
- </div> |
- </div> |
- </div> |
- <div class="row"> |
- <div class="column-set"> |
- <div class="column">OpenGL</div> |
- <div class="column" style="text-align:right;"> |
- <input type="checkbox" name="render_targets_checkbox" value="opengl"/> |
- </div> |
- </div> |
- </div> |
- </div> |
- </form> |
- </div> |
- </div> |
- <div id="zoom_level" class="settings_block"> |
- <div class="thin_outline"> |
- <div class="row-set"> |
- <div class="row"> |
- <div class="column-set"> |
- <div class="column"> |
- Zoom Level: |
- </div> |
- <div class="column" style="text-align:right; width:35%;"> |
- <input type="text" style="width:100%;"/> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
- <div id="small_window_wrapper" class="settings_block"> |
- <div class="thin_outline" style="padding:0px;"> |
- <div id="small_window"> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
- <div id="bottom_row" class="row"> |
- <div id="tabview" class="column"> |
- <div class="row-set"> |
- <div class="row" style="height:5px; overflow:auto;"> |
- <form id="overviewdetails_form"> |
- <input type="radio" name="overviewdetails_radio" onChange="javascript:updateOverviewDetails()" id="overview_radio" value="overview" checked>Overview |
- <input type="radio" name="overviewdetails_radio" onChange="javascript:updateOverviewDetails()" id="details_radio" value="details">Details |
- </form> |
- </div> |
- <div class="row"> |
- <div id="overviewdetails"></div> |
- </div> |
- </div> |
- </div> |
- <div id="matrixclip" class="column"> |
- Current Matrix |
- <table> |
- <tr> |
- <td><input type="text" id="matrix00" class="matrix" /></td> |
- <td><input type="text" id="matrix01" class="matrix" /></td> |
- <td><input type="text" id="matrix02" class="matrix" /></td> |
- </tr> |
- <tr> |
- <td><input type="text" id="matrix10" class="matrix" /></td> |
- <td><input type="text" id="matrix11" class="matrix" /></td> |
- <td><input type="text" id="matrix12" class="matrix" /></td> |
- </tr> |
- <tr> |
- <td><input type="text" id="matrix20" class="matrix" /></td> |
- <td><input type="text" id="matrix21" class="matrix" /></td> |
- <td><input type="text" id="matrix22" class="matrix" /></td> |
- </tr> |
- </table> |
- Current Clip |
- <table> |
- <tr> |
- <td><input type="text" id="clip00" class="matrix" /></td> |
- <td><input type="text" id="clip01" class="matrix" /></td> |
- </tr> |
- <tr> |
- <td><input type="text" id="clip10" class="matrix" /></td> |
- <td><input type="text" id="clip11" class="matrix" /></td> |
- </tr> |
- </table> |
- </div> |
- </div> |
- </div> |
- </div> |
- </div> |
-</div> |
-<input type="file" id="file_open" style="display:none;"/> |
-</body> |
-</html> |