[add] support for displaying PDF file

[AIC-BV]

PDFs are not displayed as thumbnail.
This adds support for displaying a PDF 'thumbnail'.

If OK, it should be added to all fileupload widgets.
I guess it is somewhat linked to this PR: #996

[AIC-BV]

Well I guess its the same as https://github.com/wintercms/winter/pull/990/files 😆

[AIC-BV]

Kind of worked around it using a partial

<?php
if ($model->drawing) {
    $src = $model->drawing->getPath();
?>
    <iframe src="<?= e($src) ?>#toolbar=0" width="50%" height="420px"></iframe>
<?php } ?>

[damsfx]

It might be interesting to use a generic icon in SVG format, using a <text /> node to display the file extension.

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="100%" height="100%" viewBox="0 0 250 250" version="1.1"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve"
    xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
    <path d="M62.5,0c-8.594,0 -15.625,7.031 -15.625,15.625l0,218.75c0,8.594 7.031,15.625 15.625,15.625l156.25,0c8.594,0 15.625,-7.031 15.625,-15.625l0,-171.875l-62.5,-62.5l-109.375,0Z" style="fill:#e2e5e7;fill-rule:nonzero;"/>
    <path d="M187.5,62.5l46.875,0l-62.5,-62.5l0,46.875c0,8.594 7.031,15.625 15.625,15.625Z" style="fill:#b0b7bd;fill-rule:nonzero;"/>
    <path d="M234.375,109.375l-46.875,-46.875l46.875,0l0,46.875Z" style="fill:#cad1d8;fill-rule:nonzero;"/>
    <path d="M195.313,210.938l-148.438,-0.001l0,7.813l148.438,0c4.296,0 7.812,-3.516 7.812,-7.813l-0,-7.812c-0,4.297 -3.516,7.813 -7.813,7.813Z" style="fill:#cad1d8;fill-rule:nonzero;"/>
    <!-- Colour label -->
    <path d="M203.125,203.125c0,4.297 -3.516,7.813 -7.813,7.813l-171.875,-0c-4.296,-0 -7.812,-3.516 -7.812,-7.813l-0,-78.125c-0,-4.297 3.516,-7.813 7.812,-7.813l171.875,0.001c4.297,-0.001 7.813,3.515 7.813,7.812l0,78.125Z" style="fill:#576d7e;fill-rule:nonzero;"/>
    <!-- Extension text node -->
    <text x="47.965px" y="188.125px" style="font-family:'ArialMT', 'Arial', sans-serif;font-size:61.512px;fill:#fff;">EXT</text>
</svg>

In this case EXT in text node may be replaced by the file extension.
The color can also be changed.

Some examples :

	Render
Generic
PSD
PDF

[LukeTowers]

I like that @damsfx, @AIC-BV are you interested in making that change?

[AIC-BV]

That looks awesome and will work for 'all' file types.
However, I don't have time to do try this straight away

[AIC-BV]

@damsfx too fast
#1061

[AIC-BV]

Hmm or is that only in the mediafinder and not in form widget? Might need to extend it. Need to test it first.

[damsfx]

Hmm or is that only in the mediafinder and not in form widget? Might need to extend it. Need to test it first.

@AIC-BV It's only related to the mediamanager! ⚠

Your use case is a little more specific ... I think you are using a fileupload field in image mode BUT allow it to accept other file types.
This is cool, because it allows you to have the same GUI to manage all file types.

If it became possible to carry over dynamic icon support to the fileupload formwidget, I think it wouldn't even be necessary to have two different modes of behavior (unless you wanted a more compact interface).

[LukeTowers]

@damsfx perhaps we should take the logic for generating the SVG and put it in a helper class so that the mediamanager and the fileupload field can use it?

[damsfx]

@LukeTowers Yes, that would be perfect, but I'm not sure how to get started with that change.

[LukeTowers]

@bennothommo do you have any thoughts on a desired API / direction to go in for the proposal of making it easier to reuse the work that was just added for generating icons based on file extension in the media manager?

[bennothommo]

Sure, we could use the PHP SVG library. Would be very simple to have it generate text on the fly from what I can see.

[damsfx]

@LukeTowers @bennothommo Isn't using a library to generate an SVG image (a simple string of characters) a bit over-dimmed?
What's needed is just displaying the image where it's needed, wouldn't a simple partial containing the image code be enough?

[AIC-BV]

Yes the SVG is already made by @damsfx

[LukeTowers]

@damsfx are you still interested in porting your work in #1061 to the FileUpload FormWidget?

[damsfx]

@LukeTowers Yes, of course.
But I still don't know the best way to share a partial representing the structure of the SVG icon and the associated stylesheet between the mediamanager widget and the fileupload formwidget.

[LukeTowers]

CSS here: https://github.com/damsfx/winter/blob/048b37a8e7fd64e6b5af0fc42c249b62f87f0079/modules/backend/assets/less/controls/svg-icons.less

HTML, maybe here: https://github.com/wintercms/storm/blob/develop/src/Filesystem/Filesystem.php as File::svgIcon($extension);?

@bennothommo @jaxwilko @mjauvin any thoughts?