From 5053598a1358f13abd8a2603b6501fa95c7c21f7 Mon Sep 17 00:00:00 2001
From: rr- <rr-@sakuya.pl>
Date: Sat, 9 Apr 2016 22:35:09 +0200
Subject: [PATCH] client/views: extract empty view

...so that UsersController doesn't mess with DOM.
---
 client/js/controllers/users_controller.js |  4 +++-
 client/js/util/views.js                   |  7 -------
 client/js/views/empty_view.js             | 18 ++++++++++++++++++
 client/js/views/help_view.js              | 15 ++++++---------
 4 files changed, 27 insertions(+), 17 deletions(-)
 create mode 100644 client/js/views/empty_view.js

diff --git a/client/js/controllers/users_controller.js b/client/js/controllers/users_controller.js
index db35a025..784c60ee 100644
--- a/client/js/controllers/users_controller.js
+++ b/client/js/controllers/users_controller.js
@@ -9,11 +9,13 @@ const views = require('../util/views.js');
 const topNavController = require('../controllers/top_nav_controller.js');
 const RegistrationView = require('../views/registration_view.js');
 const UserView = require('../views/user_view.js');
+const EmptyView = require('../views/empty_view.js');
 
 class UsersController {
     constructor() {
         this.registrationView = new RegistrationView();
         this.userView = new UserView();
+        this.emptyView = new EmptyView();
     }
 
     registerRoutes() {
@@ -59,7 +61,7 @@ class UsersController {
                 this.user = response.user;
                 next();
             }).catch(response => {
-                views.emptyView(document.getElementById('content-holder'));
+                this.emptyView.render();
                 events.notify(events.Error, response.description);
             });
         }
diff --git a/client/js/util/views.js b/client/js/util/views.js
index 98350f81..d539c65c 100644
--- a/client/js/util/views.js
+++ b/client/js/util/views.js
@@ -84,12 +84,6 @@ function enableForm(form) {
     }
 }
 
-function emptyView(target) {
-    const ret = showView(target, htmlToDom('<div class="messages"></div>'));
-    listenToMessages(target);
-    return ret;
-}
-
 function showView(target, source) {
     return new Promise((resolve, reject) => {
         let observer = new MutationObserver(mutations => {
@@ -116,7 +110,6 @@ module.exports = {
     htmlToDom: htmlToDom,
     getTemplate: getTemplate,
     showView: showView,
-    emptyView: emptyView,
     enableForm: enableForm,
     disableForm: disableForm,
     listenToMessages: listenToMessages,
diff --git a/client/js/views/empty_view.js b/client/js/views/empty_view.js
new file mode 100644
index 00000000..d4e36b6d
--- /dev/null
+++ b/client/js/views/empty_view.js
@@ -0,0 +1,18 @@
+'use strict';
+
+const views = require('../util/views.js');
+
+class EmptyView {
+    constructor() {
+        this.template = views.htmlToDom('<div class="messages"></div>');
+    }
+
+    render(ctx) {
+        const target = document.getElementById('content-holder');
+        const source = this.template;
+        views.listenToMessages(target);
+        views.showView(target, source);
+    }
+}
+
+module.exports = EmptyView;
diff --git a/client/js/views/help_view.js b/client/js/views/help_view.js
index 833e548e..2a5c4ec0 100644
--- a/client/js/views/help_view.js
+++ b/client/js/views/help_view.js
@@ -19,17 +19,14 @@ class HelpView {
         const source = this.template();
 
         ctx.section = ctx.section || 'about';
-        if (!(ctx.section in this.sectionTemplates)) {
-            views.emptyView(target);
-            return;
+        if (ctx.section in this.sectionTemplates) {
+            views.showView(
+                source.querySelector('.content'),
+                this.sectionTemplates[ctx.section]({
+                    name: config.name,
+                }));
         }
 
-        views.showView(
-            source.querySelector('.content'),
-            this.sectionTemplates[ctx.section]({
-                name: config.name,
-            }));
-
         const allItemsSelector = '[data-name]';
         for (let item of source.querySelectorAll(allItemsSelector)) {
             if (item.getAttribute('data-name') === ctx.section) {