dialog picker v2
This commit is contained in:
Vlyan
BIN
system/assets/imgs/noskill.png
Normal file
BIN
system/assets/imgs/noskill.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 27 KiB |
@@ -193,7 +193,7 @@
|
||||
"total": "Total",
|
||||
"spent": "Used",
|
||||
"saved": "Saved",
|
||||
"acquisitions": "Adquisitions"
|
||||
"acquisitions": "Acquisitions"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -41,9 +41,9 @@ export class DicePickerDialog extends Application {
|
||||
id: "l5r5e-dice-picker-dialog",
|
||||
classes: ["l5r5e", "dice-picker-dialog"],
|
||||
template: "systems/l5r5e/templates/dice/dice-picker-dialog.html",
|
||||
width: 650,
|
||||
// height: 400,
|
||||
// title: "L5R Dice Roller",
|
||||
title: "L5R Dice Roller",
|
||||
width: 660,
|
||||
height: 390,
|
||||
actor: null,
|
||||
ringId: null,
|
||||
skillId: "",
|
||||
@@ -152,6 +152,7 @@ export class DicePickerDialog extends Application {
|
||||
*/
|
||||
getData(options = null) {
|
||||
return {
|
||||
...super.getData(options),
|
||||
elementsList: this._getElements(),
|
||||
dicesList: [0, 1, 2, 3, 4, 5, 6],
|
||||
skillData: this._skillData,
|
||||
@@ -185,33 +186,41 @@ export class DicePickerDialog extends Application {
|
||||
activateListeners(html) {
|
||||
super.activateListeners(html);
|
||||
|
||||
// on change approaches
|
||||
// On change approaches
|
||||
html.find('input[name="approach"]').on("click", async (event) => {
|
||||
$("#ring_value").val(event.target.value);
|
||||
$(".ring-selection").removeClass("ring-selected");
|
||||
$("." + event.target.dataset.ringid).addClass("ring-selected");
|
||||
$("#stance_label").html(
|
||||
game.i18n.localize("l5r5e.skills." + this._skillData.cat + "." + event.target.dataset.ringid)
|
||||
);
|
||||
});
|
||||
|
||||
// Ring Add button
|
||||
// Ring - Add button
|
||||
html.find("#ring_add").on("click", async (event) => {
|
||||
this._quantityChange(event, "#ring_value", false);
|
||||
});
|
||||
|
||||
// Ring Subtract button
|
||||
// Ring - Subtract button
|
||||
html.find("#ring_sub").on("click", async (event) => {
|
||||
this._quantityChange(event, "#ring_value", true);
|
||||
});
|
||||
|
||||
// Skill Add button
|
||||
// Skill - Add button
|
||||
html.find("#skill_add").on("click", async (event) => {
|
||||
this._quantityChange(event, "#skill_value", false);
|
||||
});
|
||||
|
||||
// Skill Subtract button
|
||||
// Skill - Subtract button
|
||||
html.find("#skill_sub").on("click", async (event) => {
|
||||
this._quantityChange(event, "#skill_value", true);
|
||||
});
|
||||
|
||||
// Skill - Default Dice div
|
||||
html.find("#skill_default_value").on("click", async (event) => {
|
||||
$("#skill_value").val(this._skillData.value);
|
||||
});
|
||||
|
||||
// Roll button
|
||||
html.find('button[name="roll"]').on("click", async (event) => {
|
||||
event.preventDefault();
|
||||
@@ -233,6 +242,10 @@ export class DicePickerDialog extends Application {
|
||||
formula.push(`${skill}ds`);
|
||||
}
|
||||
|
||||
// TODO update actor stance ? good idea or not, choice-able ?
|
||||
// this._actor.data.data.stance = approach;
|
||||
|
||||
// Let's roll !
|
||||
const roll = await new RollL5r5e(formula.join("+"));
|
||||
|
||||
roll.l5r5e.stance = approach;
|
||||
@@ -244,16 +257,9 @@ export class DicePickerDialog extends Application {
|
||||
await this.close();
|
||||
});
|
||||
|
||||
// Check if a stance is selected
|
||||
let selectedStance = "air";
|
||||
if (this._actor) {
|
||||
DicePickerDialog.stances.forEach((e) => {
|
||||
if (this._actor.data.data?.stances?.[e]?.isSelected?.value) {
|
||||
selectedStance = e;
|
||||
}
|
||||
});
|
||||
}
|
||||
html.find(`.approach_${selectedStance}`).first().trigger("click");
|
||||
html.find(`.approach_${this._actor ? this._actor.data.data.stance : "void"}`)
|
||||
.first()
|
||||
.trigger("click");
|
||||
html.find("#skill_value").val(this._skillData.value);
|
||||
}
|
||||
|
||||
|
||||
@@ -101,7 +101,7 @@ export class ActorSheetL5r5e extends ActorSheet {
|
||||
this._onSkillClicked(skillId);
|
||||
});
|
||||
|
||||
html.find(".adquisition-add").click((ev) => {
|
||||
html.find(".acquisition-add").click((ev) => {
|
||||
this._createFeat();
|
||||
});
|
||||
}
|
||||
|
||||
File diff suppressed because one or more lines are too long
@@ -24,6 +24,7 @@
|
||||
* {
|
||||
transition: none;
|
||||
}
|
||||
|
||||
input[type="text"]:focus,
|
||||
input[type="text"]:hover {
|
||||
box-shadow: none !important;
|
||||
@@ -34,25 +35,35 @@
|
||||
img {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
table {
|
||||
.profil {
|
||||
text-align: center;
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
td:first-child {
|
||||
width: 200px;
|
||||
}
|
||||
.rings {
|
||||
|
||||
td {
|
||||
width: 240px;
|
||||
}
|
||||
.skill {
|
||||
|
||||
td:last-child {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
|
||||
.pointer-choice {
|
||||
cursor: url("../l5r-ui/ui/cursors/pointer.webp"), pointer;
|
||||
}
|
||||
|
||||
// Approach choice
|
||||
.ring-selection {
|
||||
filter: contrast(10%);
|
||||
|
||||
&.ring-selected {
|
||||
filter: drop-shadow(1px 1px 0 #151515);
|
||||
//text-shadow: 1px 1px 0 #efefef;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -60,28 +71,34 @@
|
||||
font-size: xx-large;
|
||||
}
|
||||
|
||||
.center {
|
||||
.third {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.dice-container {
|
||||
position: relative;
|
||||
text-align: center;
|
||||
}
|
||||
.third {
|
||||
float: left;
|
||||
width: 33.333333333%;
|
||||
|
||||
.dice-value {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
#ring_value {
|
||||
|
||||
.dice-ring {
|
||||
width: 20px;
|
||||
position: relative;
|
||||
left: +34px;
|
||||
top: -14px;
|
||||
color: #f0f0e0;
|
||||
background: none;
|
||||
border: none;
|
||||
font-size: large;
|
||||
}
|
||||
#skill_value {
|
||||
|
||||
.dice-skill {
|
||||
width: 20px;
|
||||
position: relative;
|
||||
left: +34px;
|
||||
top: -13px;
|
||||
color: #0f0f0e;
|
||||
background: none;
|
||||
border: none;
|
||||
|
||||
@@ -77,7 +77,7 @@
|
||||
},
|
||||
"fatigue": 0,
|
||||
"strife": 0,
|
||||
"stance": "air"
|
||||
"stance": "void"
|
||||
},
|
||||
"xp": {
|
||||
"xp_total": 0,
|
||||
|
||||
@@ -1,82 +1,109 @@
|
||||
<div class="l5r5e dice-picker-dialog">
|
||||
|
||||
<form class="noflex l5r5e dices" autocomplete="off">
|
||||
<table>
|
||||
<tr>
|
||||
<td class="profil center">
|
||||
<img class="profile-img"
|
||||
src="{{#if actor.img}}{{actor.img}}{{/if}}{{^if actor.img}}icons/svg/mystery-man.svg{{/if}}"
|
||||
data-edit="img"
|
||||
height="200"
|
||||
width="200"
|
||||
alt="{{#if actor.name}}{{actor.name}}{{/if}}{{^if actor.name}}mystery-man{{/if}}"
|
||||
>
|
||||
</td>
|
||||
<td class="rings center">
|
||||
<ul class="rings">
|
||||
{{#each elementsList}}
|
||||
<li id="{{this.id}}">
|
||||
<label class="attribute-label {{this.id}} centered-input ring-selection">
|
||||
<i class="i_{{this.id}}"></i>
|
||||
<strong>{{this.label}}</strong>
|
||||
<input class="centered-input approach_{{this.id}}"
|
||||
type="text"
|
||||
name="approach"
|
||||
data-ringid="{{this.id}}"
|
||||
value="{{this.value}}"
|
||||
readonly="readonly"
|
||||
/>
|
||||
</label>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</td>
|
||||
<td class="skill center">
|
||||
{{#if skillData.name}}
|
||||
<label>{{skillData.name}} </label>
|
||||
|
||||
{{skillData.value}}
|
||||
|
||||
{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="center">
|
||||
<!-- TODO-->
|
||||
ND : {{difficulty}}
|
||||
</td>
|
||||
<td class="center">
|
||||
<div class="third">
|
||||
<i id="ring_sub" class="quantity fa fa-minus-square"></i>
|
||||
<form class="l5r5e dice-picker-dialog" autocomplete="off">
|
||||
<table>
|
||||
<tr>
|
||||
<td class="profil center">
|
||||
<img class="profile-img"
|
||||
src="{{#if actor.img}}{{actor.img}}{{/if}}{{^if actor.img}}icons/svg/mystery-man.svg{{/if}}"
|
||||
data-edit="img"
|
||||
height="200"
|
||||
width="200"
|
||||
alt="{{#if actor.name}}{{actor.name}}{{/if}}{{^if actor.name}}mystery-man{{/if}}"
|
||||
>
|
||||
</td>
|
||||
<td class="rings center">
|
||||
<ul class="rings">
|
||||
{{#each elementsList}}
|
||||
<li id="{{this.id}}">
|
||||
<label class="attribute-label {{this.id}} centered-input ring-selection pointer-choice">
|
||||
<i class="i_{{this.id}}"></i>
|
||||
<strong>{{this.label}}</strong>
|
||||
<input class="centered-input approach_{{this.id}}"
|
||||
type="text"
|
||||
name="approach"
|
||||
data-ringid="{{this.id}}"
|
||||
value="{{this.value}}"
|
||||
readonly="readonly"
|
||||
/>
|
||||
</label>
|
||||
</li>
|
||||
{{/each}}
|
||||
</ul>
|
||||
</td>
|
||||
<td class="skill">
|
||||
{{#if skillData.name}}
|
||||
<div>
|
||||
<label>{{localizeSkill skillData.cat 'title'}}</label>
|
||||
</div>
|
||||
<div>
|
||||
<label>{{skillData.name}}</label>
|
||||
</div>
|
||||
<div>
|
||||
<label id="stance_label">unknown</label>
|
||||
</div>
|
||||
<div id="skill_default_value" class="dice-container pointer-choice">
|
||||
<img src="systems/l5r5e/assets/dices/default/skill_blank.png" alt="1">
|
||||
<div class="dice-value">
|
||||
<span class="dice-skill" type="text" name="skill_{{skillData.name}}">{{skillData.value}}</span>
|
||||
</div>
|
||||
<div class="third">
|
||||
<input id="ring_value" class="centered-input" type="text" name="ring" value="0"
|
||||
readonly="readonly">
|
||||
</div>
|
||||
{{/if}}
|
||||
{{^if skillData.name}}
|
||||
<img class="profile-img"
|
||||
src="systems/l5r5e/assets/imgs/noskill.png"
|
||||
data-edit="img"
|
||||
height="200"
|
||||
width="200"
|
||||
alt="no skill selected"
|
||||
>
|
||||
{{/if}}
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>
|
||||
<!-- TODO -->
|
||||
ND : {{difficulty}}
|
||||
</td>
|
||||
<td>
|
||||
<div class="third">
|
||||
<i id="ring_sub" class="quantity pointer-choice fa fa-minus-square"></i>
|
||||
</div>
|
||||
|
||||
<div class="third">
|
||||
<div class="dice-container">
|
||||
<img src="systems/l5r5e/assets/dices/default/ring_blank.png" alt="1">
|
||||
<div class="dice-value">
|
||||
<input id="ring_value" class="dice-ring" type="text" name="ring" value="0" readonly="readonly">
|
||||
</div>
|
||||
</div>
|
||||
<div class="third">
|
||||
<i id="ring_add" class="quantity fa fa-plus-square"></i>
|
||||
</div>
|
||||
</td>
|
||||
<td class="center">
|
||||
<div class="third">
|
||||
<i id="skill_sub" class="quantity fa fa-minus-square"></i>
|
||||
</div>
|
||||
<div class="third">
|
||||
<input id="skill_value" class="centered-input" type="text" name="skill"
|
||||
value="{{skillData.value}}" readonly="readonly">
|
||||
</div>
|
||||
|
||||
<div class="third">
|
||||
<i id="ring_add" class="quantity pointer-choice fa fa-plus-square"></i>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="third">
|
||||
<i id="skill_sub" class="quantity pointer-choice fa fa-minus-square"></i>
|
||||
</div>
|
||||
|
||||
<div class="third">
|
||||
<div class="dice-container">
|
||||
<img src="systems/l5r5e/assets/dices/default/skill_blank.png" alt="1">
|
||||
<div class="dice-value">
|
||||
<input id="skill_value" class="dice-skill" type="text" name="skill" value="{{skillData.value}}" readonly="readonly">
|
||||
</div>
|
||||
</div>
|
||||
<div class="third">
|
||||
<i id="skill_add" class="quantity fa fa-plus-square"></i>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="third">
|
||||
<i id="skill_add" class="quantity pointer-choice fa fa-plus-square"></i>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
<div class="form-group">
|
||||
<button name="roll">Roll <i class='fas fa-arrow-circle-right'></i></button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<button name="roll">Roll <i class='fas fa-arrow-circle-right'></i></button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<div class="flexrow row">
|
||||
<span class="name" name="adquisition.name">{{ adquisition.name }}</span>
|
||||
<span class="xp" name="adquisition.xp">{{ adquisition.data.xp_used }}</span>
|
||||
<span class="rank" name="adquisition.rank">{{ adquisition.data.rank }}</span>
|
||||
<span class="name" name="acquisition.name">{{ acquisition.name }}</span>
|
||||
<span class="xp" name="acquisition.xp">{{ acquisition.data.xp_used }}</span>
|
||||
<span class="rank" name="acquisition.rank">{{ acquisition.data.rank }}</span>
|
||||
</div>
|
||||
@@ -22,10 +22,10 @@
|
||||
</header>
|
||||
|
||||
{{#each data.feats as |feat featId| }}
|
||||
{{> 'systems/l5r5e/templates/sheets/actor/adquisition.html' adquisition=feat }}
|
||||
{{> 'systems/l5r5e/templates/sheets/actor/acquisition.html' acquisition=feat }}
|
||||
{{/each}}
|
||||
<div class="tools">
|
||||
<a class="adquisition-control adquisition-add" title="{{ localize 'l5r5e.add'}}"><i class="fas fa-plus"></i></a>
|
||||
<a class="acquisition-control acquisition-add" title="{{ localize 'l5r5e.add'}}"><i class="fas fa-plus"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user