fusepool-uduvudu/browser.html at master · fusepool/fusepool-uduvudu · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<html>
<head>
    <meta charset="UTF-8">
    <link href="lib/bootstrap.min.css" rel="stylesheet">
    <script src="lib/underscore-1.6.0.js" type="text/javascript"></script>
    <script src="lib/jquery-1.10.2.min.js" type="text/javascript"></script>
    <script src="lib/handlebars-v1.3.0.js" type="text/javascript"></script>
    <script src="lib/rdf_store.js" type="text/javascript"></script>
    <script src="matcher.js" type="text/javascript"></script>
    <script src="src/uduvudu.js" type="text/javascript"></script>
</head>
<body>
    <div class="container">
        <div id="main">
            <h1>Uduvudu Browser</h1>
            <p>This is an example showing Uduvudu incorporated in a browser style application.</p>
            <p>You can start browsing adding in the location bar the <code>uri</code> variable. As e.g. <a href="?uri=http://dbpedia.org/resource/Nature"><code>?uri=http://dbpedia.org/resource/Nature</code><a></p>
        </div>
    </div>
    <div id="visualizer">
    </div>
    <script type="text/javascript">
        // prepare visualizer templates for uduvudu
        $("#visualizer").load("visualizer_browser.html");

        // helper to decipher the get query
        function getParameterByName(name) {
            name = name.replace(/[\[]/, "\\\[").replace(/[\]]/, "\\\]");
            var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
                results = regex.exec(location.search);
            return results == null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
        }

        function loadFromSource(source, resource) {
            var store = rdfstore.create();
            $("#main").html('<div class="alert alert-info"><button type="button" class="close" data-dismiss="alert">&times;</button> <strong>Loading</strong> '+source+' is being loaded ...</div>');
            if (source.substring(0,4) === "http") {
                store.load('remote',source, function(success, amountTriples){
                    if(success) {
                        console.debug("successfully loaded "+amountTriples+" triples");
                        $("#main").html(uduvudu.process(store, resource));
                    };
                })
            } else {
                $.get(source, function(response) {
                    store.load('text/turtle',response, function(success, amountTriples){
                        if(success) {
                            console.debug("successfully loaded "+amountTriples+" triples");
                            var startTime = new Date();
                            $("#main").html(uduvudu.process(store, resource));
                            console.log("rendered in " + ((new Date()) - startTime) + "ms");
                        };
                    })
                });
            };
        };

        // if uri is specified in title get it
        var uri = getParameterByName('uri');
        if (uri != '') {
            loadFromSource(uri);
            }
    </script>
</body>
</html>