Refactor graphs UI modules

Signed-off-by: Michael Tremer <michael.tremer@ipfire.org>

diff --git a/Makefile.am b/Makefile.am
index d2a522f4ec273cf48ba240922ac19320e45c39be..0ddef809b079ee671d0d6a98672d5f5f1c2c7121 100644 (file)
--- a/Makefile.am
+++ b/Makefile.am
@@ -173,10 +173,7 @@ dist_templates_modules_forms_inputs_DATA = \
 templates_modules_graphsdir = $(templates_modulesdir)/graphs
 
 dist_templates_modules_graphs_DATA = \
-       src/templates/modules/graphs/box.html \
-       src/templates/modules/graphs/preview.html \
-       src/templates/modules/graphs/thumbnail.html \
-       src/templates/modules/graphs/thumbnail-bar.html
+       src/templates/modules/graphs/box.html
 
 templates_modules_menudir = $(templates_modulesdir)/menu
 

diff --git a/src/styles/westferry.scss b/src/styles/westferry.scss
index 5efbd3a2dc35657d8490a3d42826d455b2eb69ec..46d4976500df60e199b19a00278bed8476794b79 100644 (file)
--- a/src/styles/westferry.scss
+++ b/src/styles/westferry.scss
@@ -82,3 +82,7 @@ $foundation-palette: (
 .top-bar {
        margin-bottom: 1rem;
 }
+
+img.graph {
+       margin-bottom: 1rem;
+}

diff --git a/src/templates/graph.html b/src/templates/graph.html
deleted file mode 100644 (file)
index 36ed148..0000000
--- a/src/templates/graph.html
+++ /dev/null
@@ -1,5 +0,0 @@
-{% extends "base.html" %}
-
-{% block main %}
-       {% module GraphBox(graph) %}
-{% end block %}

diff --git a/src/templates/graphs.html b/src/templates/graphs.html
index 6c7fe15a97fd14cc1bfc5540d277c70dc007ddc8..fe2a336bb358a5b25460ad4863da4bb203b4dae9 100644 (file)
--- a/src/templates/graphs.html
+++ b/src/templates/graphs.html
@@ -2,6 +2,6 @@
 
 {% block main %}
        {% for g in graphs %}
-               {% module GraphBoxPreview(g) %}
+               {% module GraphBox(g) %}
        {% end %}
 {% end block %}

diff --git a/src/templates/modules/graphs/box.html b/src/templates/modules/graphs/box.html
index 9f9b974205bc8a459781429f39e09e8501a4e94d..f5a82287aacb6ce26a8f5323719522b2e7c08aca 100644 (file)
--- a/src/templates/modules/graphs/box.html
+++ b/src/templates/modules/graphs/box.html
@@ -1,32 +1,30 @@
-<div class="page-header">
-       <h3>{{ graph.title }}</h3>
-</div>
+{% set intervals = {
+       "hour"  : _("Hour"),
+       "day"   : _("Day"),
+       "week"  : _("Week"),
+       "month" : _("Month"),
+       "year"  : _("Year")
+} %}
 
-<img class="img-responsive img-thumbnail" src="{{ graph.make_image_url(width="1130") }}"
-       alt="{{ graph.title }}">
+<h3>{{ graph.title }}</h3>
 
-<ul class="nav nav-pills">
-       {% for interval in ("hour", "day", "week", "month", "year") %}
-               <li {% if graph.interval == interval %}class="active"{% end %}>
-                       <a href="{{ graph.make_url(interval=interval) }}">
-                               {% if interval == "hour" %}
-                                       {{ _("Hour") }}
-                               {% elif interval == "day" %}
-                                       {{ _("Day") }}
-                               {% elif interval == "week" %}
-                                       {{ _("Week") }}
-                               {% elif interval == "month" %}
-                                       {{ _("Month") }}
-                               {% elif interval == "year" %}
-                                       {{ _("Year") }}
-                               {% else %}
-                                       {{ interval }}
-                               {% end %}
-                       </a>
+<ul class="tabs" data-tabs id="graph-tabs">
+       {% for i, interval in enumerate(intervals) %}
+               <li class="tabs-title {% if i == 0 %}is-active{% end %}">
+                       <a href="#{{ interval }}" aria-selected="true">{{ intervals[interval] }}</a>
                </li>
        {% end %}
 </ul>
 
-<a class="btn btn-default btn-sm" href="{{ graph.make_image_url(format="pdf") }}">
-       {{ _("Download") }}
-</a>
+<div class="tabs-content" data-tabs-content="graph-tabs">
+       {% for i, interval in enumerate(intervals) %}
+               <div class="tabs-panel {% if i == 0 %}is-active{% end %}" id="{{ interval }}">
+                       <img class="graph" src="{{ graph.make_image_url(interval=interval) }}"
+                               alt="{{ graph.title }}">
+
+                       <a class="button small expanded" href="{{ graph.make_image_url(interval=interval, format="pdf") }}">
+                               {{ _("Download") }}
+                       </a>
+               </div>
+       {% end %}
+</div>

diff --git a/src/templates/modules/graphs/preview.html b/src/templates/modules/graphs/preview.html
deleted file mode 100644 (file)
index 8706901..0000000
--- a/src/templates/modules/graphs/preview.html
+++ /dev/null
@@ -1,12 +0,0 @@
-<div class="page-header">
-       <h3>
-               <a href="{{ graph.make_url() }}">{{ graph.title }}</a>
-       </h3>
-</div>
-
-{% module GraphThumbnailBar(graph) %}
-
-<a href="{{ graph.make_url(interval="week") }}">
-       <img class="img-responsive img-thumbnail" src="{{ graph.make_image_url() }}"
-               alt="{{ graph.title }}">
-</a>

diff --git a/src/templates/modules/graphs/thumbnail-bar.html b/src/templates/modules/graphs/thumbnail-bar.html
deleted file mode 100644 (file)
index 02eccd2..0000000
--- a/src/templates/modules/graphs/thumbnail-bar.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<div class="row">
-       {% for interval in ("1h", "12h", "1d", "week", "month", "year") %}
-               <div class="col-md-2">
-                       {% module GraphThumbnail(graph, interval=interval) %}
-               </div>
-       {% end %}
-</div>

diff --git a/src/templates/modules/graphs/thumbnail.html b/src/templates/modules/graphs/thumbnail.html
deleted file mode 100644 (file)
index e84b861..0000000
--- a/src/templates/modules/graphs/thumbnail.html
+++ /dev/null
@@ -1,2 +0,0 @@
-<img class="img-responsive img-thumbnail"
-       src="{{ graph.make_thumbnail_url(**args) }}" alt="{{ graph.title }}">

diff --git a/src/westferry/ui/graphs.py b/src/westferry/ui/graphs.py
index ab9b09e7c21bd8fd6cdea8a0a17b38047751ba02..acc2a165fe2b422628d20dfc4583b5965ef43f8d 100644 (file)
--- a/src/westferry/ui/graphs.py
+++ b/src/westferry/ui/graphs.py
@@ -142,18 +142,3 @@ class Graph(object):
 class GraphBoxModule(base.BaseUIModule):
        def render(self, graph):
                return self.render_string("modules/graphs/box.html", graph=graph)
-
-
-class GraphBoxPreviewModule(base.BaseUIModule):
-       def render(self, graph):
-               return self.render_string("modules/graphs/preview.html", graph=graph)
-
-
-class GraphThumbnailModule(base.BaseUIModule):
-       def render(self, graph, **kwargs):
-               return self.render_string("modules/graphs/thumbnail.html", graph=graph, args=kwargs)
-
-
-class GraphThumbnailBarModule(base.BaseUIModule):
-       def render(self, graph):
-               return self.render_string("modules/graphs/thumbnail-bar.html", graph=graph)