@internetarchive/ia-book-actions 0.1.4-alpha1 → 0.1.4-alpha2

package/demo/index.html

@@ -131,7 +131,7 @@
     iaBookActions.returnUrl = 'https://openlibrary.org';
     iaBookActions.localCache = localCache;
 
-    let loanTotalTime2Min = { loanTotalTime: 20, loanRenewAtLast: 15, pageChangedInLast: 15 };
+    let loanTotalTime2Min = { loanTotalTime: 20, loanRenewAtLast: 15, pageChangedInLast: 8 };
     let loanTotalTime5Min = { loanTotalTime: 300, loanRenewAtLast: 180, pageChangedInLast: 15 };
     let loanTotalTime1Hour = { loanTotalTime: 3600, loanRenewAtLast: 600, pageChangedInLast: 900 };
 
@@ -150,23 +150,6 @@
       });
     });
 
-    window.addEventListener('BookReader:userAction', () => {
-      if (this.borrowType === 'browsed') {
-        this.suppressToast = false;
-        this.autoLoanRenewChecker(true);
-      }
-
-      return nothing;
-    });
-
-    document.querySelector('.brControlClick').addEventListener('click', () => {
-      window.dispatchEvent(new CustomEvent('BookReader:userAction', {
-        bubbles: true,
-        composed: true,
-        detail: { props },
-      }));
-    });
-    
     document.querySelectorAll('.errorEnable input[type=checkbox]').forEach((item) => {
       if (window.location.href.indexOf('?error=true') !== -1) {
         item.checked = true;
@@ -328,9 +311,6 @@
             <td>
               <button class="pageChangedEvent">Page Change Event</button>
             </td>
-            <td>
-              <button class="brControlClick">Br Controls</button>
-            </td>
           </tr>
         </table>
     </fieldset>

package/package.json

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

package/src/components/timer-countdown.js

@@ -31,6 +31,12 @@ export default class TimerCountdown extends LitElement {
      */
     this.loanRenewAtLast = 0;
 
+    /**
+     * timer which is not reduced along with timer
+     * @type {date}
+     */
+    this.timeWhenTimerStart = '';
+
     /**
      * delay seconds in setInterval function
      * @type {number}
@@ -42,25 +48,33 @@ export default class TimerCountdown extends LitElement {
     window?.IALendingIntervals?.clearTimerCountdown();
   }
 
+  firstUpdated() {
+    this.timerCountdown();
+  }
+
   updated(changed) {
     if (changed.has('secondsLeftOnLoan') && this.secondsLeftOnLoan > 0) {
-      this.disconnectedCallback();
-
       this.timerCountdown();
     }
   }
 
   timerCountdown() {
+    this.disconnectedCallback();
+
     // - let just execute setInterval in every 1 minute
     this.timerExecutionSeconds = 1;
+    let secondsLeft = this.secondsLeftOnLoan;
+
+    // store current time
+    this.timeWhenTimerStart = new Date();
 
     /**
      * set interval in window object
      * @see ia-lending-intervals.js
      */
-    window.IALendingIntervals.timerCountdown = setInterval(() => {
-      this.secondsLeftOnLoan -= this.timerExecutionSeconds;
-      const secondsLeft = Math.round(this.secondsLeftOnLoan);
+    window.IALendingIntervals.timerCountdown = setInterval(async () => {
+      secondsLeft -= this.timerExecutionSeconds;
+      secondsLeft = Math.round(secondsLeft); // round number
 
       console.log(
         new Date().toLocaleTimeString(),
@@ -70,6 +84,9 @@ export default class TimerCountdown extends LitElement {
         Math.ceil(secondsLeft / 60)
       );
 
+      // re-sync timer is gone off
+      await this.reSyncTimerIfGoneOff(secondsLeft);
+
       /**
        * execute from last 10th minute to 0th minute
        * - 10th - to check if user has viewed
@@ -77,26 +94,63 @@ export default class TimerCountdown extends LitElement {
        * @see IABookActions::bindLoanRenewEvents
        */
       if (secondsLeft <= this.loanRenewAtLast) {
-        this.dispatchEvent(
-          new CustomEvent('IABookActions:loanRenew', {
-            detail: {
-              hasPageChanged: false,
-              secondsLeft,
-            },
-            bubbles: true,
-            composed: true,
-          })
-        );
+        this.dispatchLoanRenewEvent(secondsLeft);
       }
 
       // clear interval
-      if (secondsLeft <= 60) {
+      if (secondsLeft <= 1) {
         this.disconnectedCallback();
         window?.Sentry?.captureMessage(sentryLogs.clearOneHourTimer);
       }
     }, this.timerExecutionSeconds * 1000);
   }
 
+  /**
+   * dispatch loan renew attempt event
+   *
+   * @param {number} secondsLeft
+   * @memberof TimerCountdown
+   */
+  dispatchLoanRenewEvent(secondsLeft) {
+    this.dispatchEvent(
+      new CustomEvent('IABookActions:loanRenew', {
+        detail: {
+          hasPageChanged: false,
+          secondsLeft,
+        },
+        bubbles: true,
+        composed: true,
+      })
+    );
+  }
+
+  /**
+   * helper function to determine if timer is not in sync properly
+   *
+   * @param {number} timerSecondsLeft - actual seconds left get from setInterval
+   *
+   * @memberof TimerCountdown
+   */
+  async reSyncTimerIfGoneOff(timerSecondsLeft) {
+    const currentTime = new Date();
+
+    // current time - loan time
+    const diffInSeconds =
+      currentTime.getTime() / 1000 - this.timeWhenTimerStart.getTime() / 1000;
+
+    const secondsShouldLeft = this.secondsLeftOnLoan - diffInSeconds;
+
+    // convert in minutes
+    const whatIsleft = Math.round(timerSecondsLeft);
+    const whatShouldLeft = Math.round(secondsShouldLeft);
+
+    if (whatIsleft !== whatShouldLeft) {
+      console.log("timer is gone off, let's re-sync");
+      console.log('whatIsleft', whatIsleft, 'whatShouldLeft', whatShouldLeft);
+      this.secondsLeftOnLoan = secondsShouldLeft;
+    }
+  }
+
   /**
    * get remaining time with timeunit
    *

package/src/ia-book-actions.js

@@ -272,9 +272,10 @@ export default class IABookActions extends LitElement {
      * detect click-event on document to close toast-template
      */
     window.addEventListener('click', e => {
-      if (this.loanRenewHelper && this.loanRenewResult.secondsLeft > 0) {
-        this.suppressToast = true;
-      }
+      console.log('detech click event');
+      // if (this.loanRenewHelper && this.loanRenewResult.secondsLeft > 0) {
+      this.suppressToast = true;
+      // }
 
       // reload when user click on book-page and book is EXPIRED
       const hasExpired =