From 0b4ef8998780b7eb0d74aaaab3bfadb1158a8575 Mon Sep 17 00:00:00 2001 From: dje Date: Mon, 4 Feb 2019 21:26:38 +0100 Subject: [PATCH] outputs switch --- app.js | 53 +++++++++++++++++++++++++++++++++++++++++++++++++++-- css/app.css | 14 ++++++++++++-- index.html | 4 ++++ 3 files changed, 67 insertions(+), 4 deletions(-) diff --git a/app.js b/app.js index 521cd7f..4bc0c4d 100644 --- a/app.js +++ b/app.js @@ -5,6 +5,15 @@ const TESTS_LIST = ['Charles', 'Baruch','Frédéric', 'John', 'Dan', const NOBODY = '***NOBODY'; +let viewRounds; +let viewParticipants; + +function outputChanged(val){ + document.getElementById('rounds').innerHTML='' + let v = val == 0 ? viewParticipants : viewRounds; + document.getElementById('rounds').appendChild(v) +} + function groupSizeChanged(val){ let nbParticipants = document.getElementsByClassName('participant').length; let meetsPerRound = val - 1; @@ -157,8 +166,11 @@ function doIt(){ }) document.getElementById('rounds').innerHTML='' - let view = renderRounds(rounds) - document.getElementById('rounds').appendChild(view) + viewParticipants = rendeParticipantTables(participants, rounds) + document.getElementById('rounds').appendChild(viewParticipants) + viewRounds = renderRounds(rounds) + document.getElementById('participants-radio').disabled = false; + document.getElementById('rounds-radio').disabled = false; } function renderRounds(rounds){ @@ -200,3 +212,40 @@ function renderRounds(rounds){ }) return roundsBlock } + +function rendeParticipantTables(participants, rounds){ + let participantBlocks = document.createElement('div') + participantBlocks.classList.add('participant-blocks') + participants.forEach(function (p) { + let participantBlock = document.createElement('div') + participantBlocks.appendChild(participantBlock) + let participantName= document.createElement('h2') + participantName.appendChild(document.createTextNode(p)) + let placesBlock = document.createElement('ul') + participantBlock.append(participantName) + participantBlock.classList.add('participant-block') + participantBlock.append(placesBlock) + let roundNum = 1 + rounds.forEach(function (round) { + let groupNum = 1 + let roundBlock = document.createElement('li') + placesBlock.append(roundBlock) + round.forEach(function (group) { + group.forEach(function (p2) { + if(p2 === p){ + let roundNumSpan = document.createElement('span') + roundNumSpan.classList.add('round-num') + roundBlock.appendChild(roundNumSpan) + roundNumSpan.appendChild(document.createTextNode("Round " + roundNum +" : ")) + roundBlock.appendChild(document.createTextNode("Table " + groupNum)) + } + }) + groupNum ++ + }) + roundNum ++ + }) + + }) + + return participantBlocks +} diff --git a/css/app.css b/css/app.css index 8309184..87064b7 100644 --- a/css/app.css +++ b/css/app.css @@ -13,11 +13,11 @@ html, body{ #rounds, #participants{ padding:10px; } -.round{ +.round, .participant-blocks{ display:flex; flex-wrap: wrap; } -.group{ +.group, .participant-block{ margin:5px; border: 1px solid #aaa; border-radius:3px; @@ -25,6 +25,16 @@ html, body{ width: 15%; } + + +#btn-do-it{ + margin-right:50px; +} + +.round-num{ + font-weight: bold; +} + h4{ margin:5px; } diff --git a/index.html b/index.html index f9b1727..5e1b374 100644 --- a/index.html +++ b/index.html @@ -23,6 +23,10 @@ + + Participants output + Rounds output +