Ajout page Ouiheberg

app/app.ejs

@@ -29,6 +29,7 @@
     <%- include('frame') %>
     <div id="main">
         <%- include('welcome') %>
+        <%- include('ouiheberg') %>
         <%- include('login') %>
         <%- include('waiting') %>
         <%- include('loginOptions') %>

app/assets/css/launcher.css

@@ -363,6 +363,89 @@ body, button {
     align-items: center;
 }
 
+
+#ouihebergButton {
+    background: none;
+    font-weight: bold;
+    letter-spacing: 2px;
+    border: none;
+    padding: 15px 5px;
+    margin: 10px 0px;
+    cursor: pointer;
+    position: relative;
+    right: -20px;
+    transition: 0.5s ease;
+    margin-top: 5%;
+    margin-bottom: -5%;
+}
+#ouihebergButton:disabled {
+    color: rgba(255, 255, 255, 0.75);
+    pointer-events: none;
+}
+#ouihebergButton:hover,
+#ouihebergButton:focus {
+    text-shadow: 0px 0px 20px #fff;
+    outline: none;
+}
+#ouihebergButton:active {
+    color: #c7c7c7;
+    text-shadow: 0px 0px 20px #c7c7c7;
+}
+
+#ouihebergButtonContent {
+    display: flex;
+    align-items: center;
+}
+
+#ouihebergContent {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    width: 50%;
+    top: -10%;
+    position: relative;
+}
+
+#ouihebergDescription {
+    text-align: justify;
+    font-size: 13px;
+    font-weight: 100;
+    text-shadow: rgba(255, 255, 255, 0.75) 0px 0px 20px
+}
+
+#ouihebergHeader {
+    font-family: 'Avenir Medium';
+    text-align: center;
+    color: white;
+    margin-bottom: 25px;
+    letter-spacing: 1px;
+    font-size: 20px;
+    text-shadow: white 0px 0px 0px;
+}
+
+#ouihebergImageSeal {
+    border-radius: 50%;
+    border: 2px solid #cad7e1;
+    background: rgba(1, 2, 1, 0.5);
+    height: 125px;
+    width: 125px;
+    box-shadow: 0px 0px 10px 0px rgb(0, 0, 0);
+    margin-bottom: 5%;
+    margin-top: 10%;
+}
+
+#testouiheberg {
+    position: relative;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100%;
+    width: 100%;
+    background: rgba(0, 0, 0, 0.50);
+}
+
+
 /*******************************************************************************
  *                                                                             *
  * Login View (login.ejs)                                                      *

app/assets/js/scripts/landing.js

@@ -122,9 +122,9 @@ document.getElementById('avatarOverlay').onclick = (e) => {
     })
 }
 
-// Bind avatar overlay button.
+// Bind ouiheberg overlay button.
 document.getElementById('ouiheberg').onclick = (e) => {
-    
+    switchView(getCurrentView(), VIEWS.testouiheberg)
 }
 
 // Bind selected account

app/assets/js/scripts/ouiheberg.js

@@ -0,0 +1,6 @@
+/**
+ * Script for ouiheberg.ejs
+ */
+document.getElementById('ouihebergButton').addEventListener('click', e => {
+    switchView(VIEWS.testouiheberg, VIEWS.landing)
+})

app/assets/js/scripts/uibinder.js

@@ -20,7 +20,8 @@ const VIEWS = {
     login: '#loginContainer',
     settings: '#settingsContainer',
     welcome: '#welcomeContainer',
-    waiting: '#waitingContainer'
+    waiting: '#waitingContainer',
+    testouiheberg: '#testouiheberg',
 }
 
 // The currently shown view container.

app/ouiheberg.ejs

@@ -0,0 +1,15 @@
+<div id="testouiheberg" style="display: none;">
+    <div id="ouihebergContent">
+        <img id="ouihebergImageSeal" src="assets/images/ouiheberg.png"/>
+        <span id="ouihebergHeader">Merci à Ouiheberg de sponsorisé LukiEnLive !<br> <br> Thanks to Ouiheberg from sponsored LukiEnLive!</span>
+        <span id="ouihebergDescription">Mais ce n'est pas tout ! Ouiheberg à penser à vous et vous offre 15% de réduction sur tout le site (sauf nom de domaine) ! Avec le lien ci-dessous et le code: LUKI15 ! <br> <br> But that's not all ! Ouiheberg to think of you and offers you 15% discount on the whole site (except domain name)! With the link below and the code: LUKI15! </span>
+        <br>
+        <a href="https://www.ouiheberg.com/panel/aff.php?aff=326">Lien de la promotion ici ! / Promo link here!</a>
+        <button id="ouihebergButton">
+            <div id="ouihebergButtonContent">
+                Retour
+            </div>
+        </button>
+    </div>
+    <script src="./assets/js/scripts/ouiheberg.js"></script>
+</div>