wip #6606 @7:00

diff --git a/public/packages/fluidbook/toolbox/css/delivery.css b/public/packages/fluidbook/toolbox/css/delivery.css
index b8ef6f50e68592f7ded95808e09d9740ba850add..ad4b513f70dde23d8d53dc38fff444b3176a3626 100644 (file)
--- a/public/packages/fluidbook/toolbox/css/delivery.css
+++ b/public/packages/fluidbook/toolbox/css/delivery.css
@@ -38,6 +38,33 @@ body {
 .delivery-glimpses p {
   margin-bottom: 6px;
 }
+.delivery-featherlight {
+  background: #fff;
+  width: 100%;
+  max-height: 640px;
+  max-width: 420px;
+  left: 50%;
+  padding: 108px 30px 30px;
+  display: none;
+}
+.delivery-featherlight.featherlight-inner {
+  display: block;
+}
+.delivery-featherlight .qrcode {
+  padding: 24px;
+  border: 1px solid var(--dark);
+  border-radius: 4px;
+  margin-bottom: 30px;
+  text-align: center;
+}
+.featherlight-close {
+  top: 30px;
+  right: 30px;
+  width: 64px;
+  height: 48px;
+  background: #1b2a4e12;
+  border-radius: 4px;
+}
 :root {
   --space-3xs: clamp(0.25rem, calc(0.25rem + 0vw), 0.25rem);
   --space-2xs: clamp(0.5rem, calc(0.5rem + 0vw), 0.5rem);

diff --git a/public/packages/fluidbook/toolbox/css/delivery.css.map b/public/packages/fluidbook/toolbox/css/delivery.css.map
index 6cfdb12e9655c34519ed6ffa4c6ac6e59bf38f66..5e5df240c294ee778456295cdcac3f069b8224fc 100644 (file)
--- a/public/packages/fluidbook/toolbox/css/delivery.css.map
+++ b/public/packages/fluidbook/toolbox/css/delivery.css.map
@@ -1 +1 @@
-{"version":3,"sources":["delivery.less"],"names":[],"mappings":"AAAA;AAAK;EACD,uBAAA;;AAGJ;EACI,qBAAA;;AAGJ,OAAQ;EACJ,iBAAA;;AAIA,SAAC;EACG,mBAAA;;AADJ,SAAC,OAEG,GAAE,IAAI;EACF,cAAc,kBAAd;;AAHR,SAAC,OAKG,GAAE;EACE,YAAA;EACA,oBAAA;;AAPR,SAAC,OASG;EACI,OAAO,WAAP;;AAGR,SAAC;EACG,mBAAA;;AADJ,SAAC,SAEG;EACI,yCAAA;EACA,aAAA;EACA,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,sBAAA;;AARR,SAAC,SAUG;EACI,eAAA;;AAXR,SAAC,SAaG;EACI,kBAAA;;AAKZ;EACI,aAAa,eAAe,6BAA5B;EACA,aAAa,cAAe,2BAA5B;EACA,YAAY,eAAe,6BAA3B;EACA,WAAW,YAAe,uBAA1B;EACA,WAAW,cAAe,2BAA1B;EACA,WAAW,YAAe,uBAA1B;EACA,YAAY,YAAe,uBAA3B;EACA,aAAa,YAAe,uBAA5B;EACA,aAAa,YAAe,uBAA5B;EACA,aAAa,eAAe,6BAA5B;;EAGA,iBAAiB,eAAe,8BAAhC;EACA,gBAAgB,cAAe,gCAA/B;EACA,cAAc,eAAe,4BAA7B;EACA,aAAa,YAAe,6BAA5B;EACA,aAAa,cAAe,2BAA5B;EACA,cAAc,YAAe,yBAA7B;EACA,gBAAgB,YAAe,yBAA/B;EACA,iBAAiB,YAAe,yBAAhC;;EAGA,eAAe,YAAe,gCAA9B","file":"delivery.css"}
\ No newline at end of file
+{"version":3,"sources":["delivery.less"],"names":[],"mappings":"AAAA;AAAK;EACD,uBAAA;;AAGJ;EACI,qBAAA;;AAGJ,OAAQ;EACJ,iBAAA;;AAIA,SAAC;EACG,mBAAA;;AADJ,SAAC,OAEG,GAAE,IAAI;EACF,cAAc,kBAAd;;AAHR,SAAC,OAKG,GAAE;EACE,YAAA;EACA,oBAAA;;AAPR,SAAC,OASG;EACI,OAAO,WAAP;;AAGR,SAAC;EACG,mBAAA;;AADJ,SAAC,SAEG;EACI,yCAAA;EACA,aAAA;EACA,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,sBAAA;;AARR,SAAC,SAUG;EACI,eAAA;;AAXR,SAAC,SAaG;EACI,kBAAA;;AAGR,SAAC;EACG,gBAAA;EACA,WAAA;EACA,iBAAA;EACA,gBAAA;EACA,SAAA;EACA,wBAAA;EACA,aAAA;;AACA,SARH,aAQI;EACG,cAAA;;AATR,SAAC,aAWG;EACI,aAAA;EACA,kBAAkB,WAAlB;EACA,kBAAA;EACA,mBAAA;EACA,kBAAA;;AAKZ;EACI,SAAA;EACA,WAAA;EACA,WAAA;EACA,YAAA;EACA,qBAAA;EACA,kBAAA;;AAGJ;EACI,aAAa,eAAe,6BAA5B;EACA,aAAa,cAAe,2BAA5B;EACA,YAAY,eAAe,6BAA3B;EACA,WAAW,YAAe,uBAA1B;EACA,WAAW,cAAe,2BAA1B;EACA,WAAW,YAAe,uBAA1B;EACA,YAAY,YAAe,uBAA3B;EACA,aAAa,YAAe,uBAA5B;EACA,aAAa,YAAe,uBAA5B;EACA,aAAa,eAAe,6BAA5B;;EAGA,iBAAiB,eAAe,8BAAhC;EACA,gBAAgB,cAAe,gCAA/B;EACA,cAAc,eAAe,4BAA7B;EACA,aAAa,YAAe,6BAA5B;EACA,aAAa,cAAe,2BAA5B;EACA,cAAc,YAAe,yBAA7B;EACA,gBAAgB,YAAe,yBAA/B;EACA,iBAAiB,YAAe,yBAAhC;;EAGA,eAAe,YAAe,gCAA9B","file":"delivery.css"}
\ No newline at end of file

diff --git a/public/packages/fluidbook/toolbox/css/delivery.less b/public/packages/fluidbook/toolbox/css/delivery.less
index 8d9a9ce080879856673c8a866fb13302f2ed091c..031e7d7e4ec82ba5dd82ef557f6238a9dfcf195f 100644 (file)
--- a/public/packages/fluidbook/toolbox/css/delivery.less
+++ b/public/packages/fluidbook/toolbox/css/delivery.less
@@ -41,6 +41,34 @@ html,body {
             margin-bottom: 6px;
         }
     }
+    &-featherlight {
+        background: #fff;
+        width: 100%;
+        max-height: 640px;
+        max-width: 420px;
+        left: 50%;
+        padding: 108px 30px 30px;
+        display: none;
+        &.featherlight-inner {
+            display: block;
+        }
+        .qrcode {
+            padding: 24px;
+            border: 1px solid var(--dark);
+            border-radius: 4px;
+            margin-bottom: 30px;
+            text-align: center;
+        }
+    }
+}
+
+.featherlight-close {
+    top: 30px;
+    right: 30px;
+    width: 64px;
+    height: 48px;
+    background: #1b2a4e12;
+    border-radius: 4px;
 }
 
 :root {

diff --git a/resources/views/fluidbook_publication/delivery.blade.php b/resources/views/fluidbook_publication/delivery.blade.php
index 5144e5ff498a80e510c437e14927aabb7e53cf67..776e18d018b04c0a62b77182fb5649000a2ab014 100644 (file)
--- a/resources/views/fluidbook_publication/delivery.blade.php
+++ b/resources/views/fluidbook_publication/delivery.blade.php
@@ -6,7 +6,39 @@
         trans('backpack::base.my_account') => false,
     ];
     $statusText = $fluidbook->status ? 'prêt' : 'en cours de production';
-    $qrCodeDesktop = QrCode::size(200)->generate($fluidbook->getPreviewURL());
+    $qrCodeMobile = QrCode::size(311)->color(27, 42, 78)->generate($fluidbook->getPreviewURL());
+
+    $fluidbookMobileFirstId = $fluidbook->mobilefirstFluidbookId;
+    $previewMobileFirstUrl = App\Models\FluidbookPublication::find($fluidbookMobileFirstId)->getPreviewURL();
+    $qrCodeMobileFirst = QrCode::size(311)->color(27, 42, 78)->generate($previewMobileFirstUrl);
+
+    $totalPages = $fluidbook->getPagesNumber();
+    $settings = [
+        ['Titre' => $fluidbook->title],
+        ['Nombre de pages' => $totalPages. ' pages'],
+        ['Langue principale' => $fluidbook->locale],
+        ['Date de création' => $fluidbook->created_at],
+        ['Dernière modification' => $fluidbook->updated_at],
+        ['Mode de navigation' => $fluidbook->mobileTransitions],
+        ['SEO' => $fluidbook->seoVersion],
+        ['SCORM (e-learning)' => $fluidbook->scorm_version],
+        ['Statistiques Fluidbook' => $fluidbook->stats],
+        ['Google Analytics' => $fluidbook->googleTagManager]
+    ];
+
+    $features = [
+        'index' => $fluidbook->index,
+        'print' => $fluidbook->print,
+        'chapters' => $fluidbook->chapters,
+        'share' => $fluidbook->share,
+        'bookmarks' => $fluidbook->bookmarks,
+        'download' => $fluidbook->pdf,
+        'sound' => $fluidbook->soundTheme,
+        'search' => $fluidbook->search,
+        'help' => $fluidbook->help,
+        'notes' => $fluidbook->notes,
+        'fullscreen' => $fluidbook->fullscreen,
+    ];
 @endphp
 
 @section('after_styles')
@@ -59,15 +91,14 @@
                                 <div class="block">
                                     <a href="#" data-featherlight="#scanBoxMobile" class="btn bg-primary">Voir</a>
                                 </div>
-                                <div class="featherlight" id="scanBoxMobile">
-                                    {{ $qrCodeDesktop }}
-                                </div>
+                                @include('fluidbook_publication.qrcode_popup', ['id' => 'scanBoxMobile', 'text' => 'Mobile', 'qrcode' => $qrCodeMobile])
                             </div>
                             <div class="preview col-md-3">
                                 <p>Version Mobile-first</p>
                                 <div class="block">
-                                    <a href="" class="btn bg-primary">Voir</a>
+                                    <a href="#" data-featherlight="#scanBoxMobileFirst" class="btn bg-primary">Voir</a>
                                 </div>
+                                @include('fluidbook_publication.qrcode_popup', ['id' => 'scanBoxMobileFirst', 'text' => 'Mobile-first', 'qrcode' => $qrCodeMobileFirst])
                             </div>
                         </div>
                         <div class="indication align-items-center flex-row d-flex icon-m">
@@ -85,28 +116,14 @@
                             <span>Voici les caractéristiques et fonctionnalités de votre Fluidbook</span>
                         </div>
                         <div class="row mb-3">
-                            <div class="col-md-6">
-                                <table class="bg-white table table-striped table-hover nowrap rounded shadow-xs border-xs mt-2 dataTable dtr-inline" data-responsive-table="1" data-has-details-row="0" data-has-bulk-actions="1" cellspacing="0" aria-describedby="crudTable_info">
-                                    <tbody>
-                                        <tr class="odd">
-                                            <td class="dtr-control">
-                                                <p></p>
-                                            </td>
-                                        </tr>
-                                    </tbody>
-                                </table>
-                            </div>
-                            <div class="col-md-6">
-                                <table class="bg-white table table-striped table-hover nowrap rounded shadow-xs border-xs mt-2 dataTable dtr-inline" data-responsive-table="1" data-has-details-row="0" data-has-bulk-actions="1" cellspacing="0" aria-describedby="crudTable_info">
-                                    <tbody>
-                                        <tr class="odd">
-                                            <td class="dtr-control">
-                                                <p></p>
-                                            </td>
-                                        </tr>
-                                    </tbody>
-                                </table>
-                            </div>
+                            @if($settings)
+                                <div class="col-md-6">
+                                    @include('fluidbook_publication.delivery_params', ['init' => 0, 'settings', $settings])
+                                </div>
+                                <div class="col-md-6">
+                                    @include('fluidbook_publication.delivery_params', ['init' => 5, 'settings', $settings])
+                                </div>
+                            @endif
                         </div>
                         <div class="row mb-3">
                             <div class="col-md-6">

diff --git a/resources/views/fluidbook_publication/delivery_params.blade.php b/resources/views/fluidbook_publication/delivery_params.blade.php
new file mode 100644 (file)
index 0000000..ca742a6
--- /dev/null
+++ b/resources/views/fluidbook_publication/delivery_params.blade.php
@@ -0,0 +1,28 @@
+<table class="bg-white table table-striped table-hover nowrap rounded shadow-xs border-xs mt-2 dataTable dtr-inline" data-responsive-table="1" data-has-details-row="0" data-has-bulk-actions="1" cellspacing="0" aria-describedby="crudTable_info">
+    <tbody>
+    @foreach($settings as $value)
+        @php
+            $index = $loop->index;
+            $key = key($settings[$index]);
+            $value_ = $settings[$index][$key]
+        @endphp
+        @if($value_)
+            @if($init === 0 && $loop->iteration < 6)
+                <tr class="odd">
+                    <td class="dtr-control d-flex justify-content-between">
+                        <p class="m-0">{{ $key }}</p>
+                        <p class="m-0">{{ $value_ }}</p>
+                    </td>
+                </tr>
+            @elseif($init === 5 && $loop->iteration > 5)
+                <tr class="odd">
+                    <td class="dtr-control d-flex justify-content-between">
+                        <p class="m-0">{{ $key }}</p>
+                        <p class="m-0">{{ $value_ }}</p>
+                    </td>
+                </tr>
+            @endif
+        @endif
+    @endforeach
+    </tbody>
+</table>

diff --git a/resources/views/fluidbook_publication/qrcode_popup.blade.php b/resources/views/fluidbook_publication/qrcode_popup.blade.php
new file mode 100644 (file)
index 0000000..24fd0e5
--- /dev/null
+++ b/resources/views/fluidbook_publication/qrcode_popup.blade.php
@@ -0,0 +1,8 @@
+<div class="delivery-featherlight" id="{{ $id }}">
+    <div class="qrcode">{{ $qrcode }}</div>
+    <div class="content">
+        <p class="font-xl m-0">Scannez le QR code</p>
+        <p>pour visualiser votre Fluidbook en version {{ $text }} directement sur votre téléphone.</p>
+        <a href="">Besoin d'aide ?</a>
+    </div>
+</div>