wire/modules/Inputfield/InputfieldImage/InputfieldImage.js
/**
	 * Initialize non-upload related events
	 *
	 */
Initialize non-upload related events
Initialize non - upload related events
function initGridEvents() {
		$(window).resize(throttle(windowResize, 200));
		$(document).on('click dblclick', '.gridImage__trash', function(e) {
			var $input = $(this).find("input");
			$input.prop("checked", inverseState).change();
			if(e.type == "dblclick") {
				setDeleteStateOnAllItems($input);
				e.preventDefault();
				e.stopPropagation();
			}
		});
		$(document).on("change", ".gridImage__deletebox", function() {
			updateDeleteClass($(this));
		});
		$(document).on('click', '.gridImage__edit', function(e) {
			var $el = $(this).closest(".gridImage");
			if(!$el.length) return;
			if($el.closest('.InputfieldImageEditAll').length) return false;
			var $all = $el.closest(".gridImages");
			var $edit = $all.find(".InputfieldImageEdit");
			if($el.hasClass('gridImageEditing')) {
				$edit.find(".InputfieldImageEdit__close").click();	
			} else {
				moveEdit($el, $edit);
				tearDownEdit($edit);
				setupEdit($el, $edit);
				$edit.addClass("InputfieldImageEdit--active").attr('data-for', $el.attr('id'));
				$all.find('.gridImageEditing').removeClass('gridImageEditing');
				$el.addClass('gridImageEditing');
			}
		}).on('click', '.InputfieldImageEditAll img', function(e) {
			e.stopPropagation();
			e.preventDefault();
			$.magnificPopup.close();
			var options = $.extend(true, {}, magnificOptions);
			var $img = $(this);
			options['items'] = {
				src: $img.attr('data-original'),
				title: $img.attr('alt')
			};
			$.magnificPopup.open(options);
			return true;
		}).on('click', '.InputfieldImageButtonFocus', function() {
			var $button = $(this);
			var $icon = $button.find('i');
			var $edit = $button.closest('.InputfieldImageEdit, .gridImage'); 
			var $focusCircle = $edit.find('.focusCircle');
			if($focusCircle.length) {
				stopFocus($edit);
			} else {
				startFocus($edit);
				$icon.addClass('focusIconActive');
				$icon.toggleClass($icon.attr('data-toggle'));
			}
		}); 
		$(document).on("click", function(e) {
			var $el = $(e.target);
			if(typeof clickLanguageTabActive != "undefined" && clickLanguageTabActive) {
				return;
			}
			if($el.closest(".InputfieldImageEdit").length) {
				closeEdit(null, $el.parents(".gridImages"));
			} else if($el.is("input, textarea") && $el.closest(".InputfieldImageEditAll").length) {
				$el.focus().one('blur', function() {
					$el.closest('.gridImages').sortable('enable'); 
				});
				$el.closest('.gridImages').sortable('disable'); 
			} else if($el.closest(".gridImage__inner").length) {
				closeEdit(null, $el.parents(".gridImages"));
			} else if($el.closest(".mfp-container").length) {
				return;
			} else if($el.closest(".ui-dialog").length) {
				return;
			} else if($el.is(".mfp-close")) {
				return;
			} else if($el.is("a.remove")) {
				return;
			} else {
				closeEdit(null, null);
			}
		});
		$(document).on("click", ".InputfieldImageEdit__close", function(e) {
			closeEdit($(this).parents(".gridImages"), null);
		});
		$(document).on("change", ".InputfieldImage", function() {
			$(this).find('.InputfieldImageButtonCrop:not(.pw-modal-dblclick)')
				.addClass('pw-modal-dblclick ui-state-disabled');
		}).on("click", ".InputfieldImageButtonCrop.ui-state-disabled", function(e) {
			var $button = $(this);
			var $list = $button.closest('.gridImages');
			if(!$list.hasClass('gridImagesAlerted')) {
				ProcessWire.alert(ProcessWire.config.InputfieldImage.labels.changes);
				$list.addClass('gridImagesAlerted');
			}
			setTimeout(function() {
				$button.removeClass('ui-state-active');
			}, 500);
			return false;
		});
		$(".ImagesGrid").on("click", "button.pw-modal", function(e) {
			e.preventDefault();
		});
		setupEditableFilename();
		checkInputfieldWidth();
	}
function initGridEvents ( ) { $ ( window ) . resize ( throttle ( windowResize , 200 ) ) ; $ ( document ) . on ( 'click dblclick' , '.gridImage__trash' , function ( e ) { var $input = $ ( this ) . find ( "input" ) ; $input . prop ( "checked" , inverseState ) . change ( ) ; if ( e . type == "dblclick" ) { setDeleteStateOnAllItems ( $input ) ; e . preventDefault ( ) ; e . stopPropagation ( ) ; } } ) ; $ ( document ) . on ( "change" , ".gridImage__deletebox" , function ( ) { updateDeleteClass ( $ ( this ) ) ; } ) ; $ ( document ) . on ( 'click' , '.gridImage__edit' , function ( e ) { var $el = $ ( this ) . closest ( ".gridImage" ) ; if ( ! $el . length ) return ; if ( $el . closest ( '.InputfieldImageEditAll' ) . length ) return false ; var $all = $el . closest ( ".gridImages" ) ; var $edit = $all . find ( ".InputfieldImageEdit" ) ; if ( $el . hasClass ( 'gridImageEditing' ) ) { $edit . find ( ".InputfieldImageEdit__close" ) . click ( ) ; } else { moveEdit ( $el , $edit ) ; tearDownEdit ( $edit ) ; setupEdit ( $el , $edit ) ; $edit . addClass ( "InputfieldImageEdit--active" ) . attr ( 'data-for' , $el . attr ( 'id' ) ) ; $all . find ( '.gridImageEditing' ) . removeClass ( 'gridImageEditing' ) ; $el . addClass ( 'gridImageEditing' ) ; } } ) . on ( 'click' , '.InputfieldImageEditAll img' , function ( e ) { e . stopPropagation ( ) ; e . preventDefault ( ) ; $ . magnificPopup . close ( ) ; var options = $ . extend ( true , { } , magnificOptions ) ; var $img = $ ( this ) ; options [ 'items' ] = { src : $img . attr ( 'data-original' ) , title : $img . attr ( 'alt' ) } ; $ . magnificPopup . open ( options ) ; return true ; } ) . on ( 'click' , '.InputfieldImageButtonFocus' , function ( ) { var $button = $ ( this ) ; var $icon = $button . find ( 'i' ) ; var $edit = $button . closest ( '.InputfieldImageEdit, .gridImage' ) ; var $focusCircle = $edit . find ( '.focusCircle' ) ; if ( $focusCircle . length ) { stopFocus ( $edit ) ; } else { startFocus ( $edit ) ; $icon . addClass ( 'focusIconActive' ) ; $icon . toggleClass ( $icon . attr ( 'data-toggle' ) ) ; } } ) ; $ ( document ) . on ( "click" , function ( e ) { var $el = $ ( e . target ) ; if ( typeof clickLanguageTabActive != "undefined" && clickLanguageTabActive ) { return ; } if ( $el . closest ( ".InputfieldImageEdit" ) . length ) { closeEdit ( null , $el . parents ( ".gridImages" ) ) ; } else if ( $el . is ( "input, textarea" ) && $el . closest ( ".InputfieldImageEditAll" ) . length ) { $el . focus ( ) . one ( 'blur' , function ( ) { $el . closest ( '.gridImages' ) . sortable ( 'enable' ) ; } ) ; $el . closest ( '.gridImages' ) . sortable ( 'disable' ) ; } else if ( $el . closest ( ".gridImage__inner" ) . length ) { closeEdit ( null , $el . parents ( ".gridImages" ) ) ; } else if ( $el . closest ( ".mfp-container" ) . length ) { return ; } else if ( $el . closest ( ".ui-dialog" ) . length ) { return ; } else if ( $el . is ( ".mfp-close" ) ) { return ; } else if ( $el . is ( "a.remove" ) ) { return ; } else { closeEdit ( null , null ) ; } } ) ; $ ( document ) . on ( "click" , ".InputfieldImageEdit__close" , function ( e ) { closeEdit ( $ ( this ) . parents ( ".gridImages" ) , null ) ; } ) ; $ ( document ) . on ( "change" , ".InputfieldImage" , function ( ) { $ ( this ) . find ( '.InputfieldImageButtonCrop:not(.pw-modal-dblclick)' ) . addClass ( 'pw-modal-dblclick ui-state-disabled' ) ; } ) . on ( "click" , ".InputfieldImageButtonCrop.ui-state-disabled" , function ( e ) { var $button = $ ( this ) ; var $list = $button . closest ( '.gridImages' ) ; if ( ! $list . hasClass ( 'gridImagesAlerted' ) ) { ProcessWire . alert ( ProcessWire . config . InputfieldImage . labels . changes ) ; $list . addClass ( 'gridImagesAlerted' ) ; } setTimeout ( function ( ) { $button . removeClass ( 'ui-state-active' ) ; } , 500 ) ; return false ; } ) ; $ ( ".ImagesGrid" ) . on ( "click" , "button.pw-modal" , function ( e ) { e . preventDefault ( ) ; } ) ; setupEditableFilename ( ) ; checkInputfieldWidth ( ) ; }
Initialize non-upload related events
Initialize non - upload related events
// resize window event // click or double click trash event // change of "delete" status for an item event // click on "edit" link event // if item already has its editor open, then close it // stops focus // starts focus // LanguageTabs dblclick event // clicked input in "edit all" mode, disable sortable, focus it then assign a blur event // re-enable sortable on blur // disable sortable on focus // magnific popup container // jQuery UI dialog // magnific popup close button // selectize  // other // close "edit" panel // Warn about cropping after Inputfield has changed since crop may cause  // InputfieldContent to be reloaded which could cause changes to be lost /*
		// Longclick .gridItem to open magnific popup
		// Stops working as soon as an "Edit" panel has been opened, and 
		// also prevents any image zooms from working. :-/
		$(document).on('longclick', '.gridImage__edit', function() {
			var $img = $(this).closest('.gridImage').find('img');
			console.log($img.attr('data-original'));
			var options = magnificOptions;
			options['items'] = {
				src: $img.attr('data-original'),
				title: $img.attr('alt')
			};
			$.magnificPopup.open(options, 0);
			return false;
		});
		*/