Include javascript file with relative path

General
1

Hi,

How to include javascript in vaadin appication yousing relative path.


@JavaScript(value = { “…/resources/example.js” })
this does not work


@JavaScript(value = { “example.js” })
 this works, but then I need to put the javascript file inside package where my JAVA files are placed.

Reference post :
https://vaadin.com/forum#!/thread/4924537

Regards,
Kunal Patil

2

Hi!

For the location problem of the JS files we tried an other approach: Rewriting the @JavaScript at runtime
See following post - sources included

https://vaadin.com/forum#!/thread/4991257

Code for rewriting the annotations at runtime

import java.lang.annotation.Annotation;
import java.lang.reflect.Field;
import java.lang.reflect.Proxy;
import java.util.ArrayList;
import java.util.LinkedHashMap;
import at.sciencesoft.mathjax.MathJax;

import com.vaadin.annotations.JavaScript;
import com.vaadin.annotations.StyleSheet;

public class ChangeAnnotation {

    static public void addJSpathToJavaScriptAnno(Class<?> clazz, String[] jsPathList)
            throws Exception {
        Annotation a = clazz.getAnnotation(JavaScript.class);
        Object invocationHandler = Proxy.getInvocationHandler(a);
        Field field = invocationHandler.getClass().getDeclaredField(
                "memberValues");
        field.setAccessible(true);
        @SuppressWarnings("unchecked")
        LinkedHashMap<String, String[]> map = (LinkedHashMap<String, String[]
>) field
                .get(invocationHandler);
        String[] paths = map.get("value");
        ArrayList<String> pathList = new ArrayList<String>();
        for (String s : paths) {
            pathList.add(s);
        }
        for (String s : jsPathList) {
            pathList.add(s);
        }
        map.put("value", pathList.toArray(new String[pathList.size()]
));
        field.set(invocationHandler, map);

    }
    
    static public void setStyleSheet(Class<?> clazz, String[] cssPathList)
            throws Exception {
        Annotation a = clazz.getAnnotation(StyleSheet.class);
        Object invocationHandler = Proxy.getInvocationHandler(a);
        Field field = invocationHandler.getClass().getDeclaredField(
                "memberValues");
        field.setAccessible(true);
        @SuppressWarnings("unchecked")
        LinkedHashMap<String, String[]> map = (LinkedHashMap<String, String[]
>) field
                .get(invocationHandler);
        map.put("value",cssPathList);
        field.set(invocationHandler, map);
    }

}

Examaple

@JavaScript({ "js_chemdoodle_label.js"})
@StyleSheet({"ChemDoodleWeb.css"})
public class ChemDoodle  extends com.vaadin.ui.AbstractJavaScriptComponent  {
    private static final long serialVersionUID = 1L;
    private static boolean changeAnno = false;
    
    public ChemDoodle(String canvasID,String script) throws Exception {
        if(!changeAnno) {
            String url =  Page.getCurrent().getLocation() + "web/ChemDoodleWeb/install/";
            changeAnno = true;
            ChangeAnnotation
            .addJSpathToJavaScriptAnno(
                    ChemDoodle.class,
                    new String[] {
                        url + "ChemDoodleWeb.js",
                    });
            ChangeAnnotation.setStyleSheet(ChemDoodle.class, new String[] {
                        url + "ChemDoodleWeb.css",
                    });
        }
        getState().canvasID = canvasID;
        getState().script = script;
    }

    @Override
    protected ChemDoodleState getState() {
        return (ChemDoodleState) super.getState();
    }
}
3

Thanks Peter. :slight_smile:
I will try out this approach.