Using the image browser tool to insert images into the Editor

One of the tools available in the Editor toolset is the image browser. The image browser tool allows you to insert an image into the Editor. It asks the user for the image URL and an optional alternate text by displaying the dialog box, as shown in the following screenshot:

However, many of the rich applications being built today allow users to browse the images in a repository, upload images, and also remove images from the same repository. The image browser tool used in the Editor can be customized to allow these actions. In this recipe, we will see how the image browser tool is used to address such scenarios.

Getting ready

In this recipe, we will first take a look at reading images from a repository and showing thumbnails for the same in the image browser. This requires a server-side application to respond to a request that returns a JSON structure that provides metadata, such as the image name and file size.

Also, to display a...