How To Use Thumbnail

Owned by Vinay
Last updated: Nov 28, 2017 by Kostis Pristouris
1 min read

Creating thumbnail

For both creating and accessing slide thumbnails, we are currently using the file-service microservice. This service provides a POST method, expecting two parameters: the slide id and the HTML content for the slide. The final slide thumbnail will be a JPEG file.

If the HTML to image conversion is successful, the service will return the URL of the created image. If there is error, it will return the error response.

Displaying thumbnail

On slidewiki-platform, there is a Thumbnail component that can be used to display a thumbnail image. Developers can use this component inside their other components. One should loop over it to show multiple components (see DeckView component for example use). Use CSS for positioning etc. as needed. This component takes url property as mandatory property. The thumbnail image URL has following URL path:

/slideThumbnail/{slideId}.jpeg


Example:

<a href={deckURL + '/slide/' + slide.id} className="ui medium image" tabIndex="-1">
    <Thumbnail key={index} url={thumbnailURL + '/slideThumbnail/' + slide.id + '.jpeg'} slideId={slide.id} />
</a>