Anyone have an experience to embedding Visualize.js into APEX Application to integrate JasperServer Reports?

does anyone have an experience in embedding Visualize.js into APEX Application to integrate JasperServer Reports ?! Using the REST or iFrame is not a case i'm afraid. Not a big fan of JavaScript, but it looks like the only way this time. Done some research and didn't find any usefull info, as most of people using either REST or iFrame. Any help highly appreciated! At least show me at which direction to dig or the rough plan ... e.g do I need to upload some libraries and actually what to start with ?! Thanks!

P.S. Apex 4.2.6 up and running, JasperServer 6.0 up and running.

Solution

I've been on Jaspersoft's visualize course and use Apex occasionally. You need to have a plain html region where you can write stuff and then use the visualize library to get reports and reports metadata from the server. You have to ensure that you are authenticated on the server and have a div or something in the dom where you can put the resulting report. You also have to grab the visualize library.

It would just be like adding any other custom html/javascript to an Apex application.

Here is a code sample to get visualize, authenticate and get a report into the dom:

<!DOCTYPE html>
<html>
<head>
    <title></title>
</head>
<!--
<script src="http://code.jquery.com/jquery-2.1.0.js"></script>
--> 
<script src="http://localhost:8080/jasperserver-pro/client/visualize.js"></script>
<script type="text/javascript">

visualize({
    auth: {
        name: "jasperadmin",
        password: "jasperadmin"
    }
}, function (v) {

    var report = v.report({
        resource: "/public/Samples/Reports/9.CustomerDetailReport",
        container: "#container"
    });
});

</script>
<body>

<div id="container"></div>

</body>
</html>