radzenhq / radzen-blazor

Radzen Blazor is a set of 90+ free native Blazor UI components packed with DataGrid, Scheduler, Charts and robust theming including Material design and FluentUI.
https://www.radzen.com
MIT License
3.52k stars 786 forks source link

Support Clickable Thumbnails in HTMLEditor #1659

Closed wss-alubic closed 1 month ago

wss-alubic commented 1 month ago

Is your feature request related to a problem? Please describe. We're using Radzen and we have a request to support uploading larger images as thumbnails. There's no built in way to do this currently that I'm able to see.

Describe the solution you'd like I think the easiest solution is to modify Radzen.createEditor to accept an optional response property of "thumbnailUrl". If it exists, insert the HTML of <a href="result.url" target="_blank"><img src="result.thumbnailUrl"></a> instead of just the img tag.

https://github.com/radzenhq/radzen-blazor/blob/dd4afb1d0a2fa70a6ebb18b1e076fe657f829c24/Radzen.Blazor/wwwroot/Radzen.Blazor.js#L1814

Describe alternatives you've considered I am considering patching Radzen.createEditor myself to do this functionality. I would replace createEditor with an equivalent version that supports result.thumbnailUrl from the upload url http response.

I'm willing to submit a PR with the enhancement, but I wanted to open an issue and have a discussion first.

akorchev commented 1 month ago

Hi @wss-alubic,

I am afraid I didn't understand what you are trying to achieve. At the moment image uploads rely on the url attribute of the result returned from the upload method. You can probably return whatever value you want in that attribute without the need of a new one.

wss-alubic commented 1 month ago

Hello @akorchev!

You're correct, we could return a thumbnail as the result.url from the upload method, but that does not fit the goal we're trying to achieve.

Our use case is that we want the thumbnail image to be clickable so you can view the full-sized image. I apologize as I should have made this clearer in the original post. This would mean we require two URLs; one to a resized thumbnail URL and one to a full-sized URL.

akorchev commented 1 month ago

Still not sure what this means. In order for the image to be clickable you have to insert a link as well. This isn't supported out of the box - you need to implement a custom tool. Check the implementation of RadzenHtmlEditorImage and the custom tools demo for inspiration.