Done
It works as it should work. It isn't the prettiest at some places, but it will do it.
This commit is contained in:
parent
ef3300592f
commit
39d086573d
@ -27,25 +27,7 @@
|
||||
"file": "src/index.html",
|
||||
"settings":
|
||||
{
|
||||
"buffer_size": 3555,
|
||||
"encoding": "UTF-8",
|
||||
"line_ending": "Windows"
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "src/script/script.js",
|
||||
"settings":
|
||||
{
|
||||
"buffer_size": 6140,
|
||||
"encoding": "UTF-8",
|
||||
"line_ending": "Windows"
|
||||
}
|
||||
},
|
||||
{
|
||||
"file": "src/style/style.scss",
|
||||
"settings":
|
||||
{
|
||||
"buffer_size": 2227,
|
||||
"buffer_size": 4208,
|
||||
"encoding": "UTF-8",
|
||||
"line_ending": "Windows"
|
||||
}
|
||||
@ -83,10 +65,19 @@
|
||||
},
|
||||
"expanded_folders":
|
||||
[
|
||||
"/home/gergo/Documents/FortuneRoundtable"
|
||||
"/home/gergo/Documents/FortuneRoundtable",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src/script",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src/style"
|
||||
],
|
||||
"file_history":
|
||||
[
|
||||
"/home/gergo/Documents/FortuneRoundtable/build/index.html",
|
||||
"/home/gergo/Documents/FortuneRoundtable/build/onefile.html",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src/style/style.scss",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src/script/script.js",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src/index.html",
|
||||
"/home/gergo/Documents/FortuneRoundtable/src/script/jquery.fittext.js",
|
||||
"/H/Munkák/FortuneRoundtable/README.md",
|
||||
"/H/Munkák/FortuneRoundtable/src/script/jquery-3.3.1.min.js"
|
||||
],
|
||||
@ -128,7 +119,7 @@
|
||||
"groups":
|
||||
[
|
||||
{
|
||||
"selected": 2,
|
||||
"selected": 0,
|
||||
"sheets":
|
||||
[
|
||||
{
|
||||
@ -137,15 +128,15 @@
|
||||
"semi_transient": false,
|
||||
"settings":
|
||||
{
|
||||
"buffer_size": 3555,
|
||||
"buffer_size": 4208,
|
||||
"regions":
|
||||
{
|
||||
},
|
||||
"selection":
|
||||
[
|
||||
[
|
||||
3555,
|
||||
3555
|
||||
0,
|
||||
0
|
||||
]
|
||||
],
|
||||
"settings":
|
||||
@ -155,69 +146,7 @@
|
||||
"translate_tabs_to_spaces": true
|
||||
},
|
||||
"translation.x": 0.0,
|
||||
"translation.y": 674.0,
|
||||
"zoom_level": 1.0
|
||||
},
|
||||
"stack_index": 2,
|
||||
"type": "text"
|
||||
},
|
||||
{
|
||||
"buffer": 1,
|
||||
"file": "src/script/script.js",
|
||||
"semi_transient": false,
|
||||
"settings":
|
||||
{
|
||||
"buffer_size": 6140,
|
||||
"regions":
|
||||
{
|
||||
},
|
||||
"selection":
|
||||
[
|
||||
[
|
||||
6070,
|
||||
6070
|
||||
]
|
||||
],
|
||||
"settings":
|
||||
{
|
||||
"syntax": "Packages/JavaScript/JavaScript.sublime-syntax",
|
||||
"tab_size": 4,
|
||||
"translate_tabs_to_spaces": true,
|
||||
"word_wrap": true
|
||||
},
|
||||
"translation.x": 0.0,
|
||||
"translation.y": 2866.0,
|
||||
"zoom_level": 1.0
|
||||
},
|
||||
"stack_index": 1,
|
||||
"type": "text"
|
||||
},
|
||||
{
|
||||
"buffer": 2,
|
||||
"file": "src/style/style.scss",
|
||||
"semi_transient": false,
|
||||
"settings":
|
||||
{
|
||||
"buffer_size": 2227,
|
||||
"regions":
|
||||
{
|
||||
},
|
||||
"selection":
|
||||
[
|
||||
[
|
||||
232,
|
||||
232
|
||||
]
|
||||
],
|
||||
"settings":
|
||||
{
|
||||
"auto_name": "",
|
||||
"syntax": "Packages/CSS/CSS.sublime-syntax",
|
||||
"tab_size": 4,
|
||||
"translate_tabs_to_spaces": true
|
||||
},
|
||||
"translation.x": 0.0,
|
||||
"translation.y": 648.0,
|
||||
"translation.y": 0.0,
|
||||
"zoom_level": 1.0
|
||||
},
|
||||
"stack_index": 0,
|
||||
|
@ -37,7 +37,8 @@
|
||||
<div id="options">
|
||||
<input type="checkbox" id="remFromBOnMatch" onclick="updateOptions()"/><label for="remFromBOnMatch">Remove element from group B when it has a match</label>
|
||||
<br/>
|
||||
<button class="start" onclick="setupRoll()">Finish</button>
|
||||
<button class="start" onclick="reroll()">Finish</button>
|
||||
<button class="start" onclick="reset()">Clear ALL data</button>
|
||||
</div>
|
||||
</div>
|
||||
<div id="roller" style="display: none">
|
||||
@ -57,10 +58,19 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" class="roller__button" onclick="roll()">Roll!</button>
|
||||
<div id="roll_results" class="roller__results" style="display: none">
|
||||
<div id="resA" class="roller__result__label">
|
||||
<!-- here goes the result from group A -->
|
||||
</div>
|
||||
<div id="resB" class="roller__result__label roller__result__label__right">
|
||||
<!-- here goes the result from group B -->
|
||||
</div>
|
||||
<button onclick="reroll()" class="roller__button roller__result__button">Roll again!</button>
|
||||
</div>
|
||||
<button id="roller_button" type="button" class="roller__button" onclick="roll()">Roll!</button>
|
||||
</div>
|
||||
<div id="results" style="display: none">
|
||||
<table>
|
||||
<table class="resultsTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="groupAName">Group A</th>
|
||||
|
@ -42,7 +42,7 @@ function loadDataStore(){
|
||||
})
|
||||
$.each(dataStore.groupB, (i, val) => {
|
||||
var el=dataStore.entities[val];
|
||||
$("<li><button class=\"forfa\" onclick=\"remGroupA(this, '"+el.id+"')\"><i class=\"fa fa-times\"></i></button> <span>"+el.val+"</span></li>").hide().appendTo("#groupBList").slideDown();
|
||||
$("<li><button class=\"forfa\" onclick=\"remGroupB(this, '"+el.id+"')\"><i class=\"fa fa-times\"></i></button> <span>"+el.val+"</span></li>").hide().appendTo("#groupBList").slideDown();
|
||||
})
|
||||
|
||||
//load options
|
||||
@ -119,7 +119,7 @@ function addGroupB(){
|
||||
$("#groupBInput").val("");
|
||||
|
||||
//add to ui
|
||||
$("<li><button class=\"forfa\" onclick=\"remGroupA(this, '"+id+"')\"><i class=\"fa fa-times\"></i></button> <span>"+inp+"</span></li>").hide().appendTo("#groupBList").slideDown();
|
||||
$("<li><button class=\"forfa\" onclick=\"remGroupB(this, '"+id+"')\"><i class=\"fa fa-times\"></i></button> <span>"+inp+"</span></li>").hide().appendTo("#groupBList").slideDown();
|
||||
}
|
||||
function remGroupA(el, id){
|
||||
dataStore.groupA=dataStore.groupA.filter((el) => el!==id);
|
||||
@ -127,7 +127,8 @@ function remGroupA(el, id){
|
||||
$(el).parent().slideUp(() => $(el).parent().remove());
|
||||
}
|
||||
function remGroupB(el, id){
|
||||
dataStore.groupA=dataStore.groupB.filter((el) => el!==id);
|
||||
console.log(id);
|
||||
dataStore.groupB=dataStore.groupB.filter((el) => el!==id);
|
||||
saveDataStore();
|
||||
$(el).parent().slideUp(() => $(el).parent().remove());
|
||||
}
|
||||
@ -150,8 +151,10 @@ var countB=0;
|
||||
var degA=0;
|
||||
var degB=0;
|
||||
function setupRoll(){
|
||||
$("#roller").slideUp(() => {
|
||||
//set up roller A
|
||||
$("#rollerA").html("");
|
||||
$("#rollerA").css("transform", "rotate(0)");
|
||||
countA=dataStore.groupA.length;
|
||||
degA=360/countA;
|
||||
var dataA=dataStore.groupA.map((id) => dataStore.entities[id]);
|
||||
@ -164,6 +167,7 @@ function setupRoll(){
|
||||
|
||||
//set up roller B
|
||||
$("#rollerB").html("");
|
||||
$("#rollerB").css("transform", "rotate(0)");
|
||||
countB=dataStore.groupB.length;
|
||||
degB=360/countB;
|
||||
var dataB=dataStore.groupB.map((id) => dataStore.entities[id]);
|
||||
@ -181,19 +185,33 @@ function setupRoll(){
|
||||
baseRotateB=degB/2;
|
||||
}
|
||||
|
||||
$("#rollerA").css("transform", "rotate("+baseRotateA.toString()+"deg)");
|
||||
$("#rollerB").css("transform", "rotate("+baseRotateB.toString()+"deg)");
|
||||
//$("#rollerA").css("transform", "rotate("+baseRotateA.toString()+"deg)");
|
||||
//$("#rollerB").css("transform", "rotate("+baseRotateB.toString()+"deg)");
|
||||
|
||||
$("#editor").slideUp();
|
||||
$("#roller").slideDown();
|
||||
$("#roller_button").slideDown();
|
||||
})
|
||||
}
|
||||
|
||||
var idA="";
|
||||
var idB="";
|
||||
function roll(){
|
||||
$("#roller_button").slideUp();
|
||||
|
||||
var randA=Math.floor(Math.random()*countA);
|
||||
var randB=Math.floor(Math.random()*countB);
|
||||
idA=dataStore.groupA[randA];
|
||||
idB=dataStore.groupB[randB];
|
||||
|
||||
var rotA=(360*10)+baseRotateA+(randA*degA)+(degA/2);
|
||||
var rotB=(360*10)+baseRotateB+(randB*degB)+(degB/2);
|
||||
var rotA=(360*10)-((randA-1)*degA)-(degA/2);
|
||||
var rotB=(360*10)-((randB-1)*degB)-(degB/2);
|
||||
|
||||
dataStore.assignments.push({a: idA, b: idB});
|
||||
dataStore.groupA=dataStore.groupA.filter((id) => id!=idA);
|
||||
if(dataStore.options.remFromB){
|
||||
dataStore.groupB=dataStore.groupB.filter((id) => id!=idB);
|
||||
}
|
||||
|
||||
$("#rollerA").removeClass("roller__rotate");
|
||||
$("#rollerB").removeClass("roller__rotate");
|
||||
@ -202,5 +220,41 @@ function roll(){
|
||||
$("#rollerA").addClass("roller__rotate");
|
||||
$("#rollerB").addClass("roller__rotate");
|
||||
|
||||
console.log(randA, randB, rotA, rotB);
|
||||
setTimeout(finishRoll, 11500);
|
||||
saveDataStore();
|
||||
}
|
||||
|
||||
function finishRoll(){
|
||||
$("#resA").text(dataStore.entities[idA].val);
|
||||
$("#resB").text(dataStore.entities[idB].val);
|
||||
$("#roll_results").show();
|
||||
}
|
||||
|
||||
function reroll(){
|
||||
if(dataStore.groupA.length){
|
||||
$("#roll_results").slideUp();
|
||||
setupRoll();
|
||||
}
|
||||
else{
|
||||
showResults();
|
||||
}
|
||||
}
|
||||
|
||||
function showResults(){
|
||||
$("#editor").slideUp();
|
||||
$("#roller").slideUp();
|
||||
|
||||
$.each(dataStore.assignments, (i, val) => {
|
||||
var labelA=dataStore.entities[val.a].val;
|
||||
var labelB=dataStore.entities[val.b].val;
|
||||
|
||||
$("<tr><td>"+labelA+"</td><td>"+labelB+"</td></tr>").appendTo("#resultsTable");
|
||||
});
|
||||
|
||||
$("#results").slideDown();
|
||||
}
|
||||
|
||||
function reset(){
|
||||
localStorage.removeItem("dataStore");
|
||||
location.reload();
|
||||
}
|
@ -24,7 +24,10 @@ ul {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
column-gap: 5em;
|
||||
margin: 3em;
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
margin-bottom: 3em;
|
||||
overflow: hidden;
|
||||
}
|
||||
.roller__holder {
|
||||
width: 100%;
|
||||
@ -67,7 +70,6 @@ ul {
|
||||
left: 75%;
|
||||
right: 5%;
|
||||
height: 4%;
|
||||
font-size: 1.5em;
|
||||
background: grey;
|
||||
border: 1px solid darkgrey;
|
||||
border-radius: 1em;
|
||||
@ -86,12 +88,51 @@ ul {
|
||||
margin-right: 5%;
|
||||
width: 89%;
|
||||
font-size: 3em;
|
||||
background: repeating-linear-gradient(46deg, grey 0rem, grey 2rem, green 2rem, green 4rem, grey 4rem);
|
||||
background: repeating-linear-gradient(45deg, grey 0rem, grey 2rem, green 2rem, green 4rem, grey 4rem);
|
||||
border: 2px solid darkgreen;
|
||||
border-radius: 2rem;
|
||||
background-size: 200% 200%;
|
||||
animation: barberpole 10s linear infinite;
|
||||
}
|
||||
.roller__results {
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
left: 30%;
|
||||
right: 30%;
|
||||
height: 15%;
|
||||
z-index: 10;
|
||||
background: linear-gradient(30deg, green, darkgreen);
|
||||
background-size: 200% 200%;
|
||||
border-radius: 1em;
|
||||
overflow: auto;
|
||||
padding: 3em;
|
||||
animation: barberpole 10s linear infinite, growappear 0.5s linear;
|
||||
}
|
||||
.roller__result__label {
|
||||
background: grey;
|
||||
font-size: 2em;
|
||||
border-radius: 2em;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
color: white;
|
||||
padding: 0.3rem;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
float: left;
|
||||
width: 40%;
|
||||
}
|
||||
.roller__result__label__right {
|
||||
float: right;
|
||||
border-radius: 2em;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
text-align: right;
|
||||
}
|
||||
.roller__result__button {
|
||||
clear: both;
|
||||
font-size: 1em;
|
||||
margin-top: 4em;
|
||||
}
|
||||
|
||||
@keyframes barberpole {
|
||||
100% {
|
||||
@ -103,5 +144,27 @@ ul {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@keyframes growappear {
|
||||
0% {
|
||||
transform: scale(0);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.resultsTable {
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
font-size: 2em;
|
||||
}
|
||||
.resultsTable th {
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
.resultsTable td {
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
.resultsTable tr:nth-child(even) {
|
||||
background: lightgrey;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=style.css.map */
|
||||
|
@ -1 +1 @@
|
||||
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAA;EACI;EACA;;;AAGJ;EACI;;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGR;EACI;IACI;;;AAGR;EACI;IACI","file":"style.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["style.scss"],"names":[],"mappings":"AAAA;EACI;EACA;;;AAGJ;EACI;;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;;AAEJ;EACI;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;EACA;EACA;;AAEJ;EACI;EACA;EACA;;;AAGR;EACI;IACI;;;AAGR;EACI;IACI;;;AAGR;EACI;IACI;;EAEJ;IACI;;;AAIR;EACI;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAEJ;EACI","file":"style.css"}
|
@ -26,7 +26,10 @@ ul{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr auto 1fr;
|
||||
column-gap: 5em;
|
||||
margin: 3em;
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
margin-bottom: 3em;
|
||||
overflow: hidden;
|
||||
}
|
||||
&__holder{
|
||||
width: 100%;
|
||||
@ -71,7 +74,6 @@ ul{
|
||||
left: 75%;
|
||||
right: 5%;
|
||||
height: 4%;
|
||||
font-size: 1.5em;
|
||||
background: grey;
|
||||
border: 1px solid darkgrey;
|
||||
border-radius: 1em;
|
||||
@ -91,12 +93,52 @@ ul{
|
||||
margin-right: 5%;
|
||||
width: 89%;
|
||||
font-size: 3em;
|
||||
background: repeating-linear-gradient(46deg, grey 0rem, grey 2rem, green 2rem, green 4rem, grey 4rem);
|
||||
background: repeating-linear-gradient(45deg, grey 0rem, grey 2rem, green 2rem, green 4rem, grey 4rem);
|
||||
border: 2px solid darkgreen;
|
||||
border-radius: 2rem;
|
||||
background-size: 200% 200%;
|
||||
animation: barberpole 10s linear infinite;
|
||||
}
|
||||
|
||||
&__results{
|
||||
position: absolute;
|
||||
top: 10%;
|
||||
left: 30%;
|
||||
right: 30%;
|
||||
height: 15%;
|
||||
z-index: 10;
|
||||
background: linear-gradient(30deg, green, darkgreen);
|
||||
background-size: 200% 200%;
|
||||
border-radius: 1em;
|
||||
overflow: auto;
|
||||
padding: 3em;
|
||||
animation: barberpole 10s linear infinite, growappear 0.5s linear;
|
||||
}
|
||||
&__result__label{
|
||||
background: grey;
|
||||
font-size: 2em;
|
||||
border-radius: 2em;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
color: white;
|
||||
padding: 0.3rem;
|
||||
padding-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
float: left;
|
||||
width: 40%;
|
||||
}
|
||||
&__result__label__right{
|
||||
float: right;
|
||||
border-radius: 2em;
|
||||
border-top-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
text-align: right;
|
||||
}
|
||||
&__result__button{
|
||||
clear: both;
|
||||
font-size: 1em;
|
||||
margin-top: 4em;
|
||||
}
|
||||
}
|
||||
@keyframes barberpole{
|
||||
100%{
|
||||
@ -108,3 +150,28 @@ ul{
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
}
|
||||
@keyframes growappear{
|
||||
0%{
|
||||
transform: scale(0);
|
||||
}
|
||||
100%{
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
|
||||
.resultsTable{
|
||||
width: 95%;
|
||||
margin: auto;
|
||||
font-size: 2em;
|
||||
|
||||
th{
|
||||
padding-bottom: 2em;
|
||||
}
|
||||
|
||||
td{
|
||||
border-bottom: 1px solid black;
|
||||
}
|
||||
tr:nth-child(even){
|
||||
background: lightgrey;
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user