Question about resource dispose (image)

[Shukhrat Nekbaev]

Hi,

question is simple:

protected void pageImageEditor_ImageSaving(object sender, ImageEditorSavingEventArgs args)
        {
            // maybe check is not required, but just in case
            if (args.Image != null && args.Image.Image != null)
            {
                // saved modified image clone to session for 'btnSaveImageChangesInternal_Click' usage
                SessionObjects.ImageEditorHelper.TempStorageForEditedProjectContentElementImage = (Image)args.Image.Image.Clone();
            }

            args.Cancel = true;
        }

will image resources be properly disposed automatically? As you can see I'm clonning modified image here and saving it to session, this custom property before setting value to session checks if there is object already, if so it calls Dispose on it.

My use case is that I trigger save on server from client side, on OnSaved client event I cause manual postback. This is needed because I need to modify the Viewstate once image is saved. I tried in server side's on saving, but Viewstate was reverting back, so this workaround was done.

Client side:

function imageEditorOnSaved(sender, e) {
            $("#<%= btnSaveImageChangesInternal.ClientID %>").click();
        }

        function saveChangesInImageEditor()
        {
            var imEditor = $find("<%= pageImageEditor.ClientID %>");
            imEditor.saveImageOnServer("<%= Guid.NewGuid().ToString() %>", true);
        }

in button's onclick server handler I pull image from session and save it with preprocessing I need, then remove session object.

Same applies to pageImageEditor_ImageLoading where this image is set:

protected void pageImageEditor_ImageLoading(object sender, ImageEditorLoadingEventArgs args)
        {
..
....
......
using (EditableImage image = new EditableImage(imgPath))
                {
                    args.Image = image.Clone();
                    args.Cancel = true;
                }
}

as soon as on that view I have image editing functionality for all pages, I force ImageEditor to load new image for page by:
pageImageEditor.ImageUrl = string.Empty;
otherwise it uses previously displayed image.

So does the handler properly disposes it's resources in my use cases?
Thank you!

[Pero]

Hello Shukhrat,

The RadImageEditor disposes the EditableImage on each postback or trip to the server. What happens is, the image changes performed on the client are applied on the server, the current EditableImage (the one with the latest changes) is cloned and saved in the Cache or Session (depending on the value set to the RadImageEditor.ImageCacheStorageLocation property; the default is ImageStorage.Cache), and finally the EditableImage is disposed.

When the EditableImage is loaded, the control looks if there is image in the Cache or the Session and loads it from there if present. Otherwise it loads it from the default location - the ImageUrl. Once you save the image in the desired location, you could clean the current EditableImage from the Cache, by calling the RadImageEditor1.ResetChanges()method. If you look at the default demo of the control, you will notice that we call this method to clear the previous image when a new gets uploaded (in the AsyncUpload1_FileUploaded event handler).
Besides, saving the image on the server by calling a method on the client, the saving can be triggered on the server by calling the SaveEditableImage.

So, to answer your question, yes the ImageEditor disposes its resources, but the EditableImage is saved in the Cache or Session, to persist the image changes during postbacks.

All the best,
Pero
the Telerik team

[Shukhrat Nekbaev]

Hi,

thanks for detailed answer! Really like those :)
Couple of questions:

>>Besides, saving the image on the server by calling a method on the client, the saving can be triggered on the server by calling the SaveEditableImage.

Note: I haven't tried, just guessing.
This method takes EditableImage as one of parameters, to create EditableImage I basically need to specify original image again. As I can guess this method will apply transformations from queue to original image. Is this correct?
And it my solution above I skip "loading original" and just take a copy of modified, trigger again server side event and save, should be safe also.

One misc drawback I see is that Session key value is not unique :)

P.S.: I've replaced:
pageImageEditor.ImageUrl = string.Empty;
with
pageImageEditor.ResetChanges();

when this modal dialog is closed. At least now I know that I'm disposing for sure :)

P.S.S.: I missed that method cause it's name hinted me that transformation queue will be cleared, but not that allocated resources will also be released :)

[Pero]

Hi Shukhrat,

The SaveEditableImage has two overloads:

• One overload takes two parameters, the imageName and a bool value (that indicates whether to overwrite the existing image, and saves the current editable image.
• The other takes plus one parameter, that is an EditableImage to save.

Best wishes,
Pero
the Telerik team

[Shukhrat Nekbaev]

Hi,

ok, I see, thanks for info.
Btw, how dictionary "key" is made up when image object is stored is cache or session: Cache["HowThisKeyIsMadeToBeUnique"], so that it handles concurrent edit of same image by same user, probably path + session id + some rand value which is stored... in viewstate/hidden field?

I mean that I open 2 tabs with same image and apply transformations on both and then toggle save on one of those. Will transformations from both tabs got mixed and applied to final save image. If they use identical key and I will call ResetChanges on first (after save) then toggle Save on second tab (probably will fire image loading first, but not sure and then save)...

UPDATE:
Ok, in my use case last one wins (have to go through fired events in debugger), so it's fine :)