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

Images in Footer #129

Closed
bahneclaussen opened this issue Oct 18, 2019 · 8 comments
Closed

Images in Footer #129

bahneclaussen opened this issue Oct 18, 2019 · 8 comments
Assignees
Labels

Comments

@bahneclaussen
Copy link

When i insert and pdf:image in pdf:footer the rendering crashes

@maechler
Copy link
Member

@bahneclaussen I just tested this with our Example from the README, everything seems to work fine with images in the footer. I guess it is a specific problem with your image or setup in general.

Are there any errors in the PHP error log or the TYPO3 system log?
Could you please share your template?

output

image

template

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers"
      xmlns:pdf="http://typo3.org/ns/Bithost/Pdfviewhelpers/ViewHelpers"
      xsi:schemaLocation="http://typo3.org/ns/Bithost/Pdfviewhelpers/ViewHelpers https://pdfviewhelpers.bithost.ch/schema/2.1.xsd"
      data-namespace-typo3-fluid="true">

<pdf:document outputDestination="inline" title="Bithost Example">
    <pdf:header>
        <pdf:image src="EXT:pdfviewhelpers/Resources/Public/Examples/BasicUsage/logo.png" width="40"/>
        <pdf:text alignment="right" color="#8C8C8C" paragraphSpacing="0" posY="15">
            Bithost GmbH
            Milchbuckstrasse 83
            CH-8057 Zürich

            hallo@bithost.ch
            044 585 28 20

            www.bithost.ch
        </pdf:text>
    </pdf:header>
    <pdf:footer>
        <pdf:graphics.line style="{color: '#8C8C8C'}"/>
        <pdf:image src="EXT:pdfviewhelpers/Resources/Public/Examples/BasicUsage/logo.png" width="20"/>
        <pdf:text alignment="right" color="#8C8C8C" posY="-13.5">EXT:pdfviewhelpers - Basic usage example</pdf:text>
    </pdf:footer>

    <pdf:page>
        <pdf:text posY="50" padding="{bottom: 4}" color="#8C8C8C">
            Zurich, <f:format.date format="d.m.Y">now</f:format.date>
        </pdf:text>
        <pdf:headline>Welcome to the extension pdfviewhelpers</pdf:headline>
        <pdf:text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr. Sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</pdf:text>
        <pdf:headline>Some more information</pdf:headline>

        <pdf:multiColumn>
            <pdf:column width="55%">
                <pdf:text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua:</pdf:text>
                <pdf:list listElements="{0: 'Websites using TYPO3', 1: 'Application Development', 2: 'Mobile Apps', 3: 'Hosting'}"/>
                <pdf:text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren est Lorem ipsum dolor sit amet.</pdf:text>
            </pdf:column>
            <pdf:column width="45%" padding="{left: 2}">
                <pdf:image src="EXT:pdfviewhelpers/Resources/Public/Examples/BasicUsage/Bithost.jpg"/>
                <pdf:text padding="{top: 1}" color="#8C8C8C">Esteban Marín, Markus Mächler</pdf:text>
            </pdf:column>
        </pdf:multiColumn>

        <pdf:text>Lorem ipsum dolor sit consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</pdf:text>
        <pdf:text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</pdf:text>
    </pdf:page>
</pdf:document>

</html>

@maechler maechler self-assigned this Oct 18, 2019
@maechler
Copy link
Member

maechler commented Oct 18, 2019

Thanks for sharing your template. Indeed, there seems to be a problem on multisite PDFs, but only with images in the footer, the header is not affected.

To me it looks like a bug within TCPDF with PNGs that have an alpha channel, but strangely enough not on all pages. I will have to further investigate this issue.

To work around this you could try to already pre scale your image to the desired width. In such a way, that you do not have to use width="20" anymore.

@maechler maechler added the bug label Oct 18, 2019
@maechler
Copy link
Member

maechler commented Oct 18, 2019

Rescaling the image worked for me, although after that the image resolution is not satisfactory anymore. You could also try converting the image to a jpeg or gif. Although I am experiencing orientation issues with these formats, even if I remove EXIF information from the images.

@maechler
Copy link
Member

Another way to workaround this could be to prepare a PDF that only contains the footer. You could do this with word or any other tool and then use this PDF as a template, see https://docs.typo3.org/typo3cms/extensions/pdfviewhelpers/2.1.0/Examples/ExtendExistingPDFs/Index.html.

<pdf:document sourceFile="EXT:pdfviewhelpers/Resources/Public/Examples/ExtendExistingPDFs/pdf_template.pdf">
        <pdf:page importPage="1" margin="{top: 80, right: 20, bottom: 40, left: 20}"> 
       
       </pdf:page>
</pdf:document>

@bahneclaussen
Copy link
Author

If I remove the scaling from the image, it looks the same on all pages up to the last page. Unfortunately I can't use it like this.

@maechler
Copy link
Member

maechler commented Oct 21, 2019

You could probably also pre scale the image using processing instructions:

<pdf:image src="EXT:nc_hobby_vehicles/Resources/Public/Images/Pdf/hobby-logo.png" 
           processingInstructions="{width: '60'}" />

Alternatively you could try converting the image to different image formats like jpg or gif. Or create a template PDF containing only the footer as described in #129 (comment).

@maechler
Copy link
Member

@bahneclaussen I think I found the underlying issue in TCPDF. There is an issue in the footer if the option fitonpage is set for an image: tecnickcom/TCPDF#147

The error should be fixed in pdfviewhelpers v2.2.0, which is available in TER now. Could you please update the extension and test if this fixes your issue?

If you like the project, please consider giving it a star on GitHub :)

@maechler
Copy link
Member

@bahneclaussen Could you verify that v2.2.0 solves your issue?

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

No branches or pull requests

2 participants