From 187197488bdbf7632dd04b812bfd3d0399532b3d Mon Sep 17 00:00:00 2001
From: artoscinote <85488244+artoscinote@users.noreply.github.com>
Date: Tue, 9 Aug 2022 10:13:43 +0200
Subject: [PATCH] Pdf viewer and protocol fixes [SCI-7074] (#4327)

---
 app/controllers/assets_controller.rb          |  2 +-
 .../vue/protocol/step_attachments/inline.vue  |  8 +-
 app/javascript/vue/shared/pdf_viewer.vue      | 78 +++++++++++++++++++
 app/serializers/asset_serializer.rb           | 13 +++-
 app/utilities/protocols_importer.rb           |  1 +
 app/utilities/protocols_importer_v2.rb        |  2 +
 .../shared/_secondary_navigation.html.erb     |  2 +-
 7 files changed, 100 insertions(+), 6 deletions(-)
 create mode 100644 app/javascript/vue/shared/pdf_viewer.vue

diff --git a/app/controllers/assets_controller.rb b/app/controllers/assets_controller.rb
index a2a3f374a..5fef41b75 100644
--- a/app/controllers/assets_controller.rb
+++ b/app/controllers/assets_controller.rb
@@ -224,7 +224,7 @@ class AssetsController < ApplicationController
           )
         else
           log_step_activity(
-            :protocol_file_deleted,
+            :protocol_step_file_deleted,
             @assoc,
             nil,
             protocol: @assoc.protocol.id,
diff --git a/app/javascript/vue/protocol/step_attachments/inline.vue b/app/javascript/vue/protocol/step_attachments/inline.vue
index ca9995bf4..77ce0a245 100644
--- a/app/javascript/vue/protocol/step_attachments/inline.vue
+++ b/app/javascript/vue/protocol/step_attachments/inline.vue
@@ -48,6 +48,7 @@
       </div>
     </template>
     <template v-else-if="attachment.attributes.pdf_previewable">
+      <PdfViewer :pdf="attachment.attributes.pdf" />
     </template>
     <template v-else-if="attachment.attributes.large_preview !== null">
       <div class="image-container">
@@ -67,13 +68,14 @@
 </template>
 
 <script>
-  import ContextMenuMixin from './mixins/context_menu.js'
-  import ContextMenu from './context_menu.vue'
+  import ContextMenuMixin from './mixins/context_menu.js';
+  import ContextMenu from './context_menu.vue';
+  import PdfViewer from '../../shared/pdf_viewer.vue';
 
   export default {
     name: 'inlineAttachment',
     mixins: [ContextMenuMixin],
-    components: { ContextMenu },
+    components: { ContextMenu, PdfViewer },
     props: {
       attachment: {
         type: Object,
diff --git a/app/javascript/vue/shared/pdf_viewer.vue b/app/javascript/vue/shared/pdf_viewer.vue
new file mode 100644
index 000000000..ae2fb0f6e
--- /dev/null
+++ b/app/javascript/vue/shared/pdf_viewer.vue
@@ -0,0 +1,78 @@
+<template>
+  <div class="pdf-viewer" :class="{ 'blocked': pdf.blocked }">
+    <div class="page-container">
+      <div class="layers-container">
+        <canvas class="pdf-canvas" :class="{ 'ready': !pdf.blocked }"
+          :data-pdf-url="pdf.url"
+          :data-pdf-worker-url="pdf.worker_url"
+        ></canvas>
+        <div class="textLayer"></div>
+      </div>
+    </div>
+    <div class="pdf-toolbar">
+      <button class="btn btn-light icon-btn prev-page">
+        <i class="fas fa-arrow-left"></i>
+      </button>
+      <div class="page-counter sci-input-container">
+        <input type="text" class="sci-input-field current-page" value=1>
+        {{ i18n.t('pdf_preview.pages.of') }}
+        <span class="total-page">...</span>
+      </div>
+      <button class="btn btn-light icon-btn next-page">
+        <i class="fas fa-arrow-right"></i>
+      </button>
+      <div class="divider"></div>
+      <div class="zoom-page">
+        <select class="zoom-page-selector">
+          <option value="auto">{{ i18n.t('pdf_preview.fit_to_screen') }}</option>
+          <option v-for="i in Array.from(Array(12).keys())"
+                  :selected="(i + 1) * 25 == 100"
+                  :value="((i + 1) * 0.25).toString().replaceAll(/\.?0+$/g, '')"
+                  :key="i">
+            {{(i + 1) * 25}}%
+          </option>
+        </select>
+      </div>
+      <div class="sci-btn-group">
+        <button class="btn btn-light icon-btn zoom-out">
+          <i class="fas fa-search-minus"></i>
+        </button>
+        <button class="btn btn-light icon-btn zoom-in">
+          <i class="fas fa-search-plus"></i>
+        </button>
+      </div>
+    </div>
+    <div class="blocked-screen">
+      <img :src="blockedIcon">
+      <p class="title">{{ i18n.t('pdf_previepw.blocked.title') }}</p>
+      <p class="description">{{ i18n.t('pdf_preview.blocked.description') }}</p>
+      <button class="btn btn-primary load-blocked-pdf">
+        <i class="fas fa-cloud-download-alt"></i>
+        {{ i18n.t('pdf_preview.blocked.submit_button') }}
+      </button>
+    </div>
+  </div>
+</template>
+
+<script>
+  import blockedIcon from 'images/pdf_js/blocked.svg'
+
+  export default {
+    name: 'PdfViewer',
+    props: {
+      pdf: { type: Object, required: true }
+    },
+    data() {
+      return {
+        blockedIcon,
+        value: ''
+      }
+    },
+    mounted() {
+      // from legacy code in app/assets/javascripts/sitewide/pdf_preview.js
+      PdfPreview.initCanvas();
+    },
+    methods: {
+    }
+  }
+</script>
diff --git a/app/serializers/asset_serializer.rb b/app/serializers/asset_serializer.rb
index 667b2ba19..6ce5635de 100644
--- a/app/serializers/asset_serializer.rb
+++ b/app/serializers/asset_serializer.rb
@@ -3,6 +3,7 @@
 class AssetSerializer < ActiveModel::Serializer
   include Canaid::Helpers::PermissionsHelper
   include Rails.application.routes.url_helpers
+  include Webpacker::Helper
   include FileIconsHelper
   include ActionView::Helpers::NumberHelper
   include ApplicationHelper
@@ -10,7 +11,7 @@ class AssetSerializer < ActiveModel::Serializer
   attributes :file_name, :view_mode, :icon, :urls, :updated_at_formatted,
              :file_size, :medium_preview, :large_preview, :asset_type, :wopi,
              :wopi_context, :pdf_previewable, :file_size_formatted, :asset_order,
-             :updated_at, :metadata, :image_editable, :image_context
+             :updated_at, :metadata, :image_editable, :image_context, :pdf
 
   def icon
     file_fa_icon_class(object)
@@ -68,6 +69,16 @@ class AssetSerializer < ActiveModel::Serializer
     object.pdf_previewable? if object.file.attached?
   end
 
+  def pdf
+    return unless asset.pdf?
+
+    {
+      url: object.pdf? ? asset_download_path(object) : asset_pdf_preview_path(object),
+      size: !object.pdf? && object.pdf_preview_ready? ? object.file_pdf_preview&.blob&.byte_size : object.file_size,
+      worker_url: asset_pack_path('pdfjs/pdf_js_worker.js')
+    }
+  end
+
   def image_editable
     object.editable_image?
   end
diff --git a/app/utilities/protocols_importer.rb b/app/utilities/protocols_importer.rb
index c4b2a9199..bf8215762 100644
--- a/app/utilities/protocols_importer.rb
+++ b/app/utilities/protocols_importer.rb
@@ -62,6 +62,7 @@ class ProtocolsImporter
   def populate_protocol(protocol, protocol_json)
     protocol.reload
     protocol.description = populate_rte(protocol_json, protocol)
+    protocol.name = protocol_json['name'].presence
     protocol.save!
     asset_ids = []
     step_pos = 0
diff --git a/app/utilities/protocols_importer_v2.rb b/app/utilities/protocols_importer_v2.rb
index d7dadbc0d..1d236b6f3 100644
--- a/app/utilities/protocols_importer_v2.rb
+++ b/app/utilities/protocols_importer_v2.rb
@@ -61,9 +61,11 @@ class ProtocolsImporterV2
   def populate_protocol(protocol, protocol_json)
     protocol.reload
     protocol.description = populate_rte(protocol_json, protocol)
+    protocol.name = protocol_json['name'].presence
     protocol.save!
     asset_ids = []
     step_pos = 0
+
     # Check if protocol has steps
     protocol_json['steps']&.values&.each do |step_json|
       step = Step.create!(
diff --git a/app/views/shared/_secondary_navigation.html.erb b/app/views/shared/_secondary_navigation.html.erb
index 1bde709c5..d6bdb5978 100644
--- a/app/views/shared/_secondary_navigation.html.erb
+++ b/app/views/shared/_secondary_navigation.html.erb
@@ -72,7 +72,7 @@
                 <%=t "nav2.modules.results" %>
                 <% @active_results_size = @my_module.results.where(archived:false).size %>
                 <% if @active_results_size.positive? %>
-                  <sup class="navigation-results-counter"><%= @active_results_size %></sup>
+                  <sup class="navigation-results-counter"><%= @my_module.archived_branch? ? @my_module.results.size : @active_results_size %></sup>
                 <% end %>
               </a>
             </li>