103 lines
3.0 KiB
JavaScript
103 lines
3.0 KiB
JavaScript
/**
|
|
* Extend the base Dialog entity by defining a custom window to perform spell.
|
|
* @extends {Dialog}
|
|
*/
|
|
import { RdDUtility } from "./rdd-utility.js";
|
|
|
|
export class RdDTMRDialog extends Dialog {
|
|
|
|
/* -------------------------------------------- */
|
|
constructor(sort, html, actor) {
|
|
|
|
// Common conf
|
|
let dialogConf = {
|
|
content: html,
|
|
buttons:
|
|
{
|
|
rollButton:
|
|
{
|
|
label: "Lancer",
|
|
callback: html => this.performRoll(html)
|
|
}
|
|
},
|
|
default: "rollButton"
|
|
}
|
|
let dialogOptions = { classes: [ "tmrdialog"] }
|
|
|
|
dialogConf.title = "Terres Médianes de Rêve",
|
|
dialogOptions.width = 740;
|
|
dialogOptions.height = 960;
|
|
super(dialogConf, dialogOptions);
|
|
|
|
this.col1_y = 30;
|
|
this.col2_y = 55;
|
|
this.cellh = 55;
|
|
this.cellw = 55;
|
|
this.sort = sort;
|
|
this.actor = actor;
|
|
this.TMRimg = new Image();
|
|
}
|
|
|
|
/* -------------------------------------------- */
|
|
performRoll (html) {
|
|
this.actor.performRoll( this.rollData );
|
|
}
|
|
|
|
/* -------------------------------------------- */
|
|
updateTMR( myself ) {
|
|
function rads(x) { return Math.PI*x/180; }
|
|
|
|
console.log("IMG", this, this.TMRimg);
|
|
|
|
let canvas = document.getElementById('canvas_tmr');
|
|
let ctx = canvas.getContext('2d');
|
|
ctx.drawImage(myself.TMRimg, 0, 0, 720, 860);
|
|
|
|
// Draw current position
|
|
let coordTMR = myself.actor.data.data.reve.tmrpos.coord;
|
|
console.log("TMR coord", coordTMR);
|
|
let coordXY = RdDUtility.convertToCellCoord( coordTMR );
|
|
let basey = (coordXY.x % 2 == 0) ? this.col1_y : this.col2_y;
|
|
ctx.globalAlpha = 0.3;
|
|
ctx.beginPath();
|
|
ctx.arc(28+(coordXY.x * this.cellw), basey+28+(coordXY.y * this.cellh), 15, 0, rads(360), false);
|
|
ctx.fill();
|
|
ctx.closePath();
|
|
ctx.stroke();
|
|
ctx.globalAlpha = 1;
|
|
|
|
setTimeout(myself.updateTMR, 500, myself);
|
|
}
|
|
|
|
/* -------------------------------------------- */
|
|
getCursorPosition(event) {
|
|
let canvasRect = event.currentTarget.getBoundingClientRect();
|
|
let x = event.clientX - canvasRect.left;
|
|
let y = event.clientY - canvasRect.top;
|
|
|
|
let cellx = Math.floor( x / this.cellw);// [From 0 -> 12]
|
|
if (cellx % 2 == 0)
|
|
y -= this.col1_y;
|
|
else
|
|
y -= this.col2_y;
|
|
let celly = Math.floor( y / this.cellh);// [From 0 -> 14]
|
|
|
|
let coordTMR = RdDUtility.convertToTMRCoord(cellx, celly);
|
|
let cellDescr = RdDUtility.getTMRDescription( coordTMR );
|
|
this.actor.data.data.reve.tmrpos.coord = coordTMR;
|
|
console.log("TMR column is", coordTMR, cellx, celly, cellDescr);
|
|
}
|
|
|
|
/* -------------------------------------------- */
|
|
async activateListeners(html) {
|
|
super.activateListeners(html);
|
|
|
|
this.TMRimg.onload = this.updateTMR(this);
|
|
this.TMRimg.src = "systems/foundryvtt-reve-de-dragon/styles/ui/tmp_main_r1.webp";
|
|
|
|
html.find('#canvas_tmr').click(event => {
|
|
this.getCursorPosition(event);
|
|
} );
|
|
}
|
|
}
|