yyc12345/SuperScriptMaterializer
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix viewer backend for convenitnt test and do some frontend work

Browse Source
This commit is contained in:
yyc12345
2022-08-05 14:49:53 +08:00
parent 59c16b2763
commit cd0aafab9f
32 changed files with 401 additions and 464 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
SuperScriptViewer/static/templates/about.html Normal file
View File

@ -0,0 +1,23 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>About Super Script Materializer</title>
</head>
<body>
<h1><img src="{{ static_icon }}" width="64" height="64" style="margin: 0 10px 0 10px;"/>Super Script Materializer</h1>
<p>There are no secret script behind Virtools. Super Script Materializer will destroy all locks and show you the real code.<br />
But Super Script Materializer only show you code. It couldn't analyse the result and touch author's heart and intention. This is your work.<br />
So, let we crack all scripts and destroy close-source illusion.</p>
<br />
<p><a href="https://github.com/yyc12345/SuperScriptMaterializer">SuperScriptMaterializer</a>. All codes are under GPLv3.<br />
Web interface is powered by <a href="https://github.com/pallets/flask">Flask</a>.<br />
Ancestor projects: <a href="https://github.com/BearKidsTeam/VirtoolsScriptDeobfuscation">BearKidsTeam/VirtoolsScriptDeobfuscation</a> and <a href="https://github.com/BearKidsTeam/Script-Materializer">BearKidsTeam/Script-Materializer</a>.<br />
Thank <a href="https://github.com/chirs241097">chirs241097</a> and <a href="https://github.com/instr3">2jjy</a>.</p>
<br />
<p>Current Super Script Materializer version: 1.0</p>
</body>
</html>

31
SuperScriptViewer/static/templates/help.html Normal file
View File

@ -0,0 +1,31 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Super Script Viewer Help</title>
</head>
<body>
<h1>Super Script Viewer Help</h1>
<p>This page is help center, providing useful link for some detailed help page. Choose what you want to use and enter corresponding page.</p>
<br />
<br />
<h2>Converter</h2>
<ul>
<li><a href="/help/converter">Converter</a>: The page containing converter which can convert the data with various style for some convenient operations.</li>
</ul>
<h2>Environment database query</h2>
<ul>
<li><a href="/help/env">Environment data query</a>: The page which can query environment data.</li>
</ul>
<h2>Viewer legend</h2>
<ul>
<li><a href="/help/legend">Viewer legend</a>: The page which introduce how to use viewer page.</li>
</ul>
<br />
<br />
<!-- todo: finish this-->
</body>
</html>

133
SuperScriptViewer/static/templates/help/converter.html Normal file
View 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">&nbsp;</th>
</tr>
<tr>
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv1_I2O();">v</button></td>
<td style="width: 150px;">&nbsp;</td>
<td style="width: 100px;" align="right">&nbsp;</td>
</tr>
<tr>
<th colspan="2">&nbsp;</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">&nbsp;</th>
</tr>
<tr>
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv2_I2O();">v</button></td>
<td style="width: 150px;">&nbsp;</td>
<td style="width: 100px;" align="right"><button style="width: 50px;" onclick="doConv2_O2I();">^</button></td>
</tr>
<tr>
<th colspan="2">&nbsp;</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">&nbsp;</th>
</tr>
<tr>
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv3_I2O();">v</button></td>
<td style="width: 150px;">&nbsp;</td>
<td style="width: 100px;" align="right"><button style="width: 50px;" onclick="doConv3_O2I();">^</button></td>
</tr>
<tr>
<th colspan="2">&nbsp;</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">&nbsp;</th>
</tr>
<tr>
<td style="width: 100px;" align="left"><button style="width: 50px;" onclick="doConv4_I2O();">v</button></td>
<td style="width: 150px;">&nbsp;</td>
<td style="width: 100px;" align="right"><button style="width: 50px;" onclick="doConv4_O2I();">^</button></td>
</tr>
<tr>
<th colspan="2">&nbsp;</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
View 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 }}, &quot;{{ item.queryKey }}&quot;);">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
View 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>

8
SuperScriptViewer/static/templates/index_entry.tmpl Normal file
View File

@ -0,0 +1,8 @@
{% for key, value in scripts.items() %}
<h2>{{ key|e }}</h2>
<ol>
{% for i in value %}
<li><a href="{{ "/viewer/%s"|format(i.id) }}">{{ i.name }}</a></li>
{% endfor %}
</ol>
{% endfor %}

126
SuperScriptViewer/static/templates/viewer.html Normal file
View File

@ -0,0 +1,126 @@
<!DOCTYPE html>
<html style="height: 100%; margin: 0; padding: 0;">
<head>
<meta charset="utf-8">
<title>Script Viewer</title>
<link rel="stylesheet" href="{{viewer_css}}">
<link rel="stylesheet" href="{{tabcontrol_css}}">
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.0/dist/jquery.min.js"></script>
<script src="{{viewer_js}}"></script>
<script src="{{tabcontrol_js}}"></script>
</head>
<body style="display: flex; flex-flow: row; height: 100%; width: 100%; margin: 0; padding: 0;">
<div style="display: flex; flex-flow: column; height: 100%; width: 100%; margin: 0; padding: 0;">
<div style="display: flex; flex-flow: row; width: 100%;">
<div id="hamburgerMenu" style="display: flex; background: #cfcfcf; flex-flow: row; width: 100%; height: 50px; overflow: scroll;">
<p class="hamburger"><a href="/index"><b>Script Hierarchy</b></a></p>
{% for i in hamburgerHistory %}
<p class="hamburger">&gt;&gt;</p>
<p class="hamburger"><a href="{{ "/viewer%s"|format(i.path) }}">{{ i.name|e }}</a></p>
{% endfor %}
<p class="hamburger">&gt;&gt;</p>
<p class="hamburger"><b>{{ hamburgerCurrent|e }}</b></p>
</div>
<button id="sidepanelToggle" style="width: 50px;" title="Toggle sidepanel display" onclick="sidepanelDisplayChange();"></button>
</div>
<div id="graphContainer" style="background: #7f7f7f; width: 100%; height: 100%; overflow: scroll; position: relative;">
<div>
{# blocks content #}
{% for i in blocks %}
<div class="block-body" style="height: {{ i[12] }}px; width: {{ i[11] }}px; top: {{ i[10] }}px; left: {{ i[9] }}px;" ondblclick="queryInfo(1,{{ i[1] }});" onclick="highlightLink({{ i[1] }});">
{% if i[4] != '{}' %}
<div class="block-target" title="{{ "Name: %s\nType: %s"|format(*pinDecoder2(i[4])) }}" style="height: 6px; width: 6px; top: 0; left: 0;" onclick="highlightLink({{ pinDecoder(i[4]).id }});"></div>
{% endif %}
{% for pin in pinDecoder(i[5]) %}
<div class="block-p" title="{{ "Name: %s\nType: %s"|format(pin.name, pin.type) }}" style="height: 6px; width: 6px; top: 0; left: {{ 20 + loop.index0 * ( 6 + 20) }}px;" onclick="highlightLink({{ pin.id }});"></div>
{% endfor %}
{% for pout in pinDecoder(i[6]) %}
<div class="block-p" title="{{ "Name: %s\nType: %s"|format(pout.name, pout.type) }}" style="height: 6px; width: 6px; bottom: 0; left: {{ 20 + loop.index0 * ( 6 + 20) }}px;" onclick="highlightLink({{ pout.id }});"></div>
{% endfor %}
{% for bin in pinDecoder(i[7]) %}
<div class="block-b" title="{{ "Name: %s\nType: %s"|format(bin.name, bin.type) }}" style="height: 6px; width: 6px; top: {{ 10 + loop.index0 * ( 6 + 20) }}px; left: 0;" onclick="highlightLink({{ bin.id }});"></div>
{% endfor %}
{% for bout in pinDecoder(i[8]) %}
<div class="block-b" title="{{ "Name: %s\nType: %s"|format(bout.name, bout.type) }}" style="height: 6px; width: 6px; top: {{ 10 + loop.index0 * ( 6 + 20) }}px; right: 0;" onclick="highlightLink({{ bout.id }});"></div>
{% endfor %}
{% if i[13] != -1 %}
<p class="block-expandable-text" style="top: 10px; left: 20px;"><a href="{{ "/viewer/%s/%s"|format(currentPath, i[13]) }}">{{ i[2]|e }}</a></p>
{% else %}
<p class="block-text" style="top: 10px; left: 20px;">{{ i[2]|e }}</p>
{% endif %}
<p class="block-asstext" style="top: 24px; left: 20px;">{{ i[3]|e }}</p>
</div>
{% endfor %}
{# cells content #}
{% for i in cells %}
<div class="{% if i[6] == 0 %}cell-plocal{% elif i[6] == 1 %}cell-shortcut{% elif i[6] == 2 %}cell-pio{% elif i[6] == 3 %}cell-bio{% else %}cell-ptarget{% endif %}"
style="height: {% if i[6] == 2 or i[6] == 3 %}6{% else %}5{% endif %}px; width: {% if i[6] == 2 or i[6] == 3 %}6{% else %}15{% endif %}px; top: {{ i[5] }}px; left: {{ i[4] }}px;"
title="{{ "Name: %s\nType: %s"|format(i[2], i[3]) }}" ondblclick="queryInfo(0,{{ i[1] }});" onclick="highlightLink({{ i[1] }});"></div>
{% endfor %}
<svg version="1.1" width="{{ gWidth }}px" height="{{ gHeight }}px" style="position: absolute; top: 0; left: 0;pointer-events: none;">
{# links content #}
{% for i in links %}
{% if i[1] == -2 %}
<line class="link-elink target{{ i[2] }} target{{ i[3] }} target{{ i[4] }} target{{ i[5] }}" x1="{{ i[10] }}" y1="{{ i[11] }}" x2="{{ i[12] }}" y2="{{ i[13] }}" stroke="cyan" stroke-width="1px" stroke-dasharray="5, 1"></line>
{% elif i[1] == -1 %}
<line class="link-plink target{{ i[2] }} target{{ i[3] }} target{{ i[4] }} target{{ i[5] }}" x1="{{ i[10] }}" y1="{{ i[11] }}" x2="{{ i[12] }}" y2="{{ i[13] }}" stroke="blue" stroke-width="1px" stroke-dasharray="5, 1"></line>
{% else %}
<line class="link-blink target{{ i[2] }} target{{ i[3] }} target{{ i[4] }} target{{ i[5] }}" x1="{{ i[10] }}" y1="{{ i[11] }}" x2="{{ i[12] }}" y2="{{ i[13] }}" stroke="black" stroke-width="1px"></line>
<text class="link-blinkDelay target{{ i[2] }} target{{ i[3] }} link-delay target{{ i[4] }} target{{ i[5] }}" x="{{ (i[10] + i[12]) / 2 }}" y="{{ (i[11] + i[13]) / 2 }}" fill="black">{{ i[1] }}</text>
{% endif %}
{% endfor %}
</svg>
</div>
</div>
</div>
<div id="sidepanelContainer" style="display: flex; flex-flow: column; background: #cfcfcf; height: 100%; width: 25%; margin: 0; padding: 0; border-left: 1px solid black;">
<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%; width: 33.33%; text-align: center;" onclick="tabControlSwitcher(1, 1);"><b style="margin: 0;">Properties</b></div>
<div id="tabnavigation_1_2" class="tabnavigation_1 tabitem-deactivated" style="height: 100%; width: 33.33%; text-align: center;" onclick="tabControlSwitcher(1, 2);"><b style="margin: 0;">Display</b></div>
<div id="tabnavigation_1_3" class="tabnavigation_1 tabitem-deactivated" style="height: 100%; width: 33.33%; text-align: center;" onclick="tabControlSwitcher(1, 3);"><b style="margin: 0;">Tools</b></div>
</div>
<div id="tabpanel_1_1" class="tabpanel_1" style="display: flex; flex-flow: column;width: 100%; height: 100%; display: flex; flex-flow: column; overflow-x: hidden;">
<p style="margin: 5px;" id="sidepanel-properties-target">Selected target: <b></b></p>
<div id="sidepanel-properties-container" style="width: 100%; height: 100%; overflow: scroll;">
</div>
</div>
<div id="tabpanel_1_2" class="tabpanel_1" id="sidepanel-display" style="width: 100%; height: 100%; display: flex; flex-flow: column; overflow: scroll; overflow-x: hidden; display: none;">
<p style="margin: 5px;">Render:<br />
<input type="checkbox" id="sidepanel-display-plink" value="1" onclick="settingChange(&quot;plink&quot;);">Show pLink and eLink</input>
</p>
<p style="margin: 5px;">Action:<br />
<input type="checkbox" id="sidepanel-display-properties" value="1" onclick="settingChange(&quot;properties&quot;);">Interactive property inspector</input><br />
<input type="checkbox" id="sidepanel-display-highlight" value="1" onclick="settingChange(&quot;highlight&quot;);">Highlight focused object</input><br />
<input type="checkbox" id="sidepanel-display-move" value="1" onclick="settingChange(&quot;move&quot;);" disabled="true">Move objects</input>
</p>
</div>
<div id="tabpanel_1_3" class="tabpanel_1" style="width: 100%; height: 100%; display: flex; flex-flow: column; overflow: scroll; overflow-x: hidden; display: none;">
<p style="margin: 5px;">Object finder:<br />
<input type="text" id="sidepanel-tools-objfinder" disabled="true"></input><br />
<button style="height: 30px; margin: 10px 0 10px 0;" disabled="true">Find</button>
</p>
<p style="margin: 5px;">Misc:<br />
<button style="height: 30px; margin: 10px 0 10px 0;" onclick="window.open(&quot;/help&quot;);">Help</button><br />
<button style="height: 30px; margin: 10px 0 10px 0;" onclick="window.open(&quot;/about&quot;);">About</button>
</p>
</div>
</div>
</body>
</html>