SERV-2286 - pdf viewer modal element

src/Views/Limitless/PdfModal/Attachments/pdf-modal.js

-// Resize the modal to the right size.
-$(window).on('touchstart click resize', function () {
+function initPdfViewerModalElements() {
+    setPdfModalButtons();
+    setPdfModals();
+    setResizeEvent();
+}
+
+function setPdfModalButtons() {
+
+    let counter = 0;
+
+    $('.LimitlessPdfViewerModalButton').each(function() {
+
+        counter++;
+        let element = $(this);
+
+        element.attr('id', 'LimitlessPdfViewerModalButton' + counter);
+        element.attr('data-target', '#LimitlessPdfModal' + counter);
+    });
+
+}
+
+function setPdfModals() {
+
+    let counter = 0;
+
+    $('.LimitlessPdfModal').each(function() {
+
+        counter++;
+        let element = $(this);
+
+        element.attr('id', 'LimitlessPdfModal' + counter);
+    });
+
+}
+
+function setResizeEvent() {
+
+    // Resize the modal to the right size.
+    $(window).on('touchstart click resize', function () {
         setTimeout(function(){
             $('.pdfIframe').each(function () {
                 var ModalDialog = $(this).parents('.modal');
                 $(this).height((ModalDialog.height() - 250) + 'px');
             });
         },300);
-});
-
-$(document).ready(function() {
-
+    });
 
+}
 
+$(document).ready(function() {
+    initPdfViewerModalElements();
 });
\ No newline at end of file

src/Views/Limitless/PdfModal/PdfModal.blade.php

@@ -7,7 +7,7 @@
     <b><i class="icon-file-pdf"></i></b> {{ $buttonText ?? $title ?? 'No Text' }}
 </button>
 
-<div id="LimitlessPdfModal" class="modal fade" tabindex="-1">
+<div class="LimitlessPdfModal modal fade" tabindex="-1">
     <div class="modal-dialog modal-full">
         <div class="modal-content">
             <div class="modal-header">
@@ -17,7 +17,7 @@
             <div class="modal-body">
                 <iframe class="pdfIframe"
                         src="https://cdn.backoffice.online/pdfjs/web/viewer.html?file={{ urlencode($url) }}"
-                        style="border:1px solid #999999;" width="100%">
+                        style="border:1px solid #999999;" width="100%" >
                 </iframe>
             </div>
             <div class="modal-footer">