Memeit.lol TextWrapping Problem Fixed

Description

This is in response to the task request of memeit.lol owner. I have contacted the project owner and He said that the water mark size has been solved already and the only problem need to solve now is the Text Wrapping Problem.

Task

Add Text Wrapping to Fabric.JS + Watermark edit

Proof of Work

• PR(Merged and Deployed) https://github.com/memeit-lol/memeit.lol/pull/32

Problem

Need to add textwrapping to the fabrijs Text and align center the text.

It is only a one line code modification to solve the problem but since its a task request I did it.

Details

1. I have Use Textboxt fabricjs object instead of the Text object . Using Textbox will enable users to edit their text within the canvas.
2. I also added breakword:true to wrap text to break words if the user types so many words.
3. Also added textAlign:'center' to make the text center whenever they type text on the textbox object.

var text = new fabric.Textbox('CLICK ON ME', {width: 200,breakWords: true, textAlign:'center',left: 0, top: 0, fontFamily: 'Impact', fontSize: 40, stroke: '#000000', strokeWidth: 3, fill: "#ffffff" });