Expand my Community achievements bar.

Don’t miss the AEM Skill Exchange in SF on Nov 14—hear from industry leaders, learn best practices, and enhance your AEM strategy with practical tips.

Script to rotate image 'attached' to button

Avatar

Former Community Member
I'm very new to the business of creating interactive forms, having only just figured out how to get the script editor to appear.



But to the point, I've created a form with twenty plus pages, each page contains an 'image field' for the end user to click on which allows them to submit a series of pictures.



The form is in Portrait orientation, but some of the images will be in Landscape orientation, ('best fit' means that the image is smaller and only takes up the top half of the image space). What I am looking for is to create a 'rotate image' button on each page that allows the end user to click it and have the image rotate through 90 degrees (within the image field) if they what to, leaving the page orientation in Portrait. (The viewer will have to turn their head sideways, but at least the image will be larger and more detailed)



Currently the advice is that they 'rotate' the image first using any familiar software, and then select it for the form.



This is a 'nicety' as far as the form is concerned, but it would give it a finishing touch. Any advice/ideas?
5 Replies

Avatar

Former Community Member
You could put a button beside the image to allow for the rotation and use this command on the click event of the button:



InageField1.rotate = "90";



Note that you can only rotate the field in increments of 90 degrees.



Hope that helps.

Avatar

Level 1

Hi pguerett, please forgive my complete lack of knowledge concerning anything livecycle, but it sounds as if you may be able to help me.

I am creating an interactive PDF whereby images can be inserted using the 'image field' object and then printed out to fit templates I've created within the page. This works fine, however I would really like to include a button that would then allow the end user to either rotate or rescale the image filling the space i've provided them with. I have tried entering the code you've posted above, but, to be honest coding is really beyond my comfort zone. I get lost when javascript and formcalc are invloved.

Many thanks for any help you can provide...

Danny

Avatar

Level 3

Ah, pguerett, this is probably exactly the TYPE of thing the user is looking for. I just tested it out. However, I see two problems with it.

1) The button only works once. So if you click it to rotate and then decide you liked it the other way, if you click the button again it does nothing.

2) It doesn't resize the image. If I insert a "Landscape oriented" picture it resizes it to be proportional to the size of the portrait oriented field. Click the button to rotate it 90 degrees. It rotates the picture so that it is sideways, but it does not resize the image to now be porportional to the long-edge of the field. I hope I'm making sense.

I would definitely like to see a solution to this one, since I have a form I will be working on very soon that could benefit from having this.

Avatar

Level 3

Ah, but wait. ImageField1.rotate = "90"; rotates the FIELD itself, not the contents of the field. Right? So it wouldn't resize. In addition, it could be MESSY when you're dealing with flowed forms.

So we should see about a way of taking the CONTENTS of the imagefield and rotating those. Any ideas? I tried a simple ImageField1.rawValue.rotate = "90"; and it didn't work at all.

Avatar

Level 1

Hi GeneveveX, many thanks for your help with this. I look forward to any solution you come up with.