Several good changes

* Add vote validation before submitting
* Show 'Saved Vote' after vote saved, fade out message
* Increase flash message size
* Randomize order of games in voting list (Issue #5)
* Embiggen ScreenShots on Click
This commit is contained in:
2017-07-09 19:18:03 -05:00
parent 262c855643
commit 2fe197b99d
6 changed files with 204 additions and 98 deletions

View File

@@ -136,6 +136,10 @@ img.thumbnail {
margin-bottom: 5px;
}
.large {
font-size: 18px;
}
.big-space {
margin: 10px;
}
@@ -216,6 +220,22 @@ table tfoot {
text-align: center;
}
div#embiggenedScreenShot {
cursor: pointer;
background-color: #FFF;
}
div.fullscreen {
height: 100%;
width: 100%;
position: absolute;
top: 0px;
left: 0px;
text-align: center;
margin: auto auto;
z-index:1001;
}
@media (min-width: 40em) {
#menu {
width: 150px;
@@ -244,7 +264,7 @@ table tfoot {
}
aside.flash {
margin-left: 150px;
font-size: 24px;
}
aside.flash.error {

View File

@@ -1,5 +1,12 @@
function toggleAdminPanel() {
document.querySelector('#menu').classList.toggle('hidden');
var menu = document.querySelector('#menu');
if(menu.classList.contains('hidden')) {
document.querySelector('#layout>.content').style.marginLeft='150px';
menu.classList.remove('hidden');
} else {
document.querySelector('#layout>.content').style.marginLeft='0';
menu.classList.add('hidden');
}
}
@@ -64,3 +71,35 @@ function hideModal() {
buttonsDiv.removeChild(buttonsDiv.firstChild);
}
}
function setFlashMessage(msg, cls) {
var flash = document.querySelector('aside.flash');
flash.innerText = msg;
for(var i = 0; i < cls.length; i++) {
flash.classList.add(cls[i]);
}
flash.classList.remove('hidden');
flash.style.opacity=1;
handleFlashMessage();
}
function handleFlashMessage() {
var flash = document.querySelector('aside.flash');
if(flash.classList.contains('fading')) {
setTimeout(fadeOutFlashMessage, 1000);
}
}
function fadeOutFlashMessage() {
var flash = document.querySelector('aside');
var opac = flash.style.opacity;
if(opac == "") { opac = 1; }
if(opac > 0) {
setTimeout(function() {
flash.style.opacity = opac - 0.01;
fadeOutFlashMessage();
}, 10);
}
}
handleFlashMessage();