Hey, first off: AMAZING module! Just a quick comment though, I personally use it to crop a node's representative image to specific resolution so that it will conform to a carousel. the problem is that the final dimensions happen to cause the dynamic preview to break the theme because the region that the node edit form resides in is too small.

So my request is: Is there any way to set max dimensions for the dynamic preview, instead of just having it adopt the dimensions of the cropped image? Or even if there was an option to disable the dynamic preview (even though that sucks, cause it's nifty :)

Thanks again for the great module!

CommentFileSizeAuthor
#8 Untitled.png733.38 KBdjbucci
#2 imagefield_crop_444422-1.patch3.85 KBskilip
Support from Acquia helps fund testing for Drupal Acquia logo

Comments

patcon’s picture

OK, anyhow, might have a solution. Didn't realize it was so easy to theme, so sorry for the bother!

Here's what I have, but I don't have access to my server now, so it's not tested yet:

Original theme:

function theme_imagefield_crop_dynamic_preview($file, $resolution) {
  $file = (array)$file;
  if (!is_file($file['filepath'])) {
    return '<!-- file not found: '. $file['filepath'] .' -->';
  }
  list($width, $height) = explode('x', $resolution);
  
  $image_attributes = array();
  if (list($orig_width, $orig_height, $type, $image_attributes) = @getimagesize($file['filepath'])) {
    $alt = $file['alt'] ? $alt : 'jcrop preview';
    $title = $file['title'] ? $title : '';
    $url = file_create_url($file['filepath']);
    $settings = array(
      'orig_width' => $orig_width,
      'orig_height' => $orig_height,
      'width' => (integer)$width,
      'height' => (integer)$height,
    );
    // REFACTOR: Support multiple fields (i.e. add element delta to setting array)
    $output = '';
    $output .= '<script type="text/javascript">Drupal.settings.imagefield_crop.preview = '. drupal_to_js($settings) .'</script>';
    $output .= '<div class="jcrop-preview-wrapper" style="width:'. $width .'px;height:'. $height .'px;overflow:hidden;"><img src="'. check_url($url) .'" alt="'.
      check_plain($alt) .'" title="'. check_plain($title) .'" class="jcrop-preview" /></div>';
    return $output;
  }
  return '<!-- could not get imagesize, possibly corrupt or non image. '. $file['filepath'] .' -->';

  
}

Substituted with new theme function in my template.php file:

function phptemplate_imagefield_crop_dynamic_preview($file, $resolution) {
  $file = (array)$file;
  if (!is_file($file['filepath'])) {
    return '<!-- file not found: '. $file['filepath'] .' -->';
  }
  list($width, $height) = explode('x', $resolution);
  
  $image_attributes = array();
  if (list($orig_width, $orig_height, $type, $image_attributes) = @getimagesize($file['filepath'])) {
    $alt = $file['alt'] ? $alt : 'jcrop preview';
    $title = $file['title'] ? $title : '';
    $url = file_create_url($file['filepath']);
	// if image width is larger than max_width, dynamic preview is made smaller to fit
	$max_width = 600;
	if ($orig_width > $max_width) {
	$preview_height = round($max_width * $orig_height / $orig_width);
	$preview_width = $max_width;
	}
    $settings = array(
      'orig_width' => $preview_width,
      'orig_height' => $preview_height,
      'width' => (integer)$width,
      'height' => (integer)$height,
    );
    // REFACTOR: Support multiple fields (i.e. add element delta to setting array)
    $output = '';
    $output .= '<script type="text/javascript">Drupal.settings.imagefield_crop.preview = '. drupal_to_js($settings) .'</script>';
    $output .= '<div class="jcrop-preview-wrapper" style="width:'. $width .'px;height:'. $height .'px;overflow:hidden;"><img src="'. check_url($url) .'" alt="'.
      check_plain($alt) .'" title="'. check_plain($title) .'" class="jcrop-preview" /></div>';
    return $output;
  }
  return '<!-- could not get imagesize, possibly corrupt or non image. '. $file['filepath'] .' -->';

  
}
skilip’s picture

Version: 6.x-1.0-beta3 » 6.x-1.x-dev
Status: Active » Needs review
FileSize
3.85 KB

Hi, I took a slightly different approach and made the width configurable in the widget settings form.

Note that the patch is against 6.x-1.x-dev!

tribsel’s picture

just tested and it looks like this patch works.
btw - is it possible to take live preview "outside" of document and display it closer to crop area or mouse cursor?

YK85’s picture

Hello,

I would like to learn more about this feature.

At the moment

1) user chooses an image to upload
2) the image is resized depending on imagefield settings
3) the image is cropped

Does this feature make it possible to crop the ORIGINAL image, then resize to what the imagefield max image dimensions are?
This will help maximum highest quality after the cropped image, where as if the image is resized, then cropped, it the quality will be degraded.

Thank you

TNmoxa’s picture

I have the same question as YK85. I need pictures of good quality, so I don't want to resize them. But after uploading big photos, they are shown too large so it's inconvenient to crop them. Is there any way to control the size of picture while cropping it without resizing them? It would be very useful. Thank you!

yhager’s picture

@YK85, @TNmoxa: although the image is resized for the display, the original image is cropped, not the resized one. This is to ensure best quality for cropped images.

tom_b’s picture

Version: 6.x-1.x-dev » 7.x-1.x-dev

is there any info about this problem concerning the 7.x version of imagefield crop?
is the patch / function mentioned above transferable to the 7.x version?

djbucci’s picture

Priority: Normal » Major
FileSize
733.38 KB

I know this is old, but *bump* this topic none the less.

I'm having similar issues and would like to know if there's a work around in Drupal 7.x (imagefield_crop version 1.0). When trying to use imagefield_crop for a content type I add/edit in the main content area of my site, it overflows like crazy (see attached screenshot).

In the administrative overlay, it overflows but then corrects itself shortly thereafter.

UPDATE: Just noticed that in the content display, no matter what resolution the image is cropped to it is scaled back to it's original resolution.

For instance. If I upload an image that is 1439x689 and crop it to a box that is 320x240 pixels, the image when viewed anywhere outside of the content-preview window (before publishing) is of resolution 320x240, but is scaled up to the width of the original image size (1439/320 = 4.5 --> 5*(320x240) = 1439x1080).

djbucci’s picture

Version: 7.x-1.x-dev » 7.x-1.0

Apologies. Changed priority by accident. Just changed it back.

Zahak’s picture

Priority: Major » Normal

Need this feature as well. Follow..

EDIT: Hmm.. on the other hand... Just got an idea. Actually in my case it is not necessary to actually see the preview. It's mostly only important to see what area to select. Testing a bit while setting .imagefield-crop-preview { display:none; }

May not be the perfect solution, but still works a lot better than with a huge preview covering the entire browser...

EDIT2: Also seems to require a .jcrop-holder > img { top: 0; left: 0; }
(Especially left:0...)

mermemladeK’s picture

I'm looking for for this feature too. Any news?

joetsuihk’s picture

Version: 7.x-1.0 » 7.x-1.x-dev
Status: Needs review » Needs work

#2 is working although the patch itself cannot apply
I just committed #2 to 6.x-1.x-dev http://drupalcode.org/project/imagefield_crop.git/commit/b64fca5
and this is becoming a 7.x-1.x-dev feature request