just created this on the fly. In the past 2 signatures with the CF5 widget did not work.
two signatures signed separately and displaying in message and email. BOTH of them!!!!!!!!!!
How sick is this?
https://www.chronoengine.com/forums/posts/t101972/2-signature-pad?keywords=signature
now it shouldnt be a problem to even more than 2 signatures. will try tomorrow.
two signatures signed separately and displaying in message and email. BOTH of them!!!!!!!!!!
How sick is this?
https://www.chronoengine.com/forums/posts/t101972/2-signature-pad?keywords=signature
now it shouldnt be a problem to even more than 2 signatures. will try tomorrow.
[file=10776]basic_contact_form_17_Jul_2018_22_47_46_two_signatures.cf6bak[/file]
[file=10820]basic_contact_form_save_signature_05_Aug_2018_17_06_56.cf6bak[/file]
Note that the above example uses signature9 and signature10 (which is now signature13 in the below example).
I tried forever to get these to save the png file to the database as an image with no luck.
So the next step was to try to save the two png signatures to the database.
I could not get the two png files (signature9 and signature10) to save to the datatable, but I was able to save the path link to the actual png image in the datatable under sig_img and sig_img2.
After two painful full days, and some artful changing (ok, guessing followed by testing followed by more guessing!) of the cf5 php code to create a signature for cf6 by creating one php code for sig_img and another for sig_img2, it is finally solved!
No offense to Bob, but I could not get the CF6 example to work from here https://www.chronoengine.com/faqs/70-chronoforms/cfv5/5254-how-can-i-use-the-[color=#a333c8
**********
The attached filel will create save (to datatable and to chronoforms6/chronoforms/upload directory) and email two signatures to the chronoforms6/chronoforms/uploads directory, and put a link in the datatable for each signature 1 (sig_img) and signature 2 (sig_img2).
*************************************
This post is part of the solution.
https://www.chronoengine.com/forums/posts/t105791/signature-widget-converting-base64-image-to-png?keywords=signature
But I could not get this example to work as written. The problem was that the folder path in the example was throwing off a "$data_pieces ...." php error. By chance, I determined that this line would not work even if the "images/photos/signatures" directory was created: [pre]$folder = 'images/photos/signatures'.$form->form['Form']['title'].'/';[/pre]
So I tried the path for the old CFv5, and used the same path for cfv6 for this one line.
$folder = 'components/com_chronoforms6/chronoforms/uploads/'.$form->form['Form']['title'].'/';
***************
after restoring the attached file, create the table and make sure to add a row for sig_img and a row for sig_img2. Notice the two php codes, one that uses sig_img for signature9 and oen that uses sig_img2 for signature13. Ir your signature pads in the designer have different number, remember to change them in the php codes, in the data base save, and in the email. Also remember to put email address in the send from otherwise email will not send. Do not touch sig_img or sig_img2 in the php codes.
here is what the two php codes look like.
THIS ONE IS FOR SIGNATURE9 IN THE DESIGNER.
$data_pieces = explode(",", $this->data['signature9']);$encoded_image = $data_pieces[1];$decoded_image = base64_decode($encoded_image);// set the folder where the images will be saved$folder = 'components/com_chronoforms6/chronoforms/uploads/'.$form->form['Form']['title'].'/';$path = JPATH_SITE.'/'.$folder;$url = JURI::root().$folder;// sets a file name using a date-time prefix to make sure it is unique$sig_name = date('Ymd-his').'_signature.png';file_put_contents( $path.$sig_name, $decoded_image);// add the file info to the form data$this->data['signature9'] = $sig_name;$this->files['signature9']['name'] = $sig_name;$this->files['signature9']['link'] = $url.$sig_name;$this->files['signature9']['path'] = $path.$sig_name;// display the image if neededecho "<img src='{$url}{$sig_name}' />";// to add the image to an email add this line// and put {sig_img} in the email template $this->data['sig_img'] = "<img src='{$url}{$sig_name}' />";
THIS ONE IS FOR SIGNATURE 13 IN THE DESIGNER.
$data_pieces = explode(",", $this->data['signature13']);$encoded_image = $data_pieces[1];$decoded_image = base64_decode($encoded_image);// set the folder where the images will be saved$folder = 'components/com_chronoforms6/chronoforms/uploads/'.$form->form['Form']['title'].'/';$path = JPATH_SITE.'/'.$folder;$url = JURI::root().$folder;// sets a file name using a date-time prefix to make sure it is unique$sig_name2 = date('Ymd-his').'_signature2.png';file_put_contents( $path.$sig_name2, $decoded_image);// add the file info to the form data$this->data['signature13'] = $sig_name2;$this->files['signature13']['name'] = $sig_name2;$this->files['signature13']['link'] = $url.$sig_name2;$this->files['signature13']['path'] = $path.$sig_name2;// display the image if neededecho "<img src='{$url}{$sig_name2}' />";// to add the image to an email add this line// and put {sig_img} in the email template $this->data['sig_img2'] = "<img src='{$url}{$sig_name2}' />";
**********************
In order to save the path to the two png files in the datatable, you also have to put this here under database save
Data override on insert
created:{date:Y-m-d H:i:s}user_id:{user:id}sig_img:{data:sig_img}sig_img2:{data:sig_img2}
***********************
If anybody has an idea how to save the png sig_img, the sig_img2, or data:signature9 or data:signature13 (in the above example, where your signature#s will probably be different when you restore the attached cf6 file) in the datable in addition to the above example that saves the png signature image in the chronoforms6/chronoforms/uploads directory, go ahead and add to this post. I have given up trying to save one or both png images directly in the datable. In CF5 I could save a BLOB image, but it does not seem to work in CF6.
************************
I have not tried yet, but we should be able to added additional signature pads in the Designer (i.e., signature14, signature 15, etc... for me) and copy and paste the sig_img2 php code to another php code. e.g., rename signature13 as signature 14 and rename sig_img2 as sig_img3 and sig_name2 as sig_name3; and for the next signature pad in the designer e.g. rename signature13 as signature 15 and rename sig_img2 as sig_img4 and sig_name2 as sig_name4. remember that all numbers have to be increased in the php code for each new signature block.
****************
The last step for me is to use this post and try to create dynamic names for sig_img and sig_img2 which are currently saved as datetime_signature.png and datetime_signature2.png at chronoforms6/chronoforms/uploads
https://www.chronoengine.com/forums/posts/t105624/store-signature-using-a-data-variable-name?keywords=signature]
fyi, note that this code to store the image from that post did not work. I think it was because $data_uri is used instead of $data_pieces
<?php$data_uri = $this->data('signature');$encoded_image = explode(",", $data_uri)[1];$decoded_image = base64_decode($encoded_image);file_put_contents("signature.png", $decoded_image)?>
I tried forever to get these to save the png file to the database as an image with no luck.
So the next step was to try to save the two png signatures to the database.
I could not get the two png files (signature9 and signature10) to save to the datatable, but I was able to save the path link to the actual png image in the datatable under sig_img and sig_img2.
After two painful full days, and some artful changing (ok, guessing followed by testing followed by more guessing!) of the cf5 php code to create a signature for cf6 by creating one php code for sig_img and another for sig_img2, it is finally solved!
No offense to Bob, but I could not get the CF6 example to work from here https://www.chronoengine.com/faqs/70-chronoforms/cfv5/5254-how-can-i-use-the-[color=#a333c8
**********
The attached filel will create save (to datatable and to chronoforms6/chronoforms/upload directory) and email two signatures to the chronoforms6/chronoforms/uploads directory, and put a link in the datatable for each signature 1 (sig_img) and signature 2 (sig_img2).
*************************************
This post is part of the solution.
https://www.chronoengine.com/forums/posts/t105791/signature-widget-converting-base64-image-to-png?keywords=signature
But I could not get this example to work as written. The problem was that the folder path in the example was throwing off a "$data_pieces ...." php error. By chance, I determined that this line would not work even if the "images/photos/signatures" directory was created: [pre]$folder = 'images/photos/signatures'.$form->form['Form']['title'].'/';[/pre]
So I tried the path for the old CFv5, and used the same path for cfv6 for this one line.
$folder = 'components/com_chronoforms6/chronoforms/uploads/'.$form->form['Form']['title'].'/';
***************
after restoring the attached file, create the table and make sure to add a row for sig_img and a row for sig_img2. Notice the two php codes, one that uses sig_img for signature9 and oen that uses sig_img2 for signature13. Ir your signature pads in the designer have different number, remember to change them in the php codes, in the data base save, and in the email. Also remember to put email address in the send from otherwise email will not send. Do not touch sig_img or sig_img2 in the php codes.
here is what the two php codes look like.
THIS ONE IS FOR SIGNATURE9 IN THE DESIGNER.
$data_pieces = explode(",", $this->data['signature9']);$encoded_image = $data_pieces[1];$decoded_image = base64_decode($encoded_image);// set the folder where the images will be saved$folder = 'components/com_chronoforms6/chronoforms/uploads/'.$form->form['Form']['title'].'/';$path = JPATH_SITE.'/'.$folder;$url = JURI::root().$folder;// sets a file name using a date-time prefix to make sure it is unique$sig_name = date('Ymd-his').'_signature.png';file_put_contents( $path.$sig_name, $decoded_image);// add the file info to the form data$this->data['signature9'] = $sig_name;$this->files['signature9']['name'] = $sig_name;$this->files['signature9']['link'] = $url.$sig_name;$this->files['signature9']['path'] = $path.$sig_name;// display the image if neededecho "<img src='{$url}{$sig_name}' />";// to add the image to an email add this line// and put {sig_img} in the email template $this->data['sig_img'] = "<img src='{$url}{$sig_name}' />";
THIS ONE IS FOR SIGNATURE 13 IN THE DESIGNER.
$data_pieces = explode(",", $this->data['signature13']);$encoded_image = $data_pieces[1];$decoded_image = base64_decode($encoded_image);// set the folder where the images will be saved$folder = 'components/com_chronoforms6/chronoforms/uploads/'.$form->form['Form']['title'].'/';$path = JPATH_SITE.'/'.$folder;$url = JURI::root().$folder;// sets a file name using a date-time prefix to make sure it is unique$sig_name2 = date('Ymd-his').'_signature2.png';file_put_contents( $path.$sig_name2, $decoded_image);// add the file info to the form data$this->data['signature13'] = $sig_name2;$this->files['signature13']['name'] = $sig_name2;$this->files['signature13']['link'] = $url.$sig_name2;$this->files['signature13']['path'] = $path.$sig_name2;// display the image if neededecho "<img src='{$url}{$sig_name2}' />";// to add the image to an email add this line// and put {sig_img} in the email template $this->data['sig_img2'] = "<img src='{$url}{$sig_name2}' />";
**********************
In order to save the path to the two png files in the datatable, you also have to put this here under database save
Data override on insert
created:{date:Y-m-d H:i:s}user_id:{user:id}sig_img:{data:sig_img}sig_img2:{data:sig_img2}
***********************
If anybody has an idea how to save the png sig_img, the sig_img2, or data:signature9 or data:signature13 (in the above example, where your signature#s will probably be different when you restore the attached cf6 file) in the datable in addition to the above example that saves the png signature image in the chronoforms6/chronoforms/uploads directory, go ahead and add to this post. I have given up trying to save one or both png images directly in the datable. In CF5 I could save a BLOB image, but it does not seem to work in CF6.
************************
I have not tried yet, but we should be able to added additional signature pads in the Designer (i.e., signature14, signature 15, etc... for me) and copy and paste the sig_img2 php code to another php code. e.g., rename signature13 as signature 14 and rename sig_img2 as sig_img3 and sig_name2 as sig_name3; and for the next signature pad in the designer e.g. rename signature13 as signature 15 and rename sig_img2 as sig_img4 and sig_name2 as sig_name4. remember that all numbers have to be increased in the php code for each new signature block.
****************
The last step for me is to use this post and try to create dynamic names for sig_img and sig_img2 which are currently saved as datetime_signature.png and datetime_signature2.png at chronoforms6/chronoforms/uploads
https://www.chronoengine.com/forums/posts/t105624/store-signature-using-a-data-variable-name?keywords=signature]
fyi, note that this code to store the image from that post did not work. I think it was because $data_uri is used instead of $data_pieces
<?php$data_uri = $this->data('signature');$encoded_image = explode(",", $data_uri)[1];$decoded_image = base64_decode($encoded_image);file_put_contents("signature.png", $decoded_image)?>
here is the output of sig_img and sig_img2, both png imgaes are emailed and stored at chronoforms6/chronoforms/uploads
the datatable saves the link like this for sig_img[file=10822]datatable_save_two_signatures.jpg[/file]
if you do it right, the datatable saves the link like this for sig_img and sig_img2.
the full path of the same for the png images is <img src= .... yourwebsite/components/com_chronoforms6/chronoforms/uploads//20180805-100109_signature.png' />
and <img src= .... yourwebsite/components/com_chronoforms6/chronoforms/uploads//20180805-100109_signature2.png' />
if you do it right, the datatable saves the link like this for sig_img and sig_img2.
the full path of the same for the png images is <img src= .... yourwebsite/components/com_chronoforms6/chronoforms/uploads//20180805-100109_signature.png' />
and <img src= .... yourwebsite/components/com_chronoforms6/chronoforms/uploads//20180805-100109_signature2.png' />
This topic is locked and no more replies can be posted.
