DigSig Stretch/Crop issues in PDF.

[Ninpo]

To ensure that there were no compatibility issues with anything, I created a Sandbox site with Joomla 3.6.0. The only extension that I installed was the latest version of Fabrik, which I then updated from the latest version from github.

I then created a simple list with 1 DigSig Element in it, in addition to the default elements of date and id. I then set the form to show the PDF button and I enabled PDF debugging. The signature display in the details view comes out exactly as I created it but when I view the PDF view, the signature is stretched, zoomed and cropped. I have attached a screenshot below of both views. Is there a way that I can fix this issue in the PDF?

I did see this post, but this does not apply to the PDF view. http://fabrikar.com/forums/index.php?threads/digital-signature-element-stretching-issue-fix.43537/

 

[troester]

https://github.com/Fabrik/fabrik/pull/1778

 

[Ninpo]

I tried the solution posted and it did not make a difference. I still had the same results. I am also getting an error.

 

[troester]

Without the patch I can replicate the stretch/crop issue, with the patch it's ok on my site.
I don't get a JS error.
Can you set "Allow Fabrik Debug" to "Debug JS" in Fabrik Options "Debugging" tab?

 

[Ninpo]

I re-applied the patch, completely cleared my cache and got a new problem. I was getting blank images and network error 500's. When I set the value back to pull from the smaller value i.e. the list parameter instead of the form parameter, the error 500 went away. Once I increased the height/width value, I got the error 500 again. I stuck it into a debugger and found that when the debugger hit line #53 in the signature-to-image.php file;

imagefill($img, 0, 0, $bg);

My session was being forcibly closed in the JSessionHandlerNative interface. I dug around the internet a bit and came across an old post from 2006. http://forums.phpfreaks.com/topic/4538-gd-and-imagefill-problems/

This post talks about problems with imagefill and GD. The suggestion was to use imagefilledrectangle instead of imagefill.

I tried this solution out. I made the following code change;

//imagefill($img, 0, 0, $bg);
  imagefilledrectangle($img,0,0,$options['imageSize'][0] * $options['drawMultiplier'],$options['imageSize'][1] * $options['drawMultiplier'],$bg);

Once I did this, I no longer got my session closed and thus the error 500, the image appeared exactly as it does in the details view without any cropping, zooming or any other distortions. So the code change that was put in the patch plus my code change fixed all my "current" issues with the signature pad.

I still get that JavaScript error in my console window, but it does not seem to affect the output.

Attached are screen shots of what my data looks like now with these 2 fixes in place.

 

[troester]

Ah, I'd seen an empty pic also at some point.
I've added your modification to the pull request.

BTW: for PDF output CSS see http://fabrikar.com/forums/index.php?wiki/pdf-output/
(at least the domPDF in Fabrik GitHub can't handle floats; I think somebody mentioned that menwhile there's a newer version which can)

 

[Ninpo]

Hold off on the modification for a few please. I just found an issue with it.

 

[Ninpo]

Ok so there is still an issue. When I generate the PDF "with PDF debugging on" the fix with the 2 modifications works. However, once I turn the debugger off and create the actual PDF, I get the result in the attached image. The fix I created works for the debugging view but the PDF view errors out with both imagefill and imagefilledrectangle. It seems to duplicate the URL. No idea at this time why, but I can look into this tomorrow, it's pretty late where I am at the moment.

Thanks for the info on the CSS issue. I noticed that the pad renders really strangely. In my actual site that I am using Fabrik, I made the following CSS changes in the custom CSS on my custom pdf template to get the Signature pad to render properly.

#{$form} .sigWrapper {
  margin-top: 20px;
  height: initial !important;
  width: 50% !important;
  border-bottom: 3px solid #a8a8a8;
}

 

[troester]

I assume the "duplicated" URL is a result of Fabrik creating absolute pathes out of relative ones for PDF and emails (which is also "work in progress" at the moment).
https://github.com/Fabrik/fabrik/pull/1777
Are the parts you've marked out identical or is there a minimal difference (e.g. port)?
Do you have livesite defined in configuration.php?

Which exact Fabrik version are you running? GitHub master branch? from when?

 

[Ninpo]

The parts I have blacked out are pretty much identical, minus the params.
I have never used the livesite param in the configuration file for any of my sites.
I am doing theses tests on Joomla 3.6.0 with Fabrik 3.5. I have checked out the master branch and I did a pull from origin about 5 min ago.

I have setup a public facing test sandbox site, if you wish to see the issue yourself, on one of the domains I own. I added this site to the "MySites" under my profile. This site only has Fabrik and I added extplorer in there in case you need file level access. This site does not have the changes that we implemented above, but I can add them if you wish.

The interesting thing is I have added the changes above, to a different site that is running Joomla 3.5.1 with Fabrik 3.4.3. I tested these changes on a PDF report template that I created and they worked flawlessly. So, the only thing I can think of is either there is a bug somewhere with Fabrik 3.5 or something in the master branch or a bug with Joomla 3.6.0.

Below is my report from Joomla 3.5.1 and Fabrik 3.4.3, with the changes that we implemented above. All the data is fictitious and the only thing blacked out is the clients logo and name as it is a security issue.

 

[Ninpo]

I am really not sure why the generated PDF is showing an invalid image but it happens every time, on a brand new installation. Now here is the interesting part; I took an Akeeba backup of one of my live sites and put it in a sandbox. I then updated that sandbox to Fabrik 3.5, I installed the very latest git hub pull from the master branch, I applied the 2 PDF fixes above and then I upgraded Joomla from 3.5.1 to 3.6.1. I tested my form and generated a PDF and it worked perfectly.

Now here is how I get the invalid image to show;
1. Create a brand new Joomla 3.x site, not a backup site or update site. This needs to be a 100% fresh Joomla install!
2. Install Fabrik 3.5 from the zip file.
3. Update the Fabrik installation from git hub, using the regular provided instructions. I usually do a pull from origin to a separate directory and then I have a script that I run to copy all the update files from that directory to a directory of my choosing. I then install all the newly found files from the Discover method and I then refresh my Fabrik extension cache, clear my Joomla system caches and Joomla system expired caches.

This is my Fabrik copy script. I use this script because I may need to copy into different sandboxes.

#!/bin/bash

OUTPATH=$1

if [ -n "$OUTPATH" ]; then
  cp -Rfv fabrik/administrator $OUTPATH;
  cp -Rfv fabrik/components $OUTPATH;
  cp -Rfv fabrik/libraries $OUTPATH;
  cp -Rfv fabrik/media $OUTPATH;
  cp -Rfv fabrik/modules $OUTPATH;
  cp -Rfv fabrik/plugins $OUTPATH;

  echo ""
  echo "*** Done Copying ***"
else
  echo "You Need to Specify an Output directory"
fi

4. I then create a new list.
5. I add the DigSig element to the new list.
6. I update the form and allow the form to show the PDF button.
7. I then create a new record for that list.
8. When I go to the details view and hit the PDF button, the PDF is downloaded but I get the invalid "Image not found" error above.

My update method for Joomla and Fabrik on my Akeeba backed up sandbox site was pretty much identical to the new site. However, the production site renders the PDF properly, with the image intact, the brand new site displays the error.

I have duplicated this issue on 2 separate computers with different OS's several times.

If you wish, I can open a new thread about this issue, to keep things clean and properly separated on the forum, as it is no longer a distorted rendering issue.

 

[Ninpo]

This "Image not found" issue seems to be related to establishing some sort of network connection within the template at the time that the PDF is generated. The network connection does not even need to be associated with your site.

Below I have posted a video screencast of this bug in action. The sandbox site I am using is joomla.example.com which I mapped back to localhost. The network connection I make is with a random image I pulled off of google, completely not associated with my site. I just use this image to establish some sort of network connectivity when the PDF is being rendered.

The reason that it worked in my custom template is that I have the clients logo passed into the template via an <img src> tag. This tag creates a network connection in the header portion of the template prior to rendering any group data.

Here is my screencast showing this issue with and without the quick modification I make to the bootstrap template.
http://screencast.com/t/c5ahEsPNSM