? im_crop_multiple.patch Index: README.txt =================================================================== RCS file: /cvs/drupal-contrib/contributions/modules/imagefield_crop/README.txt,v retrieving revision 1.1 diff -u -u -p -r1.1 README.txt --- README.txt 13 Jan 2008 20:54:34 -0000 1.1 +++ README.txt 28 Apr 2010 05:38:17 -0000 @@ -1,4 +1,4 @@ -$Id: README.txt,v 1.1 2008/01/13 20:54:34 yhager Exp $ +$Id: README.txt,v 1.1 2008-01-13 20:54:34 yhager Exp $ = Overview = imagefield_crop provides a widget for cropping an image after upload. Index: imagefield_crop.css =================================================================== RCS file: /cvs/drupal-contrib/contributions/modules/imagefield_crop/imagefield_crop.css,v retrieving revision 1.1 diff -u -u -p -r1.1 imagefield_crop.css --- imagefield_crop.css 13 Jan 2008 20:54:34 -0000 1.1 +++ imagefield_crop.css 28 Apr 2010 05:38:17 -0000 @@ -4,16 +4,16 @@ body{margin: 0;padding: 0;height: 100%;} .imagefield-crop-wrapper{height: 100%;background-color: #ccc;/*position:relative (FF bug?) */)} - #resizeMe{position: absolute;cursor: move;background-position: 0 0;background-repeat: no-repeat;border: 1px dashed black;} - #resizeSE,#resizeE,#resizeNE,#resizeN,#resizeNW,#resizeW,#resizeSW,#resizeS{position: absolute;width: 8px;height: 8px;background-color: #333;border: 1px solid #fff;overflow: hidden;} - #resizeSE{bottom: -10px;right: -10px;cursor: se-resize;} - #resizeE {top: 50%;right: -10px;margin-top: -5px;cursor: e-resize;} - #resizeNE{top: -10px;right: -10px;cursor: ne-resize;} - #resizeN {top: -10px;left: 50%;margin-left: -5px;cursor: n-resize;} - #resizeNW{top: -10px;left: -10px;cursor: nw-resize;} - #resizeW {top: 50%;left: -10px;margin-top: -5px;cursor: w-resize;} - #resizeSW{left: -10px;bottom: -10px;cursor: sw-resize;} - #resizeS{bottom: -10px;left: 50%;margin-left: -5px;cursor: s-resize;} - #image-crop-container{position: absolute;top: 50%;left: 50%;width: 320px;height: 240px;background-color: #ccc;background-repeat: no-repeat;opacity:.2;filter: alpha(opacity=20);-moz-opacity: 0.2;} + .resizeMe{position: absolute;cursor: move;background-position: 0 0;background-repeat: no-repeat;border: 1px dashed black;} + .resizeSE,.resizeE,.resizeNE,.resizeN,.resizeNW,.resizeW,.resizeSW,.resizeS{position: absolute;width: 8px;height: 8px;background-color: #333;border: 1px solid #fff;overflow: hidden;} + .resizeSE{bottom: -10px;right: -10px;cursor: se-resize;} + .resizeE {top: 50%;right: -10px;margin-top: -5px;cursor: e-resize;} + .resizeNE{top: -10px;right: -10px;cursor: ne-resize;} + .resizeN {top: -10px;left: 50%;margin-left: -5px;cursor: n-resize;} + .resizeNW{top: -10px;left: -10px;cursor: nw-resize;} + .resizeW {top: 50%;left: -10px;margin-top: -5px;cursor: w-resize;} + .resizeSW{left: -10px;bottom: -10px;cursor: sw-resize;} + .resizeS{bottom: -10px;left: 50%;margin-left: -5px;cursor: s-resize;} + .image-crop-container{position: absolute;top: 50%;left: 50%;width: 320px;height: 240px;background-color: #ccc;background-repeat: no-repeat;opacity:.2;filter: alpha(opacity=20);-moz-opacity: 0.2;} .imagefield-crop-preview{position:relative;background:url(images/img_bg.gif) repeat left top;margin:4px;border:1px solid #000;} .imagefield-crop-image-preview { border:1px solid #000 } Index: imagefield_crop.info =================================================================== RCS file: /cvs/drupal-contrib/contributions/modules/imagefield_crop/imagefield_crop.info,v retrieving revision 1.1 diff -u -u -p -r1.1 imagefield_crop.info --- imagefield_crop.info 13 Jan 2008 20:54:34 -0000 1.1 +++ imagefield_crop.info 28 Apr 2010 05:38:17 -0000 @@ -1,4 +1,4 @@ -; $Id: imagefield_crop.info,v 1.1 2008/01/13 20:54:34 yhager Exp $ +; $Id: imagefield_crop.info,v 1.1 2008-01-13 20:54:34 yhager Exp $ name= Image crop description = Add cropping ability to images using javascript dependencies = imagefield jquery_interface Index: imagefield_crop.js =================================================================== RCS file: /cvs/drupal-contrib/contributions/modules/imagefield_crop/imagefield_crop.js,v retrieving revision 1.1.2.3 diff -u -u -p -r1.1.2.3 imagefield_crop.js --- imagefield_crop.js 3 Apr 2008 13:48:28 -0000 1.1.2.3 +++ imagefield_crop.js 28 Apr 2010 05:38:17 -0000 @@ -1,127 +1,137 @@ -/* $Id: imagefield_crop.js,v 1.1.2.3 2008/04/03 13:48:28 yhager Exp $ */ -function imagefieldCropSetDimensions(x, y, w, h) { - $(".edit-image-crop-x").val(x); - $(".edit-image-crop-y").val(y); - if (w) $(".edit-image-crop-width").val(w); - if (h) $(".edit-image-crop-height").val(h); +/* $Id: imagefield_crop.js,v 1.1.2.3 2008-04-03 13:48:28 yhager Exp $ */ + +var cropIds = new Array(); + +function imagefieldCropSetDimensions(cropId, x, y, w, h) { + $('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-x").val(x); + $('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-y").val(y); + if (w) $('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-width").val(w); + if (h) $('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-height").val(h); } -function imagefieldCropInit() { - var containerpos; - var resizeT; - var dragT; - var changed = false; - if ($("#image-crop-container").size()) { - containerpos = findPos($("#image-crop-container").get(0)); - } - else { - containerpos = {x:0, y:0}; - } - - function findPos(obj) { - var curleft = obj.offsetLeft || 0; - var curtop = obj.offsetTop || 0; - while (obj = obj.parent) { - curleft += obj.offsetLeft - curtop += obj.offsetTop - } - return {x:curleft,y:curtop}; - } - - $('#resizeMe').ready(function() { - /* this is needed to set the box initially according to the form values */ - var obj = $('#resizeMe').get(0); - var newpos = { - left: parseInt($(".edit-image-crop-x").val()), - top: parseInt($(".edit-image-crop-y").val()) - } - var newsize = { - width: parseInt($(".edit-image-crop-width").val()), - height: parseInt($(".edit-image-crop-height").val()) +function imagefieldCropInit(cropId) { + var containerpos; + var resizeT; + var dragT; + var changed = false; + if ($("#image-crop-container_" + cropId).size()) { + containerpos = findPos($("#image-crop-container_" + cropId).get(0)); + } + else { + containerpos = {x:0, y:0}; + } + + function findPos(obj, cropId) { + var curleft = obj.offsetLeft || 0; + var curtop = obj.offsetTop || 0; + while (obj = obj.parent) { + curleft += obj.offsetLeft + curtop += obj.offsetTop + } + return {x:curleft,y:curtop}; + } + + $('#resizeMe_' + cropId).ready(function() { + // this is needed to set the box initially according to the form values + var obj = $('#resizeMe_' + cropId).get(0); + var newpos = { + left: parseInt($('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-x").val()), + top: parseInt($('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-y").val()) + } + var newsize = { + width: parseInt($('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-width").val()), + height: parseInt($('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-height").val()) + } + if ($('#resizeMe_' + cropId).size()) { + obj.style.backgroundPosition = (-1)*newpos.left + 'px ' + (-1)*newpos.top + 'px'; + obj.style.left = (newpos.left + containerpos.x) + 'px'; + obj.style.top = (newpos.top + containerpos.y) + 'px'; + obj.style.width = newsize.width + 'px'; + obj.style.height = newsize.height + 'px'; + } + }); + $('#resizeMe_' + cropId).Resizable( + { + minWidth: 20, + minHeight: 20, + maxWidth: 1 + $('#resizeMe_' + cropId).parents('.imagefield-crop-wrapper').width(), + maxHeight: 1 + $('#resizeMe_' + cropId).parents('.imagefield-crop-wrapper').height(), + minTop: 1, + minLeft: 1, + maxRight: $('#resizeMe_' + cropId).parents('.imagefield-crop-wrapper').width(), + maxBottom: $('#resizeMe_' + cropId).parents('.imagefield-crop-wrapper').height(), + dragHandle: true, + ratio: Drupal.imagefield_crop.ratio, + onDrag: function(x, y) + { + clearTimeout(dragT); + if (!changed) { + changed = true; + $('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-changed").val(1); } - if ($('#resizeMe').size()) { - obj.style.backgroundPosition = (-1)*newpos.left + 'px ' + (-1)*newpos.top + 'px'; - obj.style.left = (newpos.left + containerpos.x) + 'px'; - obj.style.top = (newpos.top + containerpos.y) + 'px'; - obj.style.width = newsize.width + 'px'; - obj.style.height = newsize.height + 'px'; + this.style.backgroundPosition = ((-1)*(x - containerpos.x)) + 'px ' + ((-1)*(y - containerpos.y)) + 'px'; + xx = x-containerpos.x; + yy = y-containerpos.y; + dragT = setTimeout('imagefieldCropSetDimensions ("' + cropId + '",' + xx + ',' + yy + ')', 200); + }, + handlers: { + se: '#resizeSE_' + cropId, + e: '#resizeE_' + cropId, + ne: '#resizeNE_' + cropId, + n: '#resizeN_' + cropId, + nw: '#resizeNW_' + cropId, + w: '#resizeW_' + cropId, + sw: '#resizeSW_' + cropId, + s: '#resizeS_' + cropId + }, + + onResize : function(size, position) { + clearTimeout(resizeT); + if (!changed) { + changed = true; + $('#resizeMe_' + cropId).parents('#imagefield-edit-image-row').find(".edit-image-crop-changed").val(1); } - }); + this.style.backgroundPosition = ((-1)*(position.left - containerpos.x)) + 'px ' + ((-1)*(position.top - containerpos.y)) + 'px'; + x = position.left-containerpos.x; + y = position.top-containerpos.y; + w = size.width; + h = size.height; + resizeT = setTimeout('imagefieldCropSetDimensions ("' + cropId + '", ' + x + ',' + y + ',' + w + ',' + h + ')', 200); + } - $('#resizeMe').Resizable( - { - minWidth: 20, - minHeight: 20, - maxWidth: 1 + $('#resizeMe').parents('.imagefield-crop-wrapper').width(), - maxHeight: 1 + $('#resizeMe').parents('.imagefield-crop-wrapper').height(), - minTop: 1, - minLeft: 1, - maxRight: $('#resizeMe').parents('.imagefield-crop-wrapper').width(), - maxBottom: $('#resizeMe').parents('.imagefield-crop-wrapper').height(), - dragHandle: true, - ratio: Drupal.imagefield_crop.ratio, - onDrag: function(x, y) - { - clearTimeout(dragT); - if (!changed) { - changed = true; - $(".edit-image-crop-changed").val(1); - } - this.style.backgroundPosition = ((-1)*(x - containerpos.x)) + 'px ' + ((-1)*(y - containerpos.y)) + 'px'; - xx = x-containerpos.x; - yy = y-containerpos.y; - dragT = setTimeout('imagefieldCropSetDimensions (xx, yy)', 200); - }, - handlers: { - se: '#resizeSE', - e: '#resizeE', - ne: '#resizeNE', - n: '#resizeN', - nw: '#resizeNW', - w: '#resizeW', - sw: '#resizeSW', - s: '#resizeS' - }, - onResize : function(size, position) { - clearTimeout(resizeT); - if (!changed) { - changed = true; - $(".edit-image-crop-changed").val(1); - } - this.style.backgroundPosition = ((-1)*(position.left - containerpos.x)) + 'px ' + ((-1)*(position.top - containerpos.y)) + 'px'; - x = position.left-containerpos.x; - y = position.top-containerpos.y; - w = size.width; - h = size.height; - resizeT = setTimeout('imagefieldCropSetDimensions (x, y, w, h)', 200); - } - } - ); + } + ); } var imageFieldCropInterval; -function imageFieldCropGo() { - if ($("#image-crop-container").is(':visible')) { - clearInterval(imageFieldCropInterval); - imagefieldCropInit(); - } +function imageFieldCropGo(cropId) { + if ($("#image-crop-container_" + cropId).is(':visible')) { + clearInterval(imageFieldCropInterval); + imagefieldCropInit(cropId); + } } -function imageFieldCropBind() { - $('fieldset.collapsible > legend a').click(function(event) { - var $target = $(event.target); - if ($target.parents('fieldset').find('#image-crop-container').length > 0) { - imageFieldCropInterval = setInterval('imageFieldCropGo()', 300); - } - }); +function imageFieldCropBind(cropId) { + $('fieldset.collapsible > legend a').click(function(event) { + var $target = $(event.target); + if ($target.parents('fieldset').find('#image-crop-container_' + cropId).length > 0) { + imageFieldCropInterval = setInterval('imageFieldCropGo("' + cropId + '")', 300); + } + }); } $(document).ready(function(){ - imageFieldCropGo(); - // We have to bind using a timeout, since the object is created after page load - // Do we need setInterval here instead? - setTimeout('imageFieldCropBind()', 200); + divs = document.getElementsByTagName("div"); + if (divs) { + for (var i = 0; i < divs.length; i++) { + if (divs[i].id.indexOf("image-crop-container") > -1) { + cropId = divs[i].id.substr(21); + cropIds[cropIds.length] = cropId; + imageFieldCropGo(cropId); + // We have to bind using a timeout, since the object is created after page load + // Do we need setInterval here instead? + setTimeout('imageFieldCropBind("' + cropId + '")', 200); + } + } + } }); - - - Index: imagefield_crop.module =================================================================== RCS file: /cvs/drupal-contrib/contributions/modules/imagefield_crop/imagefield_crop.module,v retrieving revision 1.1.2.13 diff -u -u -p -r1.1.2.13 imagefield_crop.module --- imagefield_crop.module 21 Nov 2009 08:48:28 -0000 1.1.2.13 +++ imagefield_crop.module 28 Apr 2010 05:38:17 -0000 @@ -1,5 +1,5 @@ array('weight' => 8, 'default' => $h ? $h : 50), 'changed' => array('weight' => 0, 'default' => 0), ); - + +// ### // drupal_set_message('node_field is 
'. print_r($node_field, TRUE)  .'
'); +// ### + foreach ($node_field as $delta => $file) { if ($file['filepath'] && !$file['flags']['delete']) { $form[$fieldname][$delta] = array( @@ -469,7 +472,9 @@ function _imagefield_crop_widget_form($n ); -// drupal_set_message('imagefield['. $fieldname .'] '. $op .' node field: 
'. print_r($node_field, true) .'
'); +// ### +// drupal_set_message('imagefield['. $fieldname .'] '. $op .' node field: 
'. print_r($node_field, true) .'
'); +// ### $form[$fieldname][$delta]['description'] = array( '#type' => 'markup', @@ -661,6 +666,7 @@ function _imagefield_crop_scale_image($f return $file; } + function theme_imagefield_crop_edit_crop_image_row($element) { list($cropw, $croph) = explode('x', $element['#croparea']); @@ -668,7 +674,8 @@ function theme_imagefield_crop_edit_crop $output .= '
'; $output .= drupal_render($element['preview']) .'
'; if ($element['crop']) { - $output .= '
'; + + $output .= '
'; // REFACTOR: Don't 'flags' only if multiple is unsupported $output .= '
'. drupal_render($element['flags']) .'
'; @@ -680,7 +687,7 @@ function theme_imagefield_crop_edit_crop $output .= drupal_render($element['title']); $output .= '
'; } - $output = '
'. $output .'
'; + $output = '
'. $output .'
'; if (isset($element['replace'])) { $output .= '
'. drupal_render($element['replace']) .'
'; } @@ -690,6 +697,11 @@ function theme_imagefield_crop_edit_crop function theme_imagefield_crop_crop_image($file = NULL, $alt = '', $title = '', $attributes = NULL, $getsize = TRUE) { $output = '
'; +// ### +// drupal_set_message('theme_imagefield_crop_crop_image $file: 
'. print_r($file, true) .'
'); +// ### + + if (!empty($file)) { $file = (array)$file; if (!$getsize || (is_file($file['filepath']) && (list($width, $height, $type, $image_attributes) = @getimagesize($file['filepath'])))) { @@ -699,23 +711,22 @@ function theme_imagefield_crop_crop_imag $title = empty($title) ? $file['title'] : $title; $url = $file['fid'] == 'upload' ? url($file['preview']) : file_create_url($file['filepath']); + $cropId = $file['fid'].'_'.str_replace("/", "", str_replace(".", "", $file['preview'])); $output .= ' -
-
-
-
-
-
-
-
-
-
- +
+
+
+
+
+
+
+
+
'; } }