From 23e9e2c1705e4cbee0f42874f7a43fba3d1f59c9 Mon Sep 17 00:00:00 2001
From: Kyle <41976328+ImKyle4815@users.noreply.github.com>
Date: Mon, 7 Jun 2021 17:15:06 -0700
Subject: [PATCH] Update versionPlaneswalker.js

---
 js/frames/versionPlaneswalker.js | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/js/frames/versionPlaneswalker.js b/js/frames/versionPlaneswalker.js
index bfa30c43..25677c43 100644
--- a/js/frames/versionPlaneswalker.js
+++ b/js/frames/versionPlaneswalker.js
@@ -8,33 +8,36 @@ if (!loadedVersions.includes('/js/frames/versionPlaneswalker.js')) {
 	newHTML.classList.add('hidden');
 	newHTML.innerHTML = `
 	<div class='readable-background padding'>
-		<h5 class='padding margin-bottom input-description'>Adjust the height (first input) and loyalty cost (second input) of each Planeswalker ability</h5>
+		<h5 class='padding margin-bottom input-description'>Adjust the height (first input), loyalty cost (second input), and loyalty placement (third input) of each Planeswalker ability</h5>
 		<h5 class='padding margin-bottom input-description'>First Ability:</h5>
 		<div class='padding input-grid margin-bottom'>
 			<input id='planeswalker-height-0' type='number' class='input' oninput='planeswalkerEdited();' min='0'>
 			<input id='planeswalker-cost-0' type='text' class='input' oninput='planeswalkerEdited();'>
+			<input id='planeswalker-shift-0' type='number' class='input' oninput='planeswalkerEdited();'>
 		</div>
 		<h5 class='padding margin-bottom input-description'>Second Ability:</h5>
 		<div class='padding input-grid margin-bottom'>
 			<input id='planeswalker-height-1' type='number' class='input' oninput='planeswalkerEdited();' min='0'>
 			<input id='planeswalker-cost-1' type='text' class='input' oninput='planeswalkerEdited();'>
+			<input id='planeswalker-shift-1' type='number' class='input' oninput='planeswalkerEdited();'>
 		</div>
 		<h5 class='padding margin-bottom input-description'>Third Ability:</h5>
 		<div class='padding input-grid margin-bottom'>
 			<input id='planeswalker-height-2' type='number' class='input' oninput='planeswalkerEdited();' min='0'>
 			<input id='planeswalker-cost-2' type='text' class='input' oninput='planeswalkerEdited();'>
+			<input id='planeswalker-shift-2' type='number' class='input' oninput='planeswalkerEdited();'>
 		</div>
 		<h5 class='padding margin-bottom input-description'>Fourth Ability:</h5>
 		<div class='padding input-grid margin-bottom'>
 			<input id='planeswalker-height-3' type='number' class='input' oninput='planeswalkerEdited();' min='0'>
 			<input id='planeswalker-cost-3' type='text' class='input' oninput='planeswalkerEdited();'>
+			<input id='planeswalker-shift-3' type='number' class='input' oninput='planeswalkerEdited();'>
 		</div>
 		<h5 class='padding margin-bottom input-description'>Invert textbox colors:</h5>
 		<input id='planeswalker-invert' class='input margin-bottom' type='checkbox' onchange='invertPlaneswalkerColors();'>
-		<h5 class='padding margin-bottom input-description'>For two-ability planeswalkers only:</h5>
 	</div>`;
 	if (!card.planeswalker) {
-		card.planeswalker = {abilities:['+1', '0', '-7', ''], count:3, x:0.1167, width:0.8094};
+		card.planeswalker = {abilities:['+1', '0', '-7', ''], abilityAdjust:[0, 0, 0, 0], count:3, x:0.1167, width:0.8094};
 	}
 	window.planeswalkerAbilityLayout = [[[0.7467], [0.6953, 0.822], [0.6639, 0.7467, 0.8362], [0.6505, 0.72, 0.7905, 0.861]],[[0.72], [0.6391, 0.801], [0.5986, 0.72, 0.8415], [0.5986, 0.6796, 0.7605, 0.8415]]];
 	document.querySelector('#creator-menu-sections').appendChild(newHTML);
@@ -77,6 +80,10 @@ function planeswalkerEdited() {
 	card.planeswalker.abilities[1] = document.querySelector('#planeswalker-cost-1').value;
 	card.planeswalker.abilities[2] = document.querySelector('#planeswalker-cost-2').value;
 	card.planeswalker.abilities[3] = document.querySelector('#planeswalker-cost-3').value;
+	card.planeswalker.abilityAdjust[0] = document.querySelector('#planeswalker-shift-0').value / card.height;
+	card.planeswalker.abilityAdjust[1] = document.querySelector('#planeswalker-shift-1').value / card.height;
+	card.planeswalker.abilityAdjust[2] = document.querySelector('#planeswalker-shift-2').value / card.height;
+	card.planeswalker.abilityAdjust[3] = document.querySelector('#planeswalker-shift-3').value / card.height;
 	card.planeswalker.count = 0;
 	var lastY = card.text.ability0.y;
 	for (var i = 0; i < 4; i ++) {
@@ -130,7 +137,7 @@ function planeswalkerEdited() {
 	planeswalkerContext.textAlign = 'center';
 	for (var i = 0; i < card.planeswalker.count; i ++) {
 		var planeswalkerIconValue = card.planeswalker.abilities[i];
-		var planeswalkerPlacement = scaleY(planeswalkerAbilityLayout[planeswalkerTall][card.planeswalker.count - 1][i])
+		var planeswalkerPlacement = scaleY(planeswalkerAbilityLayout[planeswalkerTall][card.planeswalker.count - 1][i] + card.planeswalker.abilityAdjust[i])
 		if (planeswalkerIconValue.includes('+')) {
 			if (plusIcon.complete) {
 				planeswalkerContext.drawImage(plusIcon, scaleX(0.0294), planeswalkerPlacement - scaleHeight(0.0258), scaleWidth(0.14), scaleHeight(0.0724));
@@ -155,12 +162,16 @@ function planeswalkerEdited() {
 function fixPlaneswalkerInputs(callback) {
 	document.querySelector('#planeswalker-height-0').value = scaleHeight(card.text.ability0.height);
 	document.querySelector('#planeswalker-cost-0').value = card.planeswalker.abilities[0];
+	document.querySelector('#planeswalker-shift-0').value = scaleHeight(card.planeswalker.abilityAdjust[0]);
 	document.querySelector('#planeswalker-height-1').value = scaleHeight(card.text.ability1.height);
 	document.querySelector('#planeswalker-cost-1').value = card.planeswalker.abilities[1];
+	document.querySelector('#planeswalker-shift-1').value = scaleHeight(card.planeswalker.abilityAdjust[1]);
 	document.querySelector('#planeswalker-height-2').value = scaleHeight(card.text.ability2.height);
 	document.querySelector('#planeswalker-cost-2').value = card.planeswalker.abilities[2];
+	document.querySelector('#planeswalker-shift-2').value = scaleHeight(card.planeswalker.abilityAdjust[2]);
 	document.querySelector('#planeswalker-height-3').value = scaleHeight(card.text.ability3.height);
 	document.querySelector('#planeswalker-cost-3').value = card.planeswalker.abilities[3];
+	document.querySelector('#planeswalker-shift-3').value = scaleHeight(card.planeswalker.abilityAdjust[3]);
 	if (callback) {
 		callback();
 	}