Coldfusion Image Crop issue

Iv been having this issue for some time now. I'm an average coldfusion developer and I just can't seem to figure this out.

What im trying to do here is have an upload image form; followed by a check to see if the image exceeds 2000px; if it does then resize the image down to 1000px and also crop the image at the top and bottom only leaving the centre section of the image.

So basically the 2000px image would be resized to 1000px and the top and bottom of the image would be cropped by a percentage. Leaving only the centre (horizontally) of the image.

I tried coding this and it was a complete mess and riddled with errors so I'm not even going to post it.

I'm looking for a code snippet that could do all that. I'm experienced enough in coldfusion to adapt that snippet to my already in place coding.

Thanks allot.
JCDesignsAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

_agx_Commented:
(Edit)  When you say 1000px does that refer to width, height or both (ie square area)?

Cropping and resizing are different.  What do you want to happen if only one of the dimensions exceeds 1000px? For example if the image is 1500px x 900 px. Do you want to crop 500 px off the sides - OR maintain the original ratio and shrink it so that it fits within a 1000px area max
0
JCDesignsAuthor Commented:
Yes. Sorry I should've been more specific.
If the width exceeds 2000px then proceed.

But it would still do both things ideally.

Resize the image if it's over 2000px wide and then after that crop the top and bottom off by a percentage leaving a 1000px width image with only the centre of the image remaining
0
JCDesignsAuthor Commented:
If the image is under 2000px wide, then just do the cropping.

More or less I have a header section (which is rectangular at the top of this site). It only allow for a rectangular image to be displayed. As of now if a full resolution image is uploaded it pushes everything out of the way and screws up the layout. So I need the image for that area to be a certain width and hieght. So if the uploaded image is resized to 1000px (for example) and equally (%) cropped it would fit and not effect the layout.
0
Microsoft Azure 2017

Azure has a changed a lot since it was originally introduce by adding new services and features. Do you know everything you need to about Azure? This course will teach you about the Azure App Service, monitoring and application insights, DevOps, and Team Services.

_agx_Commented:
>> I have a header section (which is rectangular at the top of this site).

Makes sense, but the exact specs are still a little unclear. Just to clarify:

>> Resize the image if it's over 2000px wide
So if it's wider than 2000px, you want to resize (maintaining ratio) so it's only 2000px wide.  

>> crop the top and bottom off by a percentage leaving a 1000px width image
Once the image is no more than 2000px wide, you want to crop it to grab the center of the image.  

>> the image for that area to be a certain width and height

If the maximum width is 1000px - what is the max height?
0
JCDesignsAuthor Commented:
Let's say 550px. I can adjust that as needed once it's all setup and functioning.
0
_agx_Commented:
Something like this should work.

 One note, if images can be smaller than 1000 x 550 you may need special handling, depending on the desired result:  do nothing, enlarge, paste onto larger image, etc...

<cfscript>

// Load file into CF image object
img = ImageRead("c:\some\path\testImage.png");

// ensure it is no wider than 2000
if (img.width > 2000) 
{
    imageResize(img, 2000, "");
}

// determine if image exceeds maximum dimensions
heightOverage = img.height - 550;
widthOverage = img.width  - 1000;

// calculate offsets from center
posX = widthOverage > 0 ? widthOverage / 2 : 0;
posY = heightOverage > 0 ? heightOverage / 2 : 0;

// if image needs to be cropped
if (posX || posY) {
    ImageCrop( posX, posY, 1000, 550);
}

writeDump(" final width=#img.width# x height=#img.height#");
</cfscript>

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
JCDesignsAuthor Commented:
Thanks. I'll give that a try later.
One question though (and I probably should've mentioned this before)

I need the final image file name to be inserted into the DB after it's been adjusted. What would the final variable be for that image? Also how would I call that image (that was just uploaded) to start this procedure?

Sorry for the noobish questions. I bit off a bit more then I can chew with this project. Thanks for all your assistance.
0
_agx_Commented:
No problem.

Normally you use cffile action="upload" to upload the file somwhere.

         <cffile action="upload" fileField="form.theImageField" destination="..."  .....>

CFFile will return a structure with details about the file.  Use the variables to get the it's location on the server.
         <cfset pathToImage = cffile.serverDirectory &"\"& cffile.serverFileName>

Then read it into an image variable:

         <cfset img = ImageRead(pathToImage)>

..... and do the resizing and cropping. When you're done, save the cropped image back to disk using ImageWrite.  Assuming you want to overwrite the uploaded file, you already know the name  ie  #cffile.serverFileName#.. Just save that value to the db.
0
JCDesignsAuthor Commented:
Sounds great. Ok I'll gve that a try and report back tomorrow. Thanks again
0
_agx_Commented:
Sounds good. I'm heading out too. I'll check back tomorrow
0
JCDesignsAuthor Commented:
Sorry. Iv just been busy the last few days. I haven't got a chance to try this all out. I will in the next couple days.
0
JCDesignsAuthor Commented:
Worked like a charm.. Thanks  a lot!
0
_agx_Commented:
Welcome :) Glad it helped.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ColdFusion Language

From novice to tech pro — start learning today.