Initial commit
This commit is contained in:
Joey Kimsey
416
app/plugins/dice/js/dice.js
Normal file
416
app/plugins/dice/js/dice.js
Normal file
@ -0,0 +1,416 @@
|
||||
const d2Btn = document.getElementById('d2-roll');
|
||||
const d4Btn = document.getElementById('d4-roll');
|
||||
const d6Btn = document.getElementById('d6-roll');
|
||||
const d8Btn = document.getElementById('d8-roll');
|
||||
const d10Btn = document.getElementById('d10-roll');
|
||||
const d12Btn = document.getElementById('d12-roll');
|
||||
const d20Btn = document.getElementById('d20-roll');
|
||||
const d100Btn = document.getElementById('d100-roll');
|
||||
const dxBtn = document.getElementById('dx-roll');
|
||||
|
||||
const dice = document.getElementById('last-roll-dice');
|
||||
const mods = document.getElementById('last-roll-dice-with-mods');
|
||||
const bonuses = document.getElementById('dice-total-with-bonuses');
|
||||
const total = document.getElementById('dice-total');
|
||||
const results = document.getElementById('roll-results');
|
||||
const history = document.getElementById('roll-history');
|
||||
const rollType = document.getElementById('roll-type');
|
||||
|
||||
window.addEventListener('DOMContentLoaded', (event) => {
|
||||
d2Btn.addEventListener('click', rollD2);
|
||||
d4Btn.addEventListener('click', rollD4);
|
||||
d6Btn.addEventListener('click', rollD6);
|
||||
d8Btn.addEventListener('click', rollD8);
|
||||
d10Btn.addEventListener('click', rollD10);
|
||||
d12Btn.addEventListener('click', rollD12);
|
||||
d20Btn.addEventListener('click', rollD20);
|
||||
d100Btn.addEventListener('click', rollD100);
|
||||
dxBtn.addEventListener('click', rollDx);
|
||||
});
|
||||
|
||||
$(document).ready(function() {
|
||||
$(document).on('click', '.mod-minus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( inputValue ) {
|
||||
newValue = parseInt(inputValue, 10) - 1;
|
||||
} else {
|
||||
newValue = -1;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.mod-plus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( inputValue ) {
|
||||
newValue = parseInt(inputValue, 10) + 1;
|
||||
} else {
|
||||
newValue = 1;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.bonus-minus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( inputValue ) {
|
||||
newValue = parseInt(inputValue, 10) - 1;
|
||||
} else {
|
||||
newValue = -1;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.bonus-plus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( inputValue ) {
|
||||
newValue = parseInt(inputValue, 10) + 1;
|
||||
} else {
|
||||
newValue = 1;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.die-minus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( '1' == inputValue ) {
|
||||
return;
|
||||
}
|
||||
if ( !inputValue ) {
|
||||
newValue = '1';
|
||||
} else {
|
||||
newValue = parseInt(inputValue, 10) - 1;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.die-plus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( inputValue ) {
|
||||
newValue = parseInt(inputValue, 10) + 1;
|
||||
} else {
|
||||
newValue = 2;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.face-minus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( '2' == inputValue ) {
|
||||
return;
|
||||
}
|
||||
if ( !inputValue ) {
|
||||
newValue = '2';
|
||||
} else {
|
||||
newValue = parseInt(inputValue, 10) - 1;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.face-plus', function() {
|
||||
var inputValue = $(this).closest('.input-group').find('input').val();
|
||||
var newValue;
|
||||
if ( inputValue ) {
|
||||
newValue = parseInt(inputValue, 10) + 1;
|
||||
} else {
|
||||
newValue = 3;
|
||||
}
|
||||
$(this).closest('.input-group').find('input').val( newValue );
|
||||
});
|
||||
$(document).on('click', '.history-remove', function() {
|
||||
$(this).closest('tr').remove();
|
||||
});
|
||||
$(document).on('click', '#history-clear', function() {
|
||||
$('#roll-history-table').empty();
|
||||
});
|
||||
});
|
||||
|
||||
const rollD2 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d2-last-roll');
|
||||
var dieCount = document.getElementById('d2-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
var roll = getRandomInt( 1, 3 );
|
||||
if ( roll > 1 ) {
|
||||
roll = 'Heads';
|
||||
} else {
|
||||
roll = 'Tails';
|
||||
}
|
||||
rolls.push( roll );
|
||||
}
|
||||
resetResults();
|
||||
updateLastRollDice( rolls );
|
||||
rollType.innerText = 'Coin';
|
||||
resultDiv.innerText = rolls.filter(result => result === 'Heads').length + ' ("Heads")';
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD4 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d4-last-roll');
|
||||
var mod = document.getElementById('d4-mod').value;
|
||||
var bonus = document.getElementById('d4-bonus').value;
|
||||
var dieCount = document.getElementById('d4-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 5 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D4';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD6 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d6-last-roll');
|
||||
var mod = document.getElementById('d6-mod').value;
|
||||
var bonus = document.getElementById('d6-bonus').value;
|
||||
var dieCount = document.getElementById('d6-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 7 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D6';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD8 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d8-last-roll');
|
||||
var mod = document.getElementById('d8-mod').value;
|
||||
var bonus = document.getElementById('d8-bonus').value;
|
||||
var dieCount = document.getElementById('d8-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 9 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D8';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD10 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d10-last-roll');
|
||||
var mod = document.getElementById('d10-mod').value;
|
||||
var bonus = document.getElementById('d10-bonus').value;
|
||||
var dieCount = document.getElementById('d10-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 11 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D10';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD12 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d12-last-roll');
|
||||
var mod = document.getElementById('d12-mod').value;
|
||||
var bonus = document.getElementById('d12-bonus').value;
|
||||
var dieCount = document.getElementById('d12-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 13 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D12';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD20 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d20-last-roll');
|
||||
var mod = document.getElementById('d20-mod').value;
|
||||
var bonus = document.getElementById('d20-bonus').value;
|
||||
var dieCount = document.getElementById('d20-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 21 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D20';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollD100 = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('d100-last-roll');
|
||||
var mod = document.getElementById('d100-mod').value;
|
||||
var bonus = document.getElementById('d100-bonus').value;
|
||||
var dieCount = document.getElementById('d100-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, 101 ) );
|
||||
}
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'Percentile';
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
const rollDx = async function (event) {
|
||||
event.preventDefault();
|
||||
var resultDiv = document.getElementById('dx-last-roll');
|
||||
var mod = document.getElementById('dx-mod').value;
|
||||
var bonus = document.getElementById('dx-bonus').value;
|
||||
var faceCount = document.getElementById('dx-face-count').value;
|
||||
var dieCount = document.getElementById('dx-die-count').value;
|
||||
let rolls = [];
|
||||
if ( !dieCount ) {
|
||||
dieCount = 1;
|
||||
}
|
||||
if ( !faceCount ) {
|
||||
faceCount = 2;
|
||||
}
|
||||
faceCount++;
|
||||
|
||||
for (let index = 0; index < dieCount; index++) {
|
||||
rolls.push( getRandomInt( 1, faceCount ) );
|
||||
}
|
||||
|
||||
updateLastRoll( rolls, mod, bonus );
|
||||
rollType.innerText = 'D' + faceCount;
|
||||
resultDiv.innerText = calculateTotalWithModAndBonus( rolls, mod, bonus );
|
||||
addRollHistory();
|
||||
}
|
||||
|
||||
function getRandomInt(min, max) {
|
||||
const minCeiled = Math.ceil(min);
|
||||
const maxFloored = Math.floor(max);
|
||||
return Math.floor(Math.random() * (maxFloored - minCeiled) + minCeiled);
|
||||
}
|
||||
|
||||
function resetResults() {
|
||||
dice.innerHTML = '';
|
||||
mods.innerHTML = '';
|
||||
bonuses.innerHTML = '';
|
||||
total.innerHTML = '';
|
||||
}
|
||||
|
||||
function updateLastRollDiceMod( rolls, mod ) {
|
||||
if (!rolls) {
|
||||
rolls = [];
|
||||
}
|
||||
if (!mod) {
|
||||
mod = 0;
|
||||
}
|
||||
var rollsStringWithMods = '';
|
||||
for (let i = 0; i < rolls.length; i++) {
|
||||
rollsStringWithMods = rollsStringWithMods + '<b>' + ( parseInt( rolls[i] ) + parseInt( mod )) + '</b> (' + rolls[i] + '+' + mod + '), ';
|
||||
}
|
||||
mods.innerHTML = rollsStringWithMods;
|
||||
}
|
||||
|
||||
function updateLastRollDice( rolls ) {
|
||||
results.style.display = '';
|
||||
if (!rolls) {
|
||||
rolls = [];
|
||||
}
|
||||
var rollsString = rolls.join(', ');
|
||||
dice.innerHTML = rollsString + ' <b>('+rolls.length+')</b>';
|
||||
}
|
||||
|
||||
function addRollHistory() {
|
||||
history.style.display = '';
|
||||
var tpeValue = rollType.innerText
|
||||
var diceValue = dice.innerHTML
|
||||
var modsValue = mods.innerHTML
|
||||
var totalValue = total.innerHTML
|
||||
var bonusesValue = bonuses.innerHTML
|
||||
|
||||
var rollList = document.getElementById('roll-history-table');
|
||||
var row = document.createElement('tr');
|
||||
|
||||
row.innerHTML = `
|
||||
<td class="text-center">${tpeValue}</td>
|
||||
<td class="text-center">${diceValue}</td>
|
||||
<td class="text-center">${modsValue}</td>
|
||||
<td class="text-center">${totalValue}</td>
|
||||
<td class="text-center">${bonusesValue}</td>
|
||||
<td class="text-right"><button class="btn btn-danger btn-sm history-remove" aria-label="Remove "><span class="glyphicon glyphicon-trash"></span></button></td>
|
||||
`;
|
||||
|
||||
var firstRow = rollList.rows[0];
|
||||
if (firstRow) {
|
||||
rollList.insertBefore(row, firstRow);
|
||||
} else {
|
||||
rollList.appendChild(row);
|
||||
}
|
||||
}
|
||||
|
||||
function updateLastRollTotal( rolls ) {
|
||||
if (!rolls) {
|
||||
rolls = [];
|
||||
}
|
||||
var sum = rolls.reduce((total, currentValue) => total + currentValue, 0);
|
||||
total.innerHTML = '<b>' + sum + '</b>';
|
||||
}
|
||||
|
||||
function calculateTotalWithModAndBonus( rolls, mod, bonus ) {
|
||||
if (!rolls) {
|
||||
rolls = [];
|
||||
}
|
||||
if (!bonus) {
|
||||
bonus = 0;
|
||||
}
|
||||
if (!mod) {
|
||||
mod = 0;
|
||||
}
|
||||
|
||||
var sum = rolls.reduce((total, currentValue) => total + currentValue, 0);
|
||||
var sumWithMods;
|
||||
if ( 0 == mod ) {
|
||||
sumWithMods = sum;
|
||||
} else {
|
||||
sumWithMods = parseInt(sum) + ( rolls.length * parseInt(mod) );
|
||||
}
|
||||
var total = parseInt(sumWithMods) + parseInt(bonus);
|
||||
return total;
|
||||
}
|
||||
|
||||
function updateLastRoll( rolls, mod, bonus ) {
|
||||
resetResults();
|
||||
updateLastRollDice( rolls );
|
||||
updateLastRollDiceMod( rolls, mod );
|
||||
updateLastRollTotal( rolls );
|
||||
var sum = rolls.reduce((total, currentValue) => total + currentValue, 0);
|
||||
if (!bonus) {
|
||||
bonus = '0';
|
||||
}
|
||||
if (!mod) {
|
||||
mod = '0';
|
||||
}
|
||||
bonuses.innerHTML = '<b>' + calculateTotalWithModAndBonus( rolls, mod, bonus ) + '</b> ( '+sum+' + ( '+rolls.length+' * '+mod+' ) + '+bonus+' )';
|
||||
}
|
||||
Reference in New Issue
Block a user