diff --git a/fortuneRoundtable.sublime-workspace b/fortuneRoundtable.sublime-workspace
index 8161590..22decf5 100644
--- a/fortuneRoundtable.sublime-workspace
+++ b/fortuneRoundtable.sublime-workspace
@@ -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,
diff --git a/src/index.html b/src/index.html
index 2026b68..45f4ab0 100644
--- a/src/index.html
+++ b/src/index.html
@@ -37,7 +37,8 @@
-
+
+
@@ -57,10 +58,19 @@
-
+
+
+
+
+
+
+
+
+
+
-
+
Group A |
diff --git a/src/script/script.js b/src/script/script.js
index 417963a..64c25a9 100644
--- a/src/script/script.js
+++ b/src/script/script.js
@@ -42,7 +42,7 @@ function loadDataStore(){
})
$.each(dataStore.groupB, (i, val) => {
var el=dataStore.entities[val];
- $(" "+el.val+"").hide().appendTo("#groupBList").slideDown();
+ $(" "+el.val+"").hide().appendTo("#groupBList").slideDown();
})
//load options
@@ -119,7 +119,7 @@ function addGroupB(){
$("#groupBInput").val("");
//add to ui
- $(" "+inp+"").hide().appendTo("#groupBList").slideDown();
+ $(" "+inp+"").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,50 +151,67 @@ var countB=0;
var degA=0;
var degB=0;
function setupRoll(){
- //set up roller A
- $("#rollerA").html("");
- countA=dataStore.groupA.length;
- degA=360/countA;
- var dataA=dataStore.groupA.map((id) => dataStore.entities[id]);
- $.each(dataA, (i, val) => {
- var rotSlicer=i*degA;
- var rotLabel=((i-1)*degA)+(degA/2);
- $("").appendTo("#rollerA");
- $(""+val.val+"
").appendTo("#rollerA");
+ $("#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]);
+ $.each(dataA, (i, val) => {
+ var rotSlicer=i*degA;
+ var rotLabel=((i-1)*degA)+(degA/2);
+ $("").appendTo("#rollerA");
+ $(""+val.val+"
").appendTo("#rollerA");
+ })
+
+ //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]);
+ $.each(dataB, (i, val) => {
+ var rotSlicer=i*degB;
+ var rotLabel=((i-1)*degB)+(degB/2);
+ $("").appendTo("#rollerB");
+ $(""+val.val+"
").appendTo("#rollerB");
+ });
+
+ if(countA%2!==0){
+ baseRotateA=-degA/2;
+ }
+ if(countB%2!==0){
+ baseRotateB=degB/2;
+ }
+
+ //$("#rollerA").css("transform", "rotate("+baseRotateA.toString()+"deg)");
+ //$("#rollerB").css("transform", "rotate("+baseRotateB.toString()+"deg)");
+
+ $("#editor").slideUp();
+ $("#roller").slideDown();
+ $("#roller_button").slideDown();
})
-
- //set up roller B
- $("#rollerB").html("");
- countB=dataStore.groupB.length;
- degB=360/countB;
- var dataB=dataStore.groupB.map((id) => dataStore.entities[id]);
- $.each(dataB, (i, val) => {
- var rotSlicer=i*degB;
- var rotLabel=((i-1)*degB)+(degB/2);
- $("").appendTo("#rollerB");
- $(""+val.val+"
").appendTo("#rollerB");
- });
-
- if(countA%2!==0){
- baseRotateA=-degA/2;
- }
- if(countB%2!==0){
- baseRotateB=degB/2;
- }
-
- $("#rollerA").css("transform", "rotate("+baseRotateA.toString()+"deg)");
- $("#rollerB").css("transform", "rotate("+baseRotateB.toString()+"deg)");
-
- $("#editor").slideUp();
- $("#roller").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;
+
+ $("
"+labelA+" | "+labelB+" |
").appendTo("#resultsTable");
+ });
+
+ $("#results").slideDown();
+}
+
+function reset(){
+ localStorage.removeItem("dataStore");
+ location.reload();
}
\ No newline at end of file
diff --git a/src/style/style.css b/src/style/style.css
index 021dcf1..9e38202 100644
--- a/src/style/style.css
+++ b/src/style/style.css
@@ -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 */
diff --git a/src/style/style.css.map b/src/style/style.css.map
index eddab03..26df36b 100644
--- a/src/style/style.css.map
+++ b/src/style/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"}
\ No newline at end of file
+{"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"}
\ No newline at end of file
diff --git a/src/style/style.scss b/src/style/style.scss
index f9bfcd8..11a150b 100644
--- a/src/style/style.scss
+++ b/src/style/style.scss
@@ -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%{
@@ -107,4 +149,29 @@ ul{
0%{
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;
+ }
}
\ No newline at end of file