Browse Source

Simplification page JSP

Arthur Brandao 5 years ago
parent
commit
a52490ffb6

+ 29 - 0
WebContent/WEB-INF/tags/footer.tag

@@ -0,0 +1,29 @@
+<%@ tag language="java" pageEncoding="UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+
+	<footer class="page-footer red">
+        <div class="container">
+            <div class="row">
+                <div class="col l6 s12">
+                    <h5 class="white-text">Microfolie Lens</h5>
+                    <p class="grey-text text-lighten-4">Bla bla bla ...</p>
+                </div>
+                <div class="col l4 offset-l2 s12">
+                    <h5 class="white-text">Liens utiles</h5>
+                    <ul>
+                        <li><a class="grey-text text-lighten-3" href="<c:url value="/" />">Accueil</a></li>
+                        <li><a class="grey-text text-lighten-3" href="#apropos">Qui somme nous</a></li>
+                        <li><a class="grey-text text-lighten-3" href="#mention">Mentions l&eacute;gales</a></li>
+                        <li><a class="grey-text text-lighten-3" href="#contact">Contact</a></li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+        <div class="footer-copyright">
+            <div class="container">
+                © 2019 Copyright Text
+                <a class="grey-text text-lighten-4 right" href="https://villedelens.fr" target="_blank">Ville de
+                    Lens</a>
+            </div>
+        </div>
+    </footer>

+ 11 - 0
WebContent/WEB-INF/tags/head.tag

@@ -0,0 +1,11 @@
+<%@ tag language="java" pageEncoding="UTF-8"%>
+<%@ attribute required="true" name="title" type="java.lang.String" %>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+
+	<meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <link type="text/css" rel="stylesheet" href="<c:url value="/css/material-icons.css"/>" />
+    <link type="text/css" rel="stylesheet" href="<c:url value="/css/materialize.min.css"/>" media="screen,projection" />
+    <link type="text/css" rel="stylesheet" href="<c:url value="/css/style.min.css"/>" media="screen,projection" />
+    <link rel="icon" href="<c:url value="/img/favicon.ico"/>" />
+    <title>${title} - Microfolie Lens</title>

+ 43 - 0
WebContent/WEB-INF/tags/header.tag

@@ -0,0 +1,43 @@
+<%@ tag language="java" pageEncoding="UTF-8"%>
+<%@ attribute required="false" name="active" type="java.lang.String" %>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+<%@ taglib prefix="s" uri="/struts-tags"%>
+
+	<s:url var="inscriptionurl" action="gotoinscription"/>
+    <s:url var="abonnesurl" action="gotoabonnes"/>
+	<s:url var="settingsurl" action="gotosettings"/>
+    <!-- Header Desktop -->
+	<header class="navbar-fixed">
+        <nav class="red">
+            <div class="nav-wrapper">
+                <a href="<c:url value="/"/>" class="brand-logo center mtop-half hide-on-med-and-down"><img src="<c:url value="/img/logo.png"/>"
+                        title="Logo Microfolie" class="responsive-img" style="max-width: 128px;" /></a>
+                <a href="<c:url value="/"/>" class="brand-logo center hide-on-large-only">Microfolie Lens</a>
+                <a href="#!" data-target="mobile-nav" class="sidenav-trigger"><i class="material-icons">menu</i></a>
+                <div class="left mleft-2 hide-on-med-and-down">
+                    <a href="<c:url value="/"/>">
+                        <h5>Microfolie Lens</h5>
+                    </a>
+                </div>
+                <ul class="right mright-2 hide-on-med-and-down">
+                    <li <c:if test="${active == 'abonnes'}">class="active"</c:if>><a href="${abonnesurl}">Abonn&eacute;s</a></li>
+                    <li <c:if test="${active == 'inscription'}">class="active"</c:if>><a href="${inscriptionurl}">Inscription</a></li>
+                    <li <c:if test="${active == 'settings'}">class="active"</c:if>><a href="${settingsurl}">Param&eacute;trage espace</a></li>
+                </ul>
+            </div>
+        </nav>
+    </header>
+    <!-- Header Mobile -->
+    <ul class="sidenav" id="mobile-nav">
+        <li class="center-align mtop-1">
+            <img src="<c:url value="/img/logo.png" />" title="Logo Microfolie" class="responsive-img" style="max-height: 150px;" />
+        </li>
+        <li class="center-align">
+            <h4>Microfolie Lens</h4>
+            <hr />
+        </li>
+        <li <c:if test="${active == 'abonnes'}'">class="active"</c:if>><a href="${abonnesurl}">Abonn&eacute;s</a></li>
+        <li <c:if test="${active == 'inscription'}">class="active"</c:if>><a href="${inscriptionurl}">Inscription</a></li>
+        <li <c:if test="${active == 'settings'}">class="active"</c:if>><a href="${settingsurl}">Param&eacute;trage espace</a></li>
+    </ul>
+    <div class="mtop-5 hide-on-med-and-down"></div>

+ 6 - 0
WebContent/WEB-INF/tags/script.tag

@@ -0,0 +1,6 @@
+<%@ tag language="java" pageEncoding="UTF-8"%>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
+
+	<script type="text/javascript" src="<c:url value="/js/jquery.min.js"/>"></script>
+    <script type="text/javascript" src="<c:url value="/js/materialize.min.js"/>"></script>
+    <script type="text/javascript" src="<c:url value="/js/script.js"/>"></script>

+ 4 - 75
WebContent/abonnes.jsp

@@ -1,7 +1,6 @@
 <%@ page language="java" contentType="text/html; charset=ISO-8859-1"
 	pageEncoding="UTF-8"%>
 <%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
-<%@ taglib prefix="s" uri="/struts-tags"%>
 <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
 <%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
 
@@ -13,54 +12,12 @@
 <html>
 
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link type="text/css" rel="stylesheet" href="css/material-icons.css" />
-    <link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection" />
-    <link type="text/css" rel="stylesheet" href="css/style.min.css" media="screen,projection" />
-    <link rel="icon" href="img/favicon.ico" />
-    <title>Abonnes - Microfolie Lens</title>
+    <tag:head title="Abonnés" />
 </head>
 
 <body class="grey lighten-3">
-    <s:url var="inscriptionurl" action="gotoinscription"/>
-    <s:url var="abonnesurl" action="gotoabonnes"/>
-	<s:url var="settingsurl" action="gotosettings"/>
     <!-- Header -->
-    <header class="navbar-fixed">
-        <nav class="red">
-            <div class="nav-wrapper">
-                <a href="./" class="brand-logo center mtop-half hide-on-med-and-down"><img src="img/logo.png"
-                        title="Logo Microfolie" class="responsive-img" style="max-width: 128px;" /></a>
-                <a href="./" class="brand-logo center hide-on-large-only">Microfolie Lens</a>
-                <a href="#!" data-target="mobile-nav" class="sidenav-trigger"><i class="material-icons">menu</i></a>
-                <div class="left mleft-2 hide-on-med-and-down">
-                    <a href="./">
-                        <h5>Microfolie Lens</h5>
-                    </a>
-                </div>
-                <ul class="right mright-2 hide-on-med-and-down">
-                    <li class="active"><a href="#">Abonn&eacute;s</a></li>
-                    <li><a href="${inscriptionurl}">Inscription</a></li>
-                    <li><a href="${settingsurl}">Param&eacute;trage espace</a></li>
-                </ul>
-            </div>
-        </nav>
-    </header>
-    <!-- Header Mobile -->
-    <ul class="sidenav" id="mobile-nav">
-        <li class="center-align mtop-1">
-            <img src="img/logo.png" title="Logo Microfolie" class="responsive-img" style="max-height: 150px;" />
-        </li>
-        <li class="center-align">
-            <h4>Microfolie Lens</h4>
-            <hr />
-        </li>
-        <li class="active"><a href="#">Abonn&eacute;s</a></li>
-        <li><a href="${inscriptionurl}">Inscription</a></li>
-        <li><a href="${settingsurl}">Param&eacute;trage espace</a></li>
-    </ul>
-    <div class="mtop-5 hide-on-med-and-down"></div>
+    <tag:header active="abonnes" />
 
     <!-- Main -->
     <main class="container">
@@ -78,41 +35,13 @@
     </main>
 
     <!-- Footer -->
-    <footer class="page-footer red">
-        <div class="container">
-            <div class="row">
-                <div class="col l6 s12">
-                    <h5 class="white-text">Microfolie Lens</h5>
-                    <p class="grey-text text-lighten-4">Bla bla bla ...</p>
-                </div>
-                <div class="col l4 offset-l2 s12">
-                    <h5 class="white-text">Liens utiles</h5>
-                    <ul>
-                        <li><a class="grey-text text-lighten-3" href="./">Accueil</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#apropos">Qui somme nous</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#mention">Mentions l&eacute;gales</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#contact">Contact</a></li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-        <div class="footer-copyright">
-            <div class="container">
-                © 2019 Copyright Text
-                <a class="grey-text text-lighten-4 right" href="https://villedelens.fr" target="_blank">Ville de
-                    Lens</a>
-            </div>
-        </div>
-    </footer>
+    <tag:footer />
     
     <!--  Loader  -->
     <tag:loader name="loader" />
 
     <!-- Script -->
-    <script type="text/javascript" src="js/jquery.min.js"></script>
-    <script type="text/javascript" src="js/materialize.min.js"></script>
-    <script type="text/javascript" src="js/script.js"></script>
-    <!-- Script pour cette page-->
+    <tag:script />
     <script type="text/javascript">
         $(document).ready(() => {
         	const loader = M.Modal.getInstance($('#loader'));

+ 5 - 75
WebContent/index.jsp

@@ -1,59 +1,17 @@
 <%@ page language="java" contentType="text/html; charset=utf-8"
 	pageEncoding="utf-8"%>
-<%@ taglib prefix="s" uri="/struts-tags"%>
+<%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
 
 <!DOCTYPE html>
 <html>
 
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link type="text/css" rel="stylesheet" href="css/material-icons.css" />
-    <link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection" />
-    <link type="text/css" rel="stylesheet" href="css/style.min.css" media="screen,projection" />
-    <link rel="icon" href="img/favicon.ico" />
-    <title>Accueil - Microfolie Lens</title>
+    <tag:head title="Accueil" />
 </head>
 
 <body class="grey lighten-3">
-	<s:url var="inscriptionurl" action="gotoinscription"/>
-    <s:url var="abonnesurl" action="gotoabonnes"/>
-	<s:url var="settingsurl" action="gotosettings"/>
     <!-- Header -->
-    <header class="navbar-fixed">
-        <nav class="red">
-            <div class="nav-wrapper">
-                <a href="./" class="brand-logo center mtop-half hide-on-med-and-down"><img src="img/logo.png"
-                        title="Logo Microfolie" class="responsive-img" style="max-width: 128px;" /></a>
-                <a href="./" class="brand-logo center hide-on-large-only">Microfolie Lens</a>
-                <a href="#!" data-target="mobile-nav" class="sidenav-trigger"><i class="material-icons">menu</i></a>
-                <div class="left mleft-2 hide-on-med-and-down">
-                    <a href="./">
-                        <h5>Microfolie Lens</h5>
-                    </a>
-                </div>
-                <ul class="right mright-2 hide-on-med-and-down">
-                    <li><a href="${abonnesurl}">Abonn&eacute;s</a></li>
-                    <li><a href="${inscriptionurl}">Inscription</a></li>
-                    <li><a href="${settingsurl}">Param&eacute;trage espace</a></li>
-                </ul>
-            </div>
-        </nav>
-    </header>
-    <!-- Header Mobile -->
-    <ul class="sidenav" id="mobile-nav">
-        <li class="center-align mtop-1">
-            <img src="img/logo.png" title="Logo Microfolie" class="responsive-img" style="max-height: 150px;" />
-        </li>
-        <li class="center-align">
-            <h4>Microfolie Lens</h4>
-            <hr />
-        </li>
-        <li><a href="${abonnesurl}">Abonn&eacute;s</a></li>
-        <li><a href="${inscriptionurl}">Inscription</a></li>
-        <li><a href="${settingurl}">Param&eacute;trage espace</a></li>
-    </ul>
-    <div class="mtop-5 hide-on-med-and-down"></div>
+    <tag:header />
 
     <!-- Main -->
     <main class="container">
@@ -81,38 +39,10 @@
     </main>
 
     <!-- Footer -->
-    <footer class="page-footer red">
-        <div class="container">
-            <div class="row">
-                <div class="col l6 s12">
-                    <h5 class="white-text">Microfolie Lens</h5>
-                    <p class="grey-text text-lighten-4">Bla bla bla ...</p>
-                </div>
-                <div class="col l4 offset-l2 s12">
-                    <h5 class="white-text">Liens utiles</h5>
-                    <ul>
-                        <li><a class="grey-text text-lighten-3" href="./">Accueil</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#apropos">Qui somme nous</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#mention">Mentions l&eacute;gales</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#contact">Contact</a></li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-        <div class="footer-copyright">
-            <div class="container">
-                © 2019 Copyright Text
-                <a class="grey-text text-lighten-4 right" href="https://villedelens.fr" target="_blank">Ville de
-                    Lens</a>
-            </div>
-        </div>
-    </footer>
+    <tag:footer />
 
     <!-- Script -->
-    <script type="text/javascript" src="js/jquery.min.js"></script>
-    <script type="text/javascript" src="js/materialize.min.js"></script>
-    <script type="text/javascript" src="js/script.js"></script>
-    <!-- Script pour cette page-->
+    <tag:script />
     <script type="text/javascript" src="js/chart.min.js"></script>
     <script type="text/javascript" src="js/generate-chart.js"></script>
     <script type="text/javascript">

+ 4 - 73
WebContent/inscription.jsp

@@ -7,55 +7,13 @@
 <html>
 
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link type="text/css" rel="stylesheet" href="css/material-icons.css" />
-    <link type="text/css" rel="stylesheet" href="css/materialize.min.css" media="screen,projection" />
-    <link type="text/css" rel="stylesheet" href="css/style.min.css" media="screen,projection" />
-    <link rel="icon" href="img/favicon.ico" />
-    <title>Inscription - Microfolie Lens</title>
+    <tag:head title="Inscription" />
     <s:head />
 </head>
 
 <body class="grey lighten-3">
-	<s:url var="inscriptionurl" action="gotoinscription"/>
-	<s:url var="abonnesurl" action="gotoabonnes"/>
-	<s:url var="settingsurl" action="gotosettings"/>
     <!-- Header -->
-    <header class="navbar-fixed">
-        <nav class="red">
-            <div class="nav-wrapper">
-                <a href="./" class="brand-logo center mtop-half hide-on-med-and-down"><img src="img/logo.png"
-                        title="Logo Microfolie" class="responsive-img" style="max-width: 128px;" /></a>
-                <a href="./" class="brand-logo center hide-on-large-only">Microfolie Lens</a>
-                <a href="#!" data-target="mobile-nav" class="sidenav-trigger"><i class="material-icons">menu</i></a>
-                <div class="left mleft-2 hide-on-med-and-down">
-                    <a href="./">
-                        <h5>Microfolie Lens</h5>
-                    </a>
-                </div>
-                <ul class="right mright-2 hide-on-med-and-down">
-                    <li><a href="${abonnesurl}">Abonn&eacute;s</a></li>
-                    <li class="active"><a href="#">Inscription</a></li>
-                    <li><a href="${settingsurl}">Param&eacute;trage espace</a></li>
-                </ul>
-            </div>
-        </nav>
-    </header>
-    <!-- Header Mobile -->
-    <ul class="sidenav" id="mobile-nav">
-        <li class="center-align mtop-1">
-            <img src="img/logo.png" title="Logo Microfolie" class="responsive-img" style="max-height: 150px;" />
-        </li>
-        <li class="center-align">
-            <h4>Microfolie Lens</h4>
-            <hr />
-        </li>
-        <li><a href="${abonnesurl}">Abonn&eacute;s</a></li>
-        <li class="active"><a href="#">Inscription</a></li>
-        <li><a href="${settingsurl}">Param&eacute;trage espace</a></li>
-    </ul>
-    <div class="mtop-5 hide-on-med-and-down"></div>
+    <tag:header active="inscription" />
 
     <!-- Main -->
     <main class="container">
@@ -161,37 +119,10 @@
     <tag:loader name="loader"/>
 
     <!-- Footer -->
-    <footer class="page-footer red">
-        <div class="container">
-            <div class="row">
-                <div class="col l6 s12">
-                    <h5 class="white-text">Microfolie Lens</h5>
-                    <p class="grey-text text-lighten-4">Bla bla bla ...</p>
-                </div>
-                <div class="col l4 offset-l2 s12">
-                    <h5 class="white-text">Liens utiles</h5>
-                    <ul>
-                        <li><a class="grey-text text-lighten-3" href="./">Accueil</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#apropos">Qui somme nous</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#mention">Mentions l&eacute;gales</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#contact">Contact</a></li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-        <div class="footer-copyright">
-            <div class="container">
-                © 2019 Copyright Text
-                <a class="grey-text text-lighten-4 right" href="https://villedelens.fr" target="_blank">Ville de
-                    Lens</a>
-            </div>
-        </div>
-    </footer>
+    <tag:footer />
 
     <!-- Script -->
-    <script type="text/javascript" src="js/jquery.min.js"></script>
-    <script type="text/javascript" src="js/materialize.min.js"></script>
-    <script type="text/javascript" src="js/script.js"></script>
+    <tag:script />
     <script type="text/javascript">
     	$(document).ready(() => {
     		const loader = M.Modal.getInstance($('#loader'));

+ 5 - 38
WebContent/scan/generate.jsp

@@ -1,5 +1,6 @@
 <%@ page language="java" contentType="text/html; charset=UTF-8"
     pageEncoding="UTF-8"%>
+<%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
 <%@ taglib prefix="s" uri="/struts-tags"%>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
 
@@ -7,14 +8,7 @@
 <html>
 
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link type="text/css" rel="stylesheet" href="<c:url value="/css/material-icons.css"/>" />
-    <link type="text/css" rel="stylesheet" href="<c:url value="/css/materialize.min.css"/>" media="screen,projection" />
-    <link type="text/css" rel="stylesheet" href="<c:url value="/css/style.min.css"/>" media="screen,projection" />
-    <link rel="icon" href="<c:url value="/img/favicon.ico"/>" />
-    <title>QRCode - Microfolie Lens</title>
-    
+    <tag:head title="QRCode" />
     <style>
     	img {
     		margin-left: auto;
@@ -72,38 +66,11 @@
     </main>
     
     <!-- Footer -->
-    <footer class="page-footer red">
-        <div class="container">
-            <div class="row">
-                <div class="col l6 s12">
-                    <h5 class="white-text">Microfolie Lens</h5>
-                    <p class="grey-text text-lighten-4">Bla bla bla ...</p>
-                </div>
-                <div class="col l4 offset-l2 s12">
-                    <h5 class="white-text">Liens utiles</h5>
-                    <ul>
-                        <li><a class="grey-text text-lighten-3" href="<c:url value="/" />">Accueil</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#apropos">Qui somme nous</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#mention">Mentions l&eacute;gales</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#contact">Contact</a></li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-        <div class="footer-copyright">
-            <div class="container">
-                © 2019 Copyright Text
-                <a class="grey-text text-lighten-4 right" href="https://villedelens.fr" target="_blank">Ville de
-                    Lens</a>
-            </div>
-        </div>
-    </footer>
+    <tag:footer />
     
     <!-- Script -->
-    <script type="text/javascript" src="../js/jquery.min.js"></script>
-    <script type="text/javascript" src="../js/materialize.min.js"></script>
-    <script type="text/javascript" src="../js/qrcode.min.js"></script>
-    <script type="text/javascript" src="../js/script.js"></script>
+    <tag:script />
+    <script type="text/javascript" src="<c:url value="/js/qrcode.min.js" />"></script>
     <script type="text/javascript">
     	$(document).ready(() => {
     		const params = new URLSearchParams(window.location.search);

+ 5 - 13
WebContent/scan/index.jsp

@@ -1,8 +1,9 @@
 <%@ page language="java" contentType="text/html; charset=UTF-8"
     pageEncoding="UTF-8"%>
 <%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
-<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
-<%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
+<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
+<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
+
 <c:set var="req" value="${pageContext.request}" />
 <c:set var="url">${req.requestURL}</c:set>
 <c:set var="base" value="${fn:substring(url, 0, fn:length(url) - fn:length(req.requestURI))}${req.contextPath}/" />
@@ -11,13 +12,7 @@
 <html>
 
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link type="text/css" rel="stylesheet" href="../css/material-icons.css" />
-    <link type="text/css" rel="stylesheet" href="../css/materialize.min.css" media="screen,projection" />
-    <link type="text/css" rel="stylesheet" href="../css/style.min.css" media="screen,projection" />
-    <link rel="icon" href="../img/favicon.ico" />
-    <title>Scan - Microfolie Lens</title>
+	<tag:head title="Scan" />
 </head>
 
 <body class="grey lighten-3">
@@ -81,10 +76,7 @@
     <tag:loader name="loader" />
 
     <!-- Script -->
-    <script type="text/javascript" src="../js/jquery.min.js"></script>
-    <script type="text/javascript" src="../js/materialize.min.js"></script>
-    <script type="text/javascript" src="../js/script.js"></script>
-    <!-- Script pour cette page-->
+    <tag:script />
     <script type="text/javascript" src="../js/instascan.min.js"></script>
     <script type="text/javascript">
     	$(document).ready(() => {

+ 6 - 74
WebContent/settings/index.jsp

@@ -1,10 +1,11 @@
 <%@ page language="java" contentType="text/html; charset=utf-8"
 	pageEncoding="utf-8"%>
-<%@ taglib prefix="s" uri="/struts-tags"%>
+<%@ taglib prefix="tag" tagdir="/WEB-INF/tags" %>
 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
 <%@ page import="java.util.List" %>
 <%@ page import="microfolie.service.EspaceService" %>
 <%@ page import="microfolie.service.dto.EspaceDTO" %>
+
 <%
 	EspaceService espaceService = EspaceService.getInstance();
 	List<EspaceDTO> espaces = espaceService.getAll();
@@ -14,54 +15,12 @@
 <html>
 
 <head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link type="text/css" rel="stylesheet" href="<c:url value="/css/material-icons.css"/>" />
-    <link type="text/css" rel="stylesheet" href="<c:url value="/css/materialize.min.css"/>" media="screen,projection" />
-    <link type="text/css" rel="stylesheet" href="<c:url value="/css/style.min.css"/>" media="screen,projection" />
-    <link rel="icon" href="<c:url value="/img/favicon.ico"/>" />
-    <title>Paramétrage - Microfolie Lens</title>
+    <tag:head title="Paramétrage" />
 </head>
 
 <body class="grey lighten-3">
-	<s:url var="inscriptionurl" action="gotoinscription"/>
-    <s:url var="abonnesurl" action="gotoabonnes"/>
-	<s:url var="settingsurl" action="gotosettings"/>
     <!-- Header -->
-    <header class="navbar-fixed">
-        <nav class="red">
-            <div class="nav-wrapper">
-                <a href="<c:url value="/"/>" class="brand-logo center mtop-half hide-on-med-and-down"><img src="<c:url value="/img/logo.png"/>"
-                        title="Logo Microfolie" class="responsive-img" style="max-width: 128px;" /></a>
-                <a href="<c:url value="/"/>" class="brand-logo center hide-on-large-only">Microfolie Lens</a>
-                <a href="#!" data-target="mobile-nav" class="sidenav-trigger"><i class="material-icons">menu</i></a>
-                <div class="left mleft-2 hide-on-med-and-down">
-                    <a href="<c:url value="/"/>">
-                        <h5>Microfolie Lens</h5>
-                    </a>
-                </div>
-                <ul class="right mright-2 hide-on-med-and-down">
-                    <li><a href="${abonnesurl}">Abonn&eacute;s</a></li>
-                    <li><a href="${inscriptionurl}">Inscription</a></li>
-                    <li class="active"><a href="#">Param&eacute;trage espace</a></li>
-                </ul>
-            </div>
-        </nav>
-    </header>
-    <!-- Header Mobile -->
-    <ul class="sidenav" id="mobile-nav">
-        <li class="center-align mtop-1">
-            <img src="../img/logo.png" title="Logo Microfolie" class="responsive-img" style="max-height: 150px;" />
-        </li>
-        <li class="center-align">
-            <h4>Microfolie Lens</h4>
-            <hr />
-        </li>
-        <li><a href="${abonnesurl}">Abonn&eacute;s</a></li>
-        <li><a href="${inscriptionurl}">Inscription</a></li>
-        <li class="active"><a href="#">Param&eacute;trage espace</a></li>
-    </ul>
-    <div class="mtop-5 hide-on-med-and-down"></div>
+    <tag:header active="settings" />
 
     <!-- Main -->
     <main class="container">
@@ -80,37 +39,10 @@
     </main>
 
     <!-- Footer -->
-    <footer class="page-footer red">
-        <div class="container">
-            <div class="row">
-                <div class="col l6 s12">
-                    <h5 class="white-text">Microfolie Lens</h5>
-                    <p class="grey-text text-lighten-4">Bla bla bla ...</p>
-                </div>
-                <div class="col l4 offset-l2 s12">
-                    <h5 class="white-text">Liens utiles</h5>
-                    <ul>
-                        <li><a class="grey-text text-lighten-3" href="<c:url value="/"/>">Accueil</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#apropos">Qui somme nous</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#mention">Mentions l&eacute;gales</a></li>
-                        <li><a class="grey-text text-lighten-3" href="#contact">Contact</a></li>
-                    </ul>
-                </div>
-            </div>
-        </div>
-        <div class="footer-copyright">
-            <div class="container">
-                © 2019 Copyright Text
-                <a class="grey-text text-lighten-4 right" href="https://villedelens.fr" target="_blank">Ville de
-                    Lens</a>
-            </div>
-        </div>
-    </footer>
+    <tag:footer />
 
     <!-- Script -->
-    <script type="text/javascript" src="<c:url value="/js/jquery.min.js"/>"></script>
-    <script type="text/javascript" src="<c:url value="/js/materialize.min.js"/>"></script>
-    <script type="text/javascript" src="<c:url value="/js/script.js"/>"></script>
+    <tag:script />
 </body>
 
 </html>