monkeytypegame/monkeytype
1
1
Fork 0
mirror of https://github.com/monkeytypegame/monkeytype.git synced 2025-10-18 11:36:13 +08:00
Code Issues Projects Releases Packages Wiki Activity

added background loading indicator

Browse source
This commit is contained in:
Jack 2020-06-12 17:30:20 +01:00
parent e8ef0b7731
commit 7ba00ff11e
3 changed files with 40 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

25
public/css/style.scss
View file

@ -75,6 +75,31 @@ a:hover {
top: -5rem;
}
#backgroundLoader{
height: 3px;
position: fixed;
width: 100%;
background: var(--main-color);
animation-name: loader;
animation-iteration-count: infinite;
animation-duration: 2s;
animation-timing-function: cubic-bezier(0.38, 0.16, 0.57, 0.82);
}
@keyframes loader{
0%{
width: 0;
left: 0;
}
50%{
width:100%;
left: 0;
}
100%{
width: 0;
left: 100%;
}
}
#tagsWrapper{
width: 100%;

1
public/index.html
View file

@ -28,6 +28,7 @@
</head>
<body>
<div id="backgroundLoader" style="display:none"></div>
<div class="nameChangeMessage" style="background-color: var(--main-color);padding: 0.5rem;text-align: center;color: var(--bg-color);display:none;">
Important information about your account. Please click this message.
</div>

14
public/js/script.js
View file

@ -1315,6 +1315,14 @@ function hideEditTags(){
}
}
function showBackgroundLoader(){
$("#backgroundLoader").stop(true,true).fadeIn(125);
}
function hideBackgroundLoader(){
$("#backgroundLoader").stop(true,true).fadeOut(125);
}
$("#tagsWrapper").click(e => {
if($(e.target).attr('id') === "tagsWrapper"){
hideEditTags();
@ -1327,7 +1335,9 @@ $("#tagsWrapper #tagsEdit .button").click(e => {
let tagid = $("#tagsWrapper #tagsEdit").attr('tagid');
hideEditTags();
if(action === "add"){
showBackgroundLoader();
addTag({uid:firebase.auth().currentUser.uid,name:inputVal}).then(e => {
hideBackgroundLoader();
let status = e.data.resultCode;
if(status === 1){
showNotification('Tag added',2000);
@ -1344,7 +1354,9 @@ $("#tagsWrapper #tagsEdit .button").click(e => {
}
})
}else if(action === "edit"){
showBackgroundLoader();
editTag({uid:firebase.auth().currentUser.uid,name:inputVal,tagid:tagid}).then(e => {
hideBackgroundLoader();
let status = e.data.resultCode;
if(status === 1){
showNotification('Tag updated',2000);
@ -1362,7 +1374,9 @@ $("#tagsWrapper #tagsEdit .button").click(e => {
}
})
}else if(action === "remove"){
showBackgroundLoader();
removeTag({uid:firebase.auth().currentUser.uid,tagid:tagid}).then(e => {
hideBackgroundLoader();
let status = e.data.resultCode;
if(status === 1){
showNotification('Tag removed',2000);