1.6 ajoute un graph dans l'hostorique d'un participant

README.md

@@ -1,4 +1,4 @@
-# ZwiiCampus 1.5.00
+# ZwiiCampus 1.6.00
 
 ZwiiCampus (Learning Management System) est logiciel auteur destiné à mettre en ligne des tutoriels. Il dispose de plusieurs modalités d'ouverture et d'accès des contenus. Basé sur la version 13 du CMS Zwii, la structure logicielle est solide, le framework de Zwii est éprouvé.
 

core/core.php

@@ -51,7 +51,7 @@ class common
 	const ACCESS_TIMER = 1800;
 
 	// Numéro de version
-	const ZWII_VERSION = '1.5.00';
+	const ZWII_VERSION = '1.6.00';
 
 	// URL autoupdate
 	const ZWII_UPDATE_URL = 'https://forge.chapril.org/ZwiiCMS-Team/campus-update/raw/branch/master/';

core/module/course/course.php

@@ -76,6 +76,8 @@ class course extends common
 
     public static $userHistory = [];
 
+    public static $userGraph = [];
+
     public static $userStat = [];
 
     public function index()
@@ -1206,6 +1208,12 @@ class course extends common
                     $time,
                     ($diff < 1800) ? sprintf("%d' %d''", floor($diff / 60), $diff % 60) : "Non significatif",
                 ];
+                if ($diff < 1800) {
+                    self::$userGraph[] = [
+                        helper::dateUTF8('%Y-%m-%d', $time),
+                        $diff,
+                    ];
+                }
                 $lastView = $time;
                 $floorTime = isset($floorTime) && $floorTime < $time ? $floorTime : $time;
                 $topTime = isset($topTime) && $topTime > $time ? $topTime : $time;
@@ -1236,7 +1244,10 @@ class course extends common
         // Valeurs en sortie
         $this->addOutput([
             'title' => helper::translate('Historique ') . $this->getData(['user', $userId, 'firstname']) . ' ' . $this->getData(['user', $userId, 'lastname']),
-            'view' => 'userHistory'
+            'view' => 'userHistory',
+            'vendor' => [
+                "plotly"
+            ]
         ]);
 
     }

core/module/course/view/userHistory/userHistory.js.php

@@ -13,4 +13,30 @@
 
 $(document).ready((function () {
 
+    var dataX = <?php echo json_encode(array_map(function ($item) { return $item[0]; }, $module::$userGraph)); ?>;
+    var dataY = <?php echo json_encode(array_map(function ($item) { return $item[1];}, $module::$userGraph)); ?>;
+
+    var data = [{
+        x: dataX,
+        y: dataY,
+        mode: 'markers', // Mode de tracé des points
+        type: 'scatter' // Type de graphe
+    }];
+
+    // Créer un objet layout et définir les propriétés du titre, des axes, etc.
+    var layout = {
+        title: 'Consultations par jour', // Titre du graphe
+        xaxis: {
+            title: 'Jours', // Titre de l'axe des abscisses
+            type: 'date' // Type de l'axe des abscisses
+        },
+        yaxis: {
+            title: 'Temps (en secondes)', // Titre de l'axe des ordonnées
+            type: 'linear' // Type de l'axe des ordonnées
+        }
+    };
+
+    // Créer et afficher le graphe dans l'élément <div>
+    Plotly.newPlot('graph', data, layout, {locale: 'fr-CH'});
+
 }));

core/module/course/view/userHistory/userHistory.php

@@ -14,20 +14,34 @@
         ]) ?>
     </div>
 </div>
+<div class="row">
+    <div class="col10 offset1">
+        <div id="graph">
+        </div>
+    </div>
+</div>
 <?php if ($module::$userHistory): ?>
     <div class="row">
         <div class="col4 offset2">
             <?php if ($this->getData(['course', $this->getUrl(2), 'access']) === self::COURSE_ACCESS_DATE): ?>
                 <p>Espace ouvert le :
-                    <?php echo helper::dateUTF8('%d %B %Y %H:%M', $this->getData(['course', $this->getUrl(2), 'openingDate'])); ?></p>
+                    <?php echo helper::dateUTF8('%d %B %Y %H:%M', $this->getData(['course', $this->getUrl(2), 'openingDate'])); ?>
+                </p>
                 <p>Espace fermé le :
-                    <?php echo helper::dateUTF8('%d %B %Y %H:%M', $this->getData(['course', $this->getUrl(2), 'closingDate'])); ?></p>
+                    <?php echo helper::dateUTF8('%d %B %Y %H:%M', $this->getData(['course', $this->getUrl(2), 'closingDate'])); ?>
+                </p>
             <?php endif; ?>
         </div>
         <div class="col4">
-            <p>Commencé le : <?php echo $module::$userStat['floor'];?></p>
+            <p>Commencé le :
-            <p>Terminé le : <?php echo $module::$userStat['top'];?></p>
+                <?php echo $module::$userStat['floor']; ?>
-            <p>Temps passé : <?php echo $module::$userStat['time'];?></p>
+            </p>
+            <p>Terminé le :
+                <?php echo $module::$userStat['top']; ?>
+            </p>
+            <p>Temps passé :
+                <?php echo $module::$userStat['time']; ?>
+            </p>
         </div>
     </div>
     <div class="row textAlignCenter">

core/vendor/plotly/README.md

@@ -0,0 +1,271 @@
+# Using distributed files
+
+All plotly.js bundles inject an object `Plotly` into the global scope.
+
+Import plotly.js as:
+
+```html
+<script src="plotly.min.js"></script>
+```
+
+or the un-minified version as:
+
+```html
+<script src="plotly.js" charset="utf-8"></script>
+```
+
+### To include localization
+
+Plotly.js defaults to US English (en-US) and includes British English (en) in the standard bundle.
+Many other localizations are available - here is an example using Swiss-German (de-CH),
+see the contents of this directory for the full list.
+Note that the file names are all lowercase, even though the region is uppercase when you apply a locale.
+
+*After* the plotly.js script tag, add:
+
+```html
+<script src="plotly-locale-de-ch.js"></script>
+<script>Plotly.setPlotConfig({locale: 'de-CH'})</script>
+```
+
+The first line loads and registers the locale definition with plotly.js, the second sets it as the default for all Plotly plots.
+You can also include multiple locale definitions and apply them to each plot separately as a `config` parameter:
+
+```js
+Plotly.newPlot(graphDiv, data, layout, {locale: 'de-CH'})
+```
+
+# Bundle information
+
+The main plotly.js bundle includes all trace modules.
+
+The main plotly.js bundles weight in at:
+
+| plotly.js | plotly.min.js | plotly.min.js + gzip | plotly-with-meta.js |
+|-----------|---------------|----------------------|---------------------|
+| 8.2 MB | 3.5 MB | 1 MB | 8.5 MB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-2.29.0.js
+
+> https://cdn.plot.ly/plotly-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js](https://www.npmjs.com/package/plotly.js)
+
+> [plotly.js-dist](https://www.npmjs.com/package/plotly.js-dist)
+
+> [plotly.js-dist-min](https://www.npmjs.com/package/plotly.js-dist-min)
+
+#### Meta information
+> If you would like to have access to the attribute meta information (including attribute descriptions as on the [schema reference page](https://plotly.com/javascript/reference/)), use dist file `dist/plotly-with-meta.js`
+---
+
+## Partial bundles
+
+plotly.js also ships with several _partial_ bundles:
+
+- [basic](#plotlyjs-basic)
+- [cartesian](#plotlyjs-cartesian)
+- [geo](#plotlyjs-geo)
+- [gl3d](#plotlyjs-gl3d)
+- [gl2d](#plotlyjs-gl2d)
+- [mapbox](#plotlyjs-mapbox)
+- [finance](#plotlyjs-finance)
+- [strict](#plotlyjs-strict)
+
+> Each plotly.js partial bundle has a corresponding npm package with no dependencies.
+
+> The minified version of each partial bundle is also published to npm in a separate "dist-min" package.
+
+> The strict bundle now includes all traces, but the regl-based traces are built differently to avoid function constructors. This results in about a 10% larger bundle size, which is why this method is not used by default. Over time we intend to use the strict bundle to work on other strict CSP issues such as inline CSS.
+
+---
+
+### plotly.js basic
+
+The `basic` partial bundle contains trace modules `bar`, `pie` and `scatter`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 2.6 MB | 984.6 kB | 329.6 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-basic-2.29.0.js
+
+> https://cdn.plot.ly/plotly-basic-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-basic-dist](https://www.npmjs.com/package/plotly.js-basic-dist)
+
+> [plotly.js-basic-dist-min](https://www.npmjs.com/package/plotly.js-basic-dist-min)
+
+---
+
+### plotly.js cartesian
+
+The `cartesian` partial bundle contains trace modules `bar`, `box`, `contour`, `heatmap`, `histogram`, `histogram2d`, `histogram2dcontour`, `image`, `pie`, `scatter`, `scatterternary` and `violin`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 3.3 MB | 1.2 MB | 417 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-cartesian-2.29.0.js
+
+> https://cdn.plot.ly/plotly-cartesian-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-cartesian-dist](https://www.npmjs.com/package/plotly.js-cartesian-dist)
+
+> [plotly.js-cartesian-dist-min](https://www.npmjs.com/package/plotly.js-cartesian-dist-min)
+
+---
+
+### plotly.js geo
+
+The `geo` partial bundle contains trace modules `choropleth`, `scatter` and `scattergeo`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 3.1 MB | 1.1 MB | 372.3 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-geo-2.29.0.js
+
+> https://cdn.plot.ly/plotly-geo-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-geo-dist](https://www.npmjs.com/package/plotly.js-geo-dist)
+
+> [plotly.js-geo-dist-min](https://www.npmjs.com/package/plotly.js-geo-dist-min)
+
+---
+
+### plotly.js gl3d
+
+The `gl3d` partial bundle contains trace modules `cone`, `isosurface`, `mesh3d`, `scatter`, `scatter3d`, `streamtube`, `surface` and `volume`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 3.6 MB | 1.5 MB | 493.1 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-gl3d-2.29.0.js
+
+> https://cdn.plot.ly/plotly-gl3d-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-gl3d-dist](https://www.npmjs.com/package/plotly.js-gl3d-dist)
+
+> [plotly.js-gl3d-dist-min](https://www.npmjs.com/package/plotly.js-gl3d-dist-min)
+
+---
+
+### plotly.js gl2d
+
+The `gl2d` partial bundle contains trace modules `heatmapgl`, `parcoords`, `pointcloud`, `scatter`, `scattergl` and `splom`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 4.4 MB | 1.9 MB | 599.6 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-gl2d-2.29.0.js
+
+> https://cdn.plot.ly/plotly-gl2d-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-gl2d-dist](https://www.npmjs.com/package/plotly.js-gl2d-dist)
+
+> [plotly.js-gl2d-dist-min](https://www.npmjs.com/package/plotly.js-gl2d-dist-min)
+
+---
+
+### plotly.js mapbox
+
+The `mapbox` partial bundle contains trace modules `choroplethmapbox`, `densitymapbox`, `scatter` and `scattermapbox`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 4.4 MB | 1.7 MB | 531.2 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-mapbox-2.29.0.js
+
+> https://cdn.plot.ly/plotly-mapbox-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-mapbox-dist](https://www.npmjs.com/package/plotly.js-mapbox-dist)
+
+> [plotly.js-mapbox-dist-min](https://www.npmjs.com/package/plotly.js-mapbox-dist-min)
+
+---
+
+### plotly.js finance
+
+The `finance` partial bundle contains trace modules `bar`, `candlestick`, `funnel`, `funnelarea`, `histogram`, `indicator`, `ohlc`, `pie`, `scatter` and `waterfall`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 2.8 MB | 1 MB | 358.7 kB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-finance-2.29.0.js
+
+> https://cdn.plot.ly/plotly-finance-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-finance-dist](https://www.npmjs.com/package/plotly.js-finance-dist)
+
+> [plotly.js-finance-dist-min](https://www.npmjs.com/package/plotly.js-finance-dist-min)
+
+---
+
+### plotly.js strict
+
+The `strict` partial bundle contains trace modules `bar`, `barpolar`, `box`, `candlestick`, `carpet`, `choropleth`, `choroplethmapbox`, `cone`, `contour`, `contourcarpet`, `densitymapbox`, `funnel`, `funnelarea`, `heatmap`, `heatmapgl`, `histogram`, `histogram2d`, `histogram2dcontour`, `icicle`, `image`, `indicator`, `isosurface`, `mesh3d`, `ohlc`, `parcats`, `parcoords`, `pie`, `pointcloud`, `sankey`, `scatter`, `scattergl`, `scatter3d`, `scattercarpet`, `scattergeo`, `scattermapbox`, `scatterpolar`, `scatterpolargl`, `scattersmith`, `scatterternary`, `splom`, `streamtube`, `sunburst`, `surface`, `table`, `treemap`, `violin`, `volume` and `waterfall`.
+
+#### Stats
+
+| Raw size | Minified size | Minified + gzip size |
+|------|-----------------|------------------------|
+| 8.7 MB | 3.8 MB | 1.1 MB |
+
+#### CDN links
+> https://cdn.plot.ly/plotly-strict-2.29.0.js
+
+> https://cdn.plot.ly/plotly-strict-2.29.0.min.js
+
+
+#### npm packages
+> [plotly.js-strict-dist](https://www.npmjs.com/package/plotly.js-strict-dist)
+
+> [plotly.js-strict-dist-min](https://www.npmjs.com/package/plotly.js-strict-dist-min)
+
+---
+
+
+_This file is auto-generated by `npm run stats`. Please do not edit this file directly._

core/vendor/plotly/inc.json

@@ -0,0 +1,4 @@
+[
+	"plotly.min.js",
+    "plotly-locale-fr-ch.js"
+]

core/vendor/plotly/plotly-locale-fr-ch.js

@@ -0,0 +1 @@
+var locale={moduleType:"locale",name:"fr-CH",dictionary:{},format:{days:["Dimanche","Lundi","Mardi","Mercredi","Jeudi","Vendredi","Samedi"],shortDays:["Dim","Lun","Mar","Mer","Jeu","Ven","Sam"],months:["Janvier","F\xe9vrier","Mars","Avril","Mai","Juin","Juillet","Ao\xfbt","Septembre","Octobre","Novembre","D\xe9cembre"],shortMonths:["Jan","F\xe9v","Mar","Avr","Mai","Jun","Jul","Ao\xfb","Sep","Oct","Nov","D\xe9c"],date:"%d.%m.%Y"}};"undefined"==typeof Plotly?(window.PlotlyLocales=window.PlotlyLocales||[],window.PlotlyLocales.push(locale)):Plotly.register(locale);