Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use plain old javascript to get de-duplication of listener registration #5775

Merged
merged 1 commit into from
Apr 10, 2024
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Use plain old javascript to get de-duplication of listener registration
  • Loading branch information
cjcolvar committed Apr 10, 2024
commit 647caf8c8eb464031107e15c66f7b59d7e1f0e47
103 changes: 56 additions & 47 deletions app/views/media_objects/_thumbnail.html.erb
Original file line number Diff line number Diff line change
Expand Up @@ -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');

Expand Down Expand Up @@ -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>
Expand Down