@internetarchive/ia-book-actions 0.0.29-beta2 → 0.0.30-alpha1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/ia-book-actions",
-  "version": "0.0.29-beta2",
+  "version": "0.0.30-alpha1",
   "description": "Bookreader actions for borrowable book",
   "author": "Internet Archive",
   "license": "AGPL-3.0-only",

package/src/components/collapsible-action-group.js

@@ -102,9 +102,9 @@ export class CollapsibleActionGroup extends ActionsHandler {
     return html`
       <div
         class="${classMap({
-          actiongroup: true,
-          disabled: this.disabled,
-        })}"
+      actiongroup: true,
+      disabled: this.disabled,
+    })}"
       >
         ${this.getLoaderIcon}
         <section class="action-buttons primary">
@@ -163,8 +163,8 @@ export class CollapsibleActionGroup extends ActionsHandler {
         href="${action.url}"
         target=${action.target}
         @click=${() => {
-          this.clickHandler(action.id, action.analyticsEvent);
-        }}
+        this.clickHandler(action.id, action.analyticsEvent);
+      }}
       >
         ${action.id === 'purchaseBook' ? purchaseIcon : ''} ${action.text}
         <small>${action.subText}</small>
@@ -244,9 +244,9 @@ export class CollapsibleActionGroup extends ActionsHandler {
   get getLoaderIcon() {
     return html`<img
       class="${classMap({
-        actionloader: true,
-        disabled: this.disabled,
-      })}"
+      actionloader: true,
+      disabled: this.disabled,
+    })}"
       alt=""
       src="${this.loaderIcon}"
     />`;

package/src/components/text-group.js

@@ -5,6 +5,7 @@ export class TextGroup extends LitElement {
     return {
       texts: { type: String },
       textClass: { type: String },
+      hasAdminBorrowedAccess: { type: Boolean },
     };
   }
 
@@ -12,11 +13,16 @@ export class TextGroup extends LitElement {
     super();
     this.texts = '';
     this.textClass = '';
+    this.hasAdminBorrowedAccess = false;
   }
 
   render() {
     return html`
-      <span class="variable-texts ${this.textClass}">${this.texts}</span>
+      <span class="variable-texts ${this.textClass}">
+        ${this.hasAdminBorrowedAccess
+        ? html`<slot name="sticky-access-checkbox">${this.texts}</slot>`
+        : this.texts}
+      </span>
     `;
   }
 
@@ -29,12 +35,13 @@ export class TextGroup extends LitElement {
         margin-left: 10px;
         vertical-align: middle;
         font-size: 1.7rem;
+        align-items: center;
       }
       .hidden {
         display: none;
       }
       .visible {
-        display: inline-block;
+        display: flex;
       }
     `;
   }

package/src/core/services/get-lending-actions.js

@@ -51,6 +51,7 @@ export const bookTitles = {
   on_waitlist: 'You are on the waitlist for this book.',
   session_expired: 'Your loan has expired.',
   unavailable: 'This book is not available at this time.',
+  admin_borrowed: 'Default to admin access mode',
 };
 
 export class GetLendingActions {
@@ -83,7 +84,7 @@ export class GetLendingActions {
 
   adminOrPrintDisabledReadingAction() {
     return {
-      primaryTitle: '',
+      primaryTitle: bookTitles.admin_borrowed,
       primaryActions: [],
       secondaryActions: [this.actionsConfig.adminOrPrintDisabledExitConfig()],
       borrowType: 'adminBorrowed',

package/src/ia-book-actions.js

@@ -12,6 +12,7 @@ import './components/info-icon.js';
 import { GetLendingActions } from './core/services/get-lending-actions.js';
 import { mobileContainerWidth } from './core/config/constants.js';
 import { LoanTokenPoller } from './core/services/loan-token-poller.js';
+import { getItem, setItem } from './core/services/doc-cookies.js';
 
 export const events = {
   browseExpired: 'IABookReader:BrowsingHasExpired',
@@ -48,7 +49,7 @@ export default class IABookActions extends LitElement {
     this.lendingStatus = {};
     this.width = 0;
     this.bwbPurchaseUrl = '';
-    this.lendingBarPostInit = () => {};
+    this.lendingBarPostInit = () => { };
     this.barType = 'action'; // 'title'|'action'
     this.sharedObserver = undefined;
     this.disableActionGroup = false;
@@ -96,11 +97,8 @@ export default class IABookActions extends LitElement {
   }
 
   startBrowseTimer() {
-    const {
-      browsingExpired,
-      user_has_browsed,
-      secondsLeftOnLoan,
-    } = this.lendingStatus;
+    const { browsingExpired, user_has_browsed, secondsLeftOnLoan } =
+      this.lendingStatus;
     if (!user_has_browsed || browsingExpired) {
       return;
     }
@@ -356,7 +354,7 @@ export default class IABookActions extends LitElement {
         Please ${refreshButton} to try again or send us an email to
         <a
           href="mailto:info@archive.org?subject=Help: cannot access my borrowed book: ${this
-            .identifier}"
+          .identifier}"
           >info@archive.org</a
         >`;
     }
@@ -366,6 +364,12 @@ export default class IABookActions extends LitElement {
     });
   }
 
+  // eslint-disable-next-line class-methods-use-this
+  toggleStickyAdminAccess() {
+    const currentValue = getItem('sticky-admin-access') === 'true';
+    setItem('sticky-admin-access', !currentValue);
+  }
+
   get iconClass() {
     return this.width <= mobileContainerWidth ? 'mobile' : 'desktop';
   }
@@ -382,10 +386,36 @@ export default class IABookActions extends LitElement {
     return html`<text-group
       textClass=${this.textClass}
       texts=${this.primaryTitle}
+      ?hasAdminBorrowedAccess=${this.hasAdminBorrowedAccess}
     >
+      ${this.hasAdminBorrowedAccess
+        ? html`<div slot="sticky-access-checkbox">
+            ${this.stickyAdminAccess}
+          </div>`
+        : ''}
     </text-group>`;
   }
 
+  get stickyAdminAccess() {
+    return html`
+      <label class="stick-admin" for="sticky-admin-access">
+        <input
+          type="checkbox"
+          id="sticky-admin-access"
+          aria-label="Checkbox"
+          @click=${this.toggleStickyAdminAccess}
+        />
+        <span>${this.primaryTitle}</span>
+      </label>
+    `;
+  }
+
+  get hasAdminBorrowedAccess() {
+    return this.secondaryActions.some(
+      action => action.id === 'exitAdminAccess'
+    );
+  }
+
   get hasAdminAccess() {
     return !this.lendingStatus.userHasBorrowed && this.lendingStatus.isAdmin;
   }
@@ -405,6 +435,10 @@ export default class IABookActions extends LitElement {
         justify-content: center;
         flex-wrap: wrap;
       }
+      .stick-admin {
+        user-select: none;
+        cursor: pointer;
+      }
     `;
   }
 }