From 37185c5d97a408d5cfe2aa48e8909d5cad18eedd Mon Sep 17 00:00:00 2001 From: Chris Colvard Date: Thu, 10 Aug 2023 12:39:40 -0400 Subject: [PATCH 1/2] LocalStorage is not available inside an iframe unless users change a setting to allow it --- .../avalon_player_new.es6 | 41 ++++++++++++++++--- app/assets/javascripts/supplemental_files.js | 10 ++++- 2 files changed, 44 insertions(+), 7 deletions(-) diff --git a/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 b/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 index 9163d0323c..9e39d49466 100644 --- a/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 +++ b/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 @@ -30,7 +30,9 @@ class MEJSPlayer { this.mejsTimeRailHelper = new MEJSTimeRailHelper(); this.mejsMarkersHelper = new MEJSMarkersHelper(); this.mejsQualityHelper = new MEJSQualityHelper(); - this.localStorage = window.localStorage; + if (typeof window.localStorage !== "undefined") { + this.localStorage = window.localStorage; + } this.canvasIndex = 0; // Unpack player configuration object for the new player. @@ -186,6 +188,10 @@ class MEJSPlayer { * @return {void} */ handleVolumeChange() { + if (typeof window.localStorage === "undefined") { + return; + } + this.localStorage.setItem('startVolume', this.mediaElement.volume) } @@ -196,6 +202,10 @@ class MEJSPlayer { * @return {void} */ handleCaptionsChange() { + if (typeof window.localStorage === "undefined") { + return; + } + let srclang = currentPlayer.selectedTrack === null ? '' : currentPlayer.selectedTrack.srclang; this.localStorage.setItem('captions', srclang) } @@ -293,7 +303,9 @@ class MEJSPlayer { // Quality selector is turned off in mobile devices if(!mejs.Features.isAndroid) { // Set defaultQuality in player options before building the quality feature - this.player.options.defaultQuality = this.localStorage.getItem('quality'); + if (typeof window.localStorage !== "undefined") { + this.player.options.defaultQuality = this.localStorage.getItem('quality'); + } // Build quality this.player.buildquality(this.player, null, null, this.mediaElement); @@ -367,6 +379,10 @@ class MEJSPlayer { * @returns {void} */ toggleCaptions() { + if (typeof window.localStorage === "undefined") { + return; + } + if (this.mediaType==="video" && this.player.options.toggleCaptionsButtonWhenOnlyOne) { if (this.localStorage.getItem('captions') !== '' && this.player.tracks && this.player.tracks.length===1) { this.player.setTrack(this.player.tracks[0].trackId, (typeof keyboard !== 'undefined')); @@ -604,12 +620,25 @@ class MEJSPlayer { initializePlayer() { let currentStreamInfo = this.currentStreamInfo; // Set default quality value in localStorage - this.localStorage.setItem('quality', this.defaultQuality); + if (typeof window.localStorage !== "undefined") { + this.localStorage.setItem('quality', this.defaultQuality); + } // Interval in seconds to jump forward and backward in media let jumpInterval = 5; // Set default quality value in localStorage - this.localStorage.setItem('quality', this.defaultQuality); + if (typeof window.localStorage !== "undefined") { + this.localStorage.setItem('quality', this.defaultQuality); + } + + let startVolume = 1.0; + if (typeof window.localStorage !== "undefined") { + startVolume = this.localStorage.getItem('startVolume') || 1.0; + } + let startLanguage = ''; + if (typeof window.localStorage !== "undefined") { + startLanguage = this.localStorage.getItem('captions') || ''; + } // Mediaelement default root level configuration let defaults = { @@ -623,8 +652,8 @@ class MEJSPlayer { qualityText: 'Stream Quality', defaultQuality: this.defaultQuality, toggleCaptionsButtonWhenOnlyOne: true, - startVolume: this.localStorage.getItem('startVolume') || 1.0, - startLanguage: this.localStorage.getItem('captions') || '', + startVolume: startVolume, + startLanguage: startLanguage, // jump forward and backward when player is not focused defaultSeekBackwardInterval: function() { return jumpInterval }, defaultSeekForwardInterval: function() { return jumpInterval } diff --git a/app/assets/javascripts/supplemental_files.js b/app/assets/javascripts/supplemental_files.js index e2637be597..ce430b528c 100644 --- a/app/assets/javascripts/supplemental_files.js +++ b/app/assets/javascripts/supplemental_files.js @@ -102,8 +102,12 @@ $('.supplemental-file-form') $row.find('.visible-inline').addClass('alert'); }); -/* Store collapsed section ids in localStorage */ +/* Store collapsed section ids in localStorage if available */ $('button[id^=edit_section').on('click', (e) => { + if (typeof window.localStorage === "undefined") { + return; + } + // Active sections var activeSections = JSON.parse(localStorage.getItem('activeSections')) || []; @@ -123,6 +127,10 @@ $('button[id^=edit_section').on('click', (e) => { /* On page reload; collapse sections which were collapsed previously */ $(document).ready(function () { + if (typeof window.localStorage === "undefined") { + return; + } + var activeSections = JSON.parse(localStorage.getItem('activeSections')) || []; // Collapse active sections on page From a96bcc0165beef97ebc1750f96d64a73736fad60 Mon Sep 17 00:00:00 2001 From: Chris Colvard Date: Mon, 14 Aug 2023 10:30:16 -0400 Subject: [PATCH 2/2] Simplify conditionals --- .../avalon_player_new.es6 | 35 ++++++------------- 1 file changed, 11 insertions(+), 24 deletions(-) diff --git a/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 b/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 index 9e39d49466..67c667db89 100644 --- a/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 +++ b/app/assets/javascripts/media_player_wrapper/avalon_player_new.es6 @@ -32,6 +32,8 @@ class MEJSPlayer { this.mejsQualityHelper = new MEJSQualityHelper(); if (typeof window.localStorage !== "undefined") { this.localStorage = window.localStorage; + } else { + this.localStorage = false; } this.canvasIndex = 0; @@ -188,9 +190,7 @@ class MEJSPlayer { * @return {void} */ handleVolumeChange() { - if (typeof window.localStorage === "undefined") { - return; - } + if (!this.localStorage) return; this.localStorage.setItem('startVolume', this.mediaElement.volume) } @@ -202,9 +202,7 @@ class MEJSPlayer { * @return {void} */ handleCaptionsChange() { - if (typeof window.localStorage === "undefined") { - return; - } + if (!this.localStorage) return; let srclang = currentPlayer.selectedTrack === null ? '' : currentPlayer.selectedTrack.srclang; this.localStorage.setItem('captions', srclang) @@ -303,7 +301,7 @@ class MEJSPlayer { // Quality selector is turned off in mobile devices if(!mejs.Features.isAndroid) { // Set defaultQuality in player options before building the quality feature - if (typeof window.localStorage !== "undefined") { + if (!this.localStorage) { this.player.options.defaultQuality = this.localStorage.getItem('quality'); } @@ -379,9 +377,7 @@ class MEJSPlayer { * @returns {void} */ toggleCaptions() { - if (typeof window.localStorage === "undefined") { - return; - } + if (!this.localStorage) return; if (this.mediaType==="video" && this.player.options.toggleCaptionsButtonWhenOnlyOne) { if (this.localStorage.getItem('captions') !== '' && this.player.tracks && this.player.tracks.length===1) { @@ -619,25 +615,16 @@ class MEJSPlayer { */ initializePlayer() { let currentStreamInfo = this.currentStreamInfo; - // Set default quality value in localStorage - if (typeof window.localStorage !== "undefined") { - this.localStorage.setItem('quality', this.defaultQuality); - } + // Interval in seconds to jump forward and backward in media let jumpInterval = 5; - - // Set default quality value in localStorage - if (typeof window.localStorage !== "undefined") { - this.localStorage.setItem('quality', this.defaultQuality); - } - let startVolume = 1.0; - if (typeof window.localStorage !== "undefined") { - startVolume = this.localStorage.getItem('startVolume') || 1.0; - } let startLanguage = ''; - if (typeof window.localStorage !== "undefined") { + if (!this.localStorage) { + startVolume = this.localStorage.getItem('startVolume') || 1.0; startLanguage = this.localStorage.getItem('captions') || ''; + // Set default quality value in localStorage + this.localStorage.setItem('quality', this.defaultQuality); } // Mediaelement default root level configuration