Image Editor - sometimes exception while editing pictures

[Felix]

Hi Guys,

depending on the used browser (IE, FF, Chrome) we sometimes run into a "NullReferenceException" while trying to open a picture to edit. FF & Chrome working almost all time while IE throws an exeption one of 3 times.

Within this forum we found the guess that someting with webResources/seasson state server is the reason of this error (http://www.telerik.com/community/forums/aspnet-ajax/editor/editor-image-manager-refresh-image-save-image-doesn-t-work-very-well.aspx#2187725) - but we can exclude this after a few tests.

This is the exception we run into:

2012.11.20 17:44:30.988 ThreadId=7 Fatal ErrorsHttpModule
UrlQueryString: /v0/Telerik.Web.UI.WebResource.axd?type=iec&pr=c&key=c695498e-de5a-4dbd-9e85-f4a4e40398c0
REMOTE_ADDR: 192.168.1.38
HTTP_USER_AGENT: Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
HTTP_REFERER: [...]/Telerik.Web.UI.DialogHandler.aspx?DialogName=ImageEditor&Skin=Default&Title=&doid=ad5a5db1-7982-46bf-90b9-2afeea8662e6&dpptn=
HttpApplication.RecordError => HttpApplication.RaiseOnError => CustomExceptionHttpModule.app_Error
m1.eRelCL.WebSite.Exceptions.CustomExceptionHttpModule.app_Error

FatalException
m1.eRelCL.WebSite.Exceptions.CustomException

InnerException
System.NullReferenceException: Der Objektverweis wurde nicht auf eine Objektinstanz festgelegt.
   bei Telerik.Web.UI.ImageEditor.ImageEditorCacheHandler.SendImage(EditableImage editableImage, HttpContext context, String path, String fileName)
   bei Telerik.Web.UI.ImageEditor.ImageEditorCacheHandler.ProcessRequest(HttpContext context)
   bei Telerik.Web.UI.HandlerRouter.ProcessHandler(String handlerKey, HttpContext context)
   bei Telerik.Web.UI.HandlerRouter.ProcessHandler(HttpContext context)
   bei Telerik.Web.UI.WebResource.ProcessRequest(HttpContext context)
   bei System.Web.HttpApplication.CallHandlerExecutionStep.System.Web.HttpApplication.IExecutionStep.Execute()
   bei System.Web.HttpApplication.ExecuteStep(IExecutionStep step, Boolean& completedSynchronously)
After a few investigations we can confirm, that the error does not happen if we run our web application in
only one working process (application pool). Normaly four are default.

Now - do you know something about problems with the "ImageEditor" and IIS application pool Working processes?
This this a known Bug? I've tried the newest Telerik DLL (Q3 2012) but this does not help anything.

Best regards,
Felix

[Vessy]

Hi Felix,

If I understand the scenario correctly, you are using the ImageEditor into a load-balanced environment (WebGarden probably)? If so, there are some additional setting you need to configure in order to load the image in the editor properly (to load it from the session, not from the cache as is by default):

1. Set the ImageStorageLocation property of RadImageEditor to Session:

<telerik:RadImageEditor ID="RadImageEditor1" runat="server" ImageCacheStorageLocation="Session" ImageUrl="image.png"></telerik:RadImageEditor>

2. Configure the httpHandler (inside the web.config) in the following way:

<configuration>
    <system.web>
        <httpHandlers>
            <add path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResourceSession" verb="*" validate="false" />
        </httpHandlers>
    </system.web>
    <system.webServer>
        <handlers>
            <add name="Telerik_Web_UI_WebResource_axd" verb="*" preCondition="integratedMode" path="Telerik.Web.UI.WebResource.axd" type="Telerik.Web.UI.WebResourceSession" />
        </handlers>
    </system.webServer>
</configuration>

Hope this would be helpful.

Regards,
Vesi
the Telerik team

[Felix]

Hi Vesi,

thanks for your reply!
The idea with ImageCacheStorageLocation="Session" sounds great but we use the ImageManager (with image editor) outside the radeditor (like here:http://www.telerik.com/support/kb/aspnet-ajax/editor/using-the-image-and-document-managers-outside-radeditor.aspx) so I cant modify direct a parameter of "<telerik:RadImageEditor".

Our code looks like this:

FileManagerDialogParameters ImageManagerParameters = new FileManagerDialogParameters();
ImageManagerParameters.ViewPaths = viewDirectoryNames;
ImageManagerParameters.UploadPaths = uploadDirectoryNames;
ImageManagerParameters.DeletePaths = deleteDirectoryNames;
ImageManagerParameters.MaxUploadFileSize = 5000000;
string[] myImgManPatterns = new string[4];
myImgManPatterns[0] = "*.jpg";
myImgManPatterns[1] = "*.jpeg";
myImgManPatterns[2] = "*.gif";
myImgManPatterns[3] = "*.png";
ImageManagerParameters.SearchPatterns = myImgManPatterns;
ImageManagerParameters.FileBrowserContentProviderTypeName = typeof(MediaContentProvider).AssemblyQualifiedName;

DialogDefinition image4Manager = new DialogDefinition(typeof(ImageManagerDialog), ImageManagerParameters);
image4Manager.Width = Unit.Pixel(694);
image4Manager.Height = Unit.Pixel(440);
image4Manager.Parameters.Add("Language", currentLanguage);
image4Manager.Parameters["EnableEmbeddedSkins"] = true;
DialogOpener3.DialogDefinitions.Add("Image4Manager", image4Manager);

FileManagerDialogParameters imageEditorParameters = new FileManagerDialogParameters();
imageEditorParameters.ViewPaths = viewDirectoryNames;
imageEditorParameters.UploadPaths = uploadDirectoryNames;
imageEditorParameters.DeletePaths = deleteDirectoryNames;
imageEditorParameters.MaxUploadFileSize = 5000000;
imageEditorParameters.FileBrowserContentProviderTypeName = typeof(MediaContentProvider).AssemblyQualifiedName;

DialogDefinition imageEditor = new DialogDefinition(typeof(ImageEditorDialog), imageEditorParameters);
imageEditor.Width = Unit.Pixel(832);
imageEditor.Height = Unit.Pixel(520);
imageEditor.Parameters.Add("Language", currentLanguage);
imageEditor.Parameters["EnableEmbeddedSkins"] = true;
DialogOpener3.DialogDefinitions.Add("ImageEditor", imageEditor);

Can you tell us where to set this parameter?

Best regards,
Felix

[Vessy]

Hi Felix,

In that scenario you will need to customize the Editor's external dialogs and especially the ImageEditor.ascx one. You have to set their path as a value of the ExternalDialogsPath property of the ImageEdito. After that you will be able to modify the ImageEditor.ascx dialog, adding the desired property:

DialogDefinition image4Manager = new DialogDefinition(typeof(ImageManagerDialog), imageManagerParameters);
image4Manager.Width = Unit.Pixel(694);
image4Manager.Height = Unit.Pixel(440);
image4Manager.Parameters.Add("Language", currentLanguage);
image4Manager.Parameters["EnableEmbeddedSkins"] = true;
DialogOpener3.DialogDefinitions.Add("Image4Manager", image4Manager);
image4Manager.Parameters["ExternalDialogsPath"] = "~/EditorDialogs/";

Note, that in order to make your modifications the Editor's External dialogs, they must be exactly the same version as the referenced DLLs in the project. You could find useful information on the subject here: Editor / Customize Built-in Dialogs.

Regards,
Vesi
the Telerik team

[Felix]

Hi Vesi,

thanks a lot! Now its working like a charm!

I had to change a other code section - but the idea you told me was correct :)

FileManagerDialogParameters imageEditorParameters = new FileManagerDialogParameters();
        imageEditorParameters.ViewPaths = viewDirectoryNames;
        imageEditorParameters.UploadPaths = uploadDirectoryNames;
        imageEditorParameters.DeletePaths = deleteDirectoryNames;
        imageEditorParameters.MaxUploadFileSize = 5000000;
        imageEditorParameters.Add("ExternalDialogsPath", ResolveUrl("~/xxx/xxx/EditorDialogs/"));
        imageEditorParameters.FileBrowserContentProviderTypeName = typeof(MediaContentProvider).AssemblyQualifiedName;

Thanks again, and best regards
Felix