<head> <link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,700|Roboto:400,700" rel="stylesheet"> <link href='../style.css' rel='stylesheet' type='text/css'> <title>CenterValues Results</title> <link rel="icon" type="x-icon" href="hardicon.png"> <link rel="shortcut icon" type="x-icon" href="hardicon.png"> <meta charset="utf-8"> <script> version = "Test Edition #1" </script> </head> <script type="application/javascript" src="../ideologies.js"> // Will it work if there are more axes tho </script> <body> <h1>CenterValues</h1> <hr> <h1>Results</h1> <h2>Theoretic Axis: <span class="weight-300" id="Theoretic-label"></span></h2> <div class="axis"> <img id="img-axes" src="../value-images/IconAxes.png" height="128pt"/> <div class="bar axes" id="bar-axes"><div class="text-wrapper" id="axes"></div></div> <div class="bar horseshoe" id="bar-horseshoe"><div class="text-wrapper" id="horseshoe"></div></div> <img id="img-horseshoe" src="../value-images/IconSame.png" height="128pt"/> </div> <h2>Beliefal Axis: <span class="weight-300" id="Beliefal-label"></span></h2> <div class="axis"> <img id="img-moderate" src="../value-images/IconMod.png" height="128pt"/> <div class="bar moderate" id="bar-moderate"><div class="text-wrapper" id="moderate"></div></div> <div class="bar radical" id="bar-radical"><div class="text-wrapper" id="radical"></div></div> <img id="img-radical" src="../value-images/IconRad.png" height="128pt"/> </div> <h2>Politic Axis: <span class="weight-300" id="Politic-label"></span></h2> <div class="axis"> <img id="img-political" src="../value-images/IconPol.png" height="128pt"/> <div class="bar political" id="bar-political"><div class="text-wrapper" id="political"></div></div> <div class="bar apolitical" id="bar-apolitical"><div class="text-wrapper" id="apolitical"></div></div> <img id="img-apolitical" src="../value-images/IconApol.png" height="128pt"/> </div> <h2>Coordinatic Axis: <span class="weight-300" id="Coordinatic-label"></span></h2> <div class="axis"> <img id="img-dead" src="../value-images/IconDead.png" height="128pt"/> <div class="bar dead" id="bar-dead"><div class="text-wrapper" id="dead"></div></div> <div class="bar leaning" id="bar-leaning"><div class="text-wrapper" id="leaning"></div></div> <img id="img-leaning" src="../value-images/IconLean.png" height="128pt"/> </div> <h2>Wing Axis: <span class="weight-300" id="Wing-label"></span></h2> <div class="axis"> <img id="img-leftist" src="../value-images/IconLeft.png" height="128pt"/> <div class="bar leftist" id="bar-leftist"><div class="text-wrapper" id="leftist"></div></div> <div class="bar rightist" id="bar-rightist"><div class="text-wrapper" id="rightist"></div></div> <img id="img-rightist" src="../value-images/IconRite.png" height="128pt"/> </div> <h2>Govermental Axis: <span class="weight-300" id="Govermental-label"></span></h2> <div class="axis"> <img id="img-statist" src="../value-images/IconUp.png" height="128pt"/> <div class="bar statist" id="bar-statist"><div class="text-wrapper" id="statist"></div></div> <div class="bar liberal" id="bar-liberal"><div class="text-wrapper" id="liberal"></div></div> <img id="img-liberal" src="../value-images/IconDown.png" height="128pt"/> </div> <h2>Diagonal Axis: <span class="weight-300" id="Diagonal-label"></span></h2> <div class="axis"> <img id="img-anfash" src="../value-images/IconAnfa.png" height="128pt"/> <div class="bar anfash" id="bar-anfash"><div class="text-wrapper" id="anfash"></div></div> <div class="bar capcom" id="bar-capcom"><div class="text-wrapper" id="capcom"></div></div> <img id="img-capcom" src="../value-images/IconCpcm.png" height="128pt"/> </div> <h2>Food Preference Axis: <span class="weight-300" id="Food-label"></span></h2> <div class="axis"> <img id="img-vegan" src="../value-images/IconVeg.png" height="128pt"/> <div class="bar vegan" id="bar-vegan"><div class="text-wrapper" id="vegan"></div></div> <div class="bar meat" id="bar-meat"><div class="text-wrapper" id="meat"></div></div> <img id="img-meat" src="../value-images/IconMeat.png" height="128pt"/> </div> <h2>Healthiness Axis: <span class="weight-300" id="Healthiness-label"></span></h2> <div class="axis"> <img id="img-healthy" src="../value-images/IconHeal.png" height="128pt"/> <div class="bar healthy" id="bar-healthy"><div class="text-wrapper" id="healthy"></div></div> <div class="bar junk" id="bar-junk"><div class="text-wrapper" id="junk"></div></div> <img id="img-junk" src="../value-images/IconJunk.png" height="128pt"/> </div> <h2>Smartness Axis: <span class="weight-300" id="Smartness-label"></span></h2> <div class="axis"> <img id="img-smart" src="../value-images/IconSmrt.png" height="128pt"/> <div class="bar smart" id="bar-smart"><div class="text-wrapper" id="smart"></div></div> <div class="bar strong" id="bar-strong"><div class="text-wrapper" id="strong"></div></div> <img id="img-strong" src="../value-images/IconStrn.png" height="128pt"/> </div> <h2>Speed Axis: <span class="weight-300" id="Speed-label"></span></h2> <div class="axis"> <img id="img-fast" src="../value-images/IconFast.png" height="128pt"/> <div class="bar fast" id="bar-fast"><div class="text-wrapper" id="fast"></div></div> <div class="bar patient" id="bar-patient"><div class="text-wrapper" id="patient"></div></div> <img id="img-patient" src="../value-images/IconSlow.png" height="128pt"/> </div> <h2>Closest Match: <span class="weight-300" id="ideology-label"></span></h2> <p>Ideological matching is a work in progress, and is even less accurate than the values and axes.</p> <hr/> <img src="" id="banner"> <button class="button" onclick="location.href='../index.html';" style="background-color: #2196f3;">Back</button> <br> <!-- Website visit statistics - no personal information is collected! --> <script type="text/javascript"> var sc_project=11325211; var sc_invisible=1; var sc_security="fd9f0659"; var scJsHost = (("https:" == document.location.protocol) ? "https://secure." : "http://www."); document.write("<sc"+"ript type='text/javascript' src='" + scJsHost+ "statcounter.com/counter/counter.js'></"+"script>"); </script> <noscript><div class="statcounter"><a title="web stats" href="http://statcounter.com/" target="_blank"><img class="statcounter" src="//c.statcounter.com/11325211/0/fd9f0659/1/" alt="web stats"></a></div></noscript> <script> function getQueryVariable(variable) { var query = window.location.search.substring(1) var vars = query.split("&") for (var i=0;i<vars.length;i++) { var pair = vars[i].split("=") if(pair[0] == variable) {return pair[1]} } return(NaN); } function setBarValue(name, value) { innerel = document.getElementById(name) outerel = document.getElementById("bar-" + name) outerel.style.width = (value + "%") innerel.innerHTML = (value + "%") if (innerel.offsetWidth + 20 > outerel.offsetWidth) { innerel.style.visibility = "hidden" } } therArray = ["Even Jreg is afraid","100axes Theorist","9axes Theorist","Political Compass Theorist","Single Axis Theory","Horseshoe Theorist","Donut Theorist","Everyone's stupid but me","Reached the truth"] belfArray = ["Extreme Moderacy","Spineless","Anti-Radical","Cute","Overtonic","Semi-Radical","Radical","Every Extreme","Unreal"] polcArray = ["Based","Politician","Serious","Educated","Medium-rare","Unflaired","Apolitical","Griller","Post-political"] cordArray = ["Heavenly","Requiem","Dead","Balanced","The 0.5","Slightly Leaning","Edgy","Extremist","Off-compass"] wingArray = ["Communalist","Sinistral","Communist","Socialist","Fucking guess","Conservative","Capitalist","Dextral","Darwinist"] govtArray = ["Ingsoc","Totalitarian","Authoritarian","Upwards leaning","AuthLib","Downwards leaning","Minarchist","Anarchist","Egoist"] diagArray = ["Tumblrist","Anfash Gang","Anarcho-Monarchist","Democrat","Undiagonal","Philantropist","Chinese Communist","Capcom Gang","Hive-Mind Avaritionist"] voreArray = ["Photosynthesis","Vegan","Veganist","Veggie-lover","Omnivore","Hot Dogs","Meat-Eater","Raw Meat-Eater","Cannibal"] helfArray = ["Superhuman","Very Healthy","Healthy","Almost Healthy","Slightly Unhealthy","Unhealthy","Very Unhealthy","Diseased","Walking Corpse"] smrtArray = ["Megamind","Understands Rick&Morty","Very Smart","Smart","Basic","Athletic","Strong","Bodybuilder","Titan"] spedArray = ["Accelerationist","Superspeed","Fast","Normal Speed","Slow","Lazy","Frozen","Petrified","Stopped Thinking"] function setLabel(val,ary) { if (val > 100) { return ary[0] } else if (val > 90) { return ary[1] } else if (val > 75) { return ary[2] } else if (val > 60) { return ary[3] } else if (val >= 40) { return ary[4] } else if (val >= 25) { return ary[5] } else if (val >= 10) { return ary[6] } else if (val >= 0) { return ary[7] } else {return ary[8]} } axes = getQueryVariable("a") moderate = getQueryVariable("l") political = getQueryVariable("b") dead = getQueryVariable("m") leftist = getQueryVariable("c") statist = getQueryVariable("d") anfash = getQueryVariable("o") vegan = getQueryVariable("e") healthy = getQueryVariable("f") smart = getQueryVariable("g") fast = getQueryVariable("n") horseshoe = (100 - axes).toFixed(1) radical = (100 - moderate).toFixed(1) apolitical = (100 - political).toFixed(1) leaning = (100 - dead).toFixed(1) rightist = (100 - leftist).toFixed(1) liberal = (100 - statist).toFixed(1) capcom = (100 - anfash).toFixed(1) meat = (100 - vegan).toFixed(1) junk = (100 - healthy).toFixed(1) strong = (100 - smart).toFixed(1) patient = (100 - fast).toFixed(1) setBarValue("axes", axes) setBarValue("horseshoe", horseshoe) setBarValue("radical", radical) setBarValue("moderate", moderate) setBarValue("political", political) setBarValue("apolitical", apolitical) setBarValue("leaning", leaning) setBarValue("dead", dead) setBarValue("leftist", leftist) setBarValue("rightist", rightist) setBarValue("statist", statist) setBarValue("liberal", liberal) setBarValue("anfash", anfash) setBarValue("capcom", capcom) setBarValue("vegan", vegan) setBarValue("meat", meat) setBarValue("healthy", healthy) setBarValue("junk", junk) setBarValue("smart", smart) setBarValue("strong", strong) setBarValue("fast", fast) setBarValue("patient", patient) document.getElementById("Theoretic-label").innerHTML = setLabel(axes, therArray) document.getElementById("Beliefal-label").innerHTML = setLabel(moderate, belfArray) document.getElementById("Politic-label").innerHTML = setLabel(political, polcArray) document.getElementById("Coordinatic-label").innerHTML = setLabel(dead, cordArray) document.getElementById("Wing-label").innerHTML = setLabel(leftist, wingArray) document.getElementById("Govermental-label").innerHTML = setLabel(statist, govtArray) document.getElementById("Diagonal-label").innerHTML = setLabel(anfash, diagArray) document.getElementById("Food-label").innerHTML = setLabel(vegan, voreArray) document.getElementById("Healthiness-label").innerHTML = setLabel(healthy, helfArray) document.getElementById("Smartness-label").innerHTML = setLabel(smart, smrtArray) document.getElementById("Speed-label").innerHTML = setLabel(fast, spedArray) ideology = "" ideodist = Infinity for (var i = 0; i < ideologies.length; i++) { dist = 0 dist += Math.pow(Math.abs(ideologies[i].stats.ther - axes), 2) dist += Math.pow(Math.abs(ideologies[i].stats.belf - moderate), 2) dist += Math.pow(Math.abs(ideologies[i].stats.polc - political), 2) dist += Math.pow(Math.abs(ideologies[i].stats.cord - dead), 2) if (dist < ideodist) { ideology = ideologies[i].name ideodist = dist } } document.getElementById("ideology-label").innerHTML = ideology function createImage(src, x, y, w, h) { img = new Image () img.src = src img.onLoad = function() { ctx.drawImage(img, x, y, w, h) } } window.onload = function() { var c = document.createElement("canvas") var ctx = c.getContext("2d") c.width = 800; c.height = 1490; ctx.fillStyle = "#EEEEEE" ctx.fillRect(0,0,800,1490); img = document.getElementById("img-axes") ctx.drawImage(img, 20, 170, 100, 100); img = document.getElementById("img-horseshoe") ctx.drawImage(img, 680, 170, 100, 100) img = document.getElementById("img-moderate") ctx.drawImage(img, 20, 290, 100, 100) img = document.getElementById("img-radical") ctx.drawImage(img, 680, 290, 100, 100) img = document.getElementById("img-political") ctx.drawImage(img, 20, 410, 100, 100) img = document.getElementById("img-apolitical") ctx.drawImage(img, 680, 410, 100, 100) img = document.getElementById("img-dead") ctx.drawImage(img, 20, 530, 100, 100) img = document.getElementById("img-leaning") ctx.drawImage(img, 680, 530, 100, 100) img = document.getElementById("img-leftist") ctx.drawImage(img, 20, 650, 100, 100) img = document.getElementById("img-rightist") ctx.drawImage(img, 680, 650, 100, 100) img = document.getElementById("img-statist") ctx.drawImage(img, 20, 770, 100, 100) img = document.getElementById("img-liberal") ctx.drawImage(img, 680, 770, 100, 100) img = document.getElementById("img-anfash") ctx.drawImage(img, 20, 890, 100, 100) img = document.getElementById("img-capcom") ctx.drawImage(img, 680, 890, 100, 100) img = document.getElementById("img-vegan") ctx.drawImage(img, 20, 1010, 100, 100) img = document.getElementById("img-meat") ctx.drawImage(img, 680, 1010, 100, 100) img = document.getElementById("img-healthy") ctx.drawImage(img, 20, 1130, 100, 100) img = document.getElementById("img-junk") ctx.drawImage(img, 680, 1130, 100, 100) img = document.getElementById("img-smart") ctx.drawImage(img, 20, 1250, 100, 100) img = document.getElementById("img-strong") ctx.drawImage(img, 680, 1250, 100, 100) img = document.getElementById("img-fast") ctx.drawImage(img, 20, 1370, 100, 100) img = document.getElementById("img-patient") ctx.drawImage(img, 680, 1370, 100, 100) ctx.fillStyle="#222222" ctx.fillRect(120, 180, 560, 80) ctx.fillRect(120, 300, 560, 80) ctx.fillRect(120, 420, 560, 80) ctx.fillRect(120, 540, 560, 80) ctx.fillRect(120, 660, 560, 80) ctx.fillRect(120, 780, 560, 80) ctx.fillRect(120, 900, 560, 80) ctx.fillRect(120, 1020, 560, 80) ctx.fillRect(120, 1140, 560, 80) ctx.fillRect(120, 1260, 560, 80) ctx.fillRect(120, 1380, 560, 80) ctx.fillStyle="#264677" ctx.fillRect(120, 184, 5.6*axes-2, 72) ctx.fillStyle="#777626" ctx.fillRect(682-5.6*horseshoe, 184, 5.6*horseshoe-2, 72) ctx.fillStyle="#424242" ctx.fillRect(120, 304, 5.6*moderate-2, 72) ctx.fillStyle="#9e116f" ctx.fillRect(682-5.6*radical, 304, 5.6*radical-2, 72) ctx.fillStyle="#47871c" ctx.fillRect(120, 424, 5.6*political-2, 72) ctx.fillStyle="#951631" ctx.fillRect(682-5.6*apolitical, 424, 5.6*apolitical-2, 72) ctx.fillStyle="#316151" ctx.fillRect(120, 544, 5.6*dead-2, 72) ctx.fillStyle="#147b98" ctx.fillRect(682-5.6*leaning, 544, 5.6*leaning-2, 72) ctx.fillStyle="#89192b" ctx.fillRect(120, 664, 5.6*leftist-2, 72) ctx.fillStyle="#6e7427" ctx.fillRect(682-5.6*rightist, 664, 5.6*rightist-2, 72) ctx.fillStyle="#264677" ctx.fillRect(120, 784, 5.6*statist-2, 72) ctx.fillStyle="#267752" ctx.fillRect(682-5.6*liberal, 784, 5.6*liberal-2, 72) ctx.fillStyle="#265277" ctx.fillRect(120, 904, 5.6*anfash-2, 72) ctx.fillStyle="#852132" ctx.fillRect(682-5.6*capcom, 904, 5.6*capcom-2, 72) ctx.fillStyle="#169344" ctx.fillRect(120, 1024, 5.6*vegan-2, 72) ctx.fillStyle="#7b232f" ctx.fillRect(682-5.6*meat, 1024, 5.6*meat-2, 72) ctx.fillStyle="#169567" ctx.fillRect(120, 1144, 5.6*healthy-2, 72) ctx.fillStyle="#424242" ctx.fillRect(682-5.6*junk, 1144, 5.6*junk-2, 72) ctx.fillStyle="#a3708d" ctx.fillRect(120, 1264, 5.6*smart-2, 72) ctx.fillStyle="#333161" ctx.fillRect(682-5.6*strong, 1264, 5.6*strong-2, 72) ctx.fillStyle="#5e5932" ctx.fillRect(120, 1384, 5.6*fast-2, 72) ctx.fillStyle="#017dbb" ctx.fillRect(682-5.6*patient, 1384, 5.6*patient-2, 72) ctx.fillStyle="#222222" ctx.font="700 80px Montserrat" ctx.textAlign="left" ctx.fillText("CenterValues", 20, 90) ctx.font="50px Montserrat" ctx.fillText(ideology, 20, 140) ctx.textAlign="left" if (axes > 30) {ctx.fillText(axes + "%", 130, 237.5)} if (moderate > 30) {ctx.fillText(moderate + "%", 130, 357.5)} if (political > 30) {ctx.fillText(political + "%", 130, 477.5)} if (dead > 30) {ctx.fillText(dead + "%", 130, 597.5)} if (leftist > 30) {ctx.fillText(leftist + "%", 130, 717.5)} if (statist > 30) {ctx.fillText(statist + "%", 130, 837.5)} if (anfash > 30) {ctx.fillText(anfash + "%", 130, 957.5)} if (vegan > 30) {ctx.fillText(vegan + "%", 130, 1077.5)} if (healthy > 30) {ctx.fillText(healthy + "%", 130, 1197.5)} if (smart > 30) {ctx.fillText(smart + "%", 130, 1317.5)} if (fast > 30) {ctx.fillText(fast + "%", 130, 1437.5)} ctx.textAlign="right" if (horseshoe > 30) {ctx.fillText(horseshoe + "%", 670, 237.5)} if (radical > 30) {ctx.fillText(radical + "%", 670, 357.5)} if (apolitical > 30) {ctx.fillText(apolitical + "%", 670, 477.5)} if (leaning > 30) {ctx.fillText(leaning + "%", 670, 597.5)} if (rightist > 30) {ctx.fillText(rightist + "%", 670, 717.5)} if (liberal > 30) {ctx.fillText(liberal + "%", 670, 837.5)} if (capcom > 30) {ctx.fillText(capcom + "%", 670, 957.5)} if (meat > 30) {ctx.fillText(meat + "%", 670, 1077.5)} if (junk > 30) {ctx.fillText(junk + "%", 670, 1197.5)} if (strong > 30) {ctx.fillText(strong + "%", 670, 1317.5)} if (patient > 30) {ctx.fillText(patient + "%", 670, 1437.5)} ctx.font="300 30px Montserrat" ctx.fillText("centervalues.github.io", 780, 30) ctx.fillText("Hardmode", 780, 60) ctx.textAlign="center" ctx.fillText("Theoretic Axis: " + document.getElementById("Theoretic-label").innerHTML, 400, 175) ctx.fillText("Beliefal Axis: " + document.getElementById("Beliefal-label").innerHTML, 400, 295) ctx.fillText("Politic Axis: " + document.getElementById("Politic-label").innerHTML, 400, 415) ctx.fillText("Coordinatic Axis: " + document.getElementById("Coordinatic-label").innerHTML, 400, 535) ctx.fillText("Wing Axis: " + document.getElementById("Wing-label").innerHTML, 400, 655) ctx.fillText("Govermental Axis: " + document.getElementById("Govermental-label").innerHTML, 400, 775) ctx.fillText("Diagonal Axis: " + document.getElementById("Diagonal-label").innerHTML, 400, 895) ctx.fillText("Food Preference Axis: " + document.getElementById("Food-label").innerHTML, 400, 1015) ctx.fillText("Healthiness Axis: " + document.getElementById("Healthiness-label").innerHTML, 400, 1135) ctx.fillText("Smartness Axis: " + document.getElementById("Smartness-label").innerHTML, 400, 1255) ctx.fillText("Speed Axis: " + document.getElementById("Speed-label").innerHTML, 400, 1375) document.getElementById("banner").src = c.toDataURL(); } </script> </body>