From 28cbc228afcd34b65f8fbce747401ae4030b04fd Mon Sep 17 00:00:00 2001
From: martinRenou <martin.renou@isae.fr>
Date: Wed, 17 May 2017 10:44:00 +0100
Subject: [PATCH 1/3] Start to clean the templates

---
 remoteappmanager/templates/admin/page.html | 192 ++++-----------------
 remoteappmanager/templates/page.html       |  31 +---
 2 files changed, 38 insertions(+), 185 deletions(-)
diff --git a/remoteappmanager/templates/admin/page.html b/remoteappmanager/templates/admin/page.html
index c15a90a95..0f6b4bb9b 100644
--- a/remoteappmanager/templates/admin/page.html
+++ b/remoteappmanager/templates/admin/page.html
@@ -1,159 +1,33 @@
-<!DOCTYPE html>
-<!--
-This is a starter template page. Use this page to start your new project from
-scratch. This page gets rid of all links and provides the needed markup only.
--->
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>{% block title %}RemoteApp Manager{% endblock %}</title>
-  <!-- Tell the browser to be responsive to screen width -->
-  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-  <!-- Bootstrap 3.3.6 -->
-  <link rel="stylesheet" href="{{ static_url("bower_components/admin-lte/bootstrap/css/bootstrap.min.css") }}">
-  <!-- Font Awesome -->
-  <link rel="stylesheet" href="{{ static_url("bower_components/font-awesome/css/font-awesome.min.css") }}">
-  <!-- Ionicons -->
-  <link rel="stylesheet" href="{{ static_url("bower_components/ionicons/css/ionicons.min.css") }}">
-  <!-- Theme style -->
-  <link rel="stylesheet" href="{{ static_url("bower_components/admin-lte/dist/css/AdminLTE.min.css") }}">
-  <link rel="stylesheet" href="{{ static_url("bower_components/admin-lte/dist/css/skins/skin-red.min.css")}}">
-
-  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
-  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
-  <!--[if lt IE 9]>
-  <script src="{{ static_url("bower_components/html5shiv/dist/html5shiv.min.js") }}"></script>
-  <script src="{{ static_url("bower_components/respond/dest/respond.min.js") }}"></script>
-  <![endif]-->
-
-  <link rel="stylesheet" href="{{ static_url("css/remoteappmanager.css") }}" type="text/css"/>
-  <link rel="stylesheet" href="{{ static_url("bower_components/datatables.net-dt/css/jquery.dataTables.css") }}" type="text/css"/>
-
-  <script type="text/javascript">
-    // This will always be executed and create the basic ga function that
-    // does nothing
-    window.ga = function () {
-      (window.ga.q = window.ga.q || []).push(arguments);
-    };
-    window.ga.l = 1 * new Date();
-    window.GoogleAnalyticsObject = "ga";
-  </script>
-  {% if analytics %}
-    <script src='https://www.google-analytics.com/analytics.js' async type="text/javascript"></script>
-  {% endif %}
-
-  <script type="text/javascript">
-    window.apidata = {
-      base_url: "{{base_url}}",
-      prefix: "{{prefix}}",
-      {% if user %}
-        user: "{{user.name}}",
-      {% endif %}
-      {% if analytics %}
-        analytics: {
-          tracking_id: "{{ analytics.tracking_id }}"
-        },
-      {% endif %}
-    };
-  </script>
-</head>
-<body class="hold-transition skin-red sidebar-mini">
-
-  <noscript>
-    <div id='noscript'>
-      Jupyter Hub requires JavaScript.<br>
-      Please enable it to proceed.
-    </div>
-  </noscript>
-
-  <div class="wrapper" id="app">
-
-    <!-- Main Header -->
-    <header class="main-header">
-
-      <a href="#" class="logo">
-        <!-- logo for regular state and mobile devices -->
-        <span class="logo-lg"><b>Simphony</b>Remote</span>
-      </a>
-
-      <!-- Header Navbar -->
-      <nav class="navbar navbar-static-top" role="navigation">
-        <!-- Navbar Right Menu -->
-        <div class="navbar-custom-menu">
-          <ul class="nav navbar-nav">
-            <!-- User Account Menu -->
-            <li class="dropdown user user-menu">
-              <!-- Menu Toggle Button -->
-              <a href="#" class="dropdown-toggle" data-toggle="dropdown">
-                <!-- The user image in the navbar-->
-                <img src="https://www.gravatar.com/avatar/{{ user.name | gravatar_id }}" class="user-image" alt="User Image">
-                <!-- hidden-xs hides the username on small devices so only the image appears. -->
-                <span class="hidden-xs">{{ user.name }}</span>
-              </a>
-              <ul class="dropdown-menu">
-                <!-- The user image in the menu -->
-                <li class="user-header">
-                  <img src="https://www.gravatar.com/avatar/{{ user.name | gravatar_id }}" class="img-circle" alt="User Image">
-                  <p>
-                    {{ user.name }}
-                  </p>
-                </li>
-                <!-- Menu Body -->
-                <li class="user-body">
-                </li>
-                <!-- Menu Footer-->
-                <li class="user-footer">
-                  <div class="pull-right">
-                    {% block login_widget %}
-                      <a id="logout" href="{{ logout_url }}" class="btn btn-default btn-flat"><i class="fa fa-sign-out"> Sign out</i></a>
-                    {% endblock %}
-                  </div>
-                </li>
-              </ul>
-            </li>
-            <!-- Control Sidebar Toggle Button -->
-          </ul>
-        </div>
-      </nav>
-    </header>
-    <!-- Left side column. contains the logo and sidebar -->
-    <aside class="main-sidebar">
-      <section class="sidebar">
-        <ul class="sidebar-menu" id="adminoptions">
-          <li class="header">ADMIN</li>
-          <router-link to="/" tag="li" exact-active-class="active"><a>Home</a></router-link>
-          <router-link to="/containers" tag="li" exact-active-class="active"><a>Containers</a></router-link>
-          <router-link to="/users" tag="li" active-class="active"><a>Users</a></router-link>
-          <router-link to="/applications" tag="li" exact-active-class="active"><a>Applications</a></router-link>
-        </ul>
-      </section>
-    </aside>
-
-    <!-- Content Wrapper. Contains page content -->
-    <div class="content-wrapper">
-      <!-- Main content -->
-      <section class="content">
-        <p>
-          <!-- use router-link component for navigation. -->
-          <!-- specify the link by passing the `to` prop. -->
-          <!-- <router-link> will be rendered as an `<a>` tag by default -->
-        </p>
-        <!-- route outlet -->
-        <!-- component matched by the route will render here -->
-        <router-view></router-view>
-      <!-- Your Page Content Here -->
-      </section>
-      <!-- /.content -->
-    </div>
-    <!-- /.content-wrapper -->
-  </div>
-
-  <script src="{{ static_url("bower_components/admin-lte/plugins/jQuery/jquery-2.2.3.min.js") }}"></script>
-  <script src="{{ static_url("bower_components/admin-lte/bootstrap/js/bootstrap.min.js") }}"></script>
-  <script src="{{ static_url("bower_components/admin-lte/dist/js/app.min.js") }}"></script>
-
-  <script src="{{ static_url("dist/admin.js") }}"></script>
-
-</body>
-</html>
+{% extends "page.html" %}
+
+{% set skin = "skin-red" %}
+
+{% block sidebar %}
+  <section class="sidebar">
+    <ul class="sidebar-menu" id="adminoptions">
+      <li class="header">ADMIN</li>
+      <router-link to="/" tag="li" exact-active-class="active"><a>Home</a></router-link>
+      <router-link to="/containers" tag="li" exact-active-class="active"><a>Containers</a></router-link>
+      <router-link to="/users" tag="li" active-class="active"><a>Users</a></router-link>
+      <router-link to="/applications" tag="li" exact-active-class="active"><a>Applications</a></router-link>
+    </ul>
+  </section>
+{% endblock %}
+
+{% block main %}
+  <section class="content">
+    <p>
+      <!-- use router-link component for navigation. -->
+      <!-- specify the link by passing the `to` prop. -->
+      <!-- <router-link> will be rendered as an `<a>` tag by default -->
+    </p>
+    <!-- route outlet -->
+    <!-- component matched by the route will render here -->
+    <router-view></router-view>
+  </section>
+{% endblock %}
+
+{% block script_init %}
+    {{  super() }}
+    <script src="{{ static_url("dist/admin.js") }}"></script>
+{% endblock %}
diff --git a/remoteappmanager/templates/page.html b/remoteappmanager/templates/page.html
index 4a5b27daf..6bfa6af96 100644
--- a/remoteappmanager/templates/page.html
+++ b/remoteappmanager/templates/page.html
@@ -1,29 +1,17 @@
 {% set skin = skin | default("skin-blue") %}
 
 <!DOCTYPE html>
-<!--
-This is a starter template page. Use this page to start your new project from
-scratch. This page gets rid of all links and provides the needed markup only.
--->
 <html>
 <head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge">
   <title>{% block title %}RemoteApp Manager{% endblock %}</title>
-  <!-- Tell the browser to be responsive to screen width -->
   <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
-  <!-- Bootstrap 3.3.6 -->
+
   <link rel="stylesheet" href="{{ static_url("bower_components/admin-lte/bootstrap/css/bootstrap.min.css") }}">
-  <!-- Font Awesome -->
   <link rel="stylesheet" href="{{ static_url("bower_components/font-awesome/css/font-awesome.min.css") }}">
-  <!-- Ionicons -->
   <link rel="stylesheet" href="{{ static_url("bower_components/ionicons/css/ionicons.min.css") }}">
-  <!-- Theme style -->
   <link rel="stylesheet" href="{{ static_url("bower_components/admin-lte/dist/css/AdminLTE.min.css") }}">
-  <!-- AdminLTE Skins. We have chosen the skin-blue for this starter
-        page. However, you can choose any other skin. Make sure you
-        apply the skin class to the body tag so the changes take effect.
-  -->
   <link rel="stylesheet" href="{{ static_url("bower_components/admin-lte/dist/css/skins/"+skin+".min.css")}}">
 
   <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
@@ -33,9 +21,7 @@
   <script src="{{ static_url("bower_components/respond/dest/respond.min.js") }}"></script>
   <![endif]-->
 
-  {% block stylesheet %}
-    <link rel="stylesheet" href="{{ static_url("css/remoteappmanager.css") }}" type="text/css"/>
-  {% endblock %}
+  <link rel="stylesheet" href="{{ static_url("css/remoteappmanager.css") }}" type="text/css"/>
 
   {% block script %}
     <script type="text/javascript">
@@ -51,10 +37,8 @@
     <script src='https://www.google-analytics.com/analytics.js' async type="text/javascript"></script>
     {% endif %}
   {% endblock %}
-
-  {% block meta %}
-  {% endblock %}
 </head>
+
 <body class="hold-transition {{ skin }} sidebar-mini">
 
   <noscript>
@@ -64,7 +48,7 @@
     </div>
   </noscript>
 
-  <div class="wrapper">
+  <div class="wrapper" id="app">
 
     <!-- Main Header -->
     <header class="main-header">
@@ -109,26 +93,21 @@
                 </li>
               </ul>
             </li>
-            <!-- Control Sidebar Toggle Button -->
           </ul>
         </div>
       </nav>
     </header>
-    <!-- Left side column. contains the logo and sidebar -->
+
     <aside class="main-sidebar">
       {% block sidebar %}
       {% endblock %}
     </aside>
 
-    <!-- Content Wrapper. Contains page content -->
     <div class="content-wrapper">
       <!-- Main content -->
       {% block main %}
       {% endblock %}
-      <!-- Your Page Content Here -->
-      <!-- /.content -->
     </div>
-    <!-- /.content-wrapper -->
   </div>
 
   <script src="{{ static_url("bower_components/admin-lte/plugins/jQuery/jquery-2.2.3.min.js") }}"></script>

From 2214a6c3de8d97d64cc5932c50145f08467a4739 Mon Sep 17 00:00:00 2001
From: martinRenou <martin.renou@isae.fr>
Date: Wed, 17 May 2017 10:50:24 +0100
Subject: [PATCH 2/3] Fix table css

---
 remoteappmanager/templates/page.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/remoteappmanager/templates/page.html b/remoteappmanager/templates/page.html
index 6bfa6af96..aafbe3528 100644
--- a/remoteappmanager/templates/page.html
+++ b/remoteappmanager/templates/page.html
@@ -22,6 +22,7 @@
   <![endif]-->
 
   <link rel="stylesheet" href="{{ static_url("css/remoteappmanager.css") }}" type="text/css"/>
+  <link rel="stylesheet" href="{{ static_url("bower_components/datatables.net-dt/css/jquery.dataTables.css") }}" type="text/css"/>
 
   {% block script %}
     <script type="text/javascript">

From df3a038f4709e880f41e2a02ea8d849da17d22ec Mon Sep 17 00:00:00 2001
From: martinRenou <martin.renou@isae.fr>
Date: Wed, 17 May 2017 10:54:32 +0100
Subject: [PATCH 3/3] Add stylesheet block

---
 remoteappmanager/templates/admin/page.html | 4 ++++
 remoteappmanager/templates/page.html       | 4 +++-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/remoteappmanager/templates/admin/page.html b/remoteappmanager/templates/admin/page.html
index 0f6b4bb9b..58e182251 100644
--- a/remoteappmanager/templates/admin/page.html
+++ b/remoteappmanager/templates/admin/page.html
@@ -2,6 +2,10 @@
 
 {% set skin = "skin-red" %}
 
+{% block stylesheet %}
+  <link rel="stylesheet" href="{{ static_url("bower_components/datatables.net-dt/css/jquery.dataTables.css") }}" type="text/css"/>
+{% endblock %}
+
 {% block sidebar %}
   <section class="sidebar">
     <ul class="sidebar-menu" id="adminoptions">
diff --git a/remoteappmanager/templates/page.html b/remoteappmanager/templates/page.html
index aafbe3528..efa083ce6 100644
--- a/remoteappmanager/templates/page.html
+++ b/remoteappmanager/templates/page.html
@@ -22,7 +22,9 @@
   <![endif]-->
 
   <link rel="stylesheet" href="{{ static_url("css/remoteappmanager.css") }}" type="text/css"/>
-  <link rel="stylesheet" href="{{ static_url("bower_components/datatables.net-dt/css/jquery.dataTables.css") }}" type="text/css"/>
+
+  {% block stylesheet %}
+  {% endblock %}
 
   {% block script %}
     <script type="text/javascript">
