feat(receipt page): Add extra button for filer accounts

CHANGES.md

@@ -6,6 +6,7 @@ The following changes are not yet released, but are code complete:
 
 Features:
  - Hide recap UI elements from printed pages([#360](https://github.com/freelawproject/recap/issues/360), [#355](https://github.com/freelawproject/recap-chrome/pull/355)).
+ - Provide two clearly labeled buttons on the RECAP receipt page for accounts with filing permissions: one to RECAP the document and the other to download it normally([#360](https://github.com/freelawproject/recap/issues/357), [#355](https://github.com/freelawproject/recap-chrome/pull/357)).
 
 Changes:
  - Shift focus to support: Rename 'Help' tab to 'Donate' and enhance content.([#359](https://github.com/freelawproject/recap/issues/359), [#356](https://github.com/freelawproject/recap-chrome/pull/356)).

spec/ContentDelegateSpec.js

@@ -957,6 +957,7 @@ describe('The ContentDelegate class', function () {
         table.appendChild(table_tr);
         document.body.appendChild(table);
         spyOn(window, 'addEventListener').and.callThrough();
+        spyOnProperty(document, 'cookie').and.returnValue('test_cookie1=false; test_cookie2=true; isFilingAccount=false');
       });
 
       afterEach(function () {

src/appellate/appellate.js

@@ -396,7 +396,20 @@ AppellateDelegate.prototype.handleCombinedPdfPageView = async function () {
 
 // If this page offers a single document, intercept navigation to the document view page.
 AppellateDelegate.prototype.handleSingleDocumentPageView = async function () {
-  overwriteFormSubmitMethod();
+  if (PACER.hasFilingCookie(document.cookie)) {
+    let button = createRecapButtonForFilers('Accept Charges and RECAP Document');
+    button.addEventListener('click', (event) => {
+      event.preventDefault();
+      let form = event.target.parentNode;
+      form.id = 'form' + new Date().getTime();
+      window.postMessage({ id: form.id }, '*');
+    });
+
+    let form = document.querySelector('form');
+    form.append(button);
+  } else {
+    overwriteFormSubmitMethod();
+  }
 
   this.pacer_case_id = await APPELLATE.getCaseId(this.tabId, this.queryParameters, this.docId);
 

src/assets/css/style.css

@@ -522,6 +522,17 @@ footer #version {
   margin-right: 0.25rem;
 }
 
+.recap-bttn-for-filers {
+  margin-left: 5px;
+  border-radius: 3px;
+  border-style: solid;
+  border-width: thin;
+  font-family: helvetica, arial, serif;
+  font-size: 13px;
+  height: 21.5px;
+  border-color: #255885;
+}
+
 /* For printed pages, we want to hide anything that we add. */
 @media print {
   [class^="recap-"], [id^="recap-"] { /* Any class or ID that starts with `recap-` */

src/content_delegate.js

@@ -482,7 +482,23 @@ ContentDelegate.prototype.handleSingleDocumentPageView = function () {
     return;
   }
 
-  overwriteFormSubmitMethod();
+  if (PACER.hasFilingCookie(document.cookie)) {
+    let table = document.querySelector('form > center');
+    table.style.paddingBottom = '10px';
+
+    // Create a new button for filers accounts and add onclick
+    // event listener to intercept navigation to the PDF document
+    let button = createRecapButtonForFilers('View and RECAP Document');
+    button.addEventListener('click', () => {
+      overwriteFormSubmitMethod();
+    });
+
+    // add the new button inside the form
+    let form = document.querySelector('form');
+    form.append(button);
+  } else {
+    overwriteFormSubmitMethod();
+  }
 
   // When we receive the message from the above submit method, submit the form
   // via XHR so we can get the document before the browser does.
@@ -663,6 +679,7 @@ ContentDelegate.prototype.onDownloadAllSubmit = async function (event) {
             document.getElementById('recap-download').click();
           }
           history.pushState({ content: document.body.innerHTML }, '');
+          $('body').css('cursor', 'pointer');
         }
       }
     );
@@ -698,21 +715,35 @@ ContentDelegate.prototype.handleZipFilePageView = function () {
   }
 
   // imperatively manipulate hte dom elements without injecting a script
-  const forms = [...document.querySelectorAll('form')];
-  forms.map((form) => {
-    form.removeAttribute('action');
-    const input = form.querySelector('input');
-    input.removeAttribute('onclick');
-    input.disabled = true;
-    form.hidden = true;
-    const div = document.createElement('div');
-    const button = document.createElement('button');
-    button.textContent = 'Download Documents';
-    button.addEventListener('click', () => window.postMessage({ id: url }));
-    div.appendChild(button);
-    const parentNode = form.parentNode;
-    parentNode.insertBefore(div, form);
-  });
+  if (PACER.hasFilingCookie(document.cookie)) {
+    const inputs = [...document.querySelectorAll("form > input[type='button']")];
+    inputs.map((input) => {
+      let button = createRecapButtonForFilers('Download and RECAP Documents');
+      button.addEventListener('click', (event) => {
+        event.preventDefault();
+        window.postMessage({ id: url });
+      });
+      // insert new button next to the "Download Documents" button
+      input.after(button);
+    });
+  } else {
+    // imperatively manipulate html dom elements without injecting a script
+    const forms = [...document.querySelectorAll('form')];
+    forms.map((form) => {
+      form.removeAttribute('action');
+      const input = form.querySelector('input');
+      input.removeAttribute('onclick');
+      input.disabled = true;
+      form.hidden = true;
+      const div = document.createElement('div');
+      const button = document.createElement('button');
+      button.textContent = 'Download Documents';
+      button.addEventListener('click', () => window.postMessage({ id: url }));
+      div.appendChild(button);
+      const parentNode = form.parentNode;
+      parentNode.insertBefore(div, form);
+    });
+  }
   // When we receive the message from the above submit method, submit the form
   // via fetch so we can get the document before the browser does.
   window.addEventListener('message', this.onDownloadAllSubmit.bind(this));

src/utils.js

@@ -458,4 +458,13 @@ async function getPacerCaseIdFromPacerDocId(tabId, pacer_doc_id) {
   const success = `RECAP: Got case number ${caseId} for docId ${pacer_doc_id}`;
   console.info(success);
   return caseId;
-}
+}
+
+//Creates an extra button for filer accounts
+function createRecapButtonForFilers(description) {
+  let button = document.createElement('input');
+  button.type = 'submit';
+  button.value = description;
+  button.classList.add('recap-bttn-for-filers', 'btn-primary');
+  return button
+}