GDBrowser/html/analyze.html
GDColon 30be2d1d61 More analysis features + optimizations
- Modules are now required BEFORE exports
- Added object count to level analysis
- Added option to hide duplicate portals in analysis
- Removed LOADMODULES.js because it's gross
2019-10-16 18:47:53 -04:00

182 lines
No EOL
8.8 KiB
HTML

<head>
<title>Level Analysis</title>
<meta charset="utf-8">
<meta property="og:type" content="website">
<meta id="meta-title" property="og:title" content="Level Analysis">
<meta id="meta-desc" property="og:description" content="Analyze a Geometry Dash level and view it's objects, portals, color channels, code, and more!">
<meta id="meta-image" name="og:image" itemprop="image" content="https://gdbrowser.com/assets/cp.png">
<link href="../assets/level.css" type="text/css" rel="stylesheet">
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-135255146-3"></script><script>window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);}gtag('js', new Date());gtag('config', 'UA-135255146-3');</script>
<link rel="icon" href="../assets/cp.png">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.js"></script>
<script async type="text/javascript" src="../assets/sizecheck.js"></script>
</head>
<body class="levelBG" style="overflow-y:auto;">
<div id="everything" class="center">
<div class="supercenter" id="loadingDiv" style="height:50%">
<h1 style="transform:scale(1.2)">Analyzing level...</h1>
<img class="spin noSelect" src="../assets/loading.png" height="25%" style="margin-top: 7%">
</div>
<div id="analysisDiv" style="margin-top: 2%; display:none">
<h2 id="levelName"></h2>
<h3 id="objectCount"></h3>
<h1 class="topMargin">Portal order</h1>
<div class="transparentBox analysis" id="portals"></div>
<div>
<div class="portalSetting"><h3><input checked type="checkbox" class="portalToggle" id="box1" portal="form"> <label for="box1" class="gdcheckbox gdButton portalButton"></label>Form Portals</h3></div>
<div class="portalSetting"><h3><input checked type="checkbox" class="portalToggle" id="box2" portal="size"> <label for="box2" class="gdcheckbox gdButton portalButton"></label>Size Portals</h3></div>
<div class="portalSetting"><h3><input checked type="checkbox" class="portalToggle" id="box3" portal="speed"><label for="box3" class="gdcheckbox gdButton portalButton"></label>Speed Portals</h3></div>
<br><div style="height: 1.5%"></div>
<div class="portalSetting"><h3><input checked type="checkbox" class="portalToggle" id="box4" portal="mirror"><label for="box4" class="gdcheckbox gdButton portalButton"></label>Mirror Portals</h3></div>
<div class="portalSetting"><h3><input checked type="checkbox" class="portalToggle" id="box5" portal="dual"> <label for="box5" class="gdcheckbox gdButton portalButton"></label>Dual Portals</h3></div>
<div class="portalSetting"><h3><input checked type="checkbox" class="portalToggle" id="box6" portal="dupe"> <label for="box6" class="gdcheckbox gdButton portalButton"></label>Duplicates</h3></div>
</div>
<h1 class="topMargin2" id="triggerText">Triggers</h1>
<div class="transparentBox analysis" id="triggers"></div>
<h1 class="topMargin2" id="orbText">Jump Rings</h1>
<div class="transparentBox analysis" id="orbs"></div>
<h1 class="topMargin2">Block Types</h1>
<div class="transparentBox analysis" id="blocks"></div>
<h1 class="topMargin2">Misc Objects</h1>
<div class="transparentBox analysis" id="misc" style="height: 25%"></div>
<h1 class="topMargin2">Color Channels</h1>
<div class="transparentBox analysis" id="colorDiv"></div>
<h1 class="topMargin2">Level Data</h1>
<div class="transparentBox levelCode" id="levelCode">
<p class="menuLink" id="revealCode">Reveal level data</p>
<p id="codeLength"></p>
</div>
<div style="height: 7%"></div>
</div>
<div style="position:absolute; top: 2%; left: -1.95%; width: 10%; height: 25%; pointer-events: none">
<img class="gdButton yesClick" id="backButton" src="../assets/back.png" height="30%" onclick="backButton()">
</div>
</div>
</body>
<script>
let disabledPortals = []
let formPortals = ['cube', 'ship', 'ball', 'ufo', 'wave', 'robot', 'spider']
let speedPortals = ['-1x', '1x', '2x', '3x', '4x']
let sizePortals = ['mini', 'big']
let dualPortals = ['dual', 'single']
let mirrorPortals = ['mirrorOn', 'mirrorOff']
fetch(`../api${window.location.pathname}`).then(res => res.json()).then(res => {
if (!res.level) return window.location.href = window.location.href.replace("analyze", "search")
$('#levelName').text(res.level.name)
$('#objectCount').text(res.objects + " objects")
document.title = "Analysis of " + res.level.name
$('#meta-title').attr('content', "Analysis of " + res.level.name)
$('#meta-desc').attr('content', `${res.portals.split(",").length}x portals, ${res.orbs.total || 0}x orbs, ${res.triggers.total || 0}x triggers, ${res.misc.glow || 0}x glow...`)
let triggerList = Object.keys(res.triggers)
let orbList = Object.keys(res.orbs)
let miscList = Object.keys(res.misc)
let blockList = Object.keys(res.blocks)
let colorList = Object.keys(res.colors)
let portals = res.portals.split(", ")
function appendPortals() {
$('#portals').html("")
if (res.settings.gamemode && res.settings.gamemode != "cube" && !disabledPortals.includes('form')) $('#portals').append(`<img class="portalImage" src="../objects/portal-${res.settings.gamemode}.png" style="margin: 1.3% 0.8%"><img class="divider portalImage" src="../assets/divider.png" style="margin: 1.3% 0.8%">`)
if (res.settings.speed && res.settings.speed != "1x" && !disabledPortals.includes('speed')) $('#portals').append(`<img class="portalImage speedPortal" src="../objects/portal-${res.settings.speed}.png" style="margin: 2% 0.8%"><img class="divider portalImage" src="../assets/divider.png" style="margin: 1.3% 0.8%">`)
let dividerCount = $('.divider').length - 1
$('.divider').each(function(y) {
if (y != dividerCount) $(this).remove()
})
portals.forEach(x => {
if (!x || x == "") return;
$('#portals').append(`<img class="portalImage ${x.match(/[0-9]x/) ? "speedPortal" : ""}" src='../objects/portal-${x}.png'>`)}
)}
appendPortals()
triggerList.forEach(x => {
if (x == "total") $('#triggerText').text(`Triggers (${res.triggers[x]})`)
else $('#triggers').append(`<div class="inline triggerDiv"><img height="50%" src='../objects/trigger-${x}.png'><h3 style="padding-top: 7%">x${res.triggers[x]}</h3></div>`)
})
orbList.forEach(x => {
if (x == "total") $('#orbText').text(`Jump Rings (${res.orbs[x]})`)
else $('#orbs').append(`<div class="inline orbDiv"><img height="50%" src='../objects/orb-${x}.png'><h3 style="padding-top: 7%">x${res.orbs[x]}</h3></div>`)
})
blockList.forEach(x => {
$('#blocks').append(`<div class="inline blockDiv"><img height="45%" src='../blocks/${x}.png'><h3 style="padding-top: 15%">x${res.blocks[x]}</h3></div>`)
})
miscList.forEach(x => {
if (x == "objects") return;
else $('#misc').append(`<div class="inline miscDiv"><img height="40%" src='../objects/obj-${x.slice(0, -1)}.png'><h3 style="padding-top: 15%">x${res.misc[x][0]}<br>${res.misc[x][1]}</h3></div>`)
})
colorList.forEach((x, y) => {
let c = res.colors[x]
$('#colorDiv').append(`${y % 8 == 0 ? "<brr>" : ""}<div class="inline aColor"><div style="background-color: rgba(${c.r}, ${c.g}, ${c.b}, ${c.opacity}); border: 0.4vh solid rgb(${c.r}, ${c.g}, ${c.b})">
${c.copiedChannel ? `<h3 class='copiedColor'>C:${c.copiedChannel}</h3>` : c.pColor ? `<h3 class='copiedColor'>P${c.pColor}</h3>` : c.blending ? "<h3 class='blendingDot'>•</h3>" : ""}
${c.opacity != "1" ? `<h3 class='copiedColor'>${c.opacity}%</h3>` : ""}
</div><h3 style="padding-top: 7%">${c.channel > 0 ? "Col " + c.channel : c.channel}</h3></div>`)
})
if (colorList.length == 0) $('#colorDiv').append('<h3 style="margin-top: 7vh">Level is too old to get color info!</h3>')
$(".portalToggle").click(function() {
if ($(this).prop('checked')) disabledPortals = disabledPortals.filter(x => x != $(this).attr('portal'))
else disabledPortals.push($(this).attr('portal'))
portals = res.portals.split(", ")
if (disabledPortals.includes('form')) portals = portals.filter(x => !formPortals.includes(x))
if (disabledPortals.includes('speed')) portals = portals.filter(x => !speedPortals.includes(x))
if (disabledPortals.includes('size')) portals = portals.filter(x => !sizePortals.includes(x))
if (disabledPortals.includes('dual')) portals = portals.filter(x => !dualPortals.includes(x))
if (disabledPortals.includes('mirror')) portals = portals.filter(x => !mirrorPortals.includes(x))
if (disabledPortals.includes('dupe')) {
portals.forEach((x, y) => {if (portals[y+1] && portals[y+1] == x) portals[y] = null;})
portals = portals.filter(x => x != null)
}
appendPortals()
})
$('#codeLength').html(`(${res.dataLength} characters)`)
$('#revealCode').click(function() {
$('#levelCode').html('<p>Loading...</p>')
window.setTimeout(function () { //small delay so "loading" message appears
$('#levelCode').html(`<p class="codeFont">${res.data}</p>`)}, 50);
$('#levelCode').focus().select()
})
$('#loadingDiv').hide()
$('#analysisDiv').show()
})
</script>