upstream/nextcloud
1
0
Fork 0
mirror of https://github.com/nextcloud/server.git synced 2026-06-10 17:23:59 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions 57

Merge pull request #33347 from nextcloud/feature/use-viewer-for-singe-file-shares

Browse source 
feature: use the viewer to render single file shares
This commit is contained in:
Vincent Petry 2022-08-26 09:04:18 +02:00 committed by GitHub
commit 264a0bb17d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
11 changed files with 67 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
apps/files_sharing/css/mobile.css
View file

@ -43,7 +43,6 @@ table td.date {
#imgframe {
width: 100%;
padding: 0;
margin-bottom: 35px;
}
/* some margin for the file type icon */

2
apps/files_sharing/css/mobile.css.map
View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","mobile.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;AAEA;EACA;IACC;;;AAGD;EACA;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;IACA;IACA;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;IACA;IACA;IACA;;;EAGD;IACI;IACA;;;EAEJ;IACC;;;EAGD;IACC","file":"mobile.css"}
{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","mobile.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;AAEA;EACA;IACC;;;AAGD;EACA;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;IACA;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;IACA;IACA;IACA;;;EAGD;IACI;IACA;;;EAEJ;IACC;;;EAGD;IACC","file":"mobile.css"}

1
apps/files_sharing/css/mobile.scss
View file

@ -24,7 +24,6 @@ table td.filename .nametext {
#imgframe {
width: 100%;
padding: 0;
margin-bottom: 35px;
}
/* some margin for the file type icon */
#imgframe .publicpreview {

14
apps/files_sharing/css/public.css
View file

@ -41,6 +41,11 @@
margin: 0 auto;
}
#imgframe #viewer {
height: 100%;
width: 100%;
}
#imgframe img {
max-height: 100% !important;
max-width: 100% !important;
@ -67,6 +72,15 @@
font-size: 1.2em;
}
#imgframe .viewer__file {
height: 100%;
width: 100%;
}
#imgframe .plyr {
max-height: 100%;
}
/* fix multiselect bar offset on shared page */
thead {
left: 0 !important;

2
apps/files_sharing/css/public.css.map
View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","public.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAID;EACC;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAED;AAAA;AAAA;EAGC;EACA;;;AAED;AAAA;AAAA;AAGC;EACA;;;AAGD;EACC;;;AAIA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AAAA;EAEC;EACA;EACA;;;AAGD;EACC;EACA;EACA;;AACA;EACC;EACA;;;AAIF;EACC;EACA;;;AAKD;EAII;IACC;;;AAQL;EAGG;IACC","file":"public.css"}
{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","public.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAED;AAAA;AAAA;EAGC;EACA;;;AAED;AAAA;AAAA;AAGC;EACA;;;AAGD;EACC;;;AAIA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AAAA;EAEC;EACA;EACA;;;AAGD;EACC;EACA;EACA;;AACA;EACC;EACA;;;AAIF;EACC;EACA;;;AAKD;EAII;IACC;;;AAQL;EAGG;IACC","file":"public.css"}

13
apps/files_sharing/css/public.scss
View file

@ -21,6 +21,10 @@
margin:0 auto;
}
#imgframe #viewer {
height: 100%;
width: 100%;
}
#imgframe img {
max-height: 100% !important;
@ -48,6 +52,15 @@
font-size: 1.2em;
}
#imgframe .viewer__file {
height: 100%;
width: 100%;
}
#imgframe .plyr {
max-height: 100%;
}
/* fix multiselect bar offset on shared page */
thead {
left: 0 !important;

15
apps/files_sharing/css/publicView.css
View file

@ -41,6 +41,11 @@
margin: 0 auto;
}
#imgframe #viewer {
height: 100%;
width: 100%;
}
#imgframe img {
max-height: 100% !important;
max-width: 100% !important;
@ -67,6 +72,15 @@
font-size: 1.2em;
}
#imgframe .viewer__file {
height: 100%;
width: 100%;
}
#imgframe .plyr {
max-height: 100%;
}
/* fix multiselect bar offset on shared page */
thead {
left: 0 !important;
@ -277,7 +291,6 @@ table td.date {
#imgframe {
width: 100%;
padding: 0;
margin-bottom: 35px;
}
/* some margin for the file type icon */

2
apps/files_sharing/css/publicView.css.map
View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","public.scss","mobile.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAID;EACC;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAED;AAAA;AAAA;EAGC;EACA;;;AAED;AAAA;AAAA;AAGC;EACA;;;AAGD;EACC;;;AAIA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AAAA;EAEC;EACA;EACA;;;AAGD;EACC;EACA;EACA;;AACA;EACC;EACA;;;AAIF;EACC;EACA;;;AAKD;EAII;IACC;;;AAQL;EAGG;IACC;;;ADjOJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AEEA;AAEA;EACA;IACC;;;AAGD;EACA;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;IACA;IACA;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;IACA;IACA;IACA;;;EAGD;IACI;IACA;;;EAEJ;IACC;;;EAGD;IACC","file":"publicView.css"}
{"version":3,"sourceRoot":"","sources":["../../../core/css/variables.scss","public.scss","mobile.scss"],"names":[],"mappings":";AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACEA;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;EACC;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;AACA;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AACA;EACC;;;AAED;AAAA;AAAA;EAGC;EACA;;;AAED;AAAA;AAAA;AAGC;EACA;;;AAGD;EACC;;;AAIA;EACC;;;AAIF;EACC;;;AAGD;EACC;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;EACA;EACA;;;AAGD;EACC;EACA;EACA;;;AAGD;EACC;EACA;;;AAGD;EACC;EACA;EACA;EACA;EACA;;;AAGD;EACC;;;AAGD;AAAA;EAEC;EACA;EACA;;;AAGD;EACC;EACA;EACA;;AACA;EACC;EACA;;;AAIF;EACC;EACA;;;AAKD;EAII;IACC;;;AAQL;EAGG;IACC;;;AD9OJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AEEA;AAEA;EACA;IACC;;;AAGD;EACA;AAAA;AAAA;AAAA;IAIC;;;AAGD;EACA;IACC;;;AAGD;EACA;IACC;IACA;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;;;AAED;EACA;IACC;;;AAGD;EACA;IACC;IACA;IACA;IACA;;;EAGD;IACI;IACA;;;EAEJ;IACC;;;EAGD;IACC","file":"publicView.css"}

15
apps/files_sharing/js/public.js
View file

@ -129,7 +129,6 @@ OCA.Sharing.PublicApp = {
}
}
// dynamically load image previews
var bottomMargin = 350;
var previewWidth = $(window).width();
@ -153,13 +152,10 @@ OCA.Sharing.PublicApp = {
'max-height': previewHeight
});
var fileSize = parseInt($('#filesize').val(), 10);
var maxGifSize = parseInt($('#maxSizeAnimateGif').val(), 10);
if (mimetype === 'image/gif' &&
(maxGifSize === -1 || fileSize <= (maxGifSize * 1024 * 1024))) {
img.attr('src', $('#downloadURL').val());
imgcontainer.appendTo('#imgframe');
if (OCA.Viewer && OCA.Viewer.mimetypes.includes(mimetype)
&& (mimetype.startsWith('image/') || mimetype.startsWith('video/'))) {
OCA.Viewer.setRootElement('#imgframe')
OCA.Viewer.open({ path: '/' })
} else if (mimetype.substr(0, mimetype.indexOf('/')) === 'text' && window.btoa) {
if (OC.appswebroots['files_texteditor'] !== undefined ||
OC.appswebroots['text'] !== undefined) {
@ -189,8 +185,7 @@ OCA.Sharing.PublicApp = {
// the icon should appear before, so the container should be
// prepended to the frame.
imgcontainer.prependTo('#imgframe');
}
else if (previewSupported === 'true') {
} else if (previewSupported === 'true') {
$('#imgframe > video').attr('poster', OC.generateUrl('/apps/files_sharing/publicpreview/' + token + '?' + OC.buildQueryString(params)));
}

9
apps/files_sharing/lib/Controller/ShareController.php
View file

@ -523,13 +523,12 @@ class ShareController extends AuthPublicShareController {
\OCP\Util::addScript('files', 'filelist');
\OCP\Util::addScript('files', 'keyboardshortcuts');
\OCP\Util::addScript('files', 'operationprogressbar');
// Load Viewer scripts
if (class_exists(LoadViewer::class)) {
$this->eventDispatcher->dispatchTyped(new LoadViewer());
}
}
// Load Viewer scripts
if (class_exists(LoadViewer::class)) {
$this->eventDispatcher->dispatchTyped(new LoadViewer());
}
// OpenGraph Support: http://ogp.me/
\OCP\Util::addHeader('meta', ['property' => "og:title", 'content' => $shareTmpl['filename']]);
\OCP\Util::addHeader('meta', ['property' => "og:description", 'content' => $this->defaults->getName() . ($this->defaults->getSlogan() !== '' ? ' - ' . $this->defaults->getSlogan() : '')]);

38
apps/files_sharing/templates/public.php
View file

@ -60,31 +60,21 @@ $maxUploadFilesize = min($upload_max_filesize, $post_max_size);
<?php if (isset($_['folder'])): ?>
<?php print_unescaped($_['folder']); ?>
<?php else: ?>
<?php if ($_['previewEnabled'] && substr($_['mimetype'], 0, strpos($_['mimetype'], '/')) == 'audio'): ?>
<div id="imgframe">
<audio tabindex="0" controls="" preload="none" style="width: 100%; max-width: <?php p($_['previewMaxX']); ?>px; max-height: <?php p($_['previewMaxY']); ?>px"
<?php // See https://github.com/nextcloud/server/pull/27674?>
<?php if ($_['hideDownload']) { ?>controlsList="nodownload" <?php } ?>>
<source src="<?php p($_['downloadURL']); ?>" type="<?php p($_['mimetype']); ?>" />
</audio>
</div>
<?php else: ?>
<!-- Preview frame is filled via JS to support SVG images for modern browsers -->
<div id="imgframe"></div>
<?php if (isset($_['mimetype']) && strpos($_['mimetype'], 'image') === 0) { ?>
<div class="directDownload">
<div>
<?php p($_['filename'])?> (<?php p($_['fileSize']) ?>)
</div>
<?php if (!$_['hideDownload']) { ?>
<a href="<?php p($_['downloadURL']); ?>" id="downloadFile" class="button">
<span class="icon icon-download"></span>
<?php p($l->t('Download'))?>
</a>
<?php } ?>
</div>
<!-- preview frame to open file in with viewer -->
<div id="imgframe"></div>
<?php if (isset($_['mimetype']) && strpos($_['mimetype'], 'image') === 0) { ?>
<div class="directDownload">
<div>
<?php p($_['filename'])?> (<?php p($_['fileSize']) ?>)
</div>
<?php if (!$_['hideDownload']) { ?>
<a href="<?php p($_['downloadURL']); ?>" id="downloadFile" class="button">
<span class="icon icon-download"></span>
<?php p($l->t('Download'))?>
</a>
<?php } ?>
<?php endif; ?>
</div>
<?php } ?>
<?php if ($_['previewURL'] === $_['downloadURL'] && !$_['hideDownload']): ?>
<div class="directDownload">
<div>