[Solved] Alternate 'Select Image' in Image Map Editor

[Mathew]

Hi,

We use our own file viewer in place of the document and image managers (we needed our own specific functionality). We didn't simply change the content managers behind them - they are completely different controls that pop up in Rad Windows.

However, I don't know how to get the 'Select Image' button of the Image Map Editor to use our functions instead of the image manager. Is it possible to alter its behaviour to load some alternate javascript?

Thanks!

[George]

Hi Mathew,

This feature can be achieved with the following hack:

You need to override method showDialog to detect when the image manager is called from within another dialog and check if your dialog needs to be shown, or the original image manager should be called.After that call your own dialog, and provide it with the original callback function, e.g.

<telerik:radeditor runat="server" ID="RadEditor1" >  
    <Content>
    sample content <br />
    <img src="http://www.microsoft.com/library/toolbar/3.0/images/banners/hardware_masthead_ltr.gif" originalAttribute="src" originalPath="http://www.microsoft.com/library/toolbar/3.0/images/banners/hardware_masthead_ltr.gif" />
    </Content>
</telerik:radeditor>
<script type="text/javascript">
//Override method showDialog to detect when the image manager is called from within another dialog
Telerik.Web.UI.RadEditor.prototype.old_showDialog = Telerik.Web.UI.RadEditor.prototype.showDialog;
Telerik.Web.UI.RadEditor.prototype.showDialog = function(name, args, callback)
 {
    if (name != "ImageManager")
    {
        this.old_showDialog(name, args, callback);
    }
    else
    {
       //Check if your dialog needs to be shown, or the original image manager should be called.
       //We assume it is your dialog to be called when there is no arguments.caller object!
       if (!arguments.caller)
       {
            //Call your own dialog, and provide it with the original callback function!
            //the function will take care to insert the returned image src in the dialog input field
            this.showDialog("CustomImageDialog", {}, callback);               
       }
       else this.old_showDialog(name, args, callback);
    }
 }
</script>

For your convenience I prepared and attached a sample runnable project that demonstrates how the provided solution works. Please, use it as a base and extend it to best fit your scenario.


Best regards,
George
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[Mathew]

Thanks very much for this. Sorry for the late reply, I only got around to doing this yesterday as another project came up.

I still have one problem, though - I want to use the normal Image Manager when loading an image into the Image Map Editor. In the example you gave me, "arguments.caller" is used, I presume, to check where the request has come from. However, this value seems to always be false no matter what.

Is there any way that I can check to see if the user has loaded the Image Manager from the Image Map Editor?

Thanks!

[George]

Hi Mathew,

In your first message you have written that you want to "get the 'Select Image button of the Image Map Editor to use your functions instead of the image manager". In the last one you want to "use the normal Image Manager when loading an image into the Image Map Editor". I am a little bit confused. Could you please clarify what exactly do you what to achieve?

In addition to this, please open a support ticket and send us your runnable project. Thus we will be able to understand your exact scenario and directly modify your code.

Sincerely,
George
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center