Automaticly Resize Image when uploading

[ken zheng]

Hi:

  When user upload a wide size of image, it will not fit in the RadEditor box. I wonder if we can set the desired size in the config. So the image manager can generate/overwrite the uploaded image to reasonable size?

[Stanimir]

Hi Ken

Could you please tell me where exactly do you wish the image to be modified? In the editing are of the Editor after you click on the Insert button or in the preview section of the ImageManger dialogue.

If it is in the Image Manager dialogue, there are five buttons over the image, which you can use to modify it (Best Fit, Actual Size, Zoom In, Zoom Out, Create Thumbnail).

With the Create Thumbnail feature you can create smaller version of the image.

If you want all the images that you insert using the ImageMangaer to have the same size you can paste the following javascript code in the MOSSEditorTools.js file located in C:\Program Files\Common Files\Microsoft Shared\web server extensions\wpresources\RadEditorSharePoint\4.5.4.0__1f131a624888eeed\RadControls\Editor\Scripts\7_3_4 folder.

RadEditorCommandList["ImageManager"] = function (commandName, editor, oTool)
{
    var callBackFn = function(retValue, params)
    {
        /*
            retValue is of type
            {
                imagePath: "",
                linkImagePath: "",
                imageAltText: previewer.GetAltText()
            };
            Here you can use PasteHtml method of the Editor to paste the image
            For example.
            var editor = params.editor;
            editor.PasteHtml('<img style="width:20px; height: 20px;" src="' + retValue.imagePath + '" title="' + retValue.imageAltText + '"/>');
        */
    };
    var argument = {};

    argument.InternalParameters = editor.GetDialogInternalParameters(commandName);
    var dialogUrl = editor.GetDialogUrl(commandName);

    var selectedImage = editor.GetSelectedElement();
    if (selectedImage && selectedImage.tagName && selectedImage.tagName.toLowerCase() == "img")
    {
        dialogUrl += "&selectedObjectPath=" + RadEditorNamespace.Utils.RemoveProtocolNameAndServerName(selectedImage.src);
    }

    editor.ShowDialog(dialogUrl
        , argument
        , 400
        , 300
        , callBackFn
        , null
        , editor.Localization[commandName]);
    return false;
};

I hope this helps.

Greetings,
Stanimir
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.