rt/wrolpi
1
0
Fork 0
mirror of https://github.com/lrnselfreliance/wrolpi.git synced 2026-10-26 19:01:39 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Combining epub preview modal with iframe modal. Simplifying getEpubViewerURL.

Browse source
This commit is contained in:
Roland 2023-08-20 18:50:30 -06:00
parent 7db4bc65f0
commit 492fb16ee2
No known key found for this signature in database
GPG key ID: 9D6DBD3ACF11AB93
2 changed files with 8 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

1
app/src/components/Common.js
View file

@ -1163,6 +1163,7 @@ export const encodeMediaPath = (path) => {
path = path.replaceAll('%', '%25');
path = path.replaceAll('&', '%26');
path = path.replaceAll('=', '%3d');
path = path.replaceAll('#', '%23');
path = path.replaceAll(' ', '%20');
return path

28
app/src/components/FilePreview.js
View file

@ -26,15 +26,12 @@ function getDownloadPathURL(previewFile) {
}
function getEpubViewerURL(previewFile) {
if (previewFile['primary_path']) {
return `/epub/epub.html?url=/download/${encodeMediaPath(previewFile['primary_path'])}`;
} else {
return `/epub/epub.html?url=/download/${encodeMediaPath(previewFile['path'])}`;
}
let url = previewFile['primary_path'] ?? previewFile['path'];
return `/epub/epub.html?url=/media/${encodeMediaPath(url)}`
}
function getIframePreviewModal(previewFile) {
const url = getMediaPathURL(previewFile);
function getIframePreviewModal(previewFile, url) {
url = url || getMediaPathURL(previewFile);
return <ModalContent>
<div className='full-height'>
<iframe title='textModal' src={url}
@ -64,19 +61,6 @@ function getImagePreviewModal(previewFile) {
</React.Fragment>
}
function getEpubPreviewModal(previewFile) {
const downloadURL = getDownloadPathURL(previewFile);
const viewerUrl = `/epub/epub.html?url=${downloadURL}`;
return <ModalContent>
<div className='full-height'>
<iframe title='textModal' src={viewerUrl}
style={{
height: '100%', width: '100%', border: 'none', position: 'absolute', top: 0,
}}/>
</div>
</ModalContent>
}
function getVideoPreviewModal(previewFile) {
const url = getMediaPathURL(previewFile);
const path = previewFile.primary_path ?? previewFile.path;
@ -215,6 +199,8 @@ export function FilePreviewProvider({children}) {
</ModalContent>
: null;
console.log('Previewing', path);
console.log('Preview Download URL', downloadURL);
console.log('Preview Open URL', url);
setPreviewModal(<Modal closeIcon
size='fullscreen'
@ -281,7 +267,7 @@ export function FilePreviewProvider({children}) {
setModalContent(getAudioPreviewModal(previewFile), url, downloadURL, path);
} else if (mimetype.startsWith('application/epub')) {
const viewerURL = getEpubViewerURL(previewFile);
setModalContent(getEpubPreviewModal(previewFile), viewerURL, downloadURL, path);
setModalContent(getIframePreviewModal(previewFile, viewerURL), viewerURL, downloadURL, path);
} else if (mimetype.startsWith('application/pdf')) {
setModalContent(getIframePreviewModal(previewFile), url, downloadURL, path);
} else if (mimetype.startsWith('image/')) {