Imageplus failed to generate thumbnail

nikkio · February 12, 2024, 2:31pm

Hi,

when i try to add an image with imageplus, I receive the following error:

immagine

I do not know if it is related, but each time i try to add an image via imageplus, I can see this error in the log viewer

[2024-02-12 15:27:40] (ERROR @ /web/htdocs/www.mywebsite.com/home/core/model/phpthumb/modphpthumb.class.php : 45) PHP warning: Constant IMG_AVIF already defined

Thank you for any help.

andytough · February 12, 2024, 4:45pm

Hi, If the image is of the file type AVIF (as suggested by the error log) it may be that it is not supported by imageplus, or that imageplus needs to be updated to support it. You may also find that your PHP version needs to be upgraded to 8.1. As usual please don’t upgrade or update anything without first doing a full backup of you site and database!
https://en.wikipedia.org/wiki/AVIF

nikkio · February 12, 2024, 5:23pm

HI, the image is not an AVIF file, I receive the same error also with older images.
Imageplus used to work on this website… i think it stopped working after a bunch of updates.
I also updated PHP to 8.1 with no success…

halftrainedharry · February 12, 2024, 5:39pm

The error message you posted gets generated in Javascript.
So I don’t think it’s a problem with PHP.

The image you selected, is it possible to display it on the site using a normal <img> tag?
Any weird characters in the image-URL?
Do you use a media-source? Is it set up correctly?

nikkio · February 12, 2024, 6:18pm

Hi, i can see the image in the Media Browser, and if I add the same image using with the “mixed image input” TV it works.
I have this problem when i try to upload any images via imageplus.
I use a media source with these settings:

After updating to php 8.1 from 8.0, the AVIF error is no more in the logs…

snowcreative · February 13, 2024, 4:03am

Are you using the latest version of Image Plus? I got that message at one point, and some sort of update fixed it, although I can’t remember what that was. This was on sites running PHP 7.4, so it wasn’t a PHP issue for me.

halftrainedharry · February 13, 2024, 8:56am

You could try to log the (erroneous) image path the ImagePlus extra tries to open.

It’s a bit tricky, because all the JS code is minified.
But basically open this file

github.com

Jako/ImagePlus/blob/2003fdf761f6b47ab43cb0504d055bac6d031a46/assets/components/imageplus/js/mgr/imageplus.min.js

/*!
 * ImagePlus - Advanced Image Template Variable
 * Version: 2.9.5
 * Build date: 2023-09-07
 */
var imagePlus=function(e){imagePlus.superclass.constructor.call(this,e=e||{})},JSON,$jqIP=(Ext.extend(imagePlus,Ext.Component,{page:{},window:{},grid:{},tree:{},panel:{},combo:{},config:{},jquery:{},form:{},generateThumbUrl:function(e){return this.generatePhpThumbUrl(e)},generatePhpThumbUrl:function(e){var t,n=MODx.config.connectors_url+"system/phpthumb.php?",i={wctx:"mgr",w:150,source:1};for(t in e)i[t]=e[t];var r="";for(t in i)r+=encodeURIComponent(t)+"="+encodeURIComponent(i[t])+"&";return n=0<r.length?n+"?"+(r=r.substring(0,r.length-1)):n},warnAboutUnmetDependencies:function(){MODx.load({xtype:"modx-window",title:"Image+ Warning – Unmet Dependencies",modal:!0,padding:25,allowDrop:!1,resizable:!0,collapsible:!0,maximizable:!0,buttons:[{text:_("ok"),handler:function(e){e.ownerCt.ownerCt.close()}}],html:"<h3>You don't have any crop engines!</h3><p>Before you can use Image+, you need at least one Crop Engine installed to handle image manipulation.</p><p>A quick fix is to install either pThumb, phpThumbOf, phpThumbsUp or phpThumbOn from the MODX Package Repository</p>"}).show()}}),Ext.reg("imageplus",imagePlus),ImagePlus=new imagePlus,ImagePlus.panel.input=function(e){this.options=(e=e||{}).options,this.image={},this.getValue(e.hiddenField),this.createImageBrowser(),this.createImagePreview(),this.createTextFields(),ImagePlus.config.hasUnmetDependencies&&ImagePlus.warnAboutUnmetDependencies(),Ext.apply(e,{border:!1,config:e,baseCls:"modx-panel",hiddenField:e.hiddenField,width:"400px",items:[{xtype:"compositefield",anchor:"100%",hideLabel:!0,listeners:{afterrender:{fn:this.onAfterRender,scope:this}},items:[this.imageBrowser]},{cls:"modx-tv-image-preview imageplus-image-preview",border:!1,items:[this.imagePreview,this.altTextField,this.captionField,this.creditsField]}]}),ImagePlus.panel.input.superclass.constructor.call(this,e),this.listenForResetEvent()},Ext.extend(ImagePlus.panel.input,MODx.Panel,{listenForResetEvent:function(){Ext.getCmp("modx-panel-resource").on("tv-reset",function(e){parseInt(e.id)===this.options.tvId&&this.onReset()},this)},createImageBrowser:function(){var e=this.image.sourceImg.src.split("/"),t=(e.pop(),e=e.join("/"),this);this.imageBrowser=new ImagePlus.combo.Browser({value:this.image.sourceImg.src,source:this.options.mediaSource,hideSourceCombo:!0,openTo:e,listeners:{select:{fn:this.onImageSelected,scope:this},change:{fn:function(e,t){this.onImageChange(t)},scope:this}},onTrigger1Click:function(){t.clearImage()},onTrigger2Click:function(){t.editImage()}})},createImagePreview:function(){this.imagePreview=new Ext.BoxComponent({autoEl:{tag:"img",src:""}})},createTextFields:function(){var t=this;this.altTextField=MODx.load({xtype:"panel",items:{xtype:this.options.altTagOn?"textfield":"hidden",submitValue:!1,value:this.image.altTag||"",listeners:{change:{fn:this.onAltTagChange,scope:this},afterrender:function(){var e=this.getEl();e&&t.options.altTagOn&&(e.set({placeholder:_("imageplus.alt_text")}),e.insertSibling({tag:"span",cls:"icon icon-code",style:"position: absolute; left: 8px; top: 14px; opacity: 0.6",title:_("imageplus.alt_text")},"after",!0))}},width:400,style:{marginTop:"5px",paddingLeft:"25px"}}}),this.captionField=MODx.load({xtype:"panel",items:{xtype:this.options.captionOn?"textfield":"hidden",submitValue:!1,value:this.image.caption||"",listeners:{change:{fn:this.onCaptionChange,scope:this},afterrender:function(){var e=this.getEl();e&&t.options.captionOn&&(e.set({placeholder:_("imageplus.caption")}),e.insertSibling({tag:"span",cls:"icon icon-header",style:"position: absolute; left: 8px; top: 14px; opacity: 0.6",title:_("imageplus.caption")},"after",!0))}},width:400,style:{marginTop:"5px",paddingLeft:"25px"}}}),this.creditsField=MODx.load({xtype:"panel",items:{xtype:this.options.creditsOn?"textfield":"hidden",submitValue:!1,value:this.image.credits||"",listeners:{change:{fn:this.onCreditsChange,scope:this},afterrender:function(){var e=this.getEl();e&&t.options.creditsOn&&(e.set({placeholder:_("imageplus.credits")}),e.insertSibling({tag:"span",cls:"icon icon-copyright",style:"position: absolute; left: 8px; top: 14px; opacity: 0.6",title:_("imageplus.credits")},"after",!0))}},width:400,style:{marginTop:"5px",paddingLeft:"25px"}}})},generateThumbUrl:function(e){var t,n=MODx.config.connectors_url+"system/phpthumb.php",i={wctx:"mgr",w:this.options.thumbnailWidth,source:this.image.sourceImg.source};for(t in e)i[t]=e[t];var r="";for(t in i)r+=encodeURIComponent(t)+"="+encodeURIComponent(i[t])+"&";return n=0<r.length?n+"?"+(r=r.substring(0,r.length-1)):n},onReset:function(){this.getValue(this.config.hiddenField),this.imageBrowser.setValue(this.image.sourceImg.src||""),this.updatePreviewImage.defer(10,this)},onAfterRender:function(){this.updateDisplay()},onImageSelected:function(e){var t=!this.image.sourceImg||this.image.sourceImg&&this.image.sourceImg.src!==e.relativeUrl;this.setOldSource(

This file has been truncated. show original

then at the position where this code is

s.src=o+this.image.sourceImg.src

add a console log statement to ouput the “src” attribute of the image:

s.src=o+this.image.sourceImg.src;console.log("image-src = "+s.src);

Then hard refresh the browser and open the developer tools (“Console” tab) to check the logged output.

nikkio · February 13, 2024, 11:08am

Hi, i added the logging in the console a this is the (wrong) image path:

This is a multilanguage website, can be something related to that?

halftrainedharry · February 13, 2024, 11:39am

Try removing the slash (/) at the beginning of the “baseUrl” and “basePath” properties in the Media Source:

assets/usermedia/ instead of /assets/usermedia/.

nikkio · February 13, 2024, 12:00pm

I just chanded the path before your last reply and it worked! Thank you for ponting me in the right direction!

However this is odd, before the update, it used to work fine with the slash a the beginning of both paths…

Thank you again for your help.

snowcreative · February 13, 2024, 2:19pm

Right! That was the fix when I had this problem a year ago. I had to update the media sources on most of my sites.

An update to MODX changed how the paths work. It fixed some other problems with paths.

system · February 15, 2024, 2:19pm

This topic was automatically closed 2 days after discussion ended and a solution was marked. New replies are no longer allowed. You can open a new topic by clicking the link icon below the original post or solution and selecting “+ New Topic”.