fix viewer backend for convenitnt test and do some frontend work
This commit is contained in:
133
SuperScriptViewer/static/templates/help/converter.html
Normal file
133
SuperScriptViewer/static/templates/help/converter.html
Normal file
@ -0,0 +1,133 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Help - Converter</title>
|
||||
<link rel="stylesheet" href="{{tabcontrol_css}}">
|
||||
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.0/dist/jquery.min.js"></script>
|
||||
<script src="{{tabcontrol_js}}"></script>
|
||||
<script src="{{converter_js}}"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Converter</h1>
|
||||
<p>This page provide some useful converter for your decoding work.</p>
|
||||
<br />
|
||||
|
||||
<div style="display: flex; flex-flow: row; height: 30px; width: 100%; margin: 0; padding: 0; border-bottom: 1px solid black;">
|
||||
<div id="tabnavigation_1_1" class="tabnavigation_1 tabitem-activated" style="height: 100%; padding-left: 20px; padding-right: 20px;" onclick="tabControlSwitcher(1, 1);"><b>Reverse C style byte array</b></div>
|
||||
<div id="tabnavigation_1_2" class="tabnavigation_1 tabitem-deactivated" style="height: 100%; padding-left: 20px; padding-right: 20px;" onclick="tabControlSwitcher(1, 2);"><b>C style byte array to HEX</b></div>
|
||||
<div id="tabnavigation_1_3" class="tabnavigation_1 tabitem-deactivated" style="height: 100%; padding-left: 20px; padding-right: 20px;" onclick="tabControlSwitcher(1, 3);"><b>C style byte array to DEC</b></div>
|
||||
<div id="tabnavigation_1_4" class="tabnavigation_1 tabitem-deactivated" style="height: 100%; padding-left: 20px; padding-right: 20px;" onclick="tabControlSwitcher(1, 4);"><b>Lowcase upcase converter</b></div>
|
||||
</div>
|
||||
|
||||
<div id="tabpanel_1_1" class="tabpanel_1">
|
||||
<p>This converter will reverse your inputed C style byte array. Actually, it take responsibility for the convert between big-endian and little-endian.<br />
|
||||
Typical and legal input just like this: <code>0x00, 0xBb, 0xff, 0xFF</code><br />
|
||||
Support multi-input. Use line break to split each input.</p>
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv1Input" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="left">Input</td>
|
||||
<th colspan="2"> </th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv1_I2O();">v</button></td>
|
||||
<td style="width: 150px;"> </td>
|
||||
<td style="width: 100px;" align="right"> </td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2"> </th>
|
||||
<td align="right">Output</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv1Output" style="width: 100%; height: 100%; resize: none;" readonly="true"></textarea></th>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="tabpanel_1_2" class="tabpanel_1" style="display: none;">
|
||||
<p>This converter will converte provided C style byte array into HEX number. It is double interactive.<br />
|
||||
Acceptable byte array should follow little-endian format.<br />
|
||||
Support multi-input. Use line break to split each input.</p>
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv2Input" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="left">Byte array</td>
|
||||
<th colspan="2"> </th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv2_I2O();">v</button></td>
|
||||
<td style="width: 150px;"> </td>
|
||||
<td style="width: 100px;" align="right"><button style="width: 50px;" onclick="doConv2_O2I();">^</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2"> </th>
|
||||
<td align="right">HEX number</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv2Output" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="tabpanel_1_3" class="tabpanel_1" style="display: none;">
|
||||
<p>This converter will converte provided C style byte array into DEC number. It is double interactive.<br />
|
||||
Acceptable byte array should follow little-endian format.<br />
|
||||
Support multi-input. Use line break to split each input.</p>
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv3Input" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="left">Byte array</td>
|
||||
<th colspan="2"> </th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv3_I2O();">v</button></td>
|
||||
<td style="width: 150px;"> </td>
|
||||
<td style="width: 100px;" align="right"><button style="width: 50px;" onclick="doConv3_O2I();">^</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2"> </th>
|
||||
<td align="right">DEC number</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv3Output" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div id="tabpanel_1_4" class="tabpanel_1" style="display: none;">
|
||||
<p>This converter will provide the convert between lowcase and upcase string. It is double interactive.</p>
|
||||
<table>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv4Input" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="left">Lowcase</td>
|
||||
<th colspan="2"> </th>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv4_I2O();">v</button></td>
|
||||
<td style="width: 150px;"> </td>
|
||||
<td style="width: 100px;" align="right"><button style="width: 50px;" onclick="doConv4_O2I();">^</button></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2"> </th>
|
||||
<td align="right">Upcase</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="3" style="height: 150px;"><textarea id="conv4Output" style="width: 100%; height: 100%; resize: none;"></textarea></th>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
65
SuperScriptViewer/static/templates/help/env.html
Normal file
65
SuperScriptViewer/static/templates/help/env.html
Normal file
@ -0,0 +1,65 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Help - Environment data query</title>
|
||||
<link rel="stylesheet" href="{{tabcontrol_css}}">
|
||||
<link rel="stylesheet" href="{{env_css}}">
|
||||
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.0/dist/jquery.min.js"></script>
|
||||
<script src="{{tabcontrol_js}}"></script>
|
||||
<script src="{{env_js}}"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Environment data query</h1>
|
||||
<p>This page can query environment data.</p>
|
||||
<br />
|
||||
|
||||
|
||||
<div style="display: flex; flex-flow: row; height: 30px; width: 100%; margin: 0; padding: 0; border-bottom: 1px solid black;">
|
||||
{% for item in database_data %}
|
||||
<div id="tabnavigation_1_{{ loop.index }}" class="tabnavigation_1 tabitem-deactivated" style="height: 100%; padding-left: 20px; padding-right: 20px;" onclick="tabControlSwitcher(1, {{ loop.index }});"><b>{{ item.name }}</b></div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% for item in database_data %}
|
||||
<div id="tabpanel_1_{{ loop.index }}" class="tabpanel_1" style="display: none;">
|
||||
<p>Query field:</p>
|
||||
<table id="queryTable_{{ loop.index }}" border="1" cellspacing="0" cellpadding="5" style="margin: 10px;">
|
||||
<tr>
|
||||
<td><b>Use this</b></td>
|
||||
<td><b>Field name</b></td>
|
||||
<td style="width: 150px;"><b>Value</b></td>
|
||||
<td><b>Example</b></td>
|
||||
<td><b>Description</b></td>
|
||||
</tr>
|
||||
|
||||
{% for innerItem in item.data %}
|
||||
<tr>
|
||||
<td><input type="checkbox" value="1"></input></td>
|
||||
<td queryName="{{ innerItem[0]|e }}">{{ innerItem[0]|e }}</td>
|
||||
<td><input type="text"></input></td>
|
||||
<td>{{ innerItem[1]|e }}</td>
|
||||
<td>{{ innerItem[2]|e }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
|
||||
<button style="padding: 5px;" onclick="doQuery({{ loop.index }}, "{{ item.queryKey }}");">Query</button>
|
||||
<p>Query result:</p>
|
||||
<p id="resultTableOverflow_{{ loop.index }}" style="color: red; display: none;">The count of query result is more than 100 items(Only the first 100 items will be shown). Please give more limitation.</p>
|
||||
|
||||
<table id="resultTable_{{ loop.index }}" class="envOutput" cellspacing="0" cellpadding="5" style="margin: 10px;">
|
||||
<tr>
|
||||
{% for innerItem in item.data %}
|
||||
<td>{{ innerItem[0]|e }}</td>
|
||||
{% endfor %}
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
18
SuperScriptViewer/static/templates/help/legend.html
Normal file
18
SuperScriptViewer/static/templates/help/legend.html
Normal file
@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Help - Viewer legend</title>、
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<h1>Viewer legend</h1>
|
||||
<p>This page introduce how to use viewer page.</p>
|
||||
<br />
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|
Reference in New Issue
Block a user