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

[add] support for displaying PDF file #1045

Draft
wants to merge 1 commit into
base: develop
Choose a base branch
from

Conversation

AIC-BV
Copy link
Contributor

@AIC-BV AIC-BV commented Jan 24, 2024

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 AIC-BV marked this pull request as draft January 24, 2024 10:28
@AIC-BV
Copy link
Contributor Author

AIC-BV commented Jan 24, 2024

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

@AIC-BV
Copy link
Contributor Author

AIC-BV commented Jan 24, 2024

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
Copy link
Contributor

damsfx commented Jan 24, 2024

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 file-icon
PSD file-icon
PDF file-icon

@LukeTowers
Copy link
Member

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

@AIC-BV
Copy link
Contributor Author

AIC-BV commented Feb 21, 2024

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

@AIC-BV
Copy link
Contributor Author

AIC-BV commented Feb 23, 2024

@damsfx too fast
#1061

@AIC-BV AIC-BV closed this Feb 23, 2024
@AIC-BV
Copy link
Contributor Author

AIC-BV commented Feb 23, 2024

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

@damsfx
Copy link
Contributor

damsfx commented Feb 23, 2024

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).

@AIC-BV AIC-BV reopened this Feb 23, 2024
@LukeTowers
Copy link
Member

@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
Copy link
Contributor

damsfx commented Mar 5, 2024

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

@LukeTowers
Copy link
Member

@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
Copy link
Member

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
Copy link
Contributor

damsfx commented Mar 6, 2024

@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
Copy link
Contributor Author

AIC-BV commented Mar 6, 2024

Yes the SVG is already made by @damsfx

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants