Feature/timeout monitor fix (#4386)

address https://movember.atlassian.net/browse/IRONN-248

I was not able to reproduce and am still not certain how the issue
occurred but the changes here might help:

- as per suggestion from meeting today, add check for elapsed time
(compared against session lifetime as configured) in timeout code before
logging out user
- add appropriate defaults (e.g. session lifetime) if for some reason,
not available


tested the changes in my instance, session timed out as expected at
configured time


#### TODO
- [x] @ivan-c rebase/switch to master before merging (`git rebase HEAD~7
--onto master`; PR has 7 commits)

---------

Co-authored-by: Amy Chen <clone@cesium.cirg.washington.edu>
Co-authored-by: Ivan Cvitkovic <ivanc@uw.edu>
Co-authored-by: Justin McReynolds <mcjustin@uw.edu>

portal/static/js/portal_wrapper/SessionMonitor.js

@@ -13,7 +13,8 @@ var SessionMonitorObj = function() { /* global $ */
         var expiresIn = $("#sessionMonitorProps").attr("data-expires-in"); //session expires in time period from backend
         var __CRSF_TOKEN = $("#sessionMonitorProps").attr("data-crsftoken") || "";
         var __BASE_URL = $("#sessionMonitorProps").attr("data-baseurl") || "";
-        var SESSION_LIFETIME = this.calculatedLifeTime(expiresIn);
+        // expiresIn from backend is in seconds
+        var SESSION_LIFETIME = this.calculatedLifeTime(expiresIn ? expiresIn : 1800); // default to 30 minutes
         var sessMon = (function(n, o) {
             return function(t) {
                 "use strict";
@@ -29,6 +30,7 @@ var SessionMonitorObj = function() { /* global $ */
                     pingUrl: n + "/api/ping",
                     logoutUrl: n + LOGOUT_URL,
                     timeoutUrl: n + TIMEOUT_URL,
+                    lastActivityStorageKey: "TRUENTH_SESSION_LAST_ACTIVITY",
                     ping: function() {
                         var options = {
                             type: "POST",
@@ -75,8 +77,31 @@ var SessionMonitorObj = function() { /* global $ */
                             sessionStorage.clear();
                         }
                         l.setLogoutStorage();
+                        l.removeTimeOnLoad();
                         window.location.href = l.logoutUrl;
                     },
+                    initTimeOnLoad: function() {
+                        window.localStorage.setItem(l.lastActivityStorageKey, Date.now());
+                    },
+                    //get last active time
+                    getLastActiveTime: function(){
+                        var storedDateTime = window.localStorage.getItem(l.lastActivityStorageKey);
+                        return storedDateTime ? storedDateTime : Date.now();
+                    },
+                    removeTimeOnLoad: function() {
+                        window.localStorage.removeItem(l.lastActivityStorageKey);
+                    },
+                    //determine if some given period of time has elapsed since last stored active time
+                    isTimeExceeded: function() {
+                        var activeDuration = (Date.now() - parseFloat(l.getLastActiveTime()));
+                        if (!isNaN(activeDuration) && activeDuration >= 0) {
+                            console.log("session lifetime is ", l.sessionLifetime/1000/60, " minutes");
+                            console.log("time in session ", (activeDuration)/1000/60, " minutes ");
+                            // compare in milliseconds
+                            return activeDuration > l.sessionLifetime;
+                        }
+                        return false;
+                    },
                     onwarning: function() {
                         var n = Math.round(l.timeBeforeWarning / 60 / 1e3),
                             o = $("#jqsm-warning"); //default place holder element, content of which should be provided by consumer
@@ -93,24 +118,42 @@ var SessionMonitorObj = function() { /* global $ */
                     },
                     onbeforetimeout: function() {},
                     ontimeout: function() {
+                        //check if session time is up before actually logging out user
+                        if (!l.isTimeExceeded()) {
+                            return;
+                        }
                         if (typeof(sessionStorage) !== "undefined") {
                             sessionStorage.clear();
                         }
+                        console.log("Time exceeded, logging out...");
+                        l.timeout();
+                    },
+                    timeout: function() {
+                        // this should communicate to any open browser tab 
                         l.setTimeoutStorage();
+                        // remove session start timestamp from localStorage
+                        l.removeTimeOnLoad();
                         window.location.href = l.timeoutUrl;
                     }
                 };
 
                 function s() {
                     $.when(l.onbeforetimeout()).always(l.ontimeout);
                 }
-
+                // this function is called each time on page load and on user activity
                 function e() {
-                    var n = l.sessionLifetime - l.timeBeforeWarning;
+                    var lifeTime = l.sessionLifetime && l.sessionLifetime > 0 ? l.sessionLifetime : 30*60*1000; // default to 30 minutes in miliseconds;
+                    var timeBeforeWarning = l.timeBeforeWarning && l.timeBeforeWarning > 0 ? l.timeBeforeWarning : 60000; // default to one minute in miliseconds
+                    var n = lifeTime - timeBeforeWarning;
                     window.clearTimeout(r);
                     window.clearTimeout(u);
+                    console.log("Initiating time on load...");
+                    // initialize the session start timestamp here, saved in localStorage
+                    l.initTimeOnLoad();
+                    // set timer for showing timeout warning modal, prior to when timeout happens
                     r = window.setTimeout(l.onwarning, n);
-                    u = window.setTimeout(s, l.sessionLifetime);
+                    // set timer for timing out session
+                    u = window.setTimeout(s, lifeTime);
                 }
 
                 function i(n) {
@@ -145,17 +188,15 @@ var SessionMonitorObj = function() { /* global $ */
             logoutUrl: __BASE_URL + LOGOUT_URL,
             timeoutUrl: __BASE_URL + TIMEOUT_URL,
             modalShown: !1,
-            intervalMonitor: !1,
             onwarning: function() {
+                // showing the session about to timeout modal
                 $("#session-warning-modal").modal("show");
                 if (sessMon.modalShown) {
-                    sessMon.intervalMonitor = setInterval(function() {
-                        sessMon.ontimeout();
-                    }, 12e4);
+                    console.log("session timing out, start count down...");
                 }
             }
         });
-        $("#session-warning-modal").modal({"backdrop": false,"keyboard": false,"show": false}).on("show.bs.modal", function () {sessMon.modalShown = true;}).on("hide.bs.modal", function () { sessMon.modalShown = false; if (sessMon.intervalMonitor) { clearInterval(sessMon.intervalMonitor); }}).on("click", "#stay-logged-in", sessMon.extendsess).on("click", "#log-out", sessMon.logout);
+        $("#session-warning-modal").modal({"backdrop": false,"keyboard": false,"show": false}).on("show.bs.modal", function () {sessMon.modalShown = true;}).on("hide.bs.modal", function () { sessMon.modalShown = false;}).on("click", "#stay-logged-in", sessMon.extendsess).on("click", "#log-out", sessMon.logout);
         var warningText = ($("#session-warning-modal").find("#remaining-time").text()).replace("{time}", (sessMon.timeBeforeWarning / 1000));
         $("#session-warning-modal").find("#remaining-time").text(warningText);
     };
@@ -214,8 +255,9 @@ var SessionMonitorObj = function() { /* global $ */
         }
         $(window).on("storage", cleanUp);
     },
+    //configured session lifetime from backend is in seconds
     this.calculatedLifeTime = function(configuredLifeTime) {
-        var calculated = 15 * 60;
+        var calculated = 30 * 60;
         configuredLifeTime = parseInt(configuredLifeTime);
         if (!isNaN(configuredLifeTime) && configuredLifeTime > 0) {
             calculated = configuredLifeTime;