diff options
Diffstat (limited to 'web/index.html')
-rw-r--r-- | web/index.html | 917 |
1 files changed, 0 insertions, 917 deletions
diff --git a/web/index.html b/web/index.html deleted file mode 100644 index d12f4c38526..00000000000 --- a/web/index.html +++ /dev/null @@ -1,917 +0,0 @@ -<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> -<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> -<head> - <meta charset="utf-8"> - <meta http-equiv="pragma" content="no-cache"> - <meta http-equiv="expires" content="-1"> - <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> - <meta name="apple-mobile-web-app-capable" content="yes"> - <meta name="apple-mobile-web-app-status-bar-style" content="black"> - <title>MAME</title> - <link rel="shortcut icon" href="favicon.ico"> - <link rel="stylesheet" href="css/jquery.mobile.css"> - <!-- jQuery and jQuery Mobile --> - <script src="js/jquery.js"></script> - <script src="js/jquery.mobile.js"></script> -</head> -<body> -<script language="javascript" type="text/javascript"> - - function updateStatusBar(connectionStatus, isPaused, driverText) { - if (connectionStatus) { - // Update every page's connection statusbar. - $("td#main_statusbar_connectionstatus").html(connectionStatus); - $("td#command_statusbar_connectionstatus").html(connectionStatus); - $("td#option_statusbar_connectionstatus").html(connectionStatus); - $("td#slider_statusbar_connectionstatus").html(connectionStatus); - $("td#driver_statusbar_connectionstatus").html(connectionStatus); - $("td#image_statusbar_connectionstatus").html(connectionStatus); - $("td#info_statusbar_connectionstatus").html(connectionStatus); - $("td#logs_statusbar_connectionstatus").html(connectionStatus); - } - if (isPaused) { - // Update every page's running/paused statusbar. - $("td#main_statusbar_ispaused").html(isPaused); - $("td#command_statusbar_ispaused").html(isPaused); - $("td#option_statusbar_ispaused").html(isPaused); - $("td#slider_statusbar_ispaused").html(isPaused); - $("td#driver_statusbar_ispaused").html(isPaused); - $("td#image_statusbar_ispaused").html(isPaused); - $("td#info_statusbar_ispaused").html(isPaused); - $("td#logs_statusbar_ispaused").html(isPaused); - } - if (driverText) { - // Update every page's running driver statusbar. - $("td#main_statusbar_runningdriver").html(driverText); - $("td#command_statusbar_runningdriver").html(driverText); - $("td#option_statusbar_runningdriver").html(driverText); - $("td#slider_statusbar_runningdriver").html(driverText); - $("td#driver_statusbar_runningdriver").html(driverText); - $("td#image_statusbar_runningdriver").html(driverText); - $("td#info_statusbar_runningdriver").html(driverText); - $("td#logs_statusbar_runningdriver").html(driverText); - } - - } - - function takeScreenshot() - { - // First, we need to generate a random number to make absolutely sure we bypass browser caching. - var random=Math.floor(Math.random()*999999999) - $("#screenshot").html('<img height="240" width="320" src="/screenshot.png?cachebreaker='+random.toString()+'"/>'); - // Navigate back to home so we can see the screenshot. - window.location.hash='#mainmenu'; - } - - function executeCommands(command) - { - $.ajax({ - url: "/cmd?name="+command, - cache: false, - dataType: "text", - success: function(data) { - }, - error: function (request, status, error) { alert(status + ", " + error); } - }); - if (command !== 'exit') { - startWebSocket(); - } else { - updateStatusBar('<b style="color: red;">Disconnected</b>','Exited','No Driver'); - } - } - - function executeHardReset() - { - executeCommands("hardreset"); - startWebSocket(); - $('.ui-dialog').dialog('close'); - } - - function executeSoftReset() - { - executeCommands("softreset"); - startWebSocket(); - $('.ui-dialog').dialog('close'); - } - - function executeExit() - { - executeCommands("exit"); - $('.ui-dialog').dialog('close'); - } - - function executeSlider() - { - $.ajax({ - url: "/json/slider", - cache: false, - dataType: "json", - success: function(data) { - var items = []; - for (var i in data) { - items.push('<label for="slider-mini-'+i+'">'+data[i].description +':</label>'); - items.push('<input type="range" name="slider-mini-'+i+'" id="slider-mini-'+i+'" value="'+data[i].curval+'" min="'+data[i].minval+'" max="'+data[i].maxval+'" step=="'+data[i].incval+'" data-highlight="true" data-mini="true" />'); - } - $('#sliders').html(''); - $('#sliders').append(items.join('')).trigger('create'); - for (var i in data) { - $('#slider-mini-' + i).bind( "slidestop", function(event, ui) { setSliderValue($(this).attr('id').replace('slider-mini-',''),$(this).slider().val()); }); - } - - }, - error: function (request, status, error) { alert(status + ", " + error); } - }); - window.location.hash='#slidermenu'; // Just making sure we're on the slider screen. - } - - function setSliderValue(id,val) - { - $.ajax({ - url: "/slider?id="+id+"&val="+val, - cache: false, - dataType: "text", - success: function(data) { - }, - error: function (request, status, error) { alert(status + ", " + error); } - }); - } - - function startWebSocket() { - var docbase = window.location.href.toString().split('#')[0]; // We strip the fragment from the URL using split. - var url = docbase.replace("http://","ws://"); - websocket = new WebSocket(url); - websocket.onopen = function(ev) { - updateStatusBar('<b style="color: green;">Connected</b>','',''); - }; - websocket.onclose = function(ev) { - updateStatusBar('<b style="color: red;">Disconnected</b>','',''); - }; - websocket.onmessage = function(ev) { - if (ev.data=='update_machine') - { - $.ajax({ - url: "json/game", - cache: false, - dataType: "json", - success: function(data) { - var maindesc_name = []; - var maindesc_description = []; - var maindesc_year = []; - var maindesc_manufacturer = []; - var maindesc_parent = []; - var maindesc_sourcefile = []; - var statusbar_ispaused = []; - var statusbar_runningdriver = []; - if(data.ispaused) { - statusbar_ispaused.push('<b style="color: red; ">Paused</b>'); - } else { - statusbar_ispaused.push('<b style="color: green; ">Running</b>'); - } - if(data.name =='__empty') { - statusbar_runningdriver.push('No driver'); - } else { - statusbar_runningdriver.push(data.description + ' [' + data.manufacturer+']'); - } - maindesc_name.push(data.name); - maindesc_description.push(data.description); - maindesc_year.push(data.year); - maindesc_manufacturer.push(data.manufacturer); - maindesc_parent.push(data.parent); - maindesc_sourcefile.push(data.source_file); - $("#maindesc_name").html(maindesc_name.join('')); - $("#maindesc_description").html(maindesc_description.join('')); - $("#maindesc_year").html(maindesc_year.join('')); - $("#maindesc_manufacturer").html(maindesc_manufacturer.join('')); - $("#maindesc_parent").html(maindesc_parent.join('')); - $("#maindesc_sourcefile").html(maindesc_sourcefile.join('')); - - // Now, actually update the status bar.. - updateStatusBar('',statusbar_ispaused.join(''),statusbar_runningdriver.join('')); - takeScreenshot(); - }, - error: function (request, status, error) { alert(status + ", " + error); } - }); - } - - }; - websocket.onerror = function(ev) { - updateStatusBar('<b style="color: red; ">Error</b>',' ',' '); - }; - } - - window.onload = function() { - startWebSocket(); - }; - -$(document).ready(function() { - $( '#pasteTextForm' ).submit(function( event ) - { - $.ajax({ - url: "/keypost", - type:'POST', - data: - { - val: pasteText.value - }, - success: function(msg) - { - } - }); - event.preventDefault(); // This prevents it trying to load a /keypost page after doing the Ajax post. - }); -}); - -</script> - -<!-- This begins the MAIN MENU page -------------------------------------------------------------------> -<div data-role="page" id="mainmenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenumenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="mainmenucontent"> - <table style="tablelayout: auto; width: 100%" border="0"> - <tr> - <td style="padding: 0px; vertical-align:top; width: 1px"><div id="screenshot"><img height="240" width="320" src="/screenshot.png"></div></td> - <td style="padding: 0px; vertical-align:top"> - <table border="0"><div id="drivertext"></div> - <tr> - <th style="text-align:left;">Name</th> - <td><div id="maindesc_name"></div></td> - </tr> - <tr> - <th style="text-align:left;">Description</th> - <td><div id="maindesc_description"></div></td> - </tr> - <tr> - <th style="text-align:left;">Year</th> - <td><div id="maindesc_year"></div></td> - </tr> - <tr> - <th style="text-align:left;">Manufacturer</th> - <td><div id="maindesc_manufacturer"></div></td> - </tr> - <tr> - <th style="text-align:left;">Parent</th> - <td><div id="maindesc_parent"></div></td> - </tr> - <tr> - <th style="text-align:left;">Source File</th> - <td><div id="maindesc_sourcefile"></div></td> - </tr> - </table> - </td> - </tr> - </table> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="main_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="main_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="main_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the COMMAND MENU page -------------------------------------------------------------------> -<div data-role="page" id="commandmenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenumenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#mainmenu" data-transition="fade" data-icon="home">Main Menu</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="menu_commandmenu"> - <h2>Savestate Control</h2> - <div class="ui-grid-a"> - <div class="ui-block-a"><a href="#savestatepanel" data-transition="fade" data-role="button">Save State</a></div> - <div class="ui-block-b"><a href="#loadstatepanel" data-transition="fade" data-role="button">Load State</a></div> - </div> - <h2>Paste/Upload Text</h2> - <div class="ui-grid-a"> - <div class="ui-block-a"><a href="#pastepanel" data-transition="fade" data-role="button">Paste Text</a></div> - <div class="ui-block-b"><a href="#uploadpastepanel" data-transition="fade" data-role="button">Upload Text</a></div> - </div> - <h2>Execution Control</h2> - <div class="ui-grid-a"> - <div class="ui-block-a"><a href="#dialogConfirmSoftReset" data-rel="dialog" data-role="button">Soft reset</a></div> - <div class="ui-block-b"><a href="#dialogConfirmHardReset" data-rel="dialog" data-role="button">Hard reset</a></div> - </div> - <div class="ui-grid-a"> - <div class="ui-block-b"><a href="javascript:executeCommands('togglepause');" data-role="button">Toggle Pause</a></div> - <div class="ui-block-b"><a href="#dialogConfirmExit" data-rel="dialog" data-role="button">Exit</a></div> - </div> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="command_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="command_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="command_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> - - <!-- This begins the Save State panel --------------------------------------------------------> - <div data-role="panel" id="savestatepanel" data-position="left" data-display="overlay" data-theme="a"> - <h3>Select position to save to</h3><br> - - <!-- Yes, it's a little ugly. I could redo this more cleanly with a little javascript, but not right now. --> - <div data-role="controlgroup" data-type="horizontal"> - <a href="" data-rel="close" data-role="button">Cancel</a> - <a href="javascript:executeCommands('savestate&val=auto');" data-role="button">Auto Slot</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=0');" data-role="button">0</a> - <a href="javascript:executeCommands('savestate&val=1');" data-role="button">1</a> - <a href="javascript:executeCommands('savestate&val=2');" data-role="button">2</a> - <a href="javascript:executeCommands('savestate&val=3');" data-role="button">3</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=4');" data-role="button">4</a> - <a href="javascript:executeCommands('savestate&val=5');" data-role="button">5</a> - <a href="javascript:executeCommands('savestate&val=6');" data-role="button">6</a> - <a href="javascript:executeCommands('savestate&val=7');" data-role="button">7</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=8');" data-role="button">8</a> - <a href="javascript:executeCommands('savestate&val=9');" data-role="button">9</a> - <a href="javascript:executeCommands('savestate&val=a');" data-role="button">A</a> - <a href="javascript:executeCommands('savestate&val=b');" data-role="button">B</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=c');" data-role="button">C</a> - <a href="javascript:executeCommands('savestate&val=d');" data-role="button">D</a> - <a href="javascript:executeCommands('savestate&val=e');" data-role="button">E</a> - <a href="javascript:executeCommands('savestate&val=f');" data-role="button">F</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=g');" data-role="button">G</a> - <a href="javascript:executeCommands('savestate&val=h');" data-role="button">H</a> - <a href="javascript:executeCommands('savestate&val=i');" data-role="button">I</a> - <a href="javascript:executeCommands('savestate&val=j');" data-role="button">J</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=k');" data-role="button">K</a> - <a href="javascript:executeCommands('savestate&val=l');" data-role="button">L</a> - <a href="javascript:executeCommands('savestate&val=m');" data-role="button">M</a> - <a href="javascript:executeCommands('savestate&val=n');" data-role="button">N</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=o');" data-role="button">O</a> - <a href="javascript:executeCommands('savestate&val=p');" data-role="button">P</a> - <a href="javascript:executeCommands('savestate&val=q');" data-role="button">Q</a> - <a href="javascript:executeCommands('savestate&val=r');" data-role="button">R</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=s');" data-role="button">S</a> - <a href="javascript:executeCommands('savestate&val=t');" data-role="button">T</a> - <a href="javascript:executeCommands('savestate&val=u');" data-role="button">U</a> - <a href="javascript:executeCommands('savestate&val=v');" data-role="button">V</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('savestate&val=w');" data-role="button">W</a> - <a href="javascript:executeCommands('savestate&val=x');" data-role="button">X</a> - <a href="javascript:executeCommands('savestate&val=y');" data-role="button">Y</a> - <a href="javascript:executeCommands('savestate&val=z');" data-role="button">Z</a> - </div> - <!-- This is here to prevent webkit from trying to put the last row of states under the bottom menu on small screens like phone--> - <br><br><br><br><br> - </div> - - <!-- This begins the Load State panel --------------------------------------------------------> - <div data-role="panel" id="loadstatepanel" data-position="left" data-display="overlay" data-theme="a"> - <h3>Select position to load from</h3><br> - - <!-- Yes, it's a little ugly. I could redo this more cleanly with a little javascript, but not right now. --> - <div data-role="controlgroup" data-type="horizontal"> - <a href="" data-rel="close" data-role="button">Cancel</a> - <a href="javascript:executeCommands('loadstate&val=auto');" data-role="button">Auto Slot</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=0');" data-role="button">0</a> - <a href="javascript:executeCommands('loadstate&val=1');" data-role="button">1</a> - <a href="javascript:executeCommands('loadstate&val=2');" data-role="button">2</a> - <a href="javascript:executeCommands('loadstate&val=3');" data-role="button">3</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=4');" data-role="button">4</a> - <a href="javascript:executeCommands('loadstate&val=5');" data-role="button">5</a> - <a href="javascript:executeCommands('loadstate&val=6');" data-role="button">6</a> - <a href="javascript:executeCommands('loadstate&val=7');" data-role="button">7</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=8');" data-role="button">8</a> - <a href="javascript:executeCommands('loadstate&val=9');" data-role="button">9</a> - <a href="javascript:executeCommands('loadstate&val=a');" data-role="button">A</a> - <a href="javascript:executeCommands('loadstate&val=b');" data-role="button">B</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=c');" data-role="button">C</a> - <a href="javascript:executeCommands('loadstate&val=d');" data-role="button">D</a> - <a href="javascript:executeCommands('loadstate&val=e');" data-role="button">E</a> - <a href="javascript:executeCommands('loadstate&val=f');" data-role="button">F</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=g');" data-role="button">G</a> - <a href="javascript:executeCommands('loadstate&val=h');" data-role="button">H</a> - <a href="javascript:executeCommands('loadstate&val=i');" data-role="button">I</a> - <a href="javascript:executeCommands('loadstate&val=j');" data-role="button">J</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=k');" data-role="button">K</a> - <a href="javascript:executeCommands('loadstate&val=l');" data-role="button">L</a> - <a href="javascript:executeCommands('loadstate&val=m');" data-role="button">M</a> - <a href="javascript:executeCommands('loadstate&val=n');" data-role="button">N</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=o');" data-role="button">O</a> - <a href="javascript:executeCommands('loadstate&val=p');" data-role="button">P</a> - <a href="javascript:executeCommands('loadstate&val=q');" data-role="button">Q</a> - <a href="javascript:executeCommands('loadstate&val=r');" data-role="button">R</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=s');" data-role="button">S</a> - <a href="javascript:executeCommands('loadstate&val=t');" data-role="button">T</a> - <a href="javascript:executeCommands('loadstate&val=u');" data-role="button">U</a> - <a href="javascript:executeCommands('loadstate&val=v');" data-role="button">V</a> - </div> - <div data-role="controlgroup" data-type="horizontal"> - <a href="javascript:executeCommands('loadstate&val=w');" data-role="button">W</a> - <a href="javascript:executeCommands('loadstate&val=x');" data-role="button">X</a> - <a href="javascript:executeCommands('loadstate&val=y');" data-role="button">Y</a> - <a href="javascript:executeCommands('loadstate&val=z');" data-role="button">Z</a> - </div> - <!-- This is here to prevent webkit from trying to put the last row of states under the bottom menu on small screens like phone--> - <br><br><br><br><br> - </div> - - <!-- This begins the Paste Text panel --------------------------------------------------------> - <div data-role="panel" id="pastepanel" data-position="left" data-display="overlay" data-theme="a"> - <h4>Paste Text to Keyboard</h4> - - <form id="pasteTextForm" action="#pastepanel" method="post"> - <div data-role="controlgroup" data-type="horizontal"> - <a href="" data-rel="close" data-role="button">Exit</a> - <input type="submit" value="Send"> - <input type="reset" value="Clear"> - </div> - <br> - <textarea id="pasteText" name="val"></textarea> - </form> - <!-- This is here to prevent webkit from trying to put the last row of states under the bottom menu on small screens like phone--> - <br><br><br><br><br> - </div> - - <!-- This begins the Upload Text panel --------------------------------------------------------> - <div data-role="panel" id="uploadpastepanel" data-position="left" data-display="overlay" data-theme="a"> - <h4>Upload Text to Keyboard</h4> - - <form method="post" action="/keyupload" enctype="multipart/form-data" target="uploadpastelog" data-ajax="false"> - <!-- note that we can't do file uploads via Ajax --> - <div data-role="controlgroup" data-type="horizontal"> - <a href="" data-rel="close" data-role="button">Exit</a> - <input type="submit" value="Upload" /> - </div> - <input type="file" name="file" /> <br/> - </form> - <!-- This is here to prevent webkit from trying to put the last row of states under the bottom menu on small screens like phone--> - <br><br><br><br><br> - </div> -</div> - -<!-- This begins the SLIDERS page -------------------------------------------------------------------> -<div data-role="page" id="slidermenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenumenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="sliders"> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="option_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="option_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="option_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the OPTION MENU page -------------------------------------------------------------------> -<div data-role="page" id="optionmenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenumenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#mainmenu" data-transition="fade" data-icon="home">Main Menu</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="menu_optionmenu"> - <a href="javascript:executeSlider();" data-role="button">Sliders</a> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="slider_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="slider_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="slider_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the DRIVER MENU page -------------------------------------------------------------------> -<div data-role="page" id="drivermenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#mainmenu" data-transition="fade" data-icon="home">Main Menu</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="drivermenucontent"> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="driver_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="driver_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="driver_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the IMAGE MENU page -------------------------------------------------------------------> -<div data-role="page" id="imagemenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#mainmenu" data-transition="fade" data-icon="home">Main Menu</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="imagemenucontent"> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="image_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="image_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="image_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the INFO MENU page -------------------------------------------------------------------> -<div data-role="page" id="infomenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="infomenucontent"> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#mainmenu" data-transition="fade" data-icon="home">Main Menu</a> - </li> - <li> - <a href="#logsmenu" data-transition="fade" data-icon="check">Logs</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="info_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="info_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="info_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the LOGS MENU page -------------------------------------------------------------------> -<div data-role="page" id="logsmenu"> - <div data-theme="a" data-role="header"> - <div style="width: 100%; height: 120px; position: relative;"> - <img src="images/logo-mame-small.png" alt="image" style="position: absolute; top: 50%; left: 50%; margin-left: -158px; margin-top: -50px"> - </div> - <a data-role="button" href="#mainmenu" data-icon="home" data-iconpos="left" class="ui-btn-right">Home</a> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#drivermenu" data-transition="fade" data-icon="bars">Driver</a> - </li> - <li> - <a href="#optionmenu" data-transition="fade" data-icon="gear">Options</a> - </li> - <li> - <a href="#imagemenu" data-transition="fade" data-icon="grid">Image</a> - </li> - <li> - <a href="#commandmenu" data-transition="fade" data-icon="star">Commands</a> - </li> - </ul> - </div> - </div> - <div data-role="content" id="logsmenucontent"> - <p>Paste Upload Log</p> <!-- Yeah, this'll need reworking later. Still considering how this will work in the end. --> - <iframe name="uploadpastelog" width="250" height="250"></iframe> - </div> - <div data-theme="a" data-role="footer" data-position="fixed"> - <div data-role="navbar" data-iconpos="top"> - <ul> - <li> - <a href="#infomenu" data-transition="fade" data-icon="info">Info</a> - </li> - <li> - <a href="#mainmenu" data-transition="fade" data-icon="home">Main Menu</a> - </li> - <li> - <a href="javascript:takeScreenshot();" data-transition="fade" data-icon="search">Screenshot</a> - </li> - <li> - <a href="javascript:startWebSocket();" data-transition="fade" data-icon="refresh">Reconnect</a> - </li> - </ul> - </div> - <h3> - <table style="tablelayout: fixed; width: 100%; height: 10px; border-collapse:collapse;" border="0"> - <tr> - <td style="width: 10%; padding: 0px;" id="logs_statusbar_connectionstatus"></td> - <td style="width: 10%; padding: 0px;" id="logs_statusbar_ispaused"></td> - <td style="width: 80%; padding: 0px;" id="logs_statusbar_runningdriver"></td> - </tr> - </table> - </h3> - </div> -</div> - -<!-- This begins the EXIT dialog ----------------------------------------------------------------------> -<div data-role="dialog" id="dialogConfirmExit"> - <div data-role="header"> - <h1>Confirm: Exit emulator?</h1> - </div> - <a href="javascript:executeExit();" data-theme="a" data-role="button">Yes</a> - <a href="javascript:$('.ui-dialog').dialog('close');" data-role="button">Cancel</a> -</div> - -<!-- This begins the HARD RESET dialog ----------------------------------------------------------------> -<div data-role="page" data-close-btn="none" id="dialogConfirmHardReset"> - <div data-role="header"> - <h1>Confirm: Hard Reset?</h1> - </div> - <a href="javascript:executeHardReset();" data-theme="a" data-role="button">Yes</a> - <a href="javascript:$('.ui-dialog').dialog('close');" data-role="button">Cancel</a> -</div> - -<!-- This begins the SOFT RESET dialog ----------------------------------------------------------------> -<div data-role="page" data-close-btn="none" id="dialogConfirmSoftReset"> - <div data-role="header"> - <h1>Confirm: Soft Reset?</h1> - </div> - <a href="javascript:executeSoftReset();" data-theme="a" data-role="button">Yes</a> - <a href="javascript:$('.ui-dialog').dialog('close');" data-role="button">Cancel</a> -</div> - -</body> -</html> - |