rebillar/site-accueil-insa
1
1
Fork 1
forked from vergnet/site-accueil-insa
Code Issues Pull requests Releases Wiki Activity

l'orthographe pu**in

Browse source
This commit is contained in:
Guillaume Joffre 2022-06-19 17:19:07 +02:00
parent 063049112b
commit e81557331d
3 changed files with 344 additions and 105 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
admin/planning.php
View file

@ -43,7 +43,7 @@ if(isset($_POST['send'])) {
$color = htmlspecialchars($_POST['color']);
$opacity = (float) htmlspecialchars($_POST['opacity']);
$order_start = (int) htmlspecialchars($_POST['order_start']);
$len = (float) (100/20)*htmlspecialchars($_POST['length']);
$len = (float) (4.1)*htmlspecialchars($_POST['length']);
$num_planning = (int) htmlspecialchars($_POST['num_planning']);

196
assets/css/page/planning.css
View file

@ -5,72 +5,178 @@ main {
width: 100%;
}
section {
display: block;
.planning-container {
height: 82vh;
width: 100%;
background-color: rgba(255,255,255,0.5);
width: 80%;
max-width: 800px;
margin-left: auto;
margin-right: auto;
padding: 50px;
font-size: 1.2rem;
color: white;
margin-top: 40px;
}
table {
margin: 50px;
border-collapse: collapse;
height: 80vh;
margin-left: auto;
margin-right: auto;
.column {
width: 13%;
height: 82vh;
float: left;
background-image: linear-gradient(rgba(0,0,0,.08) 50%, transparent 50%);
background-size: 1px 10%;
}
table th, td {
border: 0;
margin: 0;
padding: 0;
.column.time {
width: 9%;
}
table td {
vertical-align: top;
.column.days {
width: 16%;
background-color: #34495e;
background-image: none;
display: none;
}
.tr-th {
background-color: rgba(255, 255, 255, 0.5);
.day_title {
height: 5%;
background-color: #34495e;
font-size: 0.8em;
font-weight: 600;
text-transform: uppercase;
text-align: center;
line-height: 4.1vh;
}
.tr-th th {
padding: 20px;
color: black;
font-size: 1.2rem;
.hour {
height: 5%;
background-color: rgba(52, 73, 94,0.9);
font-size: 1em;
text-align: center;
line-height: 4.1vh;
}
.tr-td {
height: 100%;
.day {
border-radius: 2.5vh;
background: #6b83db;
height: 5vh;
line-height: 5vh;
margin: 5px 5px 12px;
cursor: pointer;
}
div.hours {
background-color: rgba(255, 255, 255, 0.7);
border-top: 2px solid black;
color: black;
border-right:2px solid black;
.hour:after {
content: ":00";
}
div.content {
display : flex;
align-items : center;
justify-content : center;
border: 2px solid black;
.class {
display: flex;
align-content: center;
width: 100%;
height: 4.1vh;
background-color: transparent;
font-size: 2vmin;
font-weight: 300;
padding-left: 10px;
align-items: center;
}
@media (max-width: 1020px) {
table {
width: 100%;
.lundi .day_title:after,
.day0:after {
content: "undi";
}
.mardi .day_title:after,
.day1:after {
content: "rdi";
}
.mercredi .day_title:after,
.day2:after {
content: "rcrdi";
}
.jeudi .day_title:after,
.day3:after {
content: "eudi";
}
.vendredi .day_title:after,
.day4:after {
content: "endredi";
}
.samedi .day_title:after,
.day5:after {
content: "amedi";
}
.dimanche .day_title:after,
.day6:after {
content: "imanche";
}
@media (min-width: 701px) and (max-width: 950px) {
.hour:after {
content: "h";
}
.tr-th th {
height: width;
padding: 5px;
font-size: 0.5rem;
.column div.day_title:after {
content: none;
}
}
@media (max-width: 700px) {
.column {
width: 50%;
}
.column.days {
display: block;
width: 30%;
}
.column.time {
width: 20%;
}
.lundi,
.mardi,
.mercredi,
.jeudi,
.vendredi,
.samedi,
.dimanche {
display: none;
}
.planning-container[selected$="0"] .lundi {
display: block;
}
.planning-container[selected$="1"] .mardi {
display: block;
}
.planning-container[selected$="2"] .mercredi {
display: block;
}
.planning-container[selected$="3"] .jeudi {
display: block;
}
.planning-container[selected$="4"] .vendredi {
display: block;
}
.planning-container[selected$="5"] .samedi {
display: block;
}
.planning-container[selected$="6"] .dimanche {
display: block;
}
}
@media (max-width: 400px) {
.column div.day:after {
content: none;
}
}

251
planning.php
View file

@ -9,6 +9,7 @@ if(isset($_GET['planning']) AND !empty(['planning']))
} else {
header('Location: planning.php?planning=1');
}
?>
<main>
@ -22,67 +23,199 @@ if(isset($_GET['planning']) AND !empty(['planning']))
<span class="circles circles-bottom"></span>
</div>
<?php
if(isset($planning)) {
?>
<table>
<tr class="tr-th">
<th width="12.5%">Heures</th>
<th width="12.5%">Lundi</th>
<th width="12.5%">Mardi</th>
<th width="12.5%">Mercredi</th>
<th width="12.5%">Jeudi</th>
<th width="12.5%">Vendredi</th>
<th width="12.5%">Samedi</th>
<th width="12.5%">Dimanche</th>
</tr>
<tr class="tr-td">
<td>
<?php
for($i=7;$i<=26;$i++) {
if($i > 23) {
?>
<div style="height: <?= 100/20 ?>%;" class="hours">
<?= $i-24 ?>
</div>
<?php
} else {
?>
<div style="height: <?= 100/20 ?>%;" class="hours">
<?= $i ?>
</div>
<?php
}
}
?>
</td>
<?php
for($day=1;$day<=7;$day++) {
echo "<td style='border-bottom: 2px solid black;'>";
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = ? AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>%; border: 0; color: white; border-right: 2px solid black; border-top: 2px solid black; ?>" class="content">
<span><?= $r1['title'] ?></span>
</div>
<?php
}
<?php if(isset($planning)) { ?>
<div id="planning-container" class="planning-container" selected="0">
<div id="days" class="column days">
<div class="day_title">Jour</div>
<div class="day day0">L</div>
<div class="day day1">Ma</div>
<div class="day day2">Me</div>
<div class="day day3">J</div>
<div class="day day4">V</div>
<div class="day day5">S</div>
<div class="day day6">D</div>
<script defer>
const daysPLA = document.getElementsByClassName("day");
const containerPLA = document.getElementById("planning-container");
for (let i = 0; i < daysPLA.length; i++) {
const day = daysPLA[i];
day.addEventListener("click", (e) => {
let number = day.classList.item(1).charAt(3)
containerPLA.setAttribute("selected", number)
});
}
</script>
</div>
<div class="column time">
<div class="day_title">Heure</div>
<div class="hour">07</div>
<div class="hour">08</div>
<div class="hour">09</div>
<div class="hour">10</div>
<div class="hour">11</div>
<div class="hour">12</div>
<div class="hour">13</div>
<div class="hour">14</div>
<div class="hour">15</div>
<div class="hour">16</div>
<div class="hour">17</div>
<div class="hour">18</div>
<div class="hour">19</div>
<div class="hour">20</div>
<div class="hour">21</div>
<div class="hour">22</div>
<div class="hour">23</div>
<div class="hour">00</div>
<div class="hour">01</div>
</div>
<div id="lundi" class="column lundi">
<div class="day_title">L</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 0 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
<div id="mardi" class="column mardi">
<div class="day_title">Ma</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 1 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
<div id="mercredi" class="column mercredi">
<div class="day_title">Me</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 2 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
<div id="jeudi" class="column jeudi">
<div class="day_title">J</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 3 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
<div id="vendredi" class="column vendredi">
<div class="day_title">V</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 4 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
<div id="samedi" class="column samedi">
<div class="day_title">S</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 5 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
<div id="dimanche" class="column dimanche">
<div class="day_title">D</div>
<?php
// For every planned activity on day 0
$req1 = $db->prepare('SELECT title, description, color, length FROM planning_insa WHERE day = 6 AND num_planning = ? ORDER BY order_start ASC');
$req1->execute(array($day, $planning));
while($r1 = $req1->fetch()) {
?>
<div class="class" style="background-color: <?= $r1['color'] ?>; height: <?= $r1['length'] ?>vh;">
<?= $r1['title'] ?>
</div>
<?php
}
?>
</div>
</div>
<?php } else { ?>
<section>
Clique sur le planning que tu souhaites visionner : <br>
<font color="red">On les a pas encore en fait</font>
</section>
<?php } ?>
echo "</td>";
}
?>
</tr>
</table>
<?php
} else {
?>
<section>
Clique sur le planning que tu souhaites visionner : <br>
<font color="red">On les a pas encore en fait</font>
</section>
<?php } ?>
</main>
<?php
$infopage = ["", "Planning", ob_get_clean(), "", "planning"]; //relativepath, pagetitle, pagecontent, pagescript, pagename | cf structure/template.php ligne 2 à 6
include("structure/template.php");