Créer et remplir un tableau à deux dimensions

**Perpelle** · 30/01/2019, 17h38

Bonjour,
Je viens de commencer PHP et malgré mes recherches je n'ai pas vraiment trouver de quoi m'aider.
Je travaille sur un code me permettant de récupérer un flux ICS afin de le mettre sous forme de planning pour des réservations de salles. J'ai pu convertir mon ICS en format datetime avec ics-parser mais maintenant je bloque sur la création d'un tableau à 2 dimensions avec les différentes heures à gauche en colonnes et en haut en ligne les jours de la semaines.
Et dans ce tableau, je chercherais placer les horaires déjà réservé pour une salle.
Voici en gros ce que je souhaite faire, mais de façon à ce que les vignettes rouges avec l'heure, la date et la salle se place d’elles-mêmes sur le tableau.
Nom : Semaine.png
Affichages : 485
Taille : 42,1 Ko

Nom : Semaine.png
Affichages : 485
Taille : 42,1 Ko

Ici j'ai fais un tableau rapide html/css, mais en php je me retrouve avec des lignes de cette taille car je ne sais pas comment créer un tableau a deux dimensions autrement et sachant que les horaires peuvent aussi être du type 8h30 ou 9h45 je devrais en ajouter 3 fois plus

.

Nom : 2019-01-30 16_36_40-C__wamp64_www_tests_Table_Function_Time.php • - Sublime Text (UNREGISTERED).png
Affichages : 317
Taille : 66,6 Ko

Un petit coups de main serait pas de refus

**CosmoKnacki** · 30/01/2019, 20h14

Un truc comme ça:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
$quarters = range(0, 45, 15);
$hours = range(8, 18);
$days = array_fill_keys(['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], null);
 
$timeSlots = array();
$format = '%02d:%02d';
 
foreach ($hours as $hour) {
    foreach ($quarters as $quarter) {
        $timeSlots[sprintf($format, $hour, $quarter)] = $days;
    }
}
 
print_r($timeSlots);

**Perpelle** · 31/01/2019, 11h21

Je suis novice en php (j'ai commencé il y a 3 jours

), mais je vois que le print_r($timeSlots) me donne un tableau constitué de tableaux donc je crois que c'est ce dont j'ai besoin d'après le peu que j'ai vu en php, merci

.
J'aurais encore quelques questions, comment remplir le tableau en fonction de ce que me donne ICS-parser (des datetime) ? et comment le mettre en forme avec HTML ou CSS ?

**Perpelle** · 31/01/2019, 12h23

Voici mon code pour l'instant je peux ajouter ton code pour le tableau mais après je ne vois pas comment le remplir

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
 
<?php
// phpcs:disable Generic.Arrays.DisallowLongArraySyntax.Found
    require_once 'C:\Windows\System32/vendor/autoload.php';
    use ICal\ICal;
    try {
        $ical = new ICal('https://raw.githubusercontent.com/u01jmg3/ics-parser/master/examples/ICal.ics', array(
            'defaultSpan'                 => 2,     // Default value
            'defaultTimeZone'             => 'UTC',
            'defaultWeekStart'            => 'MO',  // Default value
            'disableCharacterReplacement' => false, // Default value
            'filterDaysAfter'             => null,  // Default value
            'filterDaysBefore'            => null,  // Default value
            'replaceWindowsTimeZoneIds'   => false, // Default value
            'skipRecurrence'              => false, // Default value
            'useTimeZoneWithRRules'       => false, // Default value
        ));
        // $ical->initFile('ICal.ics');
        // $ical->initUrl('https://raw.githubusercontent.com/u01jmg3/ics-parser/master/examples/ICal.ics');
    } catch (\Exception $e) {
        die($e);
    }
    $forceTimeZone = false;
    $timehours = date('H:i');
    $mon = date('d-m-Y',time()+( 1 - date('w'))*24*3600);
    $tue = date('d-m-Y',time()+( 2 - date('w'))*24*3600);
    $wed = date('d-m-Y',time()+( 3 - date('w'))*24*3600);
    $thu = date('d-m-Y',time()+( 4 - date('w'))*24*3600);
    $fri = date('d-m-Y',time()+( 5 - date('w'))*24*3600);
    $sat = date('d-m-Y',time()+( 6 - date('w'))*24*3600);
 
?>
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
        <link rel="stylesheet" type="text/css" href="testbis_semaine.css">
        <title>PHP ICS Parser test</title>
        <style>body { background-color: #eee } .caption { overflow-x: auto }</style>
    </head>
    <body>
        <div class="container-fluid">
            <?php
                $showExample = array(
                    'interval' => true,
                    'range'    => true,
                    'all'      => true,
                );
            ?>
 
            <?php
                if ($showExample['interval']) {
                    $events = $ical->eventsFromInterval('1 week');
                    if ($events) {
                        echo '<h4>Events in the next 7 days:</h4>';
                    }
                    $count = 1;
            ?>
                <div class="row">
                <?php
                foreach ($events as $event) : ?>
                        <div class="col-md-2">
                            <div class="thumbnail">
                                <div class="caption">
                                    <h7><?php
                                        $dtstart = $ical->iCalDateToDateTime($event->dtstart_array[3], $forceTimeZone);
                                        echo $event->summary . ' (' . $dtstart->format('d-m-Y H:i') . ') <br>';
                                        $dtend = $ical->iCalDateToDateTime($event->dtend_array[3], $forceTimeZone);
                                        echo $event->summary . ' (' . $dtend->format('d-m-Y H:i') . ')';
                                    ?></h7>
                                </div>
                            </div>
							<?php
								if ($dtstart->format('H:i') <=> $timehours) {
									$temps[];
 
 
								}
							?>
                        </div>
                        <?php
                            if ($count > 1 && $count % 3 === 0) {
                                echo '</div><div class="row">';
                            }
                            $count++;
                        ?>
                <?php
                endforeach
                ?>
                </div>
                <?php } ?>
        </div>
    </body>
</html>

Ligne 75 j'ai commencé un if afin d’attribuer une place à chaque grille en fonction du jour et de l'heure mais je ne vois pas comment faire

**CosmoKnacki** · 03/02/2019, 20h44

En fait plus ça va plus je me dis: À quoi bon s'embêter à créer un tableau html avec 240 cases dont les trois-quarts ne serviront à rien, n'apportent rien du point de vue sémantique et ne sont pas spécialement pratiques à remplir? En plus c'est à peine si utiliser un tableau est légitime dés lors qu'on a à faire avec des plages horaires (qui peuvent s'étaler sur plusieurs heures et dont le pas est le quart d'heure). Ça n'a pas de sens à mon avis.

D'où une autre façon de faire:

Coté PHP, tu génères chacune de tes plages horaires au format hCalendar sans te soucier de la disposition, du jour ou de l'heure, genre:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div id="planning" class="vcalendar">
    <section class="vevent">
        <span class="summary">Réunion de service DRH</span>
        de <time class="dtstart" datetime="2019-02-01T08:00">01-02-2019 8h</time>
        à <time class="dtend" datetime="2019-02-01T09:00">01-02-2019 9h</time>
    </section>
    <section class="vevent">
        <span class="summary">Affectation des tickets - DSI</span>
        de <time class="dtstart" datetime="2019-02-04T09:00">04-02-2019 9h</time>
        à <time class="dtend" datetime="2019-02-04T09:30">04-02-2019 9h30</time>
    </section>
    <section class="vevent">
        <span class="summary">Visio Sygal</span>
        de <time class="dtstart" datetime="2019-02-05T13:00">05-02-2019 13h</time>
        à <time class="dtend" datetime="2019-02-05T14:30">05-02-2019 14h30</time>
    </section>
    <!-- etc. -->
</div>

Pour le css: le bloc div avec l'id planning doit être positionné et avoir la taille souhaitée pour ton planning, et, pour avoir l'affichage des heures, des jours et des éléments de la grille, tu créer un svg que tu places en background-image.
Toujours coté css: mettre la class vevent en position: absolute et lui donner la largeur souhaitée.
Puis tu crées un script Javascript qui va calculer la position (left en fonction du jour et top en fonction de l'heure de début) ainsi que la hauteur de chaque plage-horaire (en fonction de la durée). (Tu peux aussi le faire coté php, mais ça a le désavantage de polluer ton html avec des attributs style.)

Tu obtiendras un html bien plus léger comme ça, et plus besoin de tableau coté php et html.

**Perpelle** · 04/02/2019, 10h35

Vendredi j'en suis venu à la même conclusion, donc j'ai simplement créer un tableau html avec en haut les jours et à gauche les heures sans prendre en compte les minutes.
Maintenant je cherche justement une façon de modifier la hauteur de mes grilles, que l'on voit en rouge sur mon premier post, en fonction de leur durée et modifier leur position en fonction de la date et l'heure pour quelle se place dans le tableau. (Je sais pas si j'ai été clair dans mes explication

)
Je n'ai jamais fais de javascript, si t'as un petit tuto ^^
Merci pour ton aide

Créer et remplir un tableau à deux dimensions

Langage PHP

Vue hybride

Discussions similaires

Partager

Partager