From 898a18ed46653295bb945ea412da62b2c7330f9b Mon Sep 17 00:00:00 2001
From: Sylvain <bond.never.die@gmail.com>
Date: Wed, 22 Jan 2020 13:25:22 +0100
Subject: [PATCH] display customized home page html

---
 app/assets/javascripts/controllers/home.js   | 42 +++++++++++++++++++-
 app/assets/javascripts/directives/compile.js | 21 ++++++++++
 app/assets/stylesheets/app.layout.scss       |  5 +++
 app/assets/templates/home.html.erb           | 22 +---------
 4 files changed, 68 insertions(+), 22 deletions(-)
 create mode 100644 app/assets/javascripts/directives/compile.js

diff --git a/app/assets/javascripts/controllers/home.js b/app/assets/javascripts/controllers/home.js
index 96fd68e66..c8d4f1f17 100644
--- a/app/assets/javascripts/controllers/home.js
+++ b/app/assets/javascripts/controllers/home.js
@@ -5,7 +5,7 @@ Application.Controllers.controller('HomeController', ['$scope', '$stateParams',
   /* PUBLIC SCOPE */
 
     // Home page HTML content
-    $scope.homeContent = homeContentPromise;
+    $scope.homeContent = null;
 
     /* PRIVATE SCOPE */
 
@@ -18,6 +18,46 @@ Application.Controllers.controller('HomeController', ['$scope', '$stateParams',
       if ($stateParams.reset_password_token) {
         return $scope.$parent.editPassword($stateParams.reset_password_token);
       }
+
+      // We set the home page content, with the directives replacing the placeholders
+      $scope.homeContent = insertDirectives(homeContentPromise.setting.value);
+    };
+
+    const insertDirectives = function (html) {
+      const node = document.createElement('div');
+      node.innerHTML = html.trim();
+
+      const newsNode = node.querySelector('div#news');
+      if (newsNode) {
+        const news = document.createElement('news');
+        newsNode.parentNode.replaceChild(news, newsNode);
+      }
+
+      const projectsNode = node.querySelector('div#projects');
+      if (projectsNode) {
+        const projects = document.createElement('projects');
+        projectsNode.parentNode.replaceChild(projects, projectsNode);
+      }
+
+      const twitterNode = node.querySelector('div#twitter');
+      if (twitterNode) {
+        const twitter = document.createElement('twitter');
+        twitterNode.parentNode.replaceChild(twitter, twitterNode);
+      }
+
+      const membersNode = node.querySelector('div#members');
+      if (membersNode) {
+        const members = document.createElement('members');
+        membersNode.parentNode.replaceChild(members, membersNode);
+      }
+
+      const eventsNode = node.querySelector('div#events');
+      if (eventsNode) {
+        const events = document.createElement('events');
+        eventsNode.parentNode.replaceChild(events, eventsNode);
+      }
+
+      return node.outerHTML;
     };
 
     // !!! MUST BE CALLED AT THE END of the controller
diff --git a/app/assets/javascripts/directives/compile.js b/app/assets/javascripts/directives/compile.js
new file mode 100644
index 000000000..cafd00cb4
--- /dev/null
+++ b/app/assets/javascripts/directives/compile.js
@@ -0,0 +1,21 @@
+Application.Directives.directive('compile', ['$compile', function ($compile) {
+  return function (scope, element, attrs) {
+    scope.$watch(
+      function (scope) {
+        // watch the 'compile' expression for changes
+        return scope.$eval(attrs.compile);
+      },
+      function (value) {
+        // when the 'compile' expression changes
+        // assign it into the current DOM
+        element.html(value);
+
+        // compile the new DOM and link it to the current
+        // scope.
+        // NOTE: we only compile .childNodes so that
+        // we don't get into infinite loop compiling ourselves
+        $compile(element.contents())(scope);
+      }
+    );
+  };
+}]);
diff --git a/app/assets/stylesheets/app.layout.scss b/app/assets/stylesheets/app.layout.scss
index 1c257746b..6278d1cbd 100644
--- a/app/assets/stylesheets/app.layout.scss
+++ b/app/assets/stylesheets/app.layout.scss
@@ -636,3 +636,8 @@ body.container{
     left: -4px;
   }
 }
+
+
+.home-page {
+  @extend .wrapper;
+}
diff --git a/app/assets/templates/home.html.erb b/app/assets/templates/home.html.erb
index 95da106d9..c8d0481ee 100644
--- a/app/assets/templates/home.html.erb
+++ b/app/assets/templates/home.html.erb
@@ -1,22 +1,2 @@
-<div class="m-sm">
-  <news></news>
-</div>
-<div class="row wrapper">
-	<div class="col-lg-8">
-		<projects></projects>
-  </div>
-
-
-	<div class="col-lg-4 m-t-lg">
-    <twitter></twitter>
-
-		<members></members>
-
-	</div>
-</div>
-
-<div class="row wrapper m-t-sm">
-  <div class="col-lg-12">
-    <events></events>
-  </div>
+<div class="home-page" compile="homeContent">
 </div>