A component with Javascript

I try to implement a component with javascript, I have read an article that is called "Vaadin loves Javascript" and I made all according to the example, I implemented state, component classes which extend JavaScriptComponentState and AbstractJavaScriptComponent, also implemented connector.js, the snippets of code are bellow:

//----------------------------------------------------------------------------------
package ru.maximgorin.ams.monitor.gui.view;

import com.vaadin.shared.ui.JavaScriptComponentState;

public class SvgViewState extends JavaScriptComponentState{
    public String path;
    
}
//----------------------------------------------------------------------------------
package ru.maximgorin.ams.monitor.gui.view;

import com.vaadin.annotations.JavaScript;
import com.vaadin.server.Resource;
import com.vaadin.ui.AbstractJavaScriptComponent;
import com.vaadin.ui.Image;

@JavaScript({ "vaadin://js/SvgView.js",
        "vaadin://js/browserify.js",
        "vaadin://js/control-icons.js",
        "vaadin://js/shadow-viewport.js",
        "vaadin://js/stand-alone.js",
        "vaadin://js/svg-pan-zoom.js",
        "vaadin://js/svg-utilities.js",
        "vaadin://js/uniwheel.js",
        "vaadin://js/utilities.js", })

public class SvgView extends AbstractJavaScriptComponent {
    public SvgView() {
        setWidth("100%");
        setHeight("100%");
    }

    @Override
    public void setWidth(String width) {
        super.setWidth(width);
        getState().width = width;
    }

    public void setHeight(String height) {
        super.setHeight(height);
        getState().height = height;
    }

    public void setSource(Resource source) {
        getState().path = source.toString();
    }

    public void setResource(Resource resource) {
        if (resource == null) {
            throw new IllegalArgumentException("resource is null");
        }
        getState().path = resource.toString();
        Image l;
    }

    @Override
    protected SvgViewState getState() {
        return (SvgViewState) super.getState();
    }
}
//------------------------------------------------------------------------
ru_maximgorin_ams_monitor_gui_view_SvgView=function() {

  var e = this.getElement();
  this.onStateChange = function() {
    var path=this.getState().path;
    var width=this.getState().width;
    var height=this.getState().height;
    e.innerHTML = "<img id=\"svgview\" src=\"" + path + "\" style=\"width: " + width + "; height: " + height + ";\"/>" + 
    "<script src=\"svg-pan-zoom.js\">svgPanZoom('#svgview', {
          zoomEnabled: true,
          controlIconsEnabled: true
        });"+
    "</script>";
  }
}

And the last file I put into ../VAADIN/js directory and the file is accessible to a link: http://localhost:8080/App/VAADIN/js/SvgView.js. When I try to show my component I always have the next error: 
Could not initialize JavaScriptConnector because no JavaScript init function was found. Make sure one of these functions are defined:ru_maximgorin_ams_monitor_gui_view_SvgView
com_vaadin_ui_AbstractJavaScriptComponent
com_vaadin_ui_AbstractComponent
com_vaadin_server_AbstractClientConnector

What's wrong? I have made components according to documentation, and I tried to put the connector file into different places and result is the same.