Patchwork [18,of,20] hgweb: add loading indicator for ajaxy loads

login
register
mail settings
Submitter Alexander Plavin
Date Aug. 9, 2013, 6:57 p.m.
Message ID <bfe92dd16d91ab859180.1376074663@debian-alexander.dolgopa>
Download mbox | patch
Permalink /patch/2123/
State Changes Requested
Headers show

Comments

Alexander Plavin - Aug. 9, 2013, 6:57 p.m.
# HG changeset patch
# User Alexander Plavin <alexander@plav.in>
# Date 1376071479 -14400
#      Fri Aug 09 22:04:39 2013 +0400
# Node ID bfe92dd16d91ab859180beee692ead44fcde6001
# Parent  a587ef25f492acec63d069337b730db7a67fcd77
hgweb: add loading indicator for ajaxy loads

Add simple animation of the indicator to the paper style CSS.

Patch

diff -r a587ef25f492 -r bfe92dd16d91 mercurial/templates/static/mercurial.js
--- a/mercurial/templates/static/mercurial.js	Fri Aug 09 22:02:32 2013 +0400
+++ b/mercurial/templates/static/mercurial.js	Fri Aug 09 22:04:39 2013 +0400
@@ -365,7 +365,7 @@ 
     }
 }
 
-function ajaxScrollInit(urlFormat, lastHash, container) {
+function ajaxScrollInit(urlFormat, lastHash, container, messageFormat) {
     updateInitiated = false;
 
     window.onscroll = function () {
@@ -386,6 +386,12 @@ 
                 'GET',
                 function onstart() {
                     container.lastElementChild.classList.add('scroll-separator');
+
+                    var message = {
+                        class: 'scroll-loading',
+                        text: 'Loading...'
+                    };
+                    appendHTML(container, format(messageFormat, message));
                 },
                 function onsuccess(xml) {
                     var html = xml.getElementsByTagName('html')[0];
@@ -399,6 +405,7 @@ 
                 function onerror(errorText) {
                 },
                 function oncomplete() {
+                    removeByClassName('scroll-loading');
                     updateInitiated = false;
                 }
             );
diff -r a587ef25f492 -r bfe92dd16d91 mercurial/templates/static/style-paper.css
--- a/mercurial/templates/static/style-paper.css	Fri Aug 09 22:02:32 2013 +0400
+++ b/mercurial/templates/static/style-paper.css	Fri Aug 09 22:04:39 2013 +0400
@@ -383,6 +383,26 @@ 
     color: blue;
 }
 
+.scroll-loading {
+  -webkit-animation: change_color 1s linear 0s infinite alternate;
+  -moz-animation: change_color 1s linear 0s infinite alternate;
+  -o-animation: change_color 1s linear 0s infinite alternate;
+  animation: change_color 1s linear 0s infinite alternate;
+}
+
+@-webkit-keyframes change_color {
+  from { background-color: #A0CEFF; } to {  }
+}
+@-moz-keyframes change_color {
+  from { background-color: #A0CEFF; } to {  }
+}
+@-o-keyframes change_color {
+  from { background-color: #A0CEFF; } to {  }
+}
+@keyframes change_color {
+  from { background-color: #A0CEFF; } to {  }
+}
+
 .scroll-separator {
     border-bottom: 1px solid #444 !important;
 }