2020-04-03 23:57:36 +08:00
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html style="height: 100%; margin: 0; padding: 0;">
|
|
|
|
|
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8">
|
|
|
|
|
<title>Script Viewer</title>
|
2020-04-09 11:21:52 +08:00
|
|
|
<link rel="stylesheet" href="{{static_css}}">
|
2020-04-13 09:46:01 +08:00
|
|
|
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.0/dist/jquery.min.js"></script>
|
2020-04-09 11:21:52 +08:00
|
|
|
<script src="{{static_js}}"></script>
|
2020-04-03 23:57:36 +08:00
|
|
|
</head>
|
|
|
|
|
|
2020-05-02 15:10:08 +08:00
|
|
|
<body style="display: flex; flex-flow: row; height: 100%; width: 100%; margin: 0; padding: 0;" onkeydown="keyboardNavigation(true);" onkeyup="keyboardNavigation(false);">
|
2020-04-17 23:31:27 +08:00
|
|
|
<div style="display: flex; flex-flow: column; height: 100%; width: 80%; margin: 0; padding: 0;">
|
2020-04-23 22:54:37 +08:00
|
|
|
<div id="hamburgerMenu" style="display: flex; background: #cfcfcf; flex-flow: row; width: 100%; height: 50px; overflow: scroll;">
|
2020-04-03 23:57:36 +08:00
|
|
|
|
2020-04-18 12:49:48 +08:00
|
|
|
<p class="hamburger"><a href="/index"><b>Script Hierarchy</b></a></p>
|
2020-04-03 23:57:36 +08:00
|
|
|
|
2020-04-09 11:21:52 +08:00
|
|
|
{% for i in hamburgerHistory %}
|
|
|
|
|
<p class="hamburger">>></p>
|
2020-04-18 12:49:48 +08:00
|
|
|
<p class="hamburger"><a href="{{ "/viewer%s"|format(i.path) }}">{{ i.name|e }}</a></p>
|
2020-04-09 11:21:52 +08:00
|
|
|
{% endfor %}
|
2020-04-03 23:57:36 +08:00
|
|
|
|
2020-04-09 11:21:52 +08:00
|
|
|
<p class="hamburger">>></p>
|
|
|
|
|
<p class="hamburger"><b>{{ hamburgerCurrent|e }}</b></p>
|
2020-04-05 22:34:11 +08:00
|
|
|
|
2020-04-03 23:57:36 +08:00
|
|
|
</div>
|
2020-04-17 23:31:27 +08:00
|
|
|
|
2020-04-23 22:54:37 +08:00
|
|
|
<div id="graphContainer" style="background: #7f7f7f; width: 100%; height: 100%; overflow: scroll; position: relative;">
|
2020-04-17 23:31:27 +08:00
|
|
|
<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;" 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 %}
|
2020-04-18 12:49:48 +08:00
|
|
|
<p class="block-expandable-text" style="top: 10px; left: 20px;"><a href="{{ "/viewer/%s/%s"|format(currentPath, i[13]) }}">{{ i[2]|e }}</a></p>
|
2020-04-17 23:31:27 +08:00
|
|
|
{% 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>
|
2020-04-09 11:21:52 +08:00
|
|
|
{% endfor %}
|
2020-04-17 23:31:27 +08:00
|
|
|
|
|
|
|
|
{# 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({{ i[1] }});" onclick="highlightLink({{ i[1] }});"></div>
|
2020-04-09 11:21:52 +08:00
|
|
|
{% endfor %}
|
|
|
|
|
|
2020-04-17 23:31:27 +08:00
|
|
|
<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>
|
2020-04-05 22:34:11 +08:00
|
|
|
</div>
|
2020-04-03 23:57:36 +08:00
|
|
|
</div>
|
2020-04-13 12:35:41 +08:00
|
|
|
</div>
|
2020-04-17 23:31:27 +08:00
|
|
|
|
2020-04-23 22:54:37 +08:00
|
|
|
<div id="sidepanelContainer" style="display: flex; flex-flow: column; background: #cfcfcf; height: 100%; width: 20%; margin: 0; padding: 0; border-left: 1px solid black;">
|
2020-04-17 23:31:27 +08:00
|
|
|
<div style="display: flex; flex-flow: row; height: 30px; width: 100%; margin: 0; padding: 0; border-bottom: 1px solid black;">
|
|
|
|
|
<div class="tabitem tabitem1 tabitem-activated" style="height: 100%; width: 33.33%; text-align: center;" onclick="sidePanelSwitcher(0);"><b style="margin: 0;" class="tabitem tabitem1 tabitem-activated">Properties</b></div>
|
|
|
|
|
<div class="tabitem tabitem2 tabitem-deactivated" style="height: 100%; width: 33.33%; text-align: center;" onclick="sidePanelSwitcher(1);"><b style="margin: 0;" class="tabitem tabitem2 tabitem-deactivated">Display</b></div>
|
|
|
|
|
<div class="tabitem tabitem3 tabitem-deactivated" style="height: 100%; width: 33.33%; text-align: center;" onclick="sidePanelSwitcher(2);"><b style="margin: 0;" class="tabitem tabitem3 tabitem-deactivated">Tools</b></div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="sidepanel-properties" style="display: flex; flex-flow: column;width: 100%; height: 100%; display: flex; flex-flow: column;">
|
|
|
|
|
<p style="margin: 5px;">Properties of <b id="sidepanel-properties-id">---</b></p>
|
|
|
|
|
<div id="sidepanel-properties-container" style="width: 100%; height: 100%; overflow: scroll;">
|
2020-04-13 12:35:41 +08:00
|
|
|
</div>
|
2020-04-17 23:31:27 +08:00
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="sidepanel-display" style="width: 100%; height: 100%; display: flex; flex-flow: column; overflow: scroll; display: none;">
|
|
|
|
|
<p style="margin: 5px;">Render:<br />
|
2020-04-18 12:49:48 +08:00
|
|
|
<input type="checkbox" id="sidepanel-display-plink" value="1" onclick="settingChange("plink");">Show pLink and eLink</input>
|
2020-04-17 23:31:27 +08:00
|
|
|
</p>
|
|
|
|
|
<p style="margin: 5px;">Action:<br />
|
2020-04-18 12:49:48 +08:00
|
|
|
<input type="checkbox" id="sidepanel-display-properties" value="1" onclick="settingChange("properties");">Interactive property inspector</input><br />
|
|
|
|
|
<input type="checkbox" id="sidepanel-display-highlight" value="1" onclick="settingChange("highlight");">Highlight focused object</input><br />
|
2020-05-02 15:10:08 +08:00
|
|
|
<input type="checkbox" id="sidepanel-display-move" value="1" onclick="settingChange("move");" disabled="true">Move objects</input>
|
2020-04-17 23:31:27 +08:00
|
|
|
</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="sidepanel-tools" style="width: 100%; height: 100%; display: flex; flex-flow: column; overflow: scroll; display: none;">
|
|
|
|
|
<p style="margin: 5px;">Object finder:<br />
|
|
|
|
|
<input type="text" id="sidepanel-tools-objfinder"></input><br />
|
|
|
|
|
<button style="height: 30px; margin: 10px 0 10px 0;">Find</button>
|
|
|
|
|
</p>
|
|
|
|
|
<p style="margin: 5px;">Misc:<br />
|
2020-04-18 12:49:48 +08:00
|
|
|
<button style="height: 30px; margin: 10px 0 10px 0;" onclick="window.open("/help");">Help</button><br />
|
|
|
|
|
<button style="height: 30px; margin: 10px 0 10px 0;" onclick="window.open("/about");">About</button>
|
2020-04-17 23:31:27 +08:00
|
|
|
</p>
|
2020-04-13 12:35:41 +08:00
|
|
|
</div>
|
2020-04-03 23:57:36 +08:00
|
|
|
</div>
|
2020-04-17 23:31:27 +08:00
|
|
|
|
2020-04-03 23:57:36 +08:00
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|
