multi-single page app

slimdash · Mar 3, 2017 · 3811cf5 · 3811cf5
1 parent d4320e5
commit 3811cf5
Show file tree

Hide file tree

Showing 11 changed files with 168 additions and 215 deletions.
diff --git a/public/app/login.html.twig b/public/app/login.html.twig
@@ -1,32 +1,10 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>mtdashmore | Log in</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.7 -->
-  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-  <!-- Font Awesome -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
-  <!-- Ionicons -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
-  <!-- Theme style -->
+[% extends 'shared/base.html.twig' %]
 
-  <link rel="stylesheet" href="/static/css/AdminLTE.min.css">
-  <link rel="stylesheet" href="/static/css/skin-blue.min.css">
-  <!-- iCheck -->
-  <link rel="stylesheet" href="/static/js/plugins/AdminLTE/plugins/iCheck/square/blue.css">
+[% block title %]Login[% endblock %]
 
-  <!-- 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="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
-  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-  <![endif]-->
-</head>
-<body class="hold-transition login-page">
+[% block body_params %]class="hold-transition login-page"[% endblock %]
+
+[% block body %]
 <div class="login-box">
   <div class="login-logo">
     <b>example</b> console
@@ -64,13 +42,9 @@
   <!-- /.login-box-body -->
 </div>
 <!-- /.login-box -->
+[% endblock %]
 
-<!-- jQuery -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
-<!-- Bootstrap -->
-<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
-<!-- iCheck -->
-<script src="/static/js/plugins/AdminLTE/plugins/iCheck/icheck.min.js"></script>
+[% block footer %]
 <script>
   $(function () {
     $('input').iCheck({
@@ -80,9 +54,6 @@
     });
   });
 </script>
-
-
-<script src="https://www.gstatic.com/firebasejs/3.4.1/firebase.js"></script>
 <script>
   // Initialize Firebase
   var config = {
@@ -170,5 +141,4 @@
     }
     $(document).ready(initApp);
 </script>
-</body>
-</html>
+[% endblock %]
diff --git a/public/app/logout.html.twig b/public/app/logout.html.twig
@@ -1,30 +1,10 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>mtdashmore | Log out</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.7 -->
-  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-  <!-- Font Awesome -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
-  <!-- Ionicons -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
-  <!-- Theme style -->
+[% extends 'shared/base.html.twig' %]
 
-  <link rel="stylesheet" href="/static/css/AdminLTE.min.css">
-  <link rel="stylesheet" href="/static/css/skin-blue.min.css">
+[% block title %]Logout[% endblock %]
 
-  <!-- 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="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
-  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-  <![endif]-->
-</head>
-<body class="hold-transition login-page">
+[% block body_params %]class="hold-transition login-page"[% endblock %]
+
+[% block body %]
 <div class="login-box">
   <div class="login-logo">
     <b>example</b> console
@@ -38,13 +18,10 @@
   <!-- /.login-box-body -->
 </div>
 <!-- /.login-box -->
+<!-- /.login-box -->
+[% endblock %]
 
-<!-- jQuery -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
-<!-- Bootstrap -->
-<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
-
-<script src="https://www.gstatic.com/firebasejs/3.4.1/firebase.js"></script>
+[% block footer %]
 <script>
   // Initialize Firebase
   var config = {
@@ -62,5 +39,4 @@
     }
     $(document).ready(initApp);
 </script>
-</body>
-</html>
+[% endblock %]
diff --git a/public/app/main.html.twig b/public/app/main.html.twig
@@ -1,66 +1 @@
-<!DOCTYPE html>
-<html>
-<head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <title>mtdashmore | Log out</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.7 -->
-  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-  <!-- Font Awesome -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
-  <!-- Ionicons -->
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
-  <!-- Theme style -->
-
-  <link rel="stylesheet" href="/static/css/AdminLTE.min.css">
-  <link rel="stylesheet" href="/static/css/skin-blue.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="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
-  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
-  <![endif]-->
-</head>
-<body class="hold-transition login-page">
-<div class="login-box">
-  <div class="login-logo">
-    <b>example</b> console
-  </div>
-  <!-- /.login-logo -->
-  <div class="login-box-body">
-    <p class="login-box-msg">Thank you for using example console!</p>
-
-    <p><a href="/login">Click here to login</a></p>
-  </div>
-  <!-- /.login-box-body -->
-</div>
-<!-- /.login-box -->
-
-<!-- jQuery -->
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
-<!-- Bootstrap -->
-<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
-
-<script src="https://www.gstatic.com/firebasejs/3.4.1/firebase.js"></script>
-<script>
-  // Initialize Firebase
-  var config = {
-    apiKey: "AIzaSyBlB-rAiulzhN59_VqCUYthK37-cSPcrgc",
-    authDomain: "brick-admin.firebaseapp.com",
-    databaseURL: "https://brick-admin.firebaseio.com",
-    storageBucket: "brick-admin.appspot.com",
-    messagingSenderId: "1067107688359"
-  };
-  firebase.initializeApp(config);
-</script>
-<script>
-    function initApp() {
-      firebase.auth().signOut();
-    }
-    $(document).ready(initApp);
-</script>
-</body>
-</html>
+[% extends 'shared/backend.html.twig' %]
diff --git a/public/app/projects/advertiser/index.html.twig b/public/app/projects/advertiser/index.html.twig
diff --git a/public/app/projects/website/index.html.twig b/public/app/projects/website/index.html.twig
diff --git a/public/app/shared/backend.html.twig b/public/app/shared/backend.html.twig
@@ -1,61 +1,18 @@
 [% extends 'shared/base.html.twig' %]
 
-[% block metatags %]
-    <meta charset="UTF-8" />
-    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-[% endblock %]
-
-[% block stylesheets %]
-    <!-- Bootstrap -->
-    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
-    <!-- Font Awesome -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
-    <!-- Ionicons -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
-    <!-- Theme style -->
-    <link rel="stylesheet" href="/assets/libs/AdminLTE/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="/assets/libs/AdminLTE/dist/css/skins/skin-green.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="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
-      <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
-    <![endif]-->
-
-[% endblock %]
-
-[% block body_params %]class="hold-transition skin-green sidebar-mini"[% endblock %]
+[% block body_params %]class="hold-transition skin-blue sidebar-mini"[% endblock %]
 
 [% block header %]
 [% include 'shared/header.html.twig' %]
 [% endblock %]
 
-[% block sidebar %]
+[% block body %]
 [% include 'shared/sidebar.html.twig' %]
-[% endblock %]
-
-[% block container %]
 [% include 'shared/container.html.twig' %]
-[% endblock %]
-
-[% block control_sidebar %]
-[% include 'shared/control_sidebar.html.twig' %]
+[% include 'shared/control-sidebar.html.twig' %]
 [% endblock %]
 
 [% block footer %]
 [% include 'shared/footer.html.twig' %]
 [% endblock %]
 
-[% block javascripts %]
-    <!-- jQuery -->
-    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
-    <!-- Bootstrap -->
-    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
-    <!-- AdminLTE App -->
-    <script src="/assets/libs/AdminLTE/dist/js/app.min.js"></script>
-[% endblock %]
diff --git a/public/app/shared/base.html.twig b/public/app/shared/base.html.twig
@@ -1,23 +1,67 @@
 <!DOCTYPE html>
 <html lang="en">
-    <head>
-        <title>[% block title %]Dashboard[% endblock %]</title>
-        [% block metatags %][% endblock %]
-        [% block stylesheets %][% endblock %]
-        [% block extra_stylesheets %][% endblock %]
-        [% block head_javascripts %][% endblock %]
-        <!-- <link rel="icon" type="image/x-icon" href="/images/favicon.ico" /> -->
-    </head>
-    <body [% block body_params %][% endblock %]>
-        [% block body %]
-            <div class="wrapper">
-                [% block header %][% endblock %]
-                [% block sidebar %][% endblock %]
-                [% block container %][% endblock %]
-                [% block footer %][% endblock %]
-            </div>
-        [% endblock %]
-        [% block javascripts %][% endblock %]
-        [% block extra_javascripts %][% endblock %]
-    </body>
+<head>
+  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+  <meta http-equiv="X-UA-Compatible" content="IE=edge">
+  <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0">
+  <title>[% block title %]mtdashmore[% endblock %]</title>
+
+[% block meta %][% endblock %]
+
+<!-- <link rel="icon" type="image/x-icon" href="/images/favicon.ico" /> -->
+
+  <!-- Bootstrap 3.3.7 -->
+  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
+
+  <!-- Font Awesome -->
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.5.0/css/font-awesome.min.css">
+
+  <!-- Ionicons -->
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ionicons/2.0.1/css/ionicons.min.css">
+
+  <!-- Theme style -->
+  <link rel="stylesheet" href="/static/css/AdminLTE.min.css">
+  <link rel="stylesheet" href="/static/css/skin-blue.min.css">
+  <!-- iCheck -->
+  <link rel="stylesheet" href="/static/js/plugins/AdminLTE/plugins/iCheck/square/blue.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="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
+<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
+<![endif]-->
+
+
+[% block head1 %][% endblock %]
+[% block head2 %][% endblock %]
+[% block head3 %][% endblock %]
+
+</head>
+<body [% block body_params %][% endblock %]>
+[% block header %][% endblock %]
+[% block body %][% endblock %]
+
+<!-- jQuery -->
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
+
+<!-- Bootstrap -->
+<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
+
+<!-- iCheck -->
+<script src="/static/js/plugins/AdminLTE/plugins/iCheck/icheck.min.js"></script>
+
+<!-- iCheck -->
+<script src="/static/js/plugins/AdminLTE/app.min.js"></script>
+
+<!-- firebase -->
+<script src="https://www.gstatic.com/firebasejs/3.7.0/firebase.js"></script>
+
+<!-- vuejs -->
+<script src="https://unpkg.com/vue/dist/vue.js"></script>
+<script src="https://unpkg.com/vuex/dist/vuex.js"></script>
+<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
+
+[% block footer %][% endblock %]
+</body>
 </html>