Removed init and loading-error css and logic
Because all pages are complete pages that can be viewed with or without javascript, the 'init' and 'loading-error' classes should not be set on the '#page-content' div. Similarly the 'loading' class should not be set on '#nav'. All associated logic and css for the 'init' and 'loading' classes is also unused. This commit removes the aforementioned. Signed-off-by: Collin J. Doering <collin.doering@rekahsoft.ca>
This commit is contained in:
parent
a21fe60c9e
commit
bc1cfaabeb
16
clay/Main.hs
16
clay/Main.hs
|
@ -155,22 +155,6 @@ pageContent = do
|
||||||
transition "opacity" (sec 1) easeIn (sec 0.5)
|
transition "opacity" (sec 1) easeIn (sec 0.5)
|
||||||
opacity 1
|
opacity 1
|
||||||
|
|
||||||
"#page-content" # ".loading-error" ** p ? do
|
|
||||||
backgroundColor "#fd6f6f"
|
|
||||||
backgroundImage $ url "/images/error-loading.png"
|
|
||||||
backgroundRepeat noRepeat
|
|
||||||
backgroundPosition $ positioned (pct 50) (pct 50)
|
|
||||||
height (px 200)
|
|
||||||
fontWeight bold
|
|
||||||
lineHeight (px 200)
|
|
||||||
textAlign $ alignSide sideCenter
|
|
||||||
|
|
||||||
"#page-content" # ".init" # ".loading" ? do
|
|
||||||
backgroundImage $ url "/images/init-loading.gif"
|
|
||||||
backgroundRepeat noRepeat
|
|
||||||
backgroundPosition $ positioned (pct 50) (pct 50)
|
|
||||||
height (px 125)
|
|
||||||
|
|
||||||
"#page-content" ** ul |> (li # ":before") ? do
|
"#page-content" ** ul |> (li # ":before") ? do
|
||||||
content $ stringContent "\\2192"
|
content $ stringContent "\\2192"
|
||||||
paddingRight (em 0.5)
|
paddingRight (em 0.5)
|
||||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 26 KiB |
|
@ -189,9 +189,6 @@ _paq.push(['enableLinkTracking']);
|
||||||
type: 'GET',
|
type: 'GET',
|
||||||
dataType: 'html',
|
dataType: 'html',
|
||||||
beforeSend: function (xhr, settings) {
|
beforeSend: function (xhr, settings) {
|
||||||
// Remove loading error from page-content
|
|
||||||
$('#page-content').removeClass('loading-error');
|
|
||||||
|
|
||||||
// Add .loading to #page-content and #nav to facilitate a loading animation
|
// Add .loading to #page-content and #nav to facilitate a loading animation
|
||||||
$('#page-content, #nav').removeClass('loading-done').addClass('loading');
|
$('#page-content, #nav').removeClass('loading-done').addClass('loading');
|
||||||
|
|
||||||
|
@ -203,9 +200,6 @@ _paq.push(['enableLinkTracking']);
|
||||||
console.log('beforeSend a.menuitem');
|
console.log('beforeSend a.menuitem');
|
||||||
},
|
},
|
||||||
success: function (dta) {
|
success: function (dta) {
|
||||||
// Remove the initial loading gif (if its there)
|
|
||||||
$('#page-content').removeClass('init');
|
|
||||||
|
|
||||||
// Remove any status message errors or successes
|
// Remove any status message errors or successes
|
||||||
$('#status').slideUp('normal', function () {
|
$('#status').slideUp('normal', function () {
|
||||||
$('#status').removeClass('error').removeClass('success').children('p.message').remove();
|
$('#status').removeClass('error').removeClass('success').children('p.message').remove();
|
||||||
|
@ -261,20 +255,13 @@ _paq.push(['enableLinkTracking']);
|
||||||
},
|
},
|
||||||
error: function (xhr, status) {
|
error: function (xhr, status) {
|
||||||
/* Remove .loading from #page-content and #nav to stop the loading
|
/* Remove .loading from #page-content and #nav to stop the loading
|
||||||
* animation. Then add .loading-error to #page-content if its the sites
|
* animation. Finally, display an error message in #status.
|
||||||
* first load (#page-content has class .init). Finally, display an error
|
|
||||||
* message in #status.
|
|
||||||
*/
|
*/
|
||||||
$('#page-content, #nav').removeClass('loading');
|
$('#page-content, #nav').removeClass('loading');
|
||||||
if ($('#page-content.init')[0]) {
|
|
||||||
// TODO: instead of immediately displaying error, check if the content is stored in local storage
|
// TODO: instead of immediately displaying error, check if the content is stored in local storage
|
||||||
$('#page-content').addClass('loading-error').html('<p class="container border-box">Error initially loading blog.rekahsoft.ca. Check the url! Given "' + page_href + '"</p>');
|
$('#status').prepend('<p class="message">Error retrieving page ' + page_href + '</p>');
|
||||||
} else if ($('#status.error')[0]) {
|
$('#status').addClass('error').slideDown();
|
||||||
$('#status').prepend('<p class="message">Error retrieving page ' + page_href + '</p>');
|
|
||||||
} else {
|
|
||||||
$('#status').prepend('<p class="message">Error retrieving page ' + page_href + '</p>');
|
|
||||||
$('#status').addClass('error').slideDown();
|
|
||||||
}
|
|
||||||
|
|
||||||
// Run current handles onError callback (if it exists)
|
// Run current handles onError callback (if it exists)
|
||||||
if (handlerCallback.hasOwnProperty('onError') && typeof handlerCallback.onError === 'function') {
|
if (handlerCallback.hasOwnProperty('onError') && typeof handlerCallback.onError === 'function') {
|
||||||
|
|
|
@ -21,20 +21,6 @@
|
||||||
|
|
||||||
<!-- Favicons -->
|
<!-- Favicons -->
|
||||||
<link href="/images/favicon.ico" rel="shortcut icon">
|
<link href="/images/favicon.ico" rel="shortcut icon">
|
||||||
|
|
||||||
<noscript>
|
|
||||||
<style>
|
|
||||||
#page-content.init.loading {
|
|
||||||
opacity: 1;
|
|
||||||
height: 100%;
|
|
||||||
background-position: -100px -100px
|
|
||||||
}
|
|
||||||
|
|
||||||
#nav.loading {
|
|
||||||
animation-play-state: paused;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</noscript>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
@ -49,7 +35,7 @@
|
||||||
<a class="close-button">Close</a>
|
<a class="close-button">Close</a>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="init loading" id="page-content">
|
<div id="page-content">
|
||||||
<noscript>
|
<noscript>
|
||||||
<div class="container" id="noscript-alert">
|
<div class="container" id="noscript-alert">
|
||||||
<h1>This site requires javascript!</h1>
|
<h1>This site requires javascript!</h1>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class="loading" id="nav">
|
<div id="nav">
|
||||||
<ul class="container" id="nav-menu">
|
<ul class="container" id="nav-menu">
|
||||||
$for(pagesFirst)$
|
$for(pagesFirst)$
|
||||||
<li>
|
<li>
|
||||||
|
|
Loading…
Reference in New Issue