diff options
| author | David Thompson <dthompson2@worcester.edu> | 2014-10-15 22:36:58 -0400 |
|---|---|---|
| committer | David Thompson <dthompson2@worcester.edu> | 2014-10-15 22:36:58 -0400 |
| commit | 43dc1e9dcc762be0f0e24c80f862f8425b093133 (patch) | |
| tree | 4fe2171b55d607c3b33016440cb11dd03b26682a /js/view | |
| parent | c45bbaf0c3aaf91150088d5153bfaa86c092fdf7 (diff) | |
js: Add loading spinner to packages page.
* css/guix.css: Add spinner styles.
* js/controller/packages.js (guix.packages.view): Explicitly redraw
after loading packages.
* js/model/packages.js (guix.packages.Packages): Load packages in the
background.
* js/view/layout.js (guix.withLayout): Cast elem to array if needed.
* js/view/packages.js (guix.packages.view): Render spinner when there
are no packages to display.
Diffstat (limited to 'js/view')
| -rw-r--r-- | js/view/layout.js | 4 | ||||
| -rw-r--r-- | js/view/packages.js | 8 |
2 files changed, 9 insertions, 3 deletions
diff --git a/js/view/layout.js b/js/view/layout.js index 1ff641a..aa7834b 100644 --- a/js/view/layout.js +++ b/js/view/layout.js @@ -42,6 +42,10 @@ guix.withLayout = (function() { ])); return function(elem) { + if(!_.isArray(elem)) { + elem = [elem]; + } + return [ m("nav.navbar.navbar-default.navbar-static-top", { role: "navigation" diff --git a/js/view/packages.js b/js/view/packages.js index e356984..e202471 100644 --- a/js/view/packages.js +++ b/js/view/packages.js @@ -16,6 +16,8 @@ // <http://www.gnu.org/licenses/>. (function(packages) { + var spinner = m(".spinner-container", m(".spinner")); + packages.view = function(ctrl) { function renderName(package) { var name = package.name; @@ -95,7 +97,7 @@ }, m("a", { href: "#" }, text)); } - return m("ul.pagination", [ + return m("div", m("ul.pagination", [ // Back page renderPage("«", { class: ctrl.isFirstPage() ? "disabled" : "", @@ -125,7 +127,7 @@ return false; } }) - ])); + ]))); } function renderSearchBox() { @@ -237,7 +239,7 @@ return null; } - return guix.withLayout([ + return guix.withLayout(_.isEmpty(ctrl.pages()) ? spinner : [ m("h2", [ "Packages", m("span.badge", ctrl.packageCount()) |