diff --git a/wire/core/ImageSizerEngine.php b/wire/core/ImageSizerEngine.php
index 9d593e25..e38d8445 100755
--- a/wire/core/ImageSizerEngine.php
+++ b/wire/core/ImageSizerEngine.php
@@ -1704,27 +1704,29 @@ abstract class ImageSizerEngine extends WireData implements Module, Configurable
 	 * @param string $focus (focus point in percent, like: 54.7%)
 	 * @param int $sourceDimension (source image width or height)
 	 * @param int $cropDimension (target crop-image width or height)
+	 * @param int $zoom
 	 *
 	 * @return int $position (crop position x or y in pixel)
 	 *
 	 */
-	protected function getFocusZoomPosition($focus, $sourceDimension, $cropDimension) {
+	protected function getFocusZoomPosition($focus, $sourceDimension, $cropDimension, $zoom) {
 		$focus = intval($focus); // string with float value and percent char, (needs to be converted to integer)
-		$source = 100; // the source-dimensions percent-value (100)
-		$target = ($cropDimension / $sourceDimension * 100); // the crop-dimensions percent-value
-		$rest = $source - $target; // the unused dimension-part-value in percent
-		$tmp = $focus + ($target / 2); // temp value
+		$scale = 1 + (($zoom / 100) * 2);
+		$focusPX = ($sourceDimension / 100 * $focus);
+		$posMinPX = $cropDimension / 2 / $scale;
+		$posMaxPX = $sourceDimension - ($cropDimension / 2);
 
 		// calculate the position in pixel !
-		if($tmp >= 100) {
-			$position = $sourceDimension - $cropDimension;
-		} else if($tmp <= floor($rest / 2)) {
-			$position = 0;
+		if($focusPX >= $posMaxPX) {
+			$posPX = $sourceDimension - $cropDimension;
+		} else if($focusPX <= $posMinPX) {
+			$posPX = 0;
 		} else {
-			$position = ceil(($sourceDimension - $cropDimension) / 100 * $focus);
+			$posPX = $focusPX - ($cropDimension / 2);
+			if(0 > $posPX) $posPX = 0;
 		}
 
-		return $position;
+		return $posPX;
 	}
 
 	/**
@@ -1752,7 +1754,6 @@ abstract class ImageSizerEngine extends WireData implements Module, Configurable
 		if($percentW >= $percentH) { // check wich one is greater
 			$maxW = $fullWidth; // if percentW is greater, maxW becomes the original Width
 			$maxH = $fullWidth / $ratioFinal; // ... and maxH gets calculated via the ratio
-
 		} else {
 			$maxH = $fullHeight; // if percentH is greater, maxH becomes the original Height
 			$maxW = $fullHeight * $ratioFinal; // ... and maxW gets calculated via the ratio
@@ -1775,12 +1776,12 @@ abstract class ImageSizerEngine extends WireData implements Module, Configurable
 		}
 
 		// calculate the crop positions
-		$tmpX = $this->getFocusZoomPosition($this->cropping[0], $fullWidth, $cropW); // calculate the x-position
-		$tmpY = $this->getFocusZoomPosition($this->cropping[1], $fullHeight, $cropH); // calculate the y-position
+		$posX = $this->getFocusZoomPosition($this->cropping[0], $fullWidth, $cropW, $zoom); // calculate the x-position
+		$posY = $this->getFocusZoomPosition($this->cropping[1], $fullHeight, $cropH, $zoom); // calculate the y-position
 
 		return array(
-			0 => (int) $tmpX,
-			1 => (int) $tmpY,
+			0 => (int) $posX,
+			1 => (int) $posY,
 			2 => (int) $cropW,
 			3 => (int) $cropH
 		);
diff --git a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.css b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.css
index fc1743a8..073e4bd0 100755
--- a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.css
+++ b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.css
@@ -378,9 +378,13 @@
     cursor: move;
     width: 40px;
     height: 40px;
-    border: 3px solid #fff;
+    margin: -20px !important;
+    border: 3px solid #EB1D61;
     border-radius: 50%;
-    background-color: rgba(255, 255, 255, 0.3); }
+    background-color: rgba(255, 255, 255, 0.6);
+    background-image: url(data:image/gif;base64,R0lGODlhBAAEAIAAAOsdYQAAACH5BAAAAAAALAAAAAAEAAQAAAIEhI8JBQA7);
+    background-position: 15px 15px;
+    background-repeat: no-repeat; }
 
 .InputfieldImage .ImageData {
   display: none; }
diff --git a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.js b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.js
index 97bec46a..f6e7b885 100755
--- a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.js
+++ b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.js
@@ -30,6 +30,9 @@ function InputfieldImage($) {
 	// grid items to retry for sizing by setGridSize() methods	
 	var retryGridItems = [];
 
+	// true when the grid is being resized with the slider
+	var gridSliding = false;
+
 	/**
 	 * Whether or not AJAX drag/drop upload is allowed?
 	 * 
@@ -390,19 +393,25 @@ function InputfieldImage($) {
 	
 		// get the focus object, optionally for a specific focusStr
 		function getFocus(focusStr) {
+			
 			if(typeof focusStr == "undefined") {
 				if(focusData !== null) return focusData;
 				var $input = $edit.find('.InputfieldImageFocus');
 				var focusStr = $input.val();
 			}
+			
 			var a = focusStr.split(' ');
-			var data = {
-				'top': (typeof a[0] == "undefined" ? 50.0 : parseFloat(a[0])),
-				'left': (typeof a[1] == "undefined" ? 50.0 : parseFloat(a[1])),
-				'zoom': (typeof a[2] == "undefined" ? 0 : parseInt(a[2]))
+			var top =  (typeof a[0] == "undefined" ? 50.0 : parseFloat(a[0]));
+			var left = (typeof a[1] == "undefined" ? 50.0 : parseFloat(a[1]));
+			var zoom = (typeof a[2] == "undefined" ? 0 : parseInt(a[2]));
+			
+			focusData = {
+				'top': top > 100 ? 100 : top, 
+				'left': left > 100 ? 100 : left, 
+				'zoom': zoom > 100 ? 0 : zoom
 			};
-			focusData = data;
-			return data;
+			
+			return focusData;
 		}
 	
 		// get focus string
@@ -441,10 +450,14 @@ function InputfieldImage($) {
 			var $overlay = $focusCircle.parent();
 			var w = $overlay.width();
 			var h = $overlay.height();
-			var x = Math.round(((focus.left / 100) * w) - ($focusCircle.width() / 2)); // 1.7
-			var y = Math.round(((focus.top / 100) * h) - ($focusCircle.height() / 2)); // 2.3
+			var x = Math.round((focus.left / 100) * w);
+			var y = Math.round((focus.top / 100) * h);
+
 			if(x < 0) x = 0;
 			if(y < 0) y = 0;
+			if(x > w) x = w; // horst: just to be on the safe side with following or actual code changes
+			if(y > h) y = h; 
+			
 			$focusCircle.css({
 				'top': y + 'px',
 				'left': x + 'px'
@@ -459,7 +472,8 @@ function InputfieldImage($) {
 		}
 		$focusArea.css({
 			'height': $img.height() + 'px',
-			'width': $img.width() + 'px'
+			'width': $img.width() + 'px',
+			'background-color': 'rgba(0,0,0,0.7)'
 		}).addClass('focusActive');
 
 		// set the draggable circle for focus
@@ -477,15 +491,16 @@ function InputfieldImage($) {
 	
 		// function called whenever the slider is moved or circle is dragged with zoom active
 		var zoomSlide = function(zoomPercent) {
-			
-			var zoomBoxSize, focusCircleSize, focus, top, left, scale, faWidth, faHeight;
-		
+
+			//var zoomBoxSize, focusCircleSize, focus, top, left, scale, faWidth, faHeight;
+			var zoomBoxSize, focus, faWidth, faHeight;
+
 			// if no zoomPercent argument provided, use the last one
 			if(typeof zoomPercent == "undefined") zoomPercent = lastZoomPercent;
 			lastZoomPercent = zoomPercent;
 			faWidth = $focusArea.width();
 			faHeight = $focusArea.height();
-		
+
 			if(faWidth > faHeight) {
 				$zoomBox.height((100 - zoomPercent) + '%'); // set width in percent
 				zoomBoxSize = $zoomBox.height(); // get width in pixels
@@ -498,19 +513,21 @@ function InputfieldImage($) {
 
 			// apply the zoom box position
 			focus = getFocus();
-			var crop = getFocusZoomCropDimensions(focus.left, focus.top, zoomPercent, faWidth, faHeight, zoomBoxSize, zoomBoxSize);
-			$zoomBox.css({ 
-				top: crop.top + 'px', 
-				left: crop.left + 'px',
+			var crop = getFocusZoomCropDimensions(focus.left, focus.top, zoomPercent, faWidth, faHeight, zoomBoxSize);
+			$zoomBox.css({
+				'top': crop.top + 'px',
+				'left': crop.left + 'px',
+				'background-position': '-' + crop.left + 'px -' + crop.top + 'px',
+				'background-size': faWidth + 'px ' + faHeight + 'px'
 			});
 
 			// save zoom percent
-			focus.zoom = crop.zoom; // crop.zoom may have been adjusted to prevent upscaling
-			setFocusProperty('zoom', crop.zoom);
-			
+			focus.zoom = zoomPercent;
+			setFocusProperty('zoom', focus.zoom);
+
 			// update the preview if in gride mode
 			if(mode == 'grid') setGridSizeItem($thumb.parent(), gridSize, false, focus);
-			
+
 		}; // zoomSlide
 	
 		// function called when the focus item is dragged
@@ -519,11 +536,13 @@ function InputfieldImage($) {
 			var circleSize = $this.outerHeight();
 			var w = $this.parent().width();
 			var h = $this.parent().height();
-			var t = ui.position.top > 0 ? ui.position.top + (circleSize / 2) : 0;
-			var l = ui.position.left > 0 ? ui.position.left + (circleSize / 2) : 0;
+			var top = ui.position.top > 0 ? ui.position.top : 0;
+			var left = ui.position.left > 0 ? ui.position.left : 0;
+			top = top > 0 ? ((top / h) * 100) : 0;
+			left = left > 0 ? ((left / w) * 100) : 0;
 			var newFocus = {
-				'top': t > 0 ? ((t / h) * 100) : 0,
-				'left': l > 0 ? ((l / w) * 100) : 0,
+				'top': top,
+				'left': left,
 				'zoom': getFocusProperty('zoom')
 			};
 			setFocus(newFocus);
@@ -547,11 +566,13 @@ function InputfieldImage($) {
 			$zoomSlider = $("<div />").addClass('focusZoomSlider').css({
 				'margin-top': '5px'
 			});
+
 			$zoomBox = $("<div />").addClass('focusZoomBox').css({
 				'position': 'absolute',
-				'background': 'rgba(0,0,0,0.5)'
-				//'box-shadow': '0 0 20px rgba(0,0,0,.9)'
+				'background': 'transparent',
+				'background-image': 'url(' + $img.attr('src') + ')'
 			});
+			
 			$focusArea.prepend($zoomBox);
 			$img.after($zoomSlider);
 			$thumb.attr('src', $img.attr('src'));
@@ -590,91 +611,125 @@ function InputfieldImage($) {
 	}
 
 	/**
-	 * Get focus zoom position for either X or Y (duplicated from Horst’s PHP version in ImageSizerEngine)
+	 * Get focus zoom position for either X or Y 
 	 * 
-	 * @param focus Left or Top percentage
+	 * A variation from Horst's PHP version in ImageSizerEngine, here simplified for square preview areas.
+	 *
+	 * @param focusPercent Left or Top percentage
 	 * @param sourceDimension Width or Height of source image
 	 * @param cropDimension Width or Height of cropped image
 	 * @returns {number}
-	 * 
+	 *
 	 */
-	function getFocusZoomPosition(focus, sourceDimension, cropDimension) {
-		focus = parseInt(focus); // string with float value and percent char, (needs to be converted to integer)
-		var source = 100; // the source-dimensions percent-value (100)
-		var target = (cropDimension / sourceDimension * 100); // the crop-dimensions percent-value
-		var rest = source - target; // the unused dimension-part-value in percent
-		var tmp = focus + (target / 2); // temp value
-		var position = 0;
-		
-		// calculate the position in pixel !
-		if(tmp >= 100) {
-			position = sourceDimension - cropDimension;
-		} else if(tmp <= Math.floor(rest / 2)) {
-			position = 0;
-		} else {
-			position = Math.ceil((sourceDimension - cropDimension) / 100 * focus);
-		}
+	function getFocusZoomPosition(focusPercent, sourceDimension, cropDimension) {
+		var focusPX = parseInt(sourceDimension * focusPercent / 100);
+		var position = parseInt(focusPX - (cropDimension / 2));
+		var maxPosition = parseInt(sourceDimension - cropDimension);
+
+		if(0 > position) position = 0;
+		if(maxPosition < position) position = maxPosition;
 
 		return position;
 	}
 
 	/**
-	 * Get focus zoom crop dimensions (duplicated from Horst’s PHP version in ImageSizerEngine)
-	 * 
-	 * @param left Left percent
-	 * @param top Top percent
-	 * @param zoom Zoom percent
-	 * @param fullWidth Width of full size image
-	 * @param fullHeight Height of full size image
-	 * @param finalWidth Width of target cropped image
-	 * @param finalHeight Height of target cropped image
+	 * Get focus zoom crop dimensions (a variation from Horst's PHP version in ImageSizerEngine, here simplified for square preview areas)
+	 *
+	 * @param focusLeft Left percent
+	 * @param focusTop Top percent
+	 * @param zoomPercent Zoom percent
+	 * @param faWidth Width of the thumbnail image
+	 * @param faHeight Height of the thumbnail image
+	 * @param zoomBoxSize Width and Height of the ZoomArea
 	 * @returns {{left: number, top: number, width: number, height: number}}
-	 * 
+	 *
 	 */
-	function getFocusZoomCropDimensions(left, top, zoom, fullWidth, fullHeight, finalWidth, finalHeight) {
-		// calculate the max crop dimensions
-		var ratioFinal = finalWidth / finalHeight; // get the ratio of the requested crop
-		var percentW = finalWidth / fullWidth * 100; // calculate percentage of the crop width in regard of the original width
-		var percentH = finalHeight / fullHeight * 100; // calculate percentage of the crop height in regard of the original height
-		
-		if(percentW >= percentH) { // check wich one is greater
-			var maxW = fullWidth; // if percentW is greater, maxW becomes the original Width
-			var maxH = fullWidth / ratioFinal; // ... and maxH gets calculated via the ratio
-		} else {
-			var maxH = fullHeight; // if percentH is greater, maxH becomes the original Height
-			var maxW = fullHeight * ratioFinal; // ... and maxW gets calculated via the ratio
-		}
+	function getFocusZoomCropDimensions(focusLeft, focusTop, zoomPercent, faWidth, faHeight, zoomBoxSize) {
+
+		// calculate the max crop dimensions in percent
+		var percentW = zoomBoxSize / faWidth * 100; // calculate percentage of the crop width in regard of the original width
+		var percentH = zoomBoxSize / faHeight * 100; // calculate percentage of the crop height in regard of the original height
+
+		// use the smaller crop dimension
+		var maxDimension = percentW >= percentH ? faWidth : faHeight;
 
 		// calculate the zoomed dimensions
-		var cropW = maxW - (maxW * zoom / 100); // to get the final crop Width and Height, the amount for zoom-in
-		var cropH = maxH - (maxH * zoom / 100); // needs to get stripped out
-
-		// validate against the minimal dimensions
-		var upscaling = true; 
-		if(!upscaling) { // if upscaling isn't allowed, we decrease the zoom, so that we get a crop with the min-Dimensions
-			if(cropW < finalWidth) {
-				cropW = finalWidth;
-				cropH = finalWidth / ratioFinal;
-			}
-			if(cropH < finalHeight) {
-				cropH = finalHeight;
-				cropW = finalHeight * ratioFinal;
-			}
-		}
+		var cropDimension = maxDimension - (maxDimension * zoomPercent / 100); // to get the final crop Width and Height, the amount for zoom-in needs to get stripped out
 
 		// calculate the crop positions
-		var tmpX = getFocusZoomPosition(left, fullWidth, cropW); // calculate the x-position
-		var tmpY = getFocusZoomPosition(top, fullHeight, cropH); // calculate the y-position
-		
+		var posLeft = getFocusZoomPosition(focusLeft, faWidth, cropDimension); // calculate the x-position
+		var posTop = getFocusZoomPosition(focusTop, faHeight, cropDimension); // calculate the y-position
+		// var percentLeft = posLeft / faWidth * 100;
+		// var percentTop = posTop / faHeight * 100;
+
 		return {
-			'left': tmpX, 
-			'top': tmpY, 
-			'width': cropW, 
-			'height': cropH,
-			'zoom': zoom // adjusted zoom
+			'left': posLeft,
+			'top': posTop,
+			'width': cropDimension,
+			'height': cropDimension
 		};
 	}
-	
+
+	/**
+	 * Get focus zoom position for either X or Y, intended for use with getFocusZoomCropDimensions4GridviewSquare()
+	 * 
+	 * via Horst
+	 *
+	 * @param focusPercent Left or Top percentage
+	 * @param sourceDimPX Width or Height from the full image
+	 * @param gridViewPX Width and Height from the square GridView-Thumbnail
+	 * @param zoomPercent Zoom percent
+	 * @param scale
+	 * @param smallestSidePX the smallest Dimension from the full image
+	 * @returns {number}
+	 *
+	 */
+	function getFocusZoomPosition4GridviewSquare(focusPercent, sourceDimPX, gridViewPX, zoomPercent, scale, smallestSidePX) {
+		var sourceDimPX = sourceDimPX * scale;                 // is used to later get the position in pixel
+		var gridViewPercent = gridViewPX / sourceDimPX * 100;  // get percent of the gridViewBox in regard to the current image side size (width|height)
+		var adjustPercent = gridViewPercent / 2;               // is used to calculate position from the circle center point to [left|top] percent
+		var posPercent = focusPercent - adjustPercent;         // get adjusted position in percent
+
+		var posMinVal = 0;
+		var posMaxVal = 100 - gridViewPercent;
+		if(posPercent <= posMinVal) posPercent = 0;
+		if(posPercent >= posMaxVal) posPercent = posMaxVal;
+
+		var posPX = sourceDimPX / 100 * posPercent / scale;
+		posPX = -1 * parseInt(posPX);
+
+		//console.log(['gridView1:', 'sourceDimPX='+sourceDimPX, 'gridViewPX='+gridViewPX, 'gridViewPercent='+gridViewPercent, 'adjustPercent='+adjustPercent, 'minVal='+posMinVal, 'maxVal='+posMaxVal, 'posPercent='+posPercent, 'posPX='+posPX]);
+		return posPX;
+	}
+
+	/**
+	 * Get focus zoom clip rect for the square GridView-Thumbnails
+	 * 
+	 * via Horst
+	 *
+	 * @param focusLeft Left percent
+	 * @param focusTop Top percent
+	 * @param zoomPercent Zoom percent
+	 * @param w Width of the thumbnail image
+	 * @param h Height of the thumbnail image
+	 * @param gridViewSize Dimension of the GridView-Thumbnail
+	 * @param scale
+	 * @returns {{transformLeft: number, transformTop: number, scale: number}}
+	 *
+	 */
+	function getFocusZoomCropDimensions4GridviewSquare(focusLeft, focusTop, zoomPercent, w, h, gridViewSize, scale) {
+		var smallestSidePX = w >= h ? h : w;
+		var posLeft = getFocusZoomPosition4GridviewSquare(focusLeft, w, gridViewSize, zoomPercent, scale, smallestSidePX);
+		var posTop = getFocusZoomPosition4GridviewSquare(focusTop, h, gridViewSize, zoomPercent, scale, smallestSidePX);
+		var transformLeft = parseInt(posLeft);
+		var transformTop  = parseInt(posTop);
+		return {
+			'transformLeft': transformLeft,
+			'transformTop': transformTop,
+			'scale': scale
+		};
+	}
+
 	/**
 	 * Tear down the InputfieldImageEdit panel
 	 *
@@ -1113,33 +1168,36 @@ function InputfieldImage($) {
 				'transform': 'translate3d(-50%, -50%, 0)'
 			});
 			
-		} else if(zoom > 0 && $item.closest('.InputfieldImageFocusZoom').length) { 
-			// focus with zoom 
+		} else if(zoom > 0 && $item.closest('.InputfieldImageFocusZoom').length && !gridSliding) { 
+			// focus with zoom
 			if(w >= h) {
 				var maxHeight = '100%';
 				var maxWidth = 'none';
+				if(w == dataW) {
+					// scale full dimensions proportionally to gridSize
+					h = gridSize;	
+					w = (h / dataH) * dataW
+				}
 			} else {
 				var maxHeight = 'none';
 				var maxWidth = '100%';
+				if(h == dataH) {
+					// scale full dimensions proportionally to gridSize
+					w = gridSize;
+					h = (w / dataW) * dataH;
+				}
 			}
+		
 			var scale = 1 + ((zoom / 100) * 2);
-			var top = focus.top;
-			var left = focus.left;
-			if(top > 92 || top > 100) top = 100;
-			if(left > 92 || left > 100) left = 100;
-			if(top < 0) top = 0;
-			if(left < 0) left = 0;
-			var crop = getFocusZoomCropDimensions(left, top, zoom, w, h, gridSize, gridSize);
-			
+			var crop = getFocusZoomCropDimensions4GridviewSquare(focus.left, focus.top, zoom, w, h, gridSize, scale);
 			$img.css({
-				'top': top + '%',
-				'left': left + '%',
-				'transform-origin': 'top left',
-				'transform': 'scale(' + scale + ') translate3d(-' + left + '%, -' + top + '%, 0)',
+				'left': '0px',
+				'top': '0px',
+				'transform-origin': '0px 0px',
+				'transform': 'scale(' + crop.scale + ') translate3d(' + crop.transformLeft + 'px, ' + crop.transformTop + 'px, 0)',
 				'max-width': maxWidth,
 				'max-height': maxHeight
 			});
-			// console.log("top=" + top + "%, left=" + left + "%, zoom=" + zoom + ", scale=" + scale);
 
 		} else if(w >= h) {
 			// image width greater than height
@@ -1310,33 +1368,37 @@ function InputfieldImage($) {
 	
 		$header.append($slider);
 		
+		var sizeSlide = function(event, ui) {
+			var value = ui.value;
+			var minPct = 15;
+			var divisor = Math.floor(gridSize / minPct);
+			var v = value - min;
+			var listSize = Math.floor(minPct + (v / divisor));
+
+			if($inputfield.hasClass('InputfieldImageEditAll')) {
+				setCookieData($inputfield, 'size', value);
+				setListSize($inputfield, listSize);
+			} else {
+				setCookieData($inputfield, 'listSize', listSize);
+				setGridSize($inputfield, value);
+			}
+		};
+		
 		$slider.slider({
 			'min': min,
 			'max': max, 
 			'value': getCookieData($inputfield, 'size'),
 			'range': 'min',
-			'slide': function(event, ui) {
-				
-				var value = ui.value;
-				var minPct = 15;
-				var divisor = Math.floor(gridSize / minPct);
-				var v = value - min;
-				var listSize = Math.floor(minPct + (v / divisor));
-				
-				if($inputfield.hasClass('InputfieldImageEditAll')) {
-					setCookieData($inputfield, 'size', value);
-					setListSize($inputfield, listSize);
-				} else {
-					setCookieData($inputfield, 'listSize', listSize);
-					setGridSize($inputfield, value);
-				}
-			},
+			'slide': sizeSlide,
 			'start': function(event, ui) {
+				gridSliding = true;
 				if($inputfield.find(".InputfieldImageEdit:visible").length) {
 					$inputfield.find(".InputfieldImageEdit__close").click();
 				}
 			}, 
 			'stop': function(event, ui) {
+				gridSliding = false;
+				sizeSlide(event, ui); 
 				updateGrid($inputfield);
 			}
 		});
diff --git a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.min.js b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.min.js
index 8751c04e..e731ac5a 100644
--- a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.min.js
+++ b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.min.js
@@ -1 +1 @@
-function InputfieldImage(x){var l=null;var c={file:"",item:null,edit:null};var J={type:"image",closeOnContentClick:true,closeBtnInside:true};var d=null;var s=[];function u(){var Q=window.File&&window.FileList&&window.FileReader;var P=x(".InputfieldAllowAjaxUpload").length>0;var R=x("#PageIDIndicator").length>0;return(Q&&(R||P))}function B(R,P,Q){P||(P=250);var S,T;return function(){var W=Q||this;var V=+new Date(),U=arguments;if(S&&V<S+P){clearTimeout(T);T=setTimeout(function(){S=V;R.apply(W,U)},P)}else{S=V;R.apply(W,U)}}}function g(Q,P){return !P}function F(Q){if(Q.hasClass("ui-sortable")){Q.sortable("destroy");Q.children("li").each(function(T){var S=x(this).find("input.InputfieldFileSort");S.val(T)})}var R;var P={items:"> .gridImage",start:function(U,T){var S=I(Q.closest(".Inputfield"),"size");T.placeholder.append(x("<div/>").css({display:"block",height:S+"px",width:S+"px"}));R=window.setTimeout(function(){K(Q,null)},100);Q.addClass("InputfieldImageSorting")},stop:function(U,S){var T=x(this);if(R!==null){S.item.find(".InputfieldImageEdit__edit").click();clearTimeout(R)}T.children("li").each(function(W){var V=x(this).find(".InputfieldFileSort");if(V.val()!=W){V.val(W).change()}});Q.removeClass("InputfieldImageSorting")},cancel:".InputfieldImageEdit,.focusArea,input,textarea,button,select,option"};Q.sortable(P)}function q(Q){var P=x.extend(true,{},J);P.callbacks={elementParse:function(R){var S=x(R.el).attr("data-original");if(typeof S=="undefined"||!S){S=x(R.el).attr("src")}R.src=S}};P.gallery={enabled:true};Q.find("img").magnificPopup(P)}function v(Q){var P=x.extend(true,{},J);P.callbacks={elementParse:function(R){R.src=x(R.el).attr("src")}};P.gallery={enabled:false};Q.find("img").magnificPopup(P)}function G(P){return P.find(".InputfieldImageEdit--active")}function w(P){return x("#"+P.find(".InputfieldImageEdit__edit").attr("data-current"))}function H(R){var P=R.is(":checked");var Q=R.parents(".gridImages").find(".gridImage__deletebox");if(P){Q.prop("checked","checked").change()}else{Q.removeAttr("checked").change()}}function N(Q){if(typeof Q=="undefined"){var P=x(".gridImages")}else{var P=Q.find(".gridImages")}P.each(function(){var R=x(this),S=G(R);if(S.length){j(w(S),S)}})}function y(P){var S=[];var X=[];var U=[];var R=0,W=0,Q=0;var V;if(typeof P=="undefined"){V=x(".InputfieldImage.Inputfield")}else{V=P}V.removeClass("InputfieldImageNarrow InputfieldImageMedium InputfieldImageWide");V.each(function(){var Z=x(this);var aa=Z.width();if(aa<1){return}if(aa<=500){S[R]=Z;R++}else{if(aa<=900){X[W]=Z;W++}else{U[Q]=Z;Q++}}});for(var T=0;T<R;T++){var Y=S[T];Y.addClass("InputfieldImageNarrow")}for(var T=0;T<W;T++){var Y=X[T];Y.addClass("InputfieldImageMedium")}for(var T=0;T<Q;T++){var Y=U[T];Y.addClass("InputfieldImageWide")}}function h(){x(".focusArea.focusActive").each(function(){var P=x(this).closest(".InputfieldImageEdit, .gridImage");if(P.length){D(P)}});N();y()}function p(P){if(P.is(":checked")){P.parents(".ImageOuter").addClass("gridImage--delete")}else{P.parents(".ImageOuter").removeClass("gridImage--delete")}}function e(S,P){if(S.closest(".InputfieldImageEditAll").length){return}var R=P.find(".InputfieldImageEdit__image");var U=S.find("img");R.attr({src:U.attr("data-original"),"data-original":U.attr("data-original"),alt:U.attr("alt")});var Q=x.extend(true,{},J);Q.callbacks={elementParse:function(V){V.src=x(V.el).attr("data-original")}};Q.gallery={enabled:true};P.attr("id","edit-"+S.attr("id"));var T=P.parents(".gridImages").find(".gridImage").not(S).find("img").add(R).magnificPopup(Q);P.find(".InputfieldImageEdit__edit").attr("data-current",S.attr("id")).append(S.find(".ImageData").children().not(".InputfieldFileSort"))}function t(ak){var X,am,ab,T,aj,Z,ai,ag=null,ac,ad,al,W,R=0,ah=false;ai=ak.closest(".Inputfield");ac=I(ai,"size");ad=I(ai,"mode");if(ai.hasClass("InputfieldImageFocusZoom")){ah=true}if(ak.hasClass("gridImage")){am=ak;X=ak.find(".gridImage__overflow").find("img");ab=X}else{am=x("#"+ak.attr("data-for"));X=ak.find(".InputfieldImageEdit__image");ab=am.find(".gridImage__overflow").find("img")}function S(ao){if(typeof ao=="undefined"){if(ag!==null){return ag}var aq=ak.find(".InputfieldImageFocus");var ao=aq.val()}var an=ao.split(" ");var ap={top:(typeof an[0]=="undefined"?50:parseFloat(an[0])),left:(typeof an[1]=="undefined"?50:parseFloat(an[1])),zoom:(typeof an[2]=="undefined"?0:parseInt(an[2]))};ag=ap;return ap}function U(an){if(typeof an=="undefined"){an=S()}return an.top+" "+an.left+" "+an.zoom}function V(ao){var an=S();return an[ao]}function Q(an){ag=an;var ao=an.top+" "+an.left+" "+an.zoom;ab.attr("data-focus",ao);T=ak.find(".InputfieldImageFocus");if(ao!=T.val()){T.val(ao).trigger("change")}}function aa(ap,ao){var an=S();an[ap]=ao;Q(an)}function ae(){var aq=S();var ao=Z.parent();var ap=ao.width();var ar=ao.height();var an=Math.round(((aq.left/100)*ap)-(Z.width()/2));var at=Math.round(((aq.top/100)*ar)-(Z.height()/2));if(an<0){an=0}if(at<0){at=0}Z.css({top:at+"px",left:an+"px"})}aj=X.siblings(".focusArea");if(!aj.length){aj=x("<div />").addClass("focusArea");X.after(aj)}aj.css({height:X.height()+"px",width:X.width()+"px"}).addClass("focusActive");Z=aj.find(".focusCircle");if(!Z.length){Z=x("<div />").addClass("focusCircle");aj.append(Z)}X.parent().addClass("focusWrap");ae();var af=function(ar){var av,au,ax,at,ao,ap,aw,an;if(typeof ar=="undefined"){ar=R}R=ar;aw=aj.width();an=aj.height();if(aw>an){W.height((100-ar)+"%");av=W.height();W.width(av)}else{W.width((100-ar)+"%");av=W.width();W.height(av)}ax=S();var aq=b(ax.left,ax.top,ar,aw,an,av,av);W.css({top:aq.top+"px",left:aq.left+"px"});ax.zoom=aq.zoom;aa("zoom",aq.zoom);if(ad=="grid"){i(ab.parent(),ac,false,ax)}};var Y=function(ao,au){var at=x(this);var an=at.outerHeight();var av=at.parent().width();var ar=at.parent().height();var aw=au.position.top>0?au.position.top+(an/2):0;var aq=au.position.left>0?au.position.left+(an/2):0;var ap={top:aw>0?((aw/ar)*100):0,left:aq>0?((aq/av)*100):0,zoom:V("zoom")};Q(ap);if(ah){af(ap.zoom)}else{if(ad=="grid"){i(ab.parent(),ac,false,ap)}}};Z.draggable({containment:"parent",drag:Y,stop:Y});if(ah){var P=V("zoom");al=x("<div />").addClass("focusZoomSlider").css({"margin-top":"5px"});W=x("<div />").addClass("focusZoomBox").css({position:"absolute",background:"rgba(0,0,0,0.5)"});aj.prepend(W);X.after(al);ab.attr("src",X.attr("src"));al.slider({min:0,max:50,value:P,range:"max",slide:function(an,ao){af(ao.value)}});af(P)}else{aj.css("background-color","rgba(0,0,0,0.5)")}}function D(P){$focusCircle=P.find(".focusCircle");if($focusCircle.length){var Q=$focusCircle.closest(".focusWrap");Q.find(".focusZoomSlider").slider("destroy").remove();Q.find(".focusZoomBox").remove();Q.removeClass("focusWrap");$focusCircle.draggable("destroy");$focusCircle.parent().removeClass("focusActive");$focusCircle.remove();var R=P.find(".InputfieldImageButtonFocus");if(R.length){$icon=R.find("i");$icon.removeClass("focusIconActive").toggleClass($icon.attr("data-toggle"))}}}function z(R,Q,W){R=parseInt(R);var U=100;var V=(W/Q*100);var T=U-V;var S=R+(V/2);var P=0;if(S>=100){P=Q-W}else{if(S<=Math.floor(T/2)){P=0}else{P=Math.ceil((Q-W)/100*R)}}return P}function b(T,Z,af,ad,ac,U,R){var ae=U/R;var V=U/ad*100;var S=R/ac*100;if(V>=S){var Q=ad;var ab=ad/ae}else{var ab=ac;var Q=ac*ae}var P=Q-(Q*af/100);var Y=ab-(ab*af/100);var aa=true;if(!aa){if(P<U){P=U;Y=U/ae}if(Y<R){Y=R;P=R*ae}}var X=z(T,ad,P);var W=z(Z,ac,Y);return{left:X,top:W,width:P,height:Y,zoom:af}}function n(P){D(P);P.off("click",".InputfieldImageButtonFocus");$inputArea=P.find(".InputfieldImageEdit__edit");if($inputArea.children().not(".InputfieldFileSort").length){var Q=$inputArea.children();x("#"+$inputArea.attr("data-current")).find(".ImageData").append(Q)}}function K(R,Q){var P;if(R){P=R.find(".InputfieldImageEdit--active")}else{if(Q){P=x(".InputfieldImageEdit--active").not(Q.find(".InputfieldImageEdit--active"))}else{P=x(".InputfieldImageEdit--active")}}if(P.length){n(P);P.removeClass("InputfieldImageEdit--active").removeAttr("id");x("#"+P.attr("data-for")).removeClass("gridImageEditing")}x(".InputfieldImageEdit__replace").removeClass("InputfieldImageEdit__replace")}function j(S,Q){if(!S||!S.length){return}var P=S.parent().children().not(".InputfieldImageEdit");var T=0;var U=false;var V=null;P.each(function(){if(V){return}var W=x(this);var X=W.offset().top;if(U&&X!=T){V=W}else{if(W.attr("id")==S.attr("id")){U=true}}T=X});if(V){Q.insertBefore(V)}else{Q.insertAfter(P.eq(P.length-1))}var R=Q.find(".InputfieldImageEdit__arrow");if(R.length){R.css("left",S.position().left+(S.outerWidth()/2)+"px")}}function A(){x(window).resize(B(h,200));x(document).on("click dblclick",".gridImage__trash",function(P){var Q=x(this).find("input");Q.prop("checked",g).change();if(P.type=="dblclick"){H(Q);P.preventDefault();P.stopPropagation()}});x(document).on("change",".gridImage__deletebox",function(){p(x(this))});x(document).on("click",".gridImage__edit",function(S){var Q=x(this).closest(".gridImage");if(!Q.length){return}if(Q.closest(".InputfieldImageEditAll").length){return false}var R=Q.closest(".gridImages");var P=R.find(".InputfieldImageEdit");if(Q.hasClass("gridImageEditing")){P.find(".InputfieldImageEdit__close").click()}else{j(Q,P);n(P);e(Q,P);P.addClass("InputfieldImageEdit--active").attr("data-for",Q.attr("id"));R.find(".gridImageEditing").removeClass("gridImageEditing");Q.addClass("gridImageEditing")}}).on("click",".InputfieldImageEditAll img",function(R){R.stopPropagation();R.preventDefault();x.magnificPopup.close();var P=x.extend(true,{},J);var Q=x(this);P.items={src:Q.attr("data-original"),title:Q.attr("alt")};x.magnificPopup.open(P);return true}).on("click",".InputfieldImageButtonFocus",function(){var S=x(this);var P=S.find("i");var Q=S.closest(".InputfieldImageEdit, .gridImage");var R=Q.find(".focusCircle");if(R.length){D(Q)}else{t(Q);P.addClass("focusIconActive");P.toggleClass(P.attr("data-toggle"))}});x(document).on("click",function(Q){var P=x(Q.target);if(P.closest(".InputfieldImageEdit").length){K(null,P.parents(".gridImages"))}else{if(P.is("input, textarea")&&P.closest(".InputfieldImageEditAll").length){P.focus().one("blur",function(){P.closest(".gridImages").sortable("enable")});P.closest(".gridImages").sortable("disable")}else{if(P.closest(".gridImage__inner").length){K(null,P.parents(".gridImages"))}else{if(P.closest(".mfp-container").length){return}else{if(P.closest(".ui-dialog").length){return}else{if(P.is(".mfp-close")){return}else{if(P.is("a.remove")){return}else{K(null,null)}}}}}}}});x(document).on("click",".InputfieldImageEdit__close",function(P){K(x(this).parents(".gridImages"),null)});x(document).on("change",".InputfieldImage",function(){x(this).find(".InputfieldImageButtonCrop:not(.pw-modal-dblclick)").addClass("pw-modal-dblclick ui-state-disabled")}).on("click",".InputfieldImageButtonCrop.ui-state-disabled",function(R){var Q=x(this);var P=Q.closest(".gridImages");if(!P.hasClass("gridImagesAlerted")){ProcessWire.alert(ProcessWire.config.InputfieldImage.labels.changes);P.addClass("gridImagesAlerted")}setTimeout(function(){Q.removeClass("ui-state-active")},500);return false});x(".ImagesGrid").on("click","button.pw-modal",function(P){P.preventDefault()});r();y()}function r(){x(document).on("click",".InputfieldImageEdit__name",function(R){var P=x(this).children("span");var S=P.closest(".gridImage, .InputfieldImageEdit").find(".InputfieldFileRename");var Q=P.closest(".gridImages");Q.sortable("disable");S.val(P.text());P.on("keypress",function(T){if(T.which==13){P.blur();return false}return true});P.attr("autocomplete","off").attr("autocorrect","off").attr("autocapitalize","off").attr("spellcheck","false");P.focus().on("blur",function(){var T=x(this).text();if(x.trim(T).length<1){P.text(S.val())}else{if(T!=S.val()){S.val(T).change();Q.closest(".Inputfield").trigger("change")}}P.off("keypress");Q.sortable("enable")})})}function m(P,Q){Q=Math.floor(Q);P.find(".gridImage__overflow").each(function(){var R=100-Q;var S=x(this);S.css("width",Q+"%");S.siblings(".ImageData").css("width",R+"%");S.find("img").css({top:0,left:0,transform:"none"})});f(P,"listSize",Q)}function k(T,P,R){if(!P){return}var Q=P+"px";var S=T.find(".gridImages");if(typeof R=="undefined"||R==null){R=S.attr("data-ragged")?true:false}if(R){S.attr("data-ragged",1)}else{S.removeAttr("data-ragged")}S.find(".gridImage__overflow").each(function(){i(x(this),P,R)});S.find(".gridImage__edit, .gridImage__resize").css("line-height",Q);S.attr("data-size",P);f(T,"size",P);if(s.length){setTimeout(function(){while(s.length){var U=s.pop();i(U,P,R)}},150)}}function i(Q,V,U,aa){if(Q.hasClass("gridImage__overflow")){var T=Q.children("img")}else{if(Q.is("img")){var T=Q;Q=T.closest(".gridImage__overflow")}else{return}}if(!V){T.removeAttr("width").removeAttr("height");Q.width("auto").height("auto");return}var P=0;var W=T.width();var ae=T.height();var X=parseInt(T.attr("data-w"));var af=parseInt(T.attr("data-h"));if(!W){W=X}if(!ae){ae=af}if(!U&&typeof aa=="undefined"){var ab=T.attr("data-focus");if(typeof ab=="undefined"){ab="50.0 50.0 0"}var ad=ab.split(" ");aa={top:parseFloat(ad[0]),left:parseFloat(ad[1]),zoom:parseInt(ad[2])}}if(!U){P=aa.zoom}if(U){T.attr("height",V).removeAttr("width");T.css({"max-height":"100%","max-width":"none",top:"50%",left:"50%",transform:"translate3d(-50%, -50%, 0)"})}else{if(P>0&&Q.closest(".InputfieldImageFocusZoom").length){if(W>=ae){var ac="100%";var ag="none"}else{var ac="none";var ag="100%"}var ah=1+((P/100)*2);var Z=aa.top;var S=aa.left;if(Z>92||Z>100){Z=100}if(S>92||S>100){S=100}if(Z<0){Z=0}if(S<0){S=0}var R=b(S,Z,P,W,ae,V,V);T.css({top:Z+"%",left:S+"%","transform-origin":"top left",transform:"scale("+ah+") translate3d(-"+S+"%, -"+Z+"%, 0)","max-width":ag,"max-height":ac})}else{if(W>=ae){T.attr("height",V).removeAttr("width");if(aa.left<1){aa.left=0.001}T.css({"max-height":"100%","max-width":"none",top:"50%",left:aa.left+"%",transform:"translate3d(-"+aa.left+"%, -50%, 0)"})}else{if(ae>W){T.attr("width",V).removeAttr("height");if(aa.top<1){aa.top=0.001}T.css({"max-height":"none","max-width":"100%",top:aa.top+"%",left:"50%",transform:"translate3d(-50%, -"+aa.top+"%, 0)"})}else{T.css({"max-height":"100%","max-width":"none",top:"50%",left:"50%",transform:"translate3d(-50%, -50%, 0)"});T.removeAttr("width").attr("height",V)}}}}var W=T.width();if(W){Q.css({width:(U?W+"px":V+"px"),height:V+"px"})}else{var Y=Q.attr("data-tries");if(!Y){Y=0}if(typeof Y=="undefined"){Y=0}Y=parseInt(Y);if(Y>3){Q.css({width:V+"px",height:V+"px"})}else{s.push(Q);Q.attr("data-tries",Y+1)}}}function E(Q){if(Q.find(".InputfieldImageListToggle").length){return}var T=x("<a class='InputfieldImageListToggle' href='list'></a>").append("<i class='fa fa-th-list'></i>");var V=x("<a class='InputfieldImageListToggle' href='left'></a>").append("<i class='fa fa-tasks'></i>");var P=x("<a class='InputfieldImageListToggle' href='grid'></a>").append("<i class='fa fa-th'></i>");var U="InputfieldImageListToggle--active";var S="";var R=function(ab){var aa=x(this);var Y=aa.closest(".Inputfield");var W=aa.attr("href");var X;var ac=aa.parent().children("."+U);var Z=ac.attr("href");ac.removeClass(U);aa.addClass(U);D(Y);if(W=="list"){if(!Y.hasClass("InputfieldImageEditAll")){Y.find(".InputfieldImageEdit--active .InputfieldImageEdit__close").click();Y.addClass("InputfieldImageEditAll")}X=I(Y,"listSize");m(Y,X);f(Y,"mode","list")}else{if(W=="left"){Y.removeClass("InputfieldImageEditAll");X=I(Y,"size");k(Y,X,true);f(Y,"mode","left");N()}else{if(W=="grid"){Y.removeClass("InputfieldImageEditAll");X=I(Y,"size");k(Y,X,false);f(Y,"mode","grid");if(Z=="left"){setTimeout(function(){k(Y,X,false)},100)}}}}F(Y.find(".gridImages"));aa.blur();return false};T.click(R);V.click(R);P.click(R);if(Q.hasClass("InputfieldImage")){Q.find(".InputfieldHeader").append(T).append(V).append(P);S=I(Q,"mode")}else{x(".InputfieldImage .InputfieldHeader",Q).append(T).append(V).append(P)}if(S=="list"){T.click()}else{if(S=="left"){V.click()}else{}}}function C(U){var R=U.children(".InputfieldHeader");if(R.children(".InputfieldImageSizeSlider").length){return}var T=U.find(".gridImages");var Q=T.attr("data-gridsize");var S=Q/2;var P=Q*2;var V=x('<span class="InputfieldImageSizeSlider"></span>');R.append(V);V.slider({min:S,max:P,value:I(U,"size"),range:"min",slide:function(Y,aa){var Z=aa.value;var ab=15;var ac=Math.floor(Q/ab);var W=Z-S;var X=Math.floor(ab+(W/ac));if(U.hasClass("InputfieldImageEditAll")){f(U,"size",Z);m(U,X)}else{f(U,"listSize",X);k(U,Z)}},start:function(W,X){if(U.find(".InputfieldImageEdit:visible").length){U.find(".InputfieldImageEdit__close").click()}},stop:function(W,X){N(U)}})}function f(Q,T,S){var R=I(Q);var U=Q.attr("id");var P=U?U.replace("wrap_Inputfield_",""):"";if(!P.length||typeof S=="undefined"){return}if(R[P][T]==S){return}R[P][T]=S;x.cookie("InputfieldImage",R);d=R}function I(Q,T){if(d&&typeof T=="undefined"){return d}var U=Q.attr("id");var P=U?U.replace("wrap_Inputfield_",""):"na";var S=d?d:x.cookie("InputfieldImage");var R=null;if(!S){var S={}}if(typeof S[P]=="undefined"){S[P]={}}if(typeof S[P].size=="undefined"){S[P].size=parseInt(Q.find(".gridImages").attr("data-size"))}if(typeof S[P].listSize=="undefined"){S[P].listSize=23}if(typeof S[P].mode=="undefined"){S[P].mode=Q.find(".gridImages").attr("data-gridMode")}if(d==null){d=S}if(typeof T=="undefined"){R=S}else{if(T===true){R=S[P]}else{if(typeof S[P][T]!="undefined"){R=S[P][T]}}}return R}function a(T){if(T.hasClass("InputfieldStateCollapsed")){return}var U=parseInt(T.find(".InputfieldImageMaxFiles").val());var S=T.find(".gridImages");var R=I(T,"size");var V=I(T,"mode");var Q=V=="left"?true:false;if(!R){R=S.attr("data-gridsize")}R=parseInt(R);if(T.hasClass("InputfieldImageEditAll")||V=="list"){var P=I(T,"listSize");m(T,P)}else{k(T,R,Q)}if(!T.hasClass("InputfieldImageInit")){T.addClass("InputfieldImageInit");if(T.hasClass("InputfieldRenderValueMode")){return q(T)}else{if(U==1){T.addClass("InputfieldImageMax1");v(T)}else{F(S)}}E(T);C(T)}y(T);T.on("change",".InputfieldFileActionSelect",function(){var W=x(this).next(".InputfieldFileActionNote");if(x(this).val().length){W.fadeIn()}else{W.hide()}})}function M(){x("body").addClass("ie-no-drop");x(".InputfieldImage.InputfieldFileMultiple").each(function(){var Q=x(this),S=parseInt(Q.find(".InputfieldFileMaxFiles").val()),P=Q.find(".gridImages"),R=Q.find(".InputfieldImageUpload");R.on("change","input[type=file]",function(){var W=x(this),U=W.parent(".InputMask");if(W.val().length>1){U.addClass("ui-state-disabled")}else{U.removeClass("ui-state-disabled")}if(W.next("input.InputfieldFile").length>0){return}var T=P.children("li").length+R.find("input[type=file]").length+1;if(S>0&&T>=S){return}R.find(".InputMask").not(":last").each(function(){var X=x(this);if(X.find("input[type=file]").val()<1){X.remove()}});var V=U.clone().removeClass("ui-state-disabled");V.children("input[type=file]").val("");V.insertAfter(U)})})}function O(R){var Q;if(R.length>0){Q=R.find(".InputfieldImageUpload")}else{Q=x(".InputfieldImageUpload")}Q.each(function(U){var V=x(this);var T=V.closest(".InputfieldContent");if(V.hasClass("InputfieldImageInitUpload")){return}S(T,U);V.addClass("InputfieldImageInitUpload")});function S(ac,ao){var ab=ac.parents("form");var T=ac.closest(".InputfieldRepeaterItem");var X=T.length?T.attr("data-editUrl"):ab.attr("action");X+=(X.indexOf("?")>-1?"&":"?")+"InputfieldFileAjax=1";var au=ab.find("input._post_token");var aa=au.attr("name");var af=au.val();var ae=ac.find(".InputfieldImageErrors").first();var W=ac.find(".InputfieldImageUpload").data("fieldname");W=W.slice(0,-2);var am=ac.closest(".Inputfield.InputfieldImage");var at=ac.find(".InputfieldImageUpload").data("extensions").toLowerCase();var al=ac.find(".InputfieldImageUpload").data("maxfilesize");var ad=ac.find("input[type=file]").get(0);var V=ac.find(".gridImages");var ap=V.get(0);var ah=V.data("gridsize");var ai=null;var ag=parseInt(ac.find(".InputfieldImageMaxFiles").val());var ar=o(am);var an=ar.maxWidth>0||ar.maxHeight>0||ar.maxSize>0;aq(ac);if(ag!=1){ak(V)}V.children().addClass("InputfieldFileItemExisting");am.on("pwimageupload",function(av,aw){aj([aw.file],aw.xhr)});function Z(aw,av){if(typeof av!=="undefined"){aw="<b>"+av+":</b> "+aw}return"<li>"+aw+"</li>"}function U(aw){var av=new String(aw).substring(aw.lastIndexOf("/")+1);if(av.lastIndexOf(".")!=-1){av=av.substring(0,av.lastIndexOf("."))}return av}function aq(aw){if(aw.hasClass("InputfieldImageDropzoneInit")){return}var az=aw.get(0);var ay=aw.closest(".Inputfield");function av(){if(ay.hasClass("pw-drag-in-file")){return}aw.addClass("ui-state-hover");ay.addClass("pw-drag-in-file")}function ax(){if(!ay.hasClass("pw-drag-in-file")){return}aw.removeClass("ui-state-hover");ay.removeClass("pw-drag-in-file")}az.addEventListener("dragleave",function(){ax()},false);az.addEventListener("dragenter",function(aA){aA.preventDefault();av()},false);az.addEventListener("dragover",function(aA){if(!aw.is("ui-state-hover")){av()}aA.preventDefault();aA.stopPropagation();return false},false);az.addEventListener("drop",function(aA){aj(aA.dataTransfer.files);ax();aA.preventDefault();aA.stopPropagation();return false},false);aw.addClass("InputfieldImageDropzoneInit")}function ak(aD){var aH=null;var aF=false;var aw=null;var av=aD.closest(".Inputfield");function aA(){av.addClass("pw-drag-in-file")}function aG(){av.removeClass("pw-drag-in-file")}function az(aJ){var aN=aJ.offset();var aK=aJ.width();var aI=aJ.height();var aM=aN.left+aK/2;var aL=aN.top+aI/2;return{clientX:aM,clientY:aL}}function aC(){return aD.find(".InputfieldImageEdit--active").length>0}function aB(aJ){if(aC()){return}aJ.preventDefault();aJ.stopPropagation();aA();aF=false;if(aH==null){var aI=aD.attr("data-size")+"px";var aK=x("<div/>").addClass("gridImage__overflow");if(aD.closest(".InputfieldImageEditAll").length){aK.css({width:"100%",height:aI})}else{aK.css({width:aI,height:aI})}aH=x("<li/>").addClass("ImageOuter gridImage gridImagePlaceholder").append(aK);aD.append(aH)}var aL=az(aH);aH.simulate("mousedown",aL)}function aE(aI){if(aC()){return}aI.preventDefault();aI.stopPropagation();aA();aF=false;if(aH==null){return}var aJ={clientX:aI.originalEvent.clientX,clientY:aI.originalEvent.clientY};aH.simulate("mousemove",aJ)}function ay(aI){if(aC()){return}aI.preventDefault();aI.stopPropagation();if(aH==null){return false}aF=true;if(aw){clearTimeout(aw)}aw=setTimeout(function(){if(!aF||aH==null){return}aH.remove();aH=null;aG()},1000)}function ax(aI){if(aC()){return}aG();aF=false;var aJ={clientX:aI.clientX,clientY:aI.clientY};aH.simulate("mouseup",aJ);l=aH.next(".gridImage");aH.remove();aH=null}if(aD.length&&!aD.hasClass("gridImagesInitDropInPlace")){aD.on("dragenter",aB);aD.on("dragover",aE);aD.on("dragleave",ay);aD.on("drop",ax);aD.addClass("gridImagesInitDropInPlace")}}function Y(aU,aI,aE){var aR=ProcessWire.config.InputfieldImage.labels;var aB=parseInt(aU.size/1024,10)+"&nbsp;kB";var aT='<div class="gridImage__tooltip"><table><tbody><tr><th>'+aR.dimensions+'</th><td class="dimensions">'+aR.na+"</td></tr><tr><th>"+aR.filesize+"</th><td>"+aB+"</td></tr><tr><th>"+aR.variations+"</th><td>0</td></tr></tbody></table></div>";var aW=x('<li class="gridImage gridImageUploading"></li>'),aO=x(aT),aC=x('<div class="gridImage__overflow"></div>'),av=x('<div class="ImageData"></div>'),aL=x("<div class='gridImage__hover'><div class='gridImage__inner'></div></div>"),aN=x("<progress class='gridImage__progress' min='-1' max='100' value='0'></progress>"),aQ=x('<a class="gridImage__edit" title="'+aU.name+'"><span>&nbsp;</span></a>'),aP=x('<div class="gridImage__resize"><i class="fa fa-spinner fa-spin fa-2x fa-fw"></i></div>'),aw,aG,aV,aJ=URL.createObjectURL(aU),ax=am.find(".gridImages"),az=ag==1,aM=I(am,"size"),aA=I(am,"listSize"),ay=am.hasClass("InputfieldImageEditAll"),aF=x('<img height="'+aM+'" alt="">');aC.append(aF);aL.find(".gridImage__inner").append(aQ);aL.find(".gridImage__inner").append(aP.css("display","none"));aL.find(".gridImage__inner").append(aN);av.append(x('<h2 class="InputfieldImageEdit__name">'+aU.name+'</h2><span class="InputfieldImageEdit__info">'+aB+"</span>"));if(ay){aC.css("width",aA+"%");av.css("width",(100-aA)+"%")}else{aC.css({width:aM+"px",height:aM+"px"})}aW.append(aO).append(aC).append(aL).append(av);aF.attr({src:aJ,"data-original":aJ});img=new Image();img.addEventListener("load",function(){aO.find(".dimensions").html(this.width+"&nbsp;&times;&nbsp;"+this.height);var aX=Math.min(this.width,this.height)/aM;aF.attr({width:this.width/aX,height:this.height/aX})},false);img.src=aJ;if(typeof aE!="undefined"){aG=aE}else{aG=new XMLHttpRequest()}function aH(aX){if(typeof aX!="undefined"){if(!aX.lengthComputable){return}aN.attr("value",parseInt((aX.loaded/aX.total)*100))}x("body").addClass("pw-uploading");aP.css("display","block")}aG.upload.addEventListener("progress",aH,false);aG.addEventListener("load",function(){aG.getAllResponseHeaders();var a0=x.parseJSON(aG.responseText);if(typeof a0.ajaxResponse!="undefined"){a0=a0.ajaxResponse}var aY=a0.length>1;if(a0.error!==undefined){a0=[a0]}for(var aZ=0;aZ<a0.length;aZ++){var aX=a0[aZ];if(aX.error){ae.append(Z(aX.message));continue}var a6=null;var a2=x(aX.markup).hide();var a5=ac.find("input[type=file]");if(a5.val()){a5.replaceWith(a5.clone(true))}if(aX.overwrite){a6=ax.children("#"+a2.attr("id"))}if(ag==1||aX.replace){a6=ax.children(".gridImage:eq(0)")}else{if(c.item&&a0.length==1){a6=c.item}}if(a6&&a6.length){a6.replaceWith(a2)}else{if(l&&l.length){l.before(a2);l=a2}else{if(aZ===0){aW.replaceWith(a2)}else{ax.append(a2)}}}if(ay){a2.find(".gridImage__overflow").css("width",aA+"%")}else{a2.find(".gridImage__overflow").css({height:aM+"px",width:aM+"px"});a2.find("img").hide()}a2.fadeIn(150,function(){a2.find("img").fadeIn();if(ay){m(am,aA)}else{k(am,aM)}}).css("display","");a2.addClass("InputfieldFileItemExisting");if(a6&&a6.length){a2.effect("highlight",500)}if(aW.length){aW.remove()}if(c.item&&ag!=1){a2.find(".InputfieldFileReplace").val(c.file);var a8=a2.find(".InputfieldImageEdit__name");var a4=a8.text();var a7=a4.substring(a4.lastIndexOf(".")+1).toLowerCase();a4=a4.substring(0,a4.lastIndexOf("."));var a3=c.file;if(a3.indexOf("?")>-1){a3=a3.substring(0,a3.indexOf("?"))}var a1=a3.substring(a3.lastIndexOf(".")+1).toLowerCase();a3=a3.substring(0,a3.lastIndexOf("."));if(a1==a7){a8.children("span").text(a3).removeAttr("contenteditable")}a2.find(".gridImage__edit").click()}c.file="";c.item=null;c.edit=null}if(ai){clearTimeout(ai)}l=null;ai=setTimeout(function(){if(ag!=1){F(ax)}else{v(am)}x("body").removeClass("pw-uploading");ax.trigger("AjaxUploadDone")},500);am.trigger("change").removeClass("InputfieldFileEmpty")},false);if(c.edit){c.edit.find(".InputfieldImageEdit__close").click()}else{if(am.find(".InputfieldImageEdit:visible").length){am.find(".InputfieldImageEdit__close").click()}}if(c.item){c.item.replaceWith(aW);c.item=aW}else{if(l&&l.length){l.before(aW)}else{ax.append(aW)}}function aS(aX,aZ){if(typeof aE=="undefined"){aG.open("POST",X,true)}aG.setRequestHeader("X-FILENAME",encodeURIComponent(aX.name));aG.setRequestHeader("X-FIELDNAME",W);if(c.item){aG.setRequestHeader("X-REPLACENAME",c.file)}aG.setRequestHeader("Content-Type","application/octet-stream");aG.setRequestHeader("X-"+aa,af);aG.setRequestHeader("X-REQUESTED-WITH","XMLHttpRequest");if(typeof aZ!="undefined"&&aZ!=false){aG.send(aZ)}else{aG.send(aX)}N();am.trigger("change");var aY=am.find(".InputfieldFileItem").length;if(aY==1){am.removeClass("InputfieldFileEmpty").removeClass("InputfieldFileMultiple").addClass("InputfieldFileSingle")}else{if(aY>1){am.removeClass("InputfieldFileEmpty").removeClass("InputfieldFileSingle").addClass("InputfieldFileMultiple")}}}aH();var aD=aU.name.substring(aU.name.lastIndexOf(".")+1).toLowerCase();if(an&&(aD=="jpg"||aD=="jpeg"||aD=="png"||aD=="gif")){var aK=new PWImageResizer(ar);aP.addClass("pw-resizing");aK.resize(aU,function(aX){aP.removeClass("pw-resizing");aS(aU,aX)})}else{aS(aU)}}function aj(av,aC){var aA=function(aE){return parseInt(aE/1024,10)};if(typeof av==="undefined"){ap.innerHTML="No support for the File API in this web browser";return}for(var ay=0,ax=av.length;ay<ax;ay++){var aB=av[ay].name.split(".").pop().toLowerCase();var aD;if(at.indexOf(aB)==-1){aD=aB+" is a invalid file extension, please use one of:  "+at;ae.append(Z(aD,av[ay].name))}else{if(!an&&av[ay].size>al&&al>2000000){var aw=aA(av[ay].size),az=aA(al);aD="Filesize "+aw+" kb is too big. Maximum allowed is "+az+" kb";ae.append(Z(aD,av[ay].name))}else{if(typeof aC!="undefined"){Y(av[ay],aB,aC)}else{Y(av[ay],aB)}}}if(ag==1){break}}}ad.addEventListener("change",function(av){aj(this.files);av.preventDefault();av.stopPropagation();this.value=""},false)}function P(){var T=".InputfieldImageEdit__imagewrapper img";x(document).on("dragenter",T,function(){var W=x(this);if(W.closest(".InputfieldImageMax1").length){return}var X=W.attr("src");var U=W.closest(".InputfieldImageEdit");var V=W.closest(".InputfieldImageEdit__imagewrapper");V.addClass("InputfieldImageEdit__replace");c.file=new String(X).substring(X.lastIndexOf("/")+1);c.item=x("#"+U.attr("data-for"));c.edit=U}).on("dragleave",T,function(){var V=x(this);if(V.closest(".InputfieldImageMax1").length){return}var U=V.closest(".InputfieldImageEdit__imagewrapper");U.removeClass("InputfieldImageEdit__replace");c.file="";c.item=null;c.edit=null})}P()}function o(Q){var P={maxWidth:0,maxHeight:0,maxSize:0,quality:1,autoRotate:true,debug:ProcessWire.config.debug};var R=Q.attr("data-resize");if(typeof R!="undefined"&&R.length){R=R.split(";");P.maxWidth=parseInt(R[0]);P.maxHeight=parseInt(R[1]);P.maxSize=parseFloat(R[2]);P.quality=parseFloat(R[3])}return P}function L(){x(".InputfieldImage.Inputfield").each(function(){a(x(this))});A();if(u()){O("")}else{M()}x(document).on("reloaded",".InputfieldImage",function(){var P=x(this);a(P);O(P)}).on("wiretabclick",function(R,Q,P){Q.find(".InputfieldImage").each(function(){a(x(this))})}).on("opened",".InputfieldImage",function(){a(x(this))})}L()}jQuery(document).ready(function(a){InputfieldImage(a)});
\ No newline at end of file
+function InputfieldImage(A){var m=null;var c={file:"",item:null,edit:null};var M={type:"image",closeOnContentClick:true,closeBtnInside:true};var d=null;var v=[];var k=false;function x(){var T=window.File&&window.FileList&&window.FileReader;var S=A(".InputfieldAllowAjaxUpload").length>0;var U=A("#PageIDIndicator").length>0;return(T&&(U||S))}function E(U,S,T){S||(S=250);var V,W;return function(){var Z=T||this;var Y=+new Date(),X=arguments;if(V&&Y<V+S){clearTimeout(W);W=setTimeout(function(){V=Y;U.apply(Z,X)},S)}else{V=Y;U.apply(Z,X)}}}function g(T,S){return !S}function I(T){if(T.hasClass("ui-sortable")){T.sortable("destroy");T.children("li").each(function(W){var V=A(this).find("input.InputfieldFileSort");V.val(W)})}var U;var S={items:"> .gridImage",start:function(X,W){var V=L(T.closest(".Inputfield"),"size");W.placeholder.append(A("<div/>").css({display:"block",height:V+"px",width:V+"px"}));U=window.setTimeout(function(){N(T,null)},100);T.addClass("InputfieldImageSorting")},stop:function(X,V){var W=A(this);if(U!==null){V.item.find(".InputfieldImageEdit__edit").click();clearTimeout(U)}W.children("li").each(function(Z){var Y=A(this).find(".InputfieldFileSort");if(Y.val()!=Z){Y.val(Z).change()}});T.removeClass("InputfieldImageSorting")},cancel:".InputfieldImageEdit,.focusArea,input,textarea,button,select,option"};T.sortable(S)}function t(T){var S=A.extend(true,{},M);S.callbacks={elementParse:function(U){var V=A(U.el).attr("data-original");if(typeof V=="undefined"||!V){V=A(U.el).attr("src")}U.src=V}};S.gallery={enabled:true};T.find("img").magnificPopup(S)}function y(T){var S=A.extend(true,{},M);S.callbacks={elementParse:function(U){U.src=A(U.el).attr("src")}};S.gallery={enabled:false};T.find("img").magnificPopup(S)}function J(S){return S.find(".InputfieldImageEdit--active")}function z(S){return A("#"+S.find(".InputfieldImageEdit__edit").attr("data-current"))}function K(U){var S=U.is(":checked");var T=U.parents(".gridImages").find(".gridImage__deletebox");if(S){T.prop("checked","checked").change()}else{T.removeAttr("checked").change()}}function Q(T){if(typeof T=="undefined"){var S=A(".gridImages")}else{var S=T.find(".gridImages")}S.each(function(){var U=A(this),V=J(U);if(V.length){j(z(V),V)}})}function B(S){var V=[];var aa=[];var X=[];var U=0,Z=0,T=0;var Y;if(typeof S=="undefined"){Y=A(".InputfieldImage.Inputfield")}else{Y=S}Y.removeClass("InputfieldImageNarrow InputfieldImageMedium InputfieldImageWide");Y.each(function(){var ac=A(this);var ad=ac.width();if(ad<1){return}if(ad<=500){V[U]=ac;U++}else{if(ad<=900){aa[Z]=ac;Z++}else{X[T]=ac;T++}}});for(var W=0;W<U;W++){var ab=V[W];ab.addClass("InputfieldImageNarrow")}for(var W=0;W<Z;W++){var ab=aa[W];ab.addClass("InputfieldImageMedium")}for(var W=0;W<T;W++){var ab=X[W];ab.addClass("InputfieldImageWide")}}function h(){A(".focusArea.focusActive").each(function(){var S=A(this).closest(".InputfieldImageEdit, .gridImage");if(S.length){G(S)}});Q();B()}function s(S){if(S.is(":checked")){S.parents(".ImageOuter").addClass("gridImage--delete")}else{S.parents(".ImageOuter").removeClass("gridImage--delete")}}function e(V,S){if(V.closest(".InputfieldImageEditAll").length){return}var U=S.find(".InputfieldImageEdit__image");var X=V.find("img");U.attr({src:X.attr("data-original"),"data-original":X.attr("data-original"),alt:X.attr("alt")});var T=A.extend(true,{},M);T.callbacks={elementParse:function(Y){Y.src=A(Y.el).attr("data-original")}};T.gallery={enabled:true};S.attr("id","edit-"+V.attr("id"));var W=S.parents(".gridImages").find(".gridImage").not(V).find("img").add(U).magnificPopup(T);S.find(".InputfieldImageEdit__edit").attr("data-current",V.attr("id")).append(V.find(".ImageData").children().not(".InputfieldFileSort"))}function w(an){var aa,ap,ae,W,am,ac,al,aj=null,af,ag,ao,Z,U=0,ak=false;al=an.closest(".Inputfield");af=L(al,"size");ag=L(al,"mode");if(al.hasClass("InputfieldImageFocusZoom")){ak=true}if(an.hasClass("gridImage")){ap=an;aa=an.find(".gridImage__overflow").find("img");ae=aa}else{ap=A("#"+an.attr("data-for"));aa=an.find(".InputfieldImageEdit__image");ae=ap.find(".gridImage__overflow").find("img")}function V(ar){if(typeof ar=="undefined"){if(aj!==null){return aj}var aw=an.find(".InputfieldImageFocus");var ar=aw.val()}var aq=ar.split(" ");var av=(typeof aq[0]=="undefined"?50:parseFloat(aq[0]));var au=(typeof aq[1]=="undefined"?50:parseFloat(aq[1]));var at=(typeof aq[2]=="undefined"?0:parseInt(aq[2]));aj={top:av>100?100:av,left:au>100?100:au,zoom:at>100?0:at};return aj}function X(aq){if(typeof aq=="undefined"){aq=V()}return aq.top+" "+aq.left+" "+aq.zoom}function Y(ar){var aq=V();return aq[ar]}function T(aq){aj=aq;var ar=aq.top+" "+aq.left+" "+aq.zoom;ae.attr("data-focus",ar);W=an.find(".InputfieldImageFocus");if(ar!=W.val()){W.val(ar).trigger("change")}}function ad(at,ar){var aq=V();aq[at]=ar;T(aq)}function ah(){var au=V();var ar=ac.parent();var at=ar.width();var av=ar.height();var aq=Math.round((au.left/100)*at);var aw=Math.round((au.top/100)*av);if(aq<0){aq=0}if(aw<0){aw=0}if(aq>at){aq=at}if(aw>av){aw=av}ac.css({top:aw+"px",left:aq+"px"})}am=aa.siblings(".focusArea");if(!am.length){am=A("<div />").addClass("focusArea");aa.after(am)}am.css({height:aa.height()+"px",width:aa.width()+"px","background-color":"rgba(0,0,0,0.7)"}).addClass("focusActive");ac=am.find(".focusCircle");if(!ac.length){ac=A("<div />").addClass("focusCircle");am.append(ac)}aa.parent().addClass("focusWrap");ah();var ai=function(aw){var ar,aq,av,at;if(typeof aw=="undefined"){aw=U}U=aw;av=am.width();at=am.height();if(av>at){Z.height((100-aw)+"%");ar=Z.height();Z.width(ar)}else{Z.width((100-aw)+"%");ar=Z.width();Z.height(ar)}aq=V();var au=b(aq.left,aq.top,aw,av,at,ar);Z.css({top:au.top+"px",left:au.left+"px","background-position":"-"+au.left+"px -"+au.top+"px","background-size":av+"px "+at+"px"});aq.zoom=aw;ad("zoom",aq.zoom);if(ag=="grid"){i(ae.parent(),af,false,aq)}};var ab=function(ar,ay){var aw=A(this);var aq=aw.outerHeight();var az=aw.parent().width();var av=aw.parent().height();var ax=ay.position.top>0?ay.position.top:0;var at=ay.position.left>0?ay.position.left:0;ax=ax>0?((ax/av)*100):0;at=at>0?((at/az)*100):0;var au={top:ax,left:at,zoom:Y("zoom")};T(au);if(ak){ai(au.zoom)}else{if(ag=="grid"){i(ae.parent(),af,false,au)}}};ac.draggable({containment:"parent",drag:ab,stop:ab});if(ak){var S=Y("zoom");ao=A("<div />").addClass("focusZoomSlider").css({"margin-top":"5px"});Z=A("<div />").addClass("focusZoomBox").css({position:"absolute",background:"transparent","background-image":"url("+aa.attr("src")+")"});am.prepend(Z);aa.after(ao);ae.attr("src",aa.attr("src"));ao.slider({min:0,max:50,value:S,range:"max",slide:function(aq,ar){ai(ar.value)}});ai(S)}else{am.css("background-color","rgba(0,0,0,0.5)")}}function G(S){$focusCircle=S.find(".focusCircle");if($focusCircle.length){var T=$focusCircle.closest(".focusWrap");T.find(".focusZoomSlider").slider("destroy").remove();T.find(".focusZoomBox").remove();T.removeClass("focusWrap");$focusCircle.draggable("destroy");$focusCircle.parent().removeClass("focusActive");$focusCircle.remove();var U=S.find(".InputfieldImageButtonFocus");if(U.length){$icon=U.find("i");$icon.removeClass("focusIconActive").toggleClass($icon.attr("data-toggle"))}}}function C(V,U,X){var T=parseInt(U*V/100);var S=parseInt(T-(X/2));var W=parseInt(U-X);if(0>S){S=0}if(W<S){S=W}return S}function b(W,ad,Y,ac,U,ab){var Z=ab/ac*100;var T=ab/U*100;var aa=Z>=T?ac:U;var S=aa-(aa*Y/100);var V=C(W,ac,S);var X=C(ad,U,S);return{left:V,top:X,width:S,height:S}}function n(V,ad,U,Y,X,ab){var ad=ad*X;var W=U/ad*100;var T=W/2;var aa=V-T;var ac=0;var S=100-W;if(aa<=ac){aa=0}if(aa>=S){aa=S}var Z=ad/100*aa/X;Z=-1*parseInt(Z);return Z}function p(V,ad,X,ab,Y,S,T){var aa=ab>=Y?Y:ab;var U=n(V,ab,S,X,T,aa);var W=n(ad,Y,S,X,T,aa);var ac=parseInt(U);var Z=parseInt(W);return{transformLeft:ac,transformTop:Z,scale:T}}function q(S){G(S);S.off("click",".InputfieldImageButtonFocus");$inputArea=S.find(".InputfieldImageEdit__edit");if($inputArea.children().not(".InputfieldFileSort").length){var T=$inputArea.children();A("#"+$inputArea.attr("data-current")).find(".ImageData").append(T)}}function N(U,T){var S;if(U){S=U.find(".InputfieldImageEdit--active")}else{if(T){S=A(".InputfieldImageEdit--active").not(T.find(".InputfieldImageEdit--active"))}else{S=A(".InputfieldImageEdit--active")}}if(S.length){q(S);S.removeClass("InputfieldImageEdit--active").removeAttr("id");A("#"+S.attr("data-for")).removeClass("gridImageEditing")}A(".InputfieldImageEdit__replace").removeClass("InputfieldImageEdit__replace")}function j(V,T){if(!V||!V.length){return}var S=V.parent().children().not(".InputfieldImageEdit");var W=0;var X=false;var Y=null;S.each(function(){if(Y){return}var Z=A(this);var aa=Z.offset().top;if(X&&aa!=W){Y=Z}else{if(Z.attr("id")==V.attr("id")){X=true}}W=aa});if(Y){T.insertBefore(Y)}else{T.insertAfter(S.eq(S.length-1))}var U=T.find(".InputfieldImageEdit__arrow");if(U.length){U.css("left",V.position().left+(V.outerWidth()/2)+"px")}}function D(){A(window).resize(E(h,200));A(document).on("click dblclick",".gridImage__trash",function(S){var T=A(this).find("input");T.prop("checked",g).change();if(S.type=="dblclick"){K(T);S.preventDefault();S.stopPropagation()}});A(document).on("change",".gridImage__deletebox",function(){s(A(this))});A(document).on("click",".gridImage__edit",function(V){var T=A(this).closest(".gridImage");if(!T.length){return}if(T.closest(".InputfieldImageEditAll").length){return false}var U=T.closest(".gridImages");var S=U.find(".InputfieldImageEdit");if(T.hasClass("gridImageEditing")){S.find(".InputfieldImageEdit__close").click()}else{j(T,S);q(S);e(T,S);S.addClass("InputfieldImageEdit--active").attr("data-for",T.attr("id"));U.find(".gridImageEditing").removeClass("gridImageEditing");T.addClass("gridImageEditing")}}).on("click",".InputfieldImageEditAll img",function(U){U.stopPropagation();U.preventDefault();A.magnificPopup.close();var S=A.extend(true,{},M);var T=A(this);S.items={src:T.attr("data-original"),title:T.attr("alt")};A.magnificPopup.open(S);return true}).on("click",".InputfieldImageButtonFocus",function(){var V=A(this);var S=V.find("i");var T=V.closest(".InputfieldImageEdit, .gridImage");var U=T.find(".focusCircle");if(U.length){G(T)}else{w(T);S.addClass("focusIconActive");S.toggleClass(S.attr("data-toggle"))}});A(document).on("click",function(T){var S=A(T.target);if(S.closest(".InputfieldImageEdit").length){N(null,S.parents(".gridImages"))}else{if(S.is("input, textarea")&&S.closest(".InputfieldImageEditAll").length){S.focus().one("blur",function(){S.closest(".gridImages").sortable("enable")});S.closest(".gridImages").sortable("disable")}else{if(S.closest(".gridImage__inner").length){N(null,S.parents(".gridImages"))}else{if(S.closest(".mfp-container").length){return}else{if(S.closest(".ui-dialog").length){return}else{if(S.is(".mfp-close")){return}else{if(S.is("a.remove")){return}else{N(null,null)}}}}}}}});A(document).on("click",".InputfieldImageEdit__close",function(S){N(A(this).parents(".gridImages"),null)});A(document).on("change",".InputfieldImage",function(){A(this).find(".InputfieldImageButtonCrop:not(.pw-modal-dblclick)").addClass("pw-modal-dblclick ui-state-disabled")}).on("click",".InputfieldImageButtonCrop.ui-state-disabled",function(U){var T=A(this);var S=T.closest(".gridImages");if(!S.hasClass("gridImagesAlerted")){ProcessWire.alert(ProcessWire.config.InputfieldImage.labels.changes);S.addClass("gridImagesAlerted")}setTimeout(function(){T.removeClass("ui-state-active")},500);return false});A(".ImagesGrid").on("click","button.pw-modal",function(S){S.preventDefault()});u();B()}function u(){A(document).on("click",".InputfieldImageEdit__name",function(U){var S=A(this).children("span");var V=S.closest(".gridImage, .InputfieldImageEdit").find(".InputfieldFileRename");var T=S.closest(".gridImages");T.sortable("disable");V.val(S.text());S.on("keypress",function(W){if(W.which==13){S.blur();return false}return true});S.attr("autocomplete","off").attr("autocorrect","off").attr("autocapitalize","off").attr("spellcheck","false");S.focus().on("blur",function(){var W=A(this).text();if(A.trim(W).length<1){S.text(V.val())}else{if(W!=V.val()){V.val(W).change();T.closest(".Inputfield").trigger("change")}}S.off("keypress");T.sortable("enable")})})}function o(S,T){T=Math.floor(T);S.find(".gridImage__overflow").each(function(){var U=100-T;var V=A(this);V.css("width",T+"%");V.siblings(".ImageData").css("width",U+"%");V.find("img").css({top:0,left:0,transform:"none"})});f(S,"listSize",T)}function l(W,S,U){if(!S){return}var T=S+"px";var V=W.find(".gridImages");if(typeof U=="undefined"||U==null){U=V.attr("data-ragged")?true:false}if(U){V.attr("data-ragged",1)}else{V.removeAttr("data-ragged")}V.find(".gridImage__overflow").each(function(){i(A(this),S,U)});V.find(".gridImage__edit, .gridImage__resize").css("line-height",T);V.attr("data-size",S);f(W,"size",S);if(v.length){setTimeout(function(){while(v.length){var X=v.pop();i(X,S,U)}},150)}}function i(ab,V,Z,ai){if(ab.hasClass("gridImage__overflow")){var S=ab.children("img")}else{if(ab.is("img")){var S=ab;ab=S.closest(".gridImage__overflow")}else{return}}if(!V){S.removeAttr("width").removeAttr("height");ab.width("auto").height("auto");return}var ah=0;var ac=S.width();var Y=S.height();var aa=parseInt(S.attr("data-w"));var W=parseInt(S.attr("data-h"));if(!ac){ac=aa}if(!Y){Y=W}if(!Z&&typeof ai=="undefined"){var ag=S.attr("data-focus");if(typeof ag=="undefined"){ag="50.0 50.0 0"}var U=ag.split(" ");ai={top:parseFloat(U[0]),left:parseFloat(U[1]),zoom:parseInt(U[2])}}if(!Z){ah=ai.zoom}if(Z){S.attr("height",V).removeAttr("width");S.css({"max-height":"100%","max-width":"none",top:"50%",left:"50%",transform:"translate3d(-50%, -50%, 0)"})}else{if(ah>0&&ab.closest(".InputfieldImageFocusZoom").length&&!k){if(ac>=Y){var af="100%";var ae="none";if(ac==aa){Y=V;ac=(Y/W)*aa}}else{var af="none";var ae="100%";if(Y==W){ac=V;Y=(ac/aa)*W}}var T=1+((ah/100)*2);var X=p(ai.left,ai.top,ah,ac,Y,V,T);S.css({left:"0px",top:"0px","transform-origin":"0px 0px",transform:"scale("+X.scale+") translate3d("+X.transformLeft+"px, "+X.transformTop+"px, 0)","max-width":ae,"max-height":af})}else{if(ac>=Y){S.attr("height",V).removeAttr("width");if(ai.left<1){ai.left=0.001}S.css({"max-height":"100%","max-width":"none",top:"50%",left:ai.left+"%",transform:"translate3d(-"+ai.left+"%, -50%, 0)"})}else{if(Y>ac){S.attr("width",V).removeAttr("height");if(ai.top<1){ai.top=0.001}S.css({"max-height":"none","max-width":"100%",top:ai.top+"%",left:"50%",transform:"translate3d(-50%, -"+ai.top+"%, 0)"})}else{S.css({"max-height":"100%","max-width":"none",top:"50%",left:"50%",transform:"translate3d(-50%, -50%, 0)"});S.removeAttr("width").attr("height",V)}}}}var ac=S.width();if(ac){ab.css({width:(Z?ac+"px":V+"px"),height:V+"px"})}else{var ad=ab.attr("data-tries");if(!ad){ad=0}if(typeof ad=="undefined"){ad=0}ad=parseInt(ad);if(ad>3){ab.css({width:V+"px",height:V+"px"})}else{v.push(ab);ab.attr("data-tries",ad+1)}}}function H(T){if(T.find(".InputfieldImageListToggle").length){return}var W=A("<a class='InputfieldImageListToggle' href='list'></a>").append("<i class='fa fa-th-list'></i>");var Y=A("<a class='InputfieldImageListToggle' href='left'></a>").append("<i class='fa fa-tasks'></i>");var S=A("<a class='InputfieldImageListToggle' href='grid'></a>").append("<i class='fa fa-th'></i>");var X="InputfieldImageListToggle--active";var V="";var U=function(ae){var ad=A(this);var ab=ad.closest(".Inputfield");var Z=ad.attr("href");var aa;var af=ad.parent().children("."+X);var ac=af.attr("href");af.removeClass(X);ad.addClass(X);G(ab);if(Z=="list"){if(!ab.hasClass("InputfieldImageEditAll")){ab.find(".InputfieldImageEdit--active .InputfieldImageEdit__close").click();ab.addClass("InputfieldImageEditAll")}aa=L(ab,"listSize");o(ab,aa);f(ab,"mode","list")}else{if(Z=="left"){ab.removeClass("InputfieldImageEditAll");aa=L(ab,"size");l(ab,aa,true);f(ab,"mode","left");Q()}else{if(Z=="grid"){ab.removeClass("InputfieldImageEditAll");aa=L(ab,"size");l(ab,aa,false);f(ab,"mode","grid");if(ac=="left"){setTimeout(function(){l(ab,aa,false)},100)}}}}I(ab.find(".gridImages"));ad.blur();return false};W.click(U);Y.click(U);S.click(U);if(T.hasClass("InputfieldImage")){T.find(".InputfieldHeader").append(W).append(Y).append(S);V=L(T,"mode")}else{A(".InputfieldImage .InputfieldHeader",T).append(W).append(Y).append(S)}if(V=="list"){W.click()}else{if(V=="left"){Y.click()}else{}}}function F(Y){var V=Y.children(".InputfieldHeader");if(V.children(".InputfieldImageSizeSlider").length){return}var X=Y.find(".gridImages");var T=X.attr("data-gridsize");var W=T/2;var S=T*2;var Z=A('<span class="InputfieldImageSizeSlider"></span>');V.append(Z);var U=function(ac,ae){var ad=ae.value;var af=15;var ag=Math.floor(T/af);var aa=ad-W;var ab=Math.floor(af+(aa/ag));if(Y.hasClass("InputfieldImageEditAll")){f(Y,"size",ad);o(Y,ab)}else{f(Y,"listSize",ab);l(Y,ad)}};Z.slider({min:W,max:S,value:L(Y,"size"),range:"min",slide:U,start:function(aa,ab){k=true;if(Y.find(".InputfieldImageEdit:visible").length){Y.find(".InputfieldImageEdit__close").click()}},stop:function(aa,ab){k=false;U(aa,ab);Q(Y)}})}function f(T,W,V){var U=L(T);var X=T.attr("id");var S=X?X.replace("wrap_Inputfield_",""):"";if(!S.length||typeof V=="undefined"){return}if(U[S][W]==V){return}U[S][W]=V;A.cookie("InputfieldImage",U);d=U}function L(T,W){if(d&&typeof W=="undefined"){return d}var X=T.attr("id");var S=X?X.replace("wrap_Inputfield_",""):"na";var V=d?d:A.cookie("InputfieldImage");var U=null;if(!V){var V={}}if(typeof V[S]=="undefined"){V[S]={}}if(typeof V[S].size=="undefined"){V[S].size=parseInt(T.find(".gridImages").attr("data-size"))}if(typeof V[S].listSize=="undefined"){V[S].listSize=23}if(typeof V[S].mode=="undefined"){V[S].mode=T.find(".gridImages").attr("data-gridMode")}if(d==null){d=V}if(typeof W=="undefined"){U=V}else{if(W===true){U=V[S]}else{if(typeof V[S][W]!="undefined"){U=V[S][W]}}}return U}function a(W){if(W.hasClass("InputfieldStateCollapsed")){return}var X=parseInt(W.find(".InputfieldImageMaxFiles").val());var V=W.find(".gridImages");var U=L(W,"size");var Y=L(W,"mode");var T=Y=="left"?true:false;if(!U){U=V.attr("data-gridsize")}U=parseInt(U);if(W.hasClass("InputfieldImageEditAll")||Y=="list"){var S=L(W,"listSize");o(W,S)}else{l(W,U,T)}if(!W.hasClass("InputfieldImageInit")){W.addClass("InputfieldImageInit");if(W.hasClass("InputfieldRenderValueMode")){return t(W)}else{if(X==1){W.addClass("InputfieldImageMax1");y(W)}else{I(V)}}H(W);F(W)}B(W);W.on("change",".InputfieldFileActionSelect",function(){var Z=A(this).next(".InputfieldFileActionNote");if(A(this).val().length){Z.fadeIn()}else{Z.hide()}})}function P(){A("body").addClass("ie-no-drop");A(".InputfieldImage.InputfieldFileMultiple").each(function(){var T=A(this),V=parseInt(T.find(".InputfieldFileMaxFiles").val()),S=T.find(".gridImages"),U=T.find(".InputfieldImageUpload");U.on("change","input[type=file]",function(){var Z=A(this),X=Z.parent(".InputMask");if(Z.val().length>1){X.addClass("ui-state-disabled")}else{X.removeClass("ui-state-disabled")}if(Z.next("input.InputfieldFile").length>0){return}var W=S.children("li").length+U.find("input[type=file]").length+1;if(V>0&&W>=V){return}U.find(".InputMask").not(":last").each(function(){var aa=A(this);if(aa.find("input[type=file]").val()<1){aa.remove()}});var Y=X.clone().removeClass("ui-state-disabled");Y.children("input[type=file]").val("");Y.insertAfter(X)})})}function R(U){var T;if(U.length>0){T=U.find(".InputfieldImageUpload")}else{T=A(".InputfieldImageUpload")}T.each(function(X){var Y=A(this);var W=Y.closest(".InputfieldContent");if(Y.hasClass("InputfieldImageInitUpload")){return}V(W,X);Y.addClass("InputfieldImageInitUpload")});function V(af,ar){var ae=af.parents("form");var W=af.closest(".InputfieldRepeaterItem");var aa=W.length?W.attr("data-editUrl"):ae.attr("action");aa+=(aa.indexOf("?")>-1?"&":"?")+"InputfieldFileAjax=1";var ax=ae.find("input._post_token");var ad=ax.attr("name");var ai=ax.val();var ah=af.find(".InputfieldImageErrors").first();var Z=af.find(".InputfieldImageUpload").data("fieldname");Z=Z.slice(0,-2);var ap=af.closest(".Inputfield.InputfieldImage");var aw=af.find(".InputfieldImageUpload").data("extensions").toLowerCase();var ao=af.find(".InputfieldImageUpload").data("maxfilesize");var ag=af.find("input[type=file]").get(0);var Y=af.find(".gridImages");var at=Y.get(0);var ak=Y.data("gridsize");var al=null;var aj=parseInt(af.find(".InputfieldImageMaxFiles").val());var av=r(ap);var aq=av.maxWidth>0||av.maxHeight>0||av.maxSize>0;au(af);if(aj!=1){an(Y)}Y.children().addClass("InputfieldFileItemExisting");ap.on("pwimageupload",function(ay,az){am([az.file],az.xhr)});function ac(az,ay){if(typeof ay!=="undefined"){az="<b>"+ay+":</b> "+az}return"<li>"+az+"</li>"}function X(az){var ay=new String(az).substring(az.lastIndexOf("/")+1);if(ay.lastIndexOf(".")!=-1){ay=ay.substring(0,ay.lastIndexOf("."))}return ay}function au(az){if(az.hasClass("InputfieldImageDropzoneInit")){return}var aC=az.get(0);var aB=az.closest(".Inputfield");function ay(){if(aB.hasClass("pw-drag-in-file")){return}az.addClass("ui-state-hover");aB.addClass("pw-drag-in-file")}function aA(){if(!aB.hasClass("pw-drag-in-file")){return}az.removeClass("ui-state-hover");aB.removeClass("pw-drag-in-file")}aC.addEventListener("dragleave",function(){aA()},false);aC.addEventListener("dragenter",function(aD){aD.preventDefault();ay()},false);aC.addEventListener("dragover",function(aD){if(!az.is("ui-state-hover")){ay()}aD.preventDefault();aD.stopPropagation();return false},false);aC.addEventListener("drop",function(aD){am(aD.dataTransfer.files);aA();aD.preventDefault();aD.stopPropagation();return false},false);az.addClass("InputfieldImageDropzoneInit")}function an(aG){var aK=null;var aI=false;var az=null;var ay=aG.closest(".Inputfield");function aD(){ay.addClass("pw-drag-in-file")}function aJ(){ay.removeClass("pw-drag-in-file")}function aC(aM){var aQ=aM.offset();var aN=aM.width();var aL=aM.height();var aP=aQ.left+aN/2;var aO=aQ.top+aL/2;return{clientX:aP,clientY:aO}}function aF(){return aG.find(".InputfieldImageEdit--active").length>0}function aE(aM){if(aF()){return}aM.preventDefault();aM.stopPropagation();aD();aI=false;if(aK==null){var aL=aG.attr("data-size")+"px";var aN=A("<div/>").addClass("gridImage__overflow");if(aG.closest(".InputfieldImageEditAll").length){aN.css({width:"100%",height:aL})}else{aN.css({width:aL,height:aL})}aK=A("<li/>").addClass("ImageOuter gridImage gridImagePlaceholder").append(aN);aG.append(aK)}var aO=aC(aK);aK.simulate("mousedown",aO)}function aH(aL){if(aF()){return}aL.preventDefault();aL.stopPropagation();aD();aI=false;if(aK==null){return}var aM={clientX:aL.originalEvent.clientX,clientY:aL.originalEvent.clientY};aK.simulate("mousemove",aM)}function aB(aL){if(aF()){return}aL.preventDefault();aL.stopPropagation();if(aK==null){return false}aI=true;if(az){clearTimeout(az)}az=setTimeout(function(){if(!aI||aK==null){return}aK.remove();aK=null;aJ()},1000)}function aA(aL){if(aF()){return}aJ();aI=false;var aM={clientX:aL.clientX,clientY:aL.clientY};aK.simulate("mouseup",aM);m=aK.next(".gridImage");aK.remove();aK=null}if(aG.length&&!aG.hasClass("gridImagesInitDropInPlace")){aG.on("dragenter",aE);aG.on("dragover",aH);aG.on("dragleave",aB);aG.on("drop",aA);aG.addClass("gridImagesInitDropInPlace")}}function ab(aX,aL,aH){var aU=ProcessWire.config.InputfieldImage.labels;var aE=parseInt(aX.size/1024,10)+"&nbsp;kB";var aW='<div class="gridImage__tooltip"><table><tbody><tr><th>'+aU.dimensions+'</th><td class="dimensions">'+aU.na+"</td></tr><tr><th>"+aU.filesize+"</th><td>"+aE+"</td></tr><tr><th>"+aU.variations+"</th><td>0</td></tr></tbody></table></div>";var aZ=A('<li class="gridImage gridImageUploading"></li>'),aR=A(aW),aF=A('<div class="gridImage__overflow"></div>'),ay=A('<div class="ImageData"></div>'),aO=A("<div class='gridImage__hover'><div class='gridImage__inner'></div></div>"),aQ=A("<progress class='gridImage__progress' min='-1' max='100' value='0'></progress>"),aT=A('<a class="gridImage__edit" title="'+aX.name+'"><span>&nbsp;</span></a>'),aS=A('<div class="gridImage__resize"><i class="fa fa-spinner fa-spin fa-2x fa-fw"></i></div>'),az,aJ,aY,aM=URL.createObjectURL(aX),aA=ap.find(".gridImages"),aC=aj==1,aP=L(ap,"size"),aD=L(ap,"listSize"),aB=ap.hasClass("InputfieldImageEditAll"),aI=A('<img height="'+aP+'" alt="">');aF.append(aI);aO.find(".gridImage__inner").append(aT);aO.find(".gridImage__inner").append(aS.css("display","none"));aO.find(".gridImage__inner").append(aQ);ay.append(A('<h2 class="InputfieldImageEdit__name">'+aX.name+'</h2><span class="InputfieldImageEdit__info">'+aE+"</span>"));if(aB){aF.css("width",aD+"%");ay.css("width",(100-aD)+"%")}else{aF.css({width:aP+"px",height:aP+"px"})}aZ.append(aR).append(aF).append(aO).append(ay);aI.attr({src:aM,"data-original":aM});img=new Image();img.addEventListener("load",function(){aR.find(".dimensions").html(this.width+"&nbsp;&times;&nbsp;"+this.height);var a0=Math.min(this.width,this.height)/aP;aI.attr({width:this.width/a0,height:this.height/a0})},false);img.src=aM;if(typeof aH!="undefined"){aJ=aH}else{aJ=new XMLHttpRequest()}function aK(a0){if(typeof a0!="undefined"){if(!a0.lengthComputable){return}aQ.attr("value",parseInt((a0.loaded/a0.total)*100))}A("body").addClass("pw-uploading");aS.css("display","block")}aJ.upload.addEventListener("progress",aK,false);aJ.addEventListener("load",function(){aJ.getAllResponseHeaders();var a3=A.parseJSON(aJ.responseText);if(typeof a3.ajaxResponse!="undefined"){a3=a3.ajaxResponse}var a1=a3.length>1;if(a3.error!==undefined){a3=[a3]}for(var a2=0;a2<a3.length;a2++){var a0=a3[a2];if(a0.error){ah.append(ac(a0.message));continue}var a9=null;var a5=A(a0.markup).hide();var a8=af.find("input[type=file]");if(a8.val()){a8.replaceWith(a8.clone(true))}if(a0.overwrite){a9=aA.children("#"+a5.attr("id"))}if(aj==1||a0.replace){a9=aA.children(".gridImage:eq(0)")}else{if(c.item&&a3.length==1){a9=c.item}}if(a9&&a9.length){a9.replaceWith(a5)}else{if(m&&m.length){m.before(a5);m=a5}else{if(a2===0){aZ.replaceWith(a5)}else{aA.append(a5)}}}if(aB){a5.find(".gridImage__overflow").css("width",aD+"%")}else{a5.find(".gridImage__overflow").css({height:aP+"px",width:aP+"px"});a5.find("img").hide()}a5.fadeIn(150,function(){a5.find("img").fadeIn();if(aB){o(ap,aD)}else{l(ap,aP)}}).css("display","");a5.addClass("InputfieldFileItemExisting");if(a9&&a9.length){a5.effect("highlight",500)}if(aZ.length){aZ.remove()}if(c.item&&aj!=1){a5.find(".InputfieldFileReplace").val(c.file);var bb=a5.find(".InputfieldImageEdit__name");var a7=bb.text();var ba=a7.substring(a7.lastIndexOf(".")+1).toLowerCase();a7=a7.substring(0,a7.lastIndexOf("."));var a6=c.file;if(a6.indexOf("?")>-1){a6=a6.substring(0,a6.indexOf("?"))}var a4=a6.substring(a6.lastIndexOf(".")+1).toLowerCase();a6=a6.substring(0,a6.lastIndexOf("."));if(a4==ba){bb.children("span").text(a6).removeAttr("contenteditable")}a5.find(".gridImage__edit").click()}c.file="";c.item=null;c.edit=null}if(al){clearTimeout(al)}m=null;al=setTimeout(function(){if(aj!=1){I(aA)}else{y(ap)}A("body").removeClass("pw-uploading");aA.trigger("AjaxUploadDone")},500);ap.trigger("change").removeClass("InputfieldFileEmpty")},false);if(c.edit){c.edit.find(".InputfieldImageEdit__close").click()}else{if(ap.find(".InputfieldImageEdit:visible").length){ap.find(".InputfieldImageEdit__close").click()}}if(c.item){c.item.replaceWith(aZ);c.item=aZ}else{if(m&&m.length){m.before(aZ)}else{aA.append(aZ)}}function aV(a0,a2){if(typeof aH=="undefined"){aJ.open("POST",aa,true)}aJ.setRequestHeader("X-FILENAME",encodeURIComponent(a0.name));aJ.setRequestHeader("X-FIELDNAME",Z);if(c.item){aJ.setRequestHeader("X-REPLACENAME",c.file)}aJ.setRequestHeader("Content-Type","application/octet-stream");aJ.setRequestHeader("X-"+ad,ai);aJ.setRequestHeader("X-REQUESTED-WITH","XMLHttpRequest");if(typeof a2!="undefined"&&a2!=false){aJ.send(a2)}else{aJ.send(a0)}Q();ap.trigger("change");var a1=ap.find(".InputfieldFileItem").length;if(a1==1){ap.removeClass("InputfieldFileEmpty").removeClass("InputfieldFileMultiple").addClass("InputfieldFileSingle")}else{if(a1>1){ap.removeClass("InputfieldFileEmpty").removeClass("InputfieldFileSingle").addClass("InputfieldFileMultiple")}}}aK();var aG=aX.name.substring(aX.name.lastIndexOf(".")+1).toLowerCase();if(aq&&(aG=="jpg"||aG=="jpeg"||aG=="png"||aG=="gif")){var aN=new PWImageResizer(av);aS.addClass("pw-resizing");aN.resize(aX,function(a0){aS.removeClass("pw-resizing");aV(aX,a0)})}else{aV(aX)}}function am(ay,aF){var aD=function(aH){return parseInt(aH/1024,10)};if(typeof ay==="undefined"){at.innerHTML="No support for the File API in this web browser";return}for(var aB=0,aA=ay.length;aB<aA;aB++){var aE=ay[aB].name.split(".").pop().toLowerCase();var aG;if(aw.indexOf(aE)==-1){aG=aE+" is a invalid file extension, please use one of:  "+aw;ah.append(ac(aG,ay[aB].name))}else{if(!aq&&ay[aB].size>ao&&ao>2000000){var az=aD(ay[aB].size),aC=aD(ao);aG="Filesize "+az+" kb is too big. Maximum allowed is "+aC+" kb";ah.append(ac(aG,ay[aB].name))}else{if(typeof aF!="undefined"){ab(ay[aB],aE,aF)}else{ab(ay[aB],aE)}}}if(aj==1){break}}}ag.addEventListener("change",function(ay){am(this.files);ay.preventDefault();ay.stopPropagation();this.value=""},false)}function S(){var W=".InputfieldImageEdit__imagewrapper img";A(document).on("dragenter",W,function(){var Z=A(this);if(Z.closest(".InputfieldImageMax1").length){return}var aa=Z.attr("src");var X=Z.closest(".InputfieldImageEdit");var Y=Z.closest(".InputfieldImageEdit__imagewrapper");Y.addClass("InputfieldImageEdit__replace");c.file=new String(aa).substring(aa.lastIndexOf("/")+1);c.item=A("#"+X.attr("data-for"));c.edit=X}).on("dragleave",W,function(){var Y=A(this);if(Y.closest(".InputfieldImageMax1").length){return}var X=Y.closest(".InputfieldImageEdit__imagewrapper");X.removeClass("InputfieldImageEdit__replace");c.file="";c.item=null;c.edit=null})}S()}function r(T){var S={maxWidth:0,maxHeight:0,maxSize:0,quality:1,autoRotate:true,debug:ProcessWire.config.debug};var U=T.attr("data-resize");if(typeof U!="undefined"&&U.length){U=U.split(";");S.maxWidth=parseInt(U[0]);S.maxHeight=parseInt(U[1]);S.maxSize=parseFloat(U[2]);S.quality=parseFloat(U[3])}return S}function O(){A(".InputfieldImage.Inputfield").each(function(){a(A(this))});D();if(x()){R("")}else{P()}A(document).on("reloaded",".InputfieldImage",function(){var S=A(this);a(S);R(S)}).on("wiretabclick",function(U,T,S){T.find(".InputfieldImage").each(function(){a(A(this))})}).on("opened",".InputfieldImage",function(){a(A(this))})}O()}jQuery(document).ready(function(a){InputfieldImage(a)});
\ No newline at end of file
diff --git a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.scss b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.scss
index e7ac2de8..f8822164 100755
--- a/wire/modules/Inputfield/InputfieldImage/InputfieldImage.scss
+++ b/wire/modules/Inputfield/InputfieldImage/InputfieldImage.scss
@@ -3,6 +3,7 @@ $deleteColor: #e83561;
 $errorColor: #FC3A3F;
 $gridMargin: 0 0.6em 0.6em 0;
 $itemPadding: 0.4em;
+$focusPointCircleSize: 40px;
 
 
 .InputfieldImage {
@@ -577,11 +578,17 @@ $itemPadding: 0.4em;
 
 	.focusCircle {
 		cursor: move;
-		width: 40px;
-		height: 40px;
-		border: 3px solid #fff;
+		width: $focusPointCircleSize;
+		height: $focusPointCircleSize;
+		margin: ($focusPointCircleSize * -1 / 2 + 0px) !important;
+		// border: 3px solid #fff;
+		// background-color: rgba(255,255,255,0.3);
+		border: 3px solid #EB1D61;
 		border-radius: 50%;
-		background-color: rgba(255,255,255,0.3);
+		background-color: rgba(255, 255, 255, 0.6);
+		background-image: url(data:image/gif;base64,R0lGODlhBAAEAIAAAOsdYQAAACH5BAAAAAAALAAAAAAEAAQAAAIEhI8JBQA7); // 4x4 px magenta
+		background-position: 15px 15px;
+		background-repeat: no-repeat;
 	}
 }