Hello I am having problems to use a plugin fabric js in a project vaadin 10,
I managed to load the js scripts in the view and execute, by console I see that I have the references but it is not displayed in the html and in the view, so that vaadin is blocking the initialization of fabric:
FrontEnd Code (html):
<script src="./dist/fabric.min.js"></script>
<!--Init Polymer binding Vaadin-->
<script>
class ContainerTemplateMaker extends Polymer.Element {
static get is() {
return 'template-maker-view';
}
static get properties() {
return {
// Declare your properties here.
};
}
}
customElements.define(ContainerTemplateMaker.is, ContainerTemplateMaker);
canvas = new fabric.Canvas('Fcanvas');
fabric.Object.prototype.transparentCorners = false;
fabric.Object.prototype.cornerSize = 20;
canvas.setDimensions(
{
width: 500,
height: 500
});
</script>
Java code :
package com.gmail.fidel.ui.views.TemplateMaker;
import com.gmail.fidel.backend.data.Role;
import com.gmail.fidel.ui.MainView;
import com.gmail.fidel.ui.utils.BakeryConst;
import com.vaadin.flow.component.Tag;
import com.vaadin.flow.component.dependency.HtmlImport;
import com.vaadin.flow.component.dependency.JavaScript;
import com.vaadin.flow.component.polymertemplate.PolymerTemplate;
import com.vaadin.flow.router.PageTitle;
import com.vaadin.flow.router.Route;
import com.vaadin.flow.templatemodel.TemplateModel;
import org.springframework.security.access.annotation.Secured;
@Tag(“template-maker-view”)
@JavaScript(“src/views/TemplateMaker/dist/fabric.min.js”)
@HtmlImport(“src/views/TemplateMaker/container-template-maker.html”)
@Route(value = BakeryConst.PAGE_MAKE_TEMPLATE, layout = MainView.class)
@PageTitle(BakeryConst.TITLE_MAKE_TEMPLATE)
@Secured(Role.ADMIN)
public class ContainerTemplateMaker extends PolymerTemplate {
public ContainerTemplateMaker()
{
}
}