Merge pull request #5806 from avalonmediasystem/staging

Release v7.7.2

app/views/media_objects/_add_to_playlist.html.erb

@@ -202,8 +202,27 @@ Unless required by applicable law or agreed to in writing, software distributed
  function enableAddToPlaylist() {
  let player = document.getElementById('iiif-media-player');
  let addToPlaylistBtn = document.getElementById('addToPlaylistBtn');
- if(addToPlaylistBtn && addToPlaylistBtn.disabled && player?.player.readyState() === 4) {
- addToPlaylistBtn.disabled = false;
+ if(addToPlaylistBtn && addToPlaylistBtn.disabled) {
+ const USER_AGENT = window.navigator.userAgent;
+ // Identify both iPad and iPhone devices
+ const IS_MOBILE = (/Mobi/i).test(USER_AGENT);
+ const IS_IPHONE = (/iPhone/i).test(USER_AGENT);
+ const IS_TOUCH_ONLY = navigator.maxTouchPoints && navigator.maxTouchPoints > 2 && !window.matchMedia("(pointer: fine").matches;
+ // Identify browser is Safari
+ const IS_SAFARI = (/Safari/i).test(USER_AGENT);
+ /*
+ For iOS Safari, player.readyState() never gets to 4 until media playback is
+ started. Therefore, use player.src() to check whether there's a playable media
+ loaded into the player instead of player.readyState().
+ Keep the player.readyState() === 4 check for desktop browsers, because without
+ that check the add to playlist form populates NaN values for time fields when user
+ clicks the 'Add to Playlist' button immediately on page load, which does not 
+ happen in mobile context.
+ */
+ if(((IS_TOUCH_ONLY || IS_IPHONE || IS_MOBILE) && IS_SAFARI && player?.player.src() != '') 
+ || player?.player.readyState() === 4) {
+ addToPlaylistBtn.disabled = false;
+ }
  }
  if(!listenersAdded) {
  // Add 'Add new playlist' option to dropdown

app/views/media_objects/_thumbnail.html.erb

@@ -50,6 +50,59 @@ Unless required by applicable law or agreed to in writing, software distributed
  let offset = ''
  let timeCheck = setInterval(enableCreateThumbnail, 500);
 
+ function handleCreateThumbnailModalShow() {
+ let currentPlayer = document.getElementById('iiif-media-player');
+ let $imgPolaroid = document.getElementById('img-polaroid');
+ offset = currentPlayer.player.currentTime();
+
+ canvasIndex = parseInt(currentPlayer.dataset.canvasindex);
+ const sectionId = sectionIds[canvasIndex];
+ baseUrl = '/master_files/' + sectionId;
+
+ if ($imgPolaroid) {
+ let src = baseUrl + '/poster?offset=' + offset + '&preview=true';
+
+ // Display a preview of thumbnail to user
+ $imgPolaroid.setAttribute('src', src);
+ $($imgPolaroid).fadeIn('slow');
+ }
+ };
+
+ function handleUpdateThumbnail() {
+ let currentPlayer = document.getElementById('iiif-media-player');
+ canvasIndex = parseInt(currentPlayer.dataset.canvasindex);
+ const sectionId = sectionIds[canvasIndex];
+ baseUrl = '/master_files/' + sectionId;
+ offset = currentPlayer.player.currentTime();
+
+ const modalBody = document.getElementsByClassName('modal-body')[0];
+ // Put in a loading spinner and disable buttons to prevent double clicks
+ modalBody.classList.add('spinner');
+ $('#thumbnailModal')
+ .find('button')
+ .attr({ disabled: true });
+
+ $.ajax({
+ url: baseUrl + '/still',
+ type: 'POST',
+ data: {
+ offset: offset
+ }
+ })
+ .done(response => {
+ $('#thumbnailModal').modal('hide');
+ })
+ .fail(error => {
+ console.log(error);
+ })
+ .always(() => {
+ modalBody.classList.remove('spinner');
+ $('#thumbnailModal')
+ .find('button')
+ .attr({ disabled: false });
+ });
+ };
+
  function enableCreateThumbnail() {
  let player = document.getElementById('iiif-media-player');
 
@@ -85,53 +138,9 @@ Unless required by applicable law or agreed to in writing, software distributed
  }
  });
  }
-
- $('#thumbnailModal').on('show.bs.modal', function(e) {
- let currentPlayer = document.getElementById('iiif-media-player');
- let $imgPolaroid = document.getElementById('img-polaroid');
- offset = currentPlayer.player.currentTime();
-
- canvasIndex = parseInt(currentPlayer.dataset.canvasindex);
- const sectionId = sectionIds[canvasIndex];
- baseUrl = '/master_files/' + sectionId;
-
- if ($imgPolaroid) {
- let src = baseUrl + '/poster?offset=' + offset + '&preview=true';
-
- // Display a preview of thumbnail to user
- $imgPolaroid.setAttribute('src', src);
- $($imgPolaroid).fadeIn('slow');
- }
- });
-
- $('#create-thumbnail-submit-button').on('click', function(e) {
- const modalBody = document.getElementsByClassName('modal-body')[0];
- // Put in a loading spinner and disable buttons to prevent double clicks
- modalBody.classList.add('spinner');
- $('#thumbnailModal')
- .find('button')
- .attr({ disabled: true });
-
- $.ajax({
- url: baseUrl + '/still',
- type: 'POST',
- data: {
- offset: offset
- }
- })
- .done(response => {
- $('#thumbnailModal').modal('hide');
- })
- .fail(error => {
- console.log(error);
- })
- .always(() => {
- modalBody.classList.remove('spinner');
- $('#thumbnailModal')
- .find('button')
- .attr({ disabled: false });
- });
- });
+
+ document.getElementById('create-thumbnail-btn').addEventListener('click', handleCreateThumbnailModalShow);
+ document.getElementById('create-thumbnail-submit-button').addEventListener('click', handleUpdateThumbnail);
  };
  });
 </script>

config/application.rb

@@ -8,7 +8,7 @@
 Bundler.require(*Rails.groups)
 
 module Avalon
- VERSION = '7.7.1'
+ VERSION = '7.7.2'
 
  class Application < Rails::Application
  require 'avalon/configuration'

package.json

@@ -5,7 +5,7 @@
  "@babel/plugin-proposal-object-rest-spread": "^7.20.7",
  "@babel/preset-react": "^7.0.0",
  "@babel/runtime": "7",
- "@samvera/ramp": "^3.1.0",
+ "@samvera/ramp": "https://github.com/samvera-labs/ramp.git#v3.1.3",
  "babel-plugin-macros": "^3.1.0",
  "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
  "buffer": "^6.0.3",

yarn.lock

@@ -1440,10 +1440,9 @@
  estree-walker "^2.0.2"
  picomatch "^2.3.1"
 
-"@samvera/ramp@^3.1.0":
- version "3.1.0"
- resolved "https://registry.yarnpkg.com/@samvera/ramp/-/ramp-3.1.0.tgz#6254646f34b9a434ff6e6046f1e013130d036e28"
- integrity sha512-B5UiU0DDxi7Ub+DfbKC7j80zjMCmkuLnmDJNUqnftjO1L2gocdMOuUfYZ30pAh9SO9HbMCEtAFtLUHPlizPz3A==
+"@samvera/ramp@https://github.com/samvera-labs/ramp.git#v3.1.3":
+ version "3.1.3"
+ resolved "https://github.com/samvera-labs/ramp.git#6c233c2cd668856b6bce1ce63076455a9e58b0f2"
  dependencies:
  "@rollup/plugin-json" "^6.0.1"
  "@silvermine/videojs-quality-selector" "^1.2.4"