client/home: render disk usage and post count

client/html/home.tpl

@@ -1,5 +1,8 @@
 <div class='content-wrapper transparent' id='home'>
     <div class='messages'></div>
+    <header>
         <h1><%= ctx.name %></h1>
+        <p>Serving <%= ctx.postCount %> posts (<%= ctx.makeFileSize(ctx.diskUsage) %>)</p>
+    </header>
     <footer>Version: <a class='version' href='https://github.com/rr-/szurubooru/commits/master'><%= ctx.version %></a> (built <%= ctx.makeRelativeTime(ctx.buildDate) %>)</footer>
 </div>

client/js/controllers/home_controller.js

@@ -1,6 +1,8 @@
 'use strict';
 
 const page = require('page');
+const api = require('../api.js');
+const events = require('../events.js');
 const topNavController = require('../controllers/top_nav_controller.js');
 const HomeView = require('../views/home_view.js');
 const NotFoundView = require('../views/not_found_view.js');
@@ -18,7 +20,19 @@ class HomeController {
 
     _indexRoute() {
         topNavController.activate('home');
+
+        api.get('/info')
+            .then(response => {
+                this._homeView.render({
+                    diskUsage: response.diskUsage,
+                    postCount: response.postCount,
+                    featuredPost: response.featuredPost,
+                });
+            },
+            response => {
                 this._homeView.render({});
+                events.notify(events.Error, response.description);
+            });
     }
 
     _notFoundRoute(ctx) {

client/js/util/misc.js

@@ -11,6 +11,35 @@ function* range(start=0, end=null, step=1) {
     }
 }
 
+function _formatUnits(number, base, suffixes, callback) {
+    if (!number && number !== 0) {
+        return NaN;
+    }
+    number *= 1.0;
+    let suffix = suffixes.shift();
+    while (number >= base && suffixes.length > 0) {
+        suffix = suffixes.shift();
+        number /= base;
+    }
+    if (callback === undefined) {
+        callback = (number, suffix) => {
+            return suffix ? number.toFixed(1) + suffix : number;
+        };
+    }
+    return callback(number, suffix);
+}
+
+function formatFileSize(fileSize) {
+    return _formatUnits(
+        fileSize,
+        1024,
+        ['B', 'K', 'M', 'G'],
+        (number, suffix) => {
+            const decimalPlaces = number < 20 && suffix !== 'B' ? 1 : 0;
+            return number.toFixed(decimalPlaces) + suffix;
+        });
+}
+
 function formatRelativeTime(timeString) {
     if (!timeString) {
         return 'never';
@@ -108,5 +137,6 @@ module.exports = {
     parseSearchQuery: parseSearchQuery,
     parseSearchQueryRoute: parseSearchQueryRoute,
     formatRelativeTime: formatRelativeTime,
+    formatFileSize: formatFileSize,
     unindent: unindent,
 };

client/js/util/views.js

@@ -24,6 +24,10 @@ function _makeLabel(options, attrs) {
     return makeNonVoidElement('label', attrs, options.text);
 }
 
+function makeFileSize(fileSize) {
+    return misc.formatFileSize(fileSize);
+}
+
 function makeRelativeTime(time) {
     return makeNonVoidElement(
         'time',
@@ -244,6 +248,7 @@ function getTemplate(templatePath) {
         }
         Object.assign(ctx, {
             makeRelativeTime: makeRelativeTime,
+            makeFileSize: makeFileSize,
             makeThumbnail: makeThumbnail,
             makeRadio: makeRadio,
             makeCheckbox: makeCheckbox,

client/js/views/home_view.js

@@ -14,6 +14,8 @@ class HomeView {
             name: config.name,
             version: config.meta.version,
             buildDate: config.meta.buildDate,
+            diskUsage: ctx.diskUsage,
+            postCount: ctx.postCount,
         });
 
         views.listenToMessages(source);