WIP: Turn/torso-twist mech template on keypress
This commit is contained in:
@@ -38,6 +38,10 @@ function isGrenade(el) {
|
||||
return el && el.getAttribute('href') === '#counter-grenade';
|
||||
}
|
||||
|
||||
function isMechTemplate(el) {
|
||||
return el && el.getAttribute('class') === 'mech-template';
|
||||
}
|
||||
|
||||
function isClone(counter) {
|
||||
const isClone = counter.classList.contains('clone'),
|
||||
{ allegiance: clAl, number: clNum } = counter.dataset;
|
||||
@@ -203,8 +207,9 @@ export function start(el) {
|
||||
const occupant = getCellOccupant(cell);
|
||||
let toPlace = placing.pop();
|
||||
|
||||
if (isGrenade(toPlace)) {
|
||||
if (isGrenade(toPlace) || isMechTemplate(toPlace)) {
|
||||
getHex(cell).after(toPlace);
|
||||
removeEventListener("keydown", handleMechTemplateRotation);
|
||||
} else if (toPlace && !occupant) {
|
||||
soldier.place(svg, toPlace, cell);
|
||||
toPlace.removeEventListener('click', selectOffBoard);
|
||||
@@ -266,6 +271,10 @@ export function start(el) {
|
||||
cell.addEventListener('pointerover', () => {
|
||||
const selected = getSelected();
|
||||
|
||||
if (placing[0]?.getAttributeNS(null, 'class') == 'mech-template') {
|
||||
cell.appendChild(placing[0]);
|
||||
}
|
||||
|
||||
if (selected && svg.querySelector('.grid').contains(selected) && !getLockedSightLine(svg) && cell !== selected.parentElement) {
|
||||
clearSightLine();
|
||||
drawSightLine(selected.parentElement, cell);
|
||||
@@ -442,3 +451,46 @@ export function setGrenade() {
|
||||
|
||||
placing.push(counter);
|
||||
}
|
||||
|
||||
function handleMechTemplateRotation(event) {
|
||||
const counter = placing[0];
|
||||
const upper = placing[0].querySelector('use[href="#mech-template-upper"]');
|
||||
|
||||
if (event.key === 'a') {
|
||||
let direction = +counter.style.transform.match(/-?\d+/) || 0;
|
||||
direction -= 60;
|
||||
counter.style.transform = `rotate(${direction}deg)`;
|
||||
} else if (event.key === 'd') {
|
||||
let direction = +counter.style.transform.match(/-?\d+/) || 0;
|
||||
direction += 60;
|
||||
counter.style.transform = `rotate(${direction}deg)`;
|
||||
} else if (event.key === 'q') {
|
||||
let facing = +upper.style.transform.match(/-?\d+/) || 0;
|
||||
facing = facing <= -60 ? -60 : facing - 60;
|
||||
upper.style.transform = `rotate(${facing}deg)`;
|
||||
} else if (event.key === 'e') {
|
||||
let facing = +upper.style.transform.match(/-?\d+/) || 0;
|
||||
facing = facing >= 60 ? 60 : facing + 60;
|
||||
upper.style.transform = `rotate(${facing}deg)`;
|
||||
}
|
||||
}
|
||||
|
||||
export function setMechTemplate() {
|
||||
const counter = document.createElementNS(svgns, 'g');
|
||||
counter.setAttributeNS(null, 'class', 'mech-template');
|
||||
counter.style.pointerEvents = 'none';
|
||||
counter.style.transition = 'transform 0.5s';
|
||||
|
||||
const lower = document.createElementNS(svgns, 'use');
|
||||
lower.setAttributeNS(null, 'href', '#mech-template-lower');
|
||||
|
||||
const upper = document.createElementNS(svgns, 'use');
|
||||
upper.setAttributeNS(null, 'href', '#mech-template-upper');
|
||||
upper.style.transition = 'transform 0.5s';
|
||||
|
||||
counter.appendChild(lower);
|
||||
counter.appendChild(upper);
|
||||
|
||||
addEventListener("keydown", handleMechTemplateRotation);
|
||||
placing.push(counter);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user