feat: integrated visuals into quads-web

Change-Id: Ifb17987a8e1e25f66a36146ecae58f685eb15654

src/quads/templates/simple_table_emoji

@@ -56,11 +56,10 @@
         style="font-size:20px;text-align:center;"
         title=
         "Description: {{ day["display_description"] }}
-        Env: cloud{{ day["chosen_color"] }}
-        Owner: {{ day["display_owner"] }}
-        Ticket: {{ day["display_ticket"] }}
-        Emoji: {{ day["emoji"][2:] }}
-        Day: {{ day["day"] }}">
+Env: cloud{{ day["chosen_color"] }}
+Owner: {{ day["display_owner"] }}
+Ticket: {{ day["display_ticket"] }}
+Day: {{ day["day"] }}">
         {% if day["chosen_color"]|int != 1 :  %}
             {{ day["emoji"] }}
         {% endif %}

src/quads/web/blueprints/visual.py

@@ -2,29 +2,30 @@
 
 from flask import Blueprint, abort, render_template
 
+from quads.config import Config
 from quads.web.blueprints.common import WEB_CONTENT_PATH, get_file_paths
 
-TEMPLATE_DIR = os.path.join(WEB_CONTENT_PATH, "visual")
+VISUAL_DIR = Config.get("visual_web_dir")
 visual_bp = Blueprint(
     "visual",
     __name__,
-    template_folder=TEMPLATE_DIR,
+    template_folder=WEB_CONTENT_PATH,
 )
 
 
 @visual_bp.route("/")
 def index():
-    try:
-        return render_template("index.html")
-    except Exception as e:
-        return str(e), 500
+    with open(os.path.join(VISUAL_DIR, "index.html"), "r") as f:
+        html_content = f.read()
+    return render_template("wiki/visuals.html", html_content=html_content)
 
 
 @visual_bp.route("/<when>")
 def visuals(when):
-    path = os.path.join(WEB_CONTENT_PATH, "visual")
-    file_paths = get_file_paths(path)
+    file_paths = get_file_paths(VISUAL_DIR)
     for file in file_paths:
         if when in file:
-            return render_template(file)
+            with open(os.path.join(VISUAL_DIR, file), "r") as f:
+                html_content = f.read()
+            return render_template("wiki/visuals.html", html_content=html_content)
     return abort(404)

src/quads/web/templates/wiki/visuals.html

@@ -0,0 +1,24 @@
+{% extends "base.html" %}
+{% block title %}Monthly Usage{% endblock %}
+
+{% block styles %}
+    {{ super() }}
+    <style>
+        th, td {
+            padding: 0px !important;
+        }
+
+    </style>
+{% endblock %}
+
+{% block page_content %}
+    <h2><b>Monthly Usage</b></h2>
+    <div class="container-fluid">
+        <div class="row">
+            <div class="col-sm-12">
+                {{ html_content|safe }}
+            </div>
+        </div>
+    </div>
+
+{% endblock %}