Multiple images and previews created dynamicly.

30 views
Skip to first unread message

hosemaria

unread,
Aug 27, 2010, 6:51:20 AM8/27/10
to Jcrop Development Discussion
Hi.
I want to use your Jcrop plugin in my application. But I have a
problem with multiple images and mulitple previews.I don't know
whether it is matter of my javascript knowladge ;) or Jcrop issue.
Here it is:
I have an Object:

var my_Jcrop = {
img_id: 'img_banner',
preview_id:'img_banner_preview',
img_width:null,
img_height:null,
size:null,
getMaxDim: function ()
{
this.img_width =
jQuery('#'+this.img_id).width();
this.img_height =
jQuery('#'+this.img_id).height();
alert(this.img_width);
alert(this.img_height);
if (this.img_width>this.img_height)
this.size = this.img_height;
else
this.size = this.img_width;
return ([ 0, 0, this.size, this.size ]);
},
showPreview: function(coords)
{
// alert('nn'+nn);

console.log();
if (parseInt(coords.w) > 0)
{
var rx = 100 / coords.w;
var ry = 100 / coords.h;
console.log('prewiev'+this.preview_id);
jQuery('#'+this.preview_id).css({
width: Math.round(rx * this.img_width) + 'px',
height: Math.round(ry * this.img_height) + 'px',
marginLeft: '-' + Math.round(rx * coords.x) + 'px',
marginTop: '-' + Math.round(ry * coords.y) + 'px'
});
}
},
crop:function() {
$('#'+this.img_id).Jcrop({
onChange: this.showPreview,
onSelect: this.showPreview, .
setSelect: this.getMaxDim(), // !! necessary ()
parenthesis
// maxSize: [200,200],
// minSize: [200,200],
aspectRatio: 1
})
}
}

What I want is to have values of
this.preview_id,this.img_width,this.img_height in showPreview:
function(coords). I gues that 'this' is in wrong scope? and I cannot
access like this.
The code of my obj is similar to code of example3 from your Jcrop
demo, but there is one static id of prevwiew and image. I need to set
those values dynamicly. Could you help me?

Greetings
Michael
Reply all
Reply to author
Forward
0 new messages