Week 12-13: Integration of Image Editor

Welcome to the eleventh week of the coding period. For the last two weeks, I have been working on Integration of Image Editor in Exerciser so that images could also be edited before using them in Exercises.

Integration of Image Editor.

When using images in an application, the need for an image editing feature is implied. Therefore, the recent patch of code integrates image editor within Exerciser. It is built upon cropperJS. Earlier upon clicking on an Image in edit mode, a modal used to appear which showed a magnified version of the image, but now in addition to that, an edit button is shown in the modal, clicking on which opens up image editing options as shown below.

Few of the functionalities include:

1. Crop
2. Flip Vertical
3. Flip Horizontal
4. Rotate(+- 90)
5. Undo

Crop

Crop is one of the most important features in an image editing environment. A user can select a portion of the image with the help of a scalable box and can get that area cropped out as shown.

The changes made in the Editor can be saved by pressing the tick button in the top right corner and can be discarded by pressing the cross button beside it.

The coding period has almost come to an end, the coming week will be more about solving minor issues and documenting the work done in the last three months instead of implementing a new one. It was great sharing this milestone with you. Looking forward to seeing you all next week. Have a great week ahead.