PDA

View Full Version : Setting coordinates at start of image crop



forum_amnesiac
06-18-2009, 01:25 PM
I am using the Jcrop addin as part of an image cropping page I am working on.

In the code it is possible to set the dimensions of the crop box and also its position, the position is defined by setSelect:.

When an image is uploaded it is displayed on the screen with a 250x250 crop box also displayed in the bottom left corner.

When the Crop button is clicked the checkCoords function is called then it processes the image with the id 'cropbox'.

My problem is this, at the moment the crop box needs to be moved, ie dragged, before the checkCoords function thinks an area has been selected.

Does anyone out there know how to set it so that it passes this check based on the initially set area.

I have forced it to bypass this check and found that it creates an image of 250x250 but it is just black.


$(function(){

$('#cropbox').Jcrop({
aspectRatio: 1,
setSelect: [ 0, 120, 250, 370 ],
minSize: [250,250],
maxSize: [250,250],
onSelect: updateCoords
});
});

function updateCoords(c){
$('#x').val(c.x);
$('#y').val(c.y);
$('#w').val(c.w);
$('#h').val(c.h);
};

function checkCoords(){
if (parseInt($('#w').val())) return true;
alert('Please select a crop region then press submit.');
return false;
};



<input type="submit" name="crop" value="Crop Image" onClick="checkCoords">

Jesdisciple
06-20-2009, 06:05 PM
If I were you, I would look for a Jcrop (or, as a second choice, JQuery) forum to ask this in. I don't know JQuery like I know JavaScript, and I've never heard of Jcrop.

But if you do find such a place, they will probably want to see the elements with the IDs used in the JS.