From 452028060919b8a74d99e041982b35ddd7ef7c94 Mon Sep 17 00:00:00 2001
From: ALGLAVE Ivan <ivan.alglave8@etu.univ-lorraine.fr>
Date: Tue, 24 Nov 2020 18:02:36 +0100
Subject: [PATCH] Big changes
---
AdvancedSearch.php | 13 +++++++++++
Cocktails.php | 24 ++++++++++++++++++++
Index.php => Hierarchy.php | 2 +-
Home.php | 38 ++++++++++++++++++++++----------
MyAccount.php | 13 +++++++++++
css/{Index.css => Hierarchy.css} | 0
css/Home.css | 29 +++++++++++++-----------
7 files changed, 93 insertions(+), 26 deletions(-)
create mode 100644 AdvancedSearch.php
create mode 100644 Cocktails.php
rename Index.php => Hierarchy.php (92%)
create mode 100644 MyAccount.php
rename css/{Index.css => Hierarchy.css} (100%)
diff --git a/AdvancedSearch.php b/AdvancedSearch.php
new file mode 100644
index 0000000..53b0b3d
--- /dev/null
+++ b/AdvancedSearch.php
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Drinkpedia</title>
+ <meta charset="UTF-8">
+ <link rel="stylesheet" type="text/css" href="css/AdvancedSearch.css">
+</head>
+
+<body>
+ <h1>AdvancedSearch</h1>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Cocktails.php b/Cocktails.php
new file mode 100644
index 0000000..d6accf5
--- /dev/null
+++ b/Cocktails.php
@@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Drinkpedia</title>
+ <meta charset="UTF-8">
+ <link rel="stylesheet" type="text/css" href="css/Cocktails.css">
+</head>
+
+<body>
+ <h1>Cocktails</h1>
+ <ul>
+
+ <?php
+ include "Donnees.inc.php";
+ foreach($Recettes as $r)
+ {
+ echo '<li>' . $r['titre'] . '</li>';
+ }
+ ?>
+
+ </ul>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/Index.php b/Hierarchy.php
similarity index 92%
rename from Index.php
rename to Hierarchy.php
index f086bc1..ba70577 100644
--- a/Index.php
+++ b/Hierarchy.php
@@ -3,7 +3,7 @@
<head>
<title>Drinkpedia</title>
<meta charset="UTF-8">
- <link rel="stylesheet" type="text/css" href="css/Index.css">
+ <link rel="stylesheet" type="text/css" href="css/Hierarchy.css">
</head>
<body id="body">
diff --git a/Home.php b/Home.php
index 6e2d066..4bca386 100644
--- a/Home.php
+++ b/Home.php
@@ -8,20 +8,18 @@
<body id="body">
-
<div id="content">
<div class="topnav">
- <a class="active" href="">Hiérarchie</a>
- <a href="">Avancé</a>
- <a href="">Cocktails</a>
- <a href="">Mon Compte</a>
+ <button id="tabBtnI" class="active" value="Hierarchy.php" onclick="tabButtonClicked('tabBtnI')">Hiérarchie</button>
+ <button id="tabBtnA" value="AdvancedSearch.php" onclick="tabButtonClicked('tabBtnA')">Avancé</button>
+ <button id="tabBtnC" value="Cocktails.php" onclick="tabButtonClicked('tabBtnC')">Cocktails</button>
+ <button id="tabBtnMA" class="right" value="MyAccount.php" onclick="tabButtonClicked('tabBtnMA')">Mon Compte</button>
</div>
- <iframe id="frame" frameborder="0" src="Index.php">
+ <iframe id="tabFrame" frameborder="0" src="Hierarchy.php">
</iframe>
</div>
-
<div id="BlurredElementCenteredContainer">
@@ -34,6 +32,8 @@
let wrapper = document.getElementById('BlurredElementCenteredContainer');
let content = document.getElementById('content');
let embed = document.getElementById('BlurredElementEmbed');
+
+ let activeTabButton = document.getElementById('tabBtnI');
window.onmessage = function (e) {
@@ -62,10 +62,7 @@
function showRecipe(id)
{
- var clone = embed.cloneNode(true);
- clone.setAttribute('src','RecipeView.php?id_recipe=' + id);
- embed.parentNode.replaceChild(clone,embed);
- embed = clone;
+ embed.setAttribute('src','RecipeView.php?id_recipe=' + id);
wrapper.classList.add('active');
content.classList.add('blur');
@@ -80,8 +77,25 @@
hideRecipe();
}
});
+ }
-
+ function switchView(viewSrc)
+ {
+ var tabFrame = document.getElementById('tabFrame');
+ tabFrame.setAttribute('src', viewSrc);
+ }
+
+ function tabButtonClicked(tabButtonId)
+ {
+ let b = document.getElementById(tabButtonId);
+ if(b.id != activeTabButton.id)
+ {
+ b.classList.add('active');
+ activeTabButton.classList.remove('active');
+ activeTabButton = b;
+
+ switchView(activeTabButton.value);
+ }
}
let closeBtn = document.getElementById('BlurredElementCenteredClose');
diff --git a/MyAccount.php b/MyAccount.php
new file mode 100644
index 0000000..e7423ff
--- /dev/null
+++ b/MyAccount.php
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+<head>
+ <title>Drinkpedia</title>
+ <meta charset="UTF-8">
+ <link rel="stylesheet" type="text/css" href="css/MyAccount.css">
+</head>
+
+<body>
+ <h1>My Account</h1>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/css/Index.css b/css/Hierarchy.css
similarity index 100%
rename from css/Index.css
rename to css/Hierarchy.css
diff --git a/css/Home.css b/css/Home.css
index de6dde8..6f8a0a1 100644
--- a/css/Home.css
+++ b/css/Home.css
@@ -4,13 +4,9 @@
box-sizing: border-box;
}
-iframe {
- position: relative;
+#tabFrame {
border: none;
- border-width: 0px;
- padding: 0px;
- width: 100vw;
- height: 100%;
+ flex-grow: 1;
}
.topnav {
@@ -18,28 +14,35 @@ iframe {
overflow: hidden;
}
-.topnav a {
+.topnav button {
+ background-color: cornsilk;
float: left;
- color: #f2f2f2;
+ color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
-.topnav a:hover {
- background-color: #ddd;
+.topnav button.right {
+ float: right;
+}
+
+.topnav button:hover {
+ background-color: cornflowerblue;
color: black;
}
-.topnav a.active {
+.topnav button.active {
background-color: #534caf;
color: white;
}
#content {
width: 100%;
- display: block;
+ display: flex;
+ flex-direction: column;
+ min-height: 100vh;
}
#content.blur {
@@ -94,4 +97,4 @@ iframe {
border-radius: 5px;
box-shadow: 0px 0px 50px 5px black;
-}
\ No newline at end of file
+}
--
GitLab