Public
Edited
Nov 26, 2022
1 star
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
function buildBoards() {
//console.log('BUILD BOARDS');
const ele = document.getElementById('rowBoards');
const eled3 = d3.select(ele);

for (var i = 0; i < mutable playerCount; i++) {
const ci = eled3.append('div')
.attr('class','col');

ci.append('div')
.attr('class','card-header text-center')
.style('background-color',playerColorsHex[i])
.text(playerColorsText[i]);

const cb = ci.append('div')
.attr('class','card-body')
.style('border-color','#000')
.style('border-width','thick')
.style('border-style','solid')
.style('border-radius','25px');

for (var j = 0; j < 6; j++) {
const rj = cb.append('div')
.attr('class','row');
for (var k = 0; k < 6; k++) {
const ck = rj.append('div')
.attr('class','col-2');
if (k < trackAvailability[j]) {
ck.append('button')
.attr('class','btn btn-primary shadow-none trackbtn trackbtn-'+trackColorsText[j])
.attr('data-bs-toggle','button')
.attr('autocomplete','off')
.attr('id','trackbtn-'+trackColorsText[j]+'-pl-'+i+'-n-'+k)
.attr('value',0);
}
}
}
$('.trackbtn').unbind('click').bind('click', function (e) {
var state = ($(this).val());
state ^= true;
$(this).val(state);
});
}
}
Insert cell
function buildRides() {
const ele = document.getElementById('rowRides');
const eled3 = d3.select(ele);

for (var i = 0; i < mutable playerCount; i++) {
const ci = eled3.append('div')
.attr('class','col');

const cb = ci.append('div')
.attr('class','card-body');

for (var j = 0; j < 8; j++) {
const rj = cb.append('div')
.attr('class','row');
const cj0 = rj.append('div')
.attr('class','col-6')
.style('background-color',scoringColorsRGB[j])
.style('border-color','#000')
.style('border-width','thick')
.style('border-style','solid');
const cj1 = rj.append('div')
.attr('class','col-6');
const ffj = cj1.append('div')
.attr('class','form-floating');
const fsj = ffj.append('select')
.attr('class','form-select')
.attr('id','ridesslct-'+scoringSources[j]+'-pl-'+i);
for (var k = 0; k < 25; k++) {
fsj.append('option')
.attr('value',k)
.text(k);
}
}
}
}
Insert cell
function buildScores() {
const ele = document.getElementById('rowScores');
const eled3 = d3.select(ele);

for (var i = 0; i < mutable playerCount; i++) {
const ci = eled3.append('div')
.attr('class','col');

const cb = ci.append('div')
.attr('class','card-body')
.attr('id','rowScore-pl-'+i);

cb.append('div')
.attr('class','row text-left')
.style('background-color','#000')
.style('color','#fff')
.style('padding-left','10%')
.text(0);
}
}
Insert cell
function calculateScores() {
for (var i = 0; i < mutable playerCount; i++) { // Calculate score from
for (var j = 0; j < mutable playerCount; j++) { // Calculate score for
var total = 0;
if ( i == j) {
// Rider score
total += parseFloat($('#ridesslct-'+scoringSources[0]+'-pl-'+i).val());
// Bonus score
total += (parseFloat($('#ridesslct-'+scoringSources[7]+'-pl-'+i).val()));
}
for (var k = 1; k < 7; k++) {
var multiplier = 0;
for (var l = 0; l < trackAvailability[k-1]; l++) {
//multiplier += parseFloat($('#trackbtn-'+scoringSources[k]+'-pl-'+i+'-n-'+l).checked());
//console.log($('#trackbtn-'+scoringSources[k]+'-pl-'+i+'-n-'+l).val());
multiplier += parseFloat($('#trackbtn-'+scoringSources[k]+'-pl-'+j+'-n-'+l).val());
}
console.log('PL ' + j + ' ' + scoringSources[k] + ' ' + parseFloat($('#ridesslct-'+scoringSources[k]+'-pl-'+i).val()) + ' ' + multiplier);
total += (parseFloat($('#ridesslct-'+scoringSources[k]+'-pl-'+i).val()) * multiplier);
}
//console.log('('+i+','+j+'): ' + total);
mutable scores[j].push(total);
}
}
for (var i = 0; i < mutable playerCount; i++) {
var roundTotal = 0;
for(var j = mutable scores[i].length - mutable playerCount; j < mutable scores[i].length; j++) {
roundTotal += mutable scores[i][j];
}
mutable scores[i].push(roundTotal);
mutable scores[i].push((mutable scores[i][mutable scores[i].length - mutable playerCount - 2]) + roundTotal);
}
//console.log(mutable scores);
mutable round += 1;
}
Insert cell
function updateScores() {
for (var i = 0; i < mutable playerCount; i++) {
$('#rowScore-pl-'+i).empty();
const ele = document.getElementById('rowScore-pl-'+i);
const eled3 = d3.select(ele);

eled3.append('div')
.attr('class','row text-left')
.style('background-color','#000')
.style('color','#fff')
.style('padding-left','10%')
.text(0);

var roundChunk = mutable playerCount + 2;

for (var j = 0; j < mutable round; j++) {
for (var k = 0; k < mutable playerCount; k++) {
eled3.append('div')
.attr('class','row text-left')
.style('background-color',playerColorsHex[k])
.style('color','#000')
.style('padding-left','90%')
.text(mutable scores[i][j * roundChunk + k + 1]);
}
eled3.append('div')
.attr('class','row text-left')
.style('background-color','#000')
.style('color','#fff')
.style('padding-left','90%')
.text(mutable scores[i][j * roundChunk + mutable playerCount + 1]);

eled3.append('div')
.attr('class','row text-left')
.style('background-color','#000')
.style('color','#fff')
.style('padding-left','10%')
.text(mutable scores[i][j * roundChunk + mutable playerCount + 2]);
}
}
}
Insert cell
function undoScores() {
if (round > 0) {
for (var i = 0; i < mutable playerCount; i++) {
for (var j = 0; j < mutable playerCount + 2; j++) {
mutable scores[i].pop();
}
}
mutable round -= 1;
}
}
Insert cell
Insert cell
mutable playerCount = 0
Insert cell
mutable round = 0
Insert cell
playerColorsText = ["BLUE", "GREEN", "RED", "WHITE", "PINK"];
Insert cell
playerColorsHex = ["#09A9D3", "#B4DC78", "#B51655", "#fff", "#FFA6C4"];
Insert cell
trackColorsText = ["RED", "BLUE", "ORANGE", "YELLOW", "PURPLE", "BLACK"];
Insert cell
trackColorsRGB = ["rgb(174, 40, 38)", "rgb(126, 203, 200)", "rgb(237, 129, 28)", "rgb(234, 198, 52)", "rgb(120, 90, 124)", "rgb(0, 0, 0)"];
Insert cell
trackAvailability = [6, 6, 5, 4, 3, 2];
Insert cell
scoringSources = ["RIDER", "RED", "BLUE", "ORANGE", "YELLOW", "PURPLE", "BLACK", "BONUS"];
Insert cell
scoringColorsRGB = ["rgb(255, 255, 255)", "rgb(174, 40, 38)", "rgb(126, 203, 200)", "rgb(237, 129, 28)", "rgb(234, 198, 52)", "rgb(120, 90, 124)", "rgb(0, 0, 0)", "rgb(35,110,35)"];
Insert cell
mutable scores = [];
Insert cell
Insert cell
Insert cell
Insert cell
BootStrap5Style = {
return html`<code>css</code> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">`
}
Insert cell
BootStrap5 = require("https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js")
Insert cell
d3 = require("d3@5")
Insert cell
$ = require("jquery")
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more