From c104b4207cc1f4cee053247c4dd79de61ab33dcd Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Fri, 18 Feb 2022 18:39:57 +0100
Subject: [PATCH] wait #5109 @2.5

---
 .idea/workspace.xml                           | 41 +++++++++++--------
 app/Fields/ElearningMediaPdfID.php            | 18 ++++++++
 app/Models/ELearningMedia.php                 | 41 +++++++++++++++++--
 app/Models/ELearningPackage.php               |  5 +--
 app/SubForms/ElearningPackageContent.php      |  2 +
 resources/elearningmedia/js/app.js            | 38 +++++++++++++----
 resources/elearningmedia/sass/app.sass        |  2 +-
 .../views/elearningmedia/index.blade.php      | 16 ++++++--
 8 files changed, 126 insertions(+), 37 deletions(-)
 create mode 100644 app/Fields/ElearningMediaPdfID.php

diff --git a/.idea/workspace.xml b/.idea/workspace.xml
index 4d376a38a..87b5e6e0d 100644
--- a/.idea/workspace.xml
+++ b/.idea/workspace.xml
@@ -22,10 +22,15 @@
     <select />
   </component>
   <component name="ChangeListManager">
-    <list default="true" id="5d2ecd5e-a05a-4f96-a195-fa6372618165" name="Default Changelist" comment="wip #5093 @3">
+    <list default="true" id="5d2ecd5e-a05a-4f96-a195-fa6372618165" name="Default Changelist" comment="wip #5041 @0.25">
+      <change afterPath="$PROJECT_DIR$/app/Fields/ElearningMediaPdfID.php" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/resources/elearningpackage/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/resources/elearningpackage/index.html" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/resources/elearningpackage/sass/app.sass" beforeDir="false" afterPath="$PROJECT_DIR$/resources/elearningpackage/sass/app.sass" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/app/Models/ELearningMedia.php" beforeDir="false" afterPath="$PROJECT_DIR$/app/Models/ELearningMedia.php" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/app/Models/ELearningPackage.php" beforeDir="false" afterPath="$PROJECT_DIR$/app/Models/ELearningPackage.php" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/app/SubForms/ElearningPackageContent.php" beforeDir="false" afterPath="$PROJECT_DIR$/app/SubForms/ElearningPackageContent.php" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/resources/elearningmedia/js/app.js" beforeDir="false" afterPath="$PROJECT_DIR$/resources/elearningmedia/js/app.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/resources/elearningmedia/sass/app.sass" beforeDir="false" afterPath="$PROJECT_DIR$/resources/elearningmedia/sass/app.sass" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/resources/views/elearningmedia/index.blade.php" beforeDir="false" afterPath="$PROJECT_DIR$/resources/views/elearningmedia/index.blade.php" afterDir="false" />
     </list>
     <option name="SHOW_DIALOG" value="false" />
     <option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -317,7 +322,7 @@
     <property name="add_unversioned_files" value="$PROJECT_DIR$/vendor/backpack/crud/src/resources/views/crud/buttons/bulk_clone.blade.php&#10;H:/Works/FluidbookToolbox/vendor/backpack/crud/src/app/Http/Controllers/Auth/ResetPasswordController.php&#10;C:/Users/vince/Works/FluidbookToolbox/vendor/cubist/cms-back/src/app/Middleware/BackLocaleSelector.php&#10;D:/Works/FluidbookToolbox/vendor/laravel-lang/lang/locales/fr/fr.json&#10;D:/Works/FluidbookToolbox/.env" />
     <property name="android.sdk.path" value="$PROJECT_DIR$/../../AndroidSDK" />
     <property name="aspect.path.notification.shown" value="true" />
-    <property name="last_opened_file_path" value="$PROJECT_DIR$/resources/pdfjs" />
+    <property name="last_opened_file_path" value="$PROJECT_DIR$/app/Fields" />
     <property name="list.type.of.created.stylesheet" value="Less" />
     <property name="node.js.detected.package.eslint" value="true" />
     <property name="node.js.detected.package.tslint" value="true" />
@@ -338,11 +343,11 @@
   </component>
   <component name="RecentsManager">
     <key name="CopyFile.RECENT_KEYS">
+      <recent name="D:\Works\FluidbookToolbox\app\Fields" />
       <recent name="D:\Works\FluidbookToolbox\resources\pdfjs" />
       <recent name="D:\Works\FluidbookToolbox\resources\views\vendor\backpack\crud\buttons" />
       <recent name="D:\Works\FluidbookToolbox\app\Http\Controllers\Admin\Operations" />
       <recent name="D:\Works\FluidbookToolbox\resources\elearningpackage\js" />
-      <recent name="D:\Works\FluidbookToolbox\resources\elearningpackage\sass" />
     </key>
     <key name="MoveFile.RECENT_KEYS">
       <recent name="D:\Works\FluidbookToolbox\resources\elearningpackage" />
@@ -681,14 +686,11 @@
       <workItem from="1644851528057" duration="636000" />
       <workItem from="1644852994411" duration="9344000" />
       <workItem from="1644907547410" duration="24512000" />
-      <workItem from="1644946789585" duration="233000" />
-    </task>
-    <task id="LOCAL-00201" summary="wip #4891 @0.5">
-      <created>1637249592707</created>
-      <option name="number" value="00201" />
-      <option name="presentableId" value="LOCAL-00201" />
-      <option name="project" value="LOCAL" />
-      <updated>1637249592707</updated>
+      <workItem from="1644946789585" duration="461000" />
+      <workItem from="1645000080912" duration="13000" />
+      <workItem from="1645010493117" duration="868000" />
+      <workItem from="1645090369550" duration="6000" />
+      <workItem from="1645197416166" duration="5109000" />
     </task>
     <task id="LOCAL-00202" summary="wip #4891 @1">
       <created>1637315966593</created>
@@ -1026,7 +1028,14 @@
       <option name="project" value="LOCAL" />
       <updated>1644934041814</updated>
     </task>
-    <option name="localTasksCounter" value="250" />
+    <task id="LOCAL-00250" summary="wip #5041 @0.25">
+      <created>1644947063162</created>
+      <option name="number" value="00250" />
+      <option name="presentableId" value="LOCAL-00250" />
+      <option name="project" value="LOCAL" />
+      <updated>1644947063163</updated>
+    </task>
+    <option name="localTasksCounter" value="251" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">
@@ -1078,12 +1087,12 @@
     <MESSAGE value="wip #5041" />
     <MESSAGE value="wip #5041 @1.5" />
     <MESSAGE value="wip #5041 @0.5" />
-    <MESSAGE value="wip #5041 @0.25" />
     <MESSAGE value="wip #5041 @1" />
     <MESSAGE value="wip #5093 @2" />
     <MESSAGE value="wip #5093 @0.25" />
     <MESSAGE value="wip #5093 @3" />
-    <option name="LAST_COMMIT_MESSAGE" value="wip #5093 @3" />
+    <MESSAGE value="wip #5041 @0.25" />
+    <option name="LAST_COMMIT_MESSAGE" value="wip #5041 @0.25" />
   </component>
   <component name="XSLT-Support.FileAssociations.UIState">
     <expand />
diff --git a/app/Fields/ElearningMediaPdfID.php b/app/Fields/ElearningMediaPdfID.php
new file mode 100644
index 000000000..103dde1c7
--- /dev/null
+++ b/app/Fields/ElearningMediaPdfID.php
@@ -0,0 +1,18 @@
+<?php
+
+namespace App\Fields;
+
+use App\Models\ELearningMedia;
+use Cubist\Backpack\Magic\Fields\SelectFromModel;
+
+class ElearningMediaPdfID extends ElearningMediaID
+{
+    protected $_allows_null = true;
+
+    public function _postSetAttributes()
+    {
+        parent::_postSetAttributes();
+        $this->setAttribute('optionsmodel_scope', 'pdf');
+    }
+
+}
diff --git a/app/Models/ELearningMedia.php b/app/Models/ELearningMedia.php
index 9ab1ed79b..b95195809 100644
--- a/app/Models/ELearningMedia.php
+++ b/app/Models/ELearningMedia.php
@@ -25,7 +25,7 @@ class ELearningMedia extends ToolboxModel
 
     protected static $_permissionBase = 'elearning-media';
 
-    public const MEDIA_TYPES = ['audio/mpeg', 'video/mp4'];
+    public const MEDIA_TYPES = ['audio/mpeg', 'video/mp4', 'application/pdf'];
 
     protected $_operations = [ImportOperation::class, PreviewOperation::class, DownloadOperation::class];
 
@@ -47,11 +47,20 @@ class ELearningMedia extends ToolboxModel
     {
         $file = $this->getMediaInField('file')->first();
         $spl = new \SplFileInfo($file->getPath());
-        $ext = mb_strtolower($spl->getExtension());
-        $this->setAttribute('type', $ext === 'mp3' ? 'audio' : 'video');
+
+        $this->setAttribute('type', self::getType($spl->getExtension()));
         return parent::preSave();
     }
 
+    public static function getType($ext)
+    {
+        $exts = ['mp3' => 'audio', 'mp4' => 'video', 'pdf' => 'pdf'];
+        $ext = mb_strtolower($ext);
+        if (isset($exts[$ext])) {
+            return $exts[$ext];
+        }
+    }
+
     public function getFinalPath()
     {
         return protected_path('elearningmedia/final/' . $this->id);
@@ -86,12 +95,31 @@ class ELearningMedia extends ToolboxModel
             $title = $spl->getBasename('.' . $spl->getExtension());
         }
 
+        $type = self::getType($ext);
+
         $vdir = new VirtualDirectory($dest);
         $vdir->file_put_contents('imsmanifest.xml', new Manifest($title, Manifest::SCORM_2004, $organization, $reference));
         $vdir->copyDirectory(resource_path('elearningmedia/dist/css'), 'css');
         $vdir->copyDirectory(resource_path('elearningmedia/dist/js'), 'js');
+        if ($type === 'pdf') {
+            $vdir->copyDirectory(resource_path('pdfjs'), 'pdfjs');
+            $css = file_get_contents(resource_path('pdfjs/web/viewer.css'));
+            $css .= 'body{--sidebar-width:400px;}';
+            $css .= '.article #sidebarContainer, .article .toolbar {display:none !important;}';
+            $css .= '.article .pdfViewer{padding:0 !important;}';
+            $css .= '.article #viewerContainer{top:0 !important;overflow:visible !important;}';
+            $css .= '.article{--page-border:0;--page-margin:0;--body-bg-color:transparent;}';
+            $css .= '.openFile,.rotateCw,.rotateCcw,.rotateCcw + .horizontalToolbarSeparator{display:none !important;}';
+            $css .= '.bookmark,.print,.download{display:none !important}';
+            $css .= '#viewLayers,#viewAttachments{display:none !important}';
+            $css .= '#documentProperties,#cursorSelectTool,#cursorHandTool,#cursorHandTool + .horizontalToolbarSeparator,.horizontalToolbarSeparator.spreadModeButtons{display:none !important}';
+            $popup = '.annotationLayer .popupAnnotation .popupWrapper .popup';
+            $css .= $popup . ' h1,' . $popup . ' span{display:none !important;}';
+            $css .= $popup . ' p{border:0 !important;margin-top:0 !important;}';
+            $vdir->file_put_contents('pdfjs/web/viewer.css', $css);
+        }
         $vdir->copy($file, 'media.' . $ext);
-        $vdir->file_put_contents('index.html', view('elearningmedia.index', ['complete_pct' => $complete_pct, 'title' => $title, 'type' => $ext === 'mp3' ? 'audio' : 'video']));
+        $vdir->file_put_contents('index.html', view('elearningmedia.index', ['complete_pct' => $complete_pct, 'title' => $title, 'type' => $type]));
         $vdir->sync(true);
         return $title;
     }
@@ -101,6 +129,11 @@ class ELearningMedia extends ToolboxModel
         return $this->id . ' - ' . $this->title;
     }
 
+    public function scopePDF($query)
+    {
+        $query->where('type', 'pdf');
+    }
+
     public function scopeAudio($query)
     {
         $query->where('type', 'audio');
diff --git a/app/Models/ELearningPackage.php b/app/Models/ELearningPackage.php
index 1e7ab8dae..50693faec 100644
--- a/app/Models/ELearningPackage.php
+++ b/app/Models/ELearningPackage.php
@@ -73,7 +73,6 @@ class ELearningPackage extends ToolboxModel
         $vdir->copyDirectory(resource_path('elearningpackage/dist/css'), 'css');
         $vdir->copyDirectory(resource_path('elearningpackage/dist/js'), 'js');
         $vdir->copyDirectory(resource_path('elearningpackage/dist/fonts'), 'fonts');
-        $vdir->copyDirectory(resource_path('pdfjs'), 'js/libs/pdfjs');
         $vdir->copy(resource_path('elearningpackage/index.html'), 'index.html');
         $vdir->sync(true);
     }
@@ -109,9 +108,7 @@ class ELearningPackage extends ToolboxModel
                 $moduleTitle = $this->_compileMedia($c['video_id'], $c['video_file'], $vdir, $basePath);
                 break;
             case 'IN':
-                $moduleTitle = $this->_compilePDF($c['infographic_file'], $vdir, $basePath);
-                $res['path'] = $basePath . '/infographic.pdf';
-                $res['scorm'] = false;
+                $moduleTitle = $this->_compileMedia($c['pdf_id'], $c['infographic_file'], $vdir, $basePath);
                 break;
             case 'FC':
             default:
diff --git a/app/SubForms/ElearningPackageContent.php b/app/SubForms/ElearningPackageContent.php
index 1e00ac013..e93ae0483 100644
--- a/app/SubForms/ElearningPackageContent.php
+++ b/app/SubForms/ElearningPackageContent.php
@@ -3,6 +3,7 @@
 namespace App\SubForms;
 
 use App\Fields\ElearningMediaAudioID;
+use App\Fields\ElearningMediaPdfID;
 use App\Fields\ElearningMediaVideoID;
 use App\Fields\FluidbookID;
 use App\Fields\QuizID;
@@ -43,6 +44,7 @@ class ElearningPackageContent extends SubForm
 
         $this->addField('quiz_id', QuizID::class, __('Quiz'), ['when' => ['content_type' => 'QZ']]);
 
+        $this->addField('pdf_id', ElearningMediaPdfID::class, __('PDF'), ['when' => ['content_type' => 'IN']]);
         $this->addField('infographic_file', Files::class, __('Charger une infographie'), ['when' => ['content_type' => ['IN']], 'acceptedFiles' => ['application/pdf']]);
 
         $this->addField('content_file', Files::class, __('Charger un contenu'), ['when' => ['content_type' => ['FC']], 'acceptedFiles' => ['.zip']]);
diff --git a/resources/elearningmedia/js/app.js b/resources/elearningmedia/js/app.js
index 2d11dba4e..3cdeb921f 100644
--- a/resources/elearningmedia/js/app.js
+++ b/resources/elearningmedia/js/app.js
@@ -33,21 +33,41 @@ document.addEventListener("DOMContentLoaded", function () {
         SCORM.set('cmi.completion_status', 'incomplete');
     }
 
-    var pc = (parseInt(progressComplete) / 100);
-    var interval = setInterval(function () {
-        if (player.duration > 0 && player.currentTime > (player.duration * pc)) {
-            SCORM.set('cmi.completion_status', 'completed');
-            SCORM.set('cmi.success_status', 'passed');
-            SCORM.save();
-            clearInterval(interval);
-        }
-    }, 1000);
+    var pc = (parseInt(window.progressComplete) / 100);
+    var interval;
+    if (window.type === 'audio' || window.type === 'video') {
+        interval = setInterval(function () {
+            if (player.duration > 0 && player.currentTime >= (player.duration * pc)) {
+                markComplete(interval);
+            }
+        }, 1000);
+    } else if (window.type === 'pdf') {
+        var interval = setInterval(function () {
+            try {
+                var pdfViewer = document.getElementById('player').contentWindow.PDFViewerApplication.pdfViewer;
+                var total = pdfViewer.pagesCount;
+                var current = pdfViewer._currentPageNumber;
+                if (total > 0 && current / total >= pc) {
+                    markComplete(interval);
+                }
+            } catch (e) {
+
+            }
+        },1000);
+    }
 
     player.on('ready', function () {
         player.play();
     });
 });
 
+function markComplete(interval) {
+    SCORM.set('cmi.completion_status', 'completed');
+    SCORM.set('cmi.success_status', 'passed');
+    SCORM.save();
+    clearInterval(interval);
+}
+
 function setSessionTime() {
     var endTime = Date.now();
     SCORM.set('cmi.session_time', scormSecondsToTimeInterval((endTime.getTime() - window.openTime.getTime()) / 1000));
diff --git a/resources/elearningmedia/sass/app.sass b/resources/elearningmedia/sass/app.sass
index 191b2daa2..0b1213172 100644
--- a/resources/elearningmedia/sass/app.sass
+++ b/resources/elearningmedia/sass/app.sass
@@ -15,7 +15,7 @@ body
     font-family: Arial, Helvetica, sans-serif
     background-color: #0E2231
 
-video, audio
+video, audio, iframe
     width: 100%
     height: 100%
 
diff --git a/resources/views/elearningmedia/index.blade.php b/resources/views/elearningmedia/index.blade.php
index ea16d6941..3ba358a15 100644
--- a/resources/views/elearningmedia/index.blade.php
+++ b/resources/views/elearningmedia/index.blade.php
@@ -4,10 +4,21 @@
     <meta charset="UTF-8">
     <link href="css/app.css" rel="stylesheet">
     <title>{{$title}}</title>
+    <script>
+        var type = '{{$type}}';
+        var progressComplete = {{$complete_pct}};
+    </script>
 </head>
 <body>
-@if($type==='audio')
-    <button type="button" id="audiobigplay" class="plyr__control plyr__control--overlaid" data-plyr="play" aria-label="Play"><svg aria-hidden="true" focusable="false"><use xlink:href="#plyr-play"></use></svg><span class="plyr__sr-only">Play</span></button>
+@if($type==='pdf')
+    <iframe id="player" frameborder="0" src="pdfjs/web/viewer.html?file=../../media.pdf#page=1"></iframe>
+@elseif($type==='audio')
+    <button type="button" id="audiobigplay" class="plyr__control plyr__control--overlaid" data-plyr="play"
+            aria-label="Play">
+        <svg aria-hidden="true" focusable="false">
+            <use xlink:href="#plyr-play"></use>
+        </svg>
+        <span class="plyr__sr-only">Play</span></button>
     <svg id="spectrum"></svg>
     <audio id="player" controls>
         <source src="media.mp3" type="audio/mp3"/>
@@ -17,7 +28,6 @@
         <source src="media.mp4" type="video/mp4"/>
     </video>
 @endif
-<script>var progressComplete = {{$complete_pct}};</script>
 <script src="js/app.js"></script>
 </body>
 </html>
-- 
2.39.5