diff --git a/css/header.css b/css/header.css
index 0425e2c..feb0059 100755
--- a/css/header.css
+++ b/css/header.css
@@ -178,4 +178,43 @@
#SUBHEADER nav > span:hover,
#SUBHEADER nav > span.active{
border-bottom-color: #2cab5f;
+}
+
+
+/* BOUTON POUR LA DÉCONNECTION */
+#SUBHEADER #LOGOUT{
+ /* position */
+ /*display: block;*/ display: none;
+ position: absolute;
+ top: 10px;
+ left: calc( 100% - 2.5em - 10px );
+ width: calc( 2.5em - 2*2px );
+ height: calc( 2.5em - 2*2px );
+
+ /* border */
+ border-radius: 100% / 100%;
+ border: 2px solid #ccc;
+
+ /* background */
+ background: transparent url(../src/header/logout.svg) center center no-repeat;
+ background-size: 70% auto;
+
+ /* animation */
+ transition: all .1s ease-in-out, background-size 0s;
+ -moz-transition: all .1s ease-in-out, background-size 0s;
+ -webkit-transition: all 0s;
+ -ms-transition: all .1s ease-in-out, background-size 0s;
+ -o-transition: all .1s ease-in-out, background-size 0s;
+
+ /* extra */
+ cursor: pointer;
+}
+
+/* BOUTON ACTIVÉ */
+#SUBHEADER #LOGOUT.active{ display: block; }
+
+/* BOUTON SURVOL */
+#SUBHEADER #LOGOUT:hover{
+ border-color: #28B965;
+ background-image: url(../src/header/logout@hover.svg);
}
\ No newline at end of file
diff --git a/index.php b/index.php
index 52e6559..9432e12 100755
--- a/index.php
+++ b/index.php
@@ -29,8 +29,6 @@ $memberNotifNum = 10;
$messageNotifNum = 0;
$notifNotifNum = 5;
-
-
?>
@@ -104,14 +102,19 @@ $notifNotifNum = 5;
";
+ else
+ echo "";
+ ?>
+
diff --git a/js/actionScript.js b/js/actionScript.js
index 32c4e09..bb445c6 100755
--- a/js/actionScript.js
+++ b/js/actionScript.js
@@ -42,10 +42,14 @@ var DOM = {
SUBSECTIONS : document.querySelector("#SUBHEADER > nav"),
CONTAINER : document.querySelector('#CONTAINER'),
AUTHFILTER : document.querySelector('#AUTH_FILTER'),
- AUTH : document.querySelector('#AUTH')
+ AUTH : document.querySelector('#AUTH'),
+ LOGOUT : document.querySelector('#SUBHEADER #LOGOUT')
};
+/* VRAI = utilisateur connecté */
+var connected = !( DOM.AUTH.children[0].innerHTML == 'Connection' );
+
/* [1] GESTIONNAIRES DE NAVIGATION
==============================================================*/
@@ -177,10 +181,15 @@ var DOM = {
/* [3] GESTION DE L'AUTHENTIFICATION
==============================================================*/
-// ouvre l'interface d'authentification quand clic sur zone verte
-DOM.MENU.children[0].addEventListener('click', function(e){
- DOM.AUTHFILTER.className = 'active';
-}, false);
+// ouvre l'interface d'authentification quand click
+ if( !connected ) // zone verte si pas connecté
+ DOM.MENU.children[0].addEventListener('click', function(e){
+ DOM.AUTHFILTER.className = 'active';
+ }, false);
+ else // sinon bouton de déconnection
+ DOM.LOGOUT.addEventListener('click', function(e){
+ DOM.AUTHFILTER.className = 'active';
+ }, false);
// ferme l'interface d'authentification quand clic sur filtre
DOM.AUTHFILTER.addEventListener('click', function(e){
@@ -273,10 +282,6 @@ function initForm(pForm, pHandler){
-/* SI ON EST PAS DEJA CONNECTE */
-var connected = !( DOM.AUTH.children[0].innerHTML == 'Connection' );
-
-
initForm( // initialisation du formulaire de connection
DOM.AUTH, // formulaire (élément DOM)
function(request){ // handler
diff --git a/src/header/logout.svg b/src/header/logout.svg
new file mode 100644
index 0000000..ef9ac33
--- /dev/null
+++ b/src/header/logout.svg
@@ -0,0 +1,53 @@
+
+
\ No newline at end of file
diff --git a/src/header/logout@hover.svg b/src/header/logout@hover.svg
new file mode 100644
index 0000000..2809a6a
--- /dev/null
+++ b/src/header/logout@hover.svg
@@ -0,0 +1,53 @@
+
+
\ No newline at end of file