removed loader animation - it was causing issues with initial focus on the tree (probably by stealing focus)

This commit is contained in:
azivner 2018-01-02 22:01:38 -05:00
parent e32289720c
commit b545100cad
6 changed files with 8 additions and 40 deletions

View file

@ -155,27 +155,6 @@ $(document).tooltip({
}
});
let appShown = false;
function showAppIfHidden() {
if (!appShown) {
appShown = true;
$("#container").show();
// Get a reference to the loader's div
const loaderDiv = document.getElementById("loader-wrapper");
// When the transition ends remove loader's div from display
// so that we can access the map with gestures or clicks
loaderDiv.addEventListener("transitionend", function(){
loaderDiv.style.display = "none";
}, true);
// Kick off the CSS transition
loaderDiv.style.opacity = 0.0;
}
}
window.onerror = function (msg, url, lineNo, columnNo, error) {
const string = msg.toLowerCase();

View file

@ -130,8 +130,6 @@ const noteEditor = (function() {
// after loading new note make sure editor is scrolled to the top
noteDetailWrapperEl.scrollTop(0);
showAppIfHidden();
}
async function loadNote(noteId) {

View file

@ -573,9 +573,6 @@ const noteTree = (function() {
// so waiting a second helps
setTimeout(scrollToCurrentNote, 1000);
}
else {
showAppIfHidden();
}
},
hotkeys: {
keydown: keybindings

View file

@ -22,9 +22,6 @@ const protected_session = (function() {
const dfd = $.Deferred();
if (requireProtectedSession && !isProtectedSessionAvailable()) {
// if this is entry point then we need to show the app even before the note is loaded
showAppIfHidden();
protectedSessionDeferred = dfd;
dialogEl.dialog({

View file

@ -199,11 +199,4 @@ div.ui-tooltip {
.suppressed {
filter: opacity(7%);
}
#loader-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;background-color:#fff;opacity:1;transition:opacity 2s ease}
#loader{display:block;position:relative;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;border:3px solid transparent;border-top-color:#777;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}
#loader:before{content:"";position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;border:3px solid transparent;border-top-color:#aaa;-webkit-animation:spin 3s linear infinite;animation:spin 3s linear infinite}
#loader:after{content:"";position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;border:3px solid transparent;border-top-color:#ddd;-webkit-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite}
@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}
@keyframes spin{0%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}
}

View file

@ -5,9 +5,7 @@
<title>Trilium Notes</title>
</head>
<body>
<div id="loader-wrapper"><div id="loader"></div></div>
<div id="container" style="display: none;">
<div id="container" style="display:none;">
<div id="header" class="hide-toggle">
<div id="header-title">
<img src="images/app-icons/png/24x24.png">
@ -399,5 +397,11 @@
<script src="javascripts/link.js"></script>
<script src="javascripts/sync.js"></script>
<script src="javascripts/messaging.js"></script>
<script type="text/javascript">
// we hide container initally because otherwise it is rendered first without CSS and then flickers into
// final form which is pretty ugly.
$("#container").show();
</script>
</body>
</html>