RemoteFrame/test.html at master · elsmorian/RemoteFrame · 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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta charset="UTF-8">
    <title>Remote Frame</title>
    <script type="text/javascript" src="js/jquery-1.5.1.min.js"></script>
    <script type="text/javascript">

    var json_url = "http://127.0.0.1:8080/get";
    var img_url = "<img src=\"http://127.0.0.1:8080/static/artwork.png"

    var old_item = "";
    //var img_dl = false;

    function update(){
        var jsonfile = $.ajax({ type: "GET", url: json_url,async: false }).responseText;
        console.log(jsonfile)
        var iTunes = jQuery.parseJSON(jsonfile);

        //console.log(iTunes);
        if (!iTunes || !jsonfile) {
            console.log('Error contacting server..');
        }
        else {

            $("h1#Header").text("");
            console.log(old_item);
            console.log(iTunes.item);
            if (old_item != iTunes.item){
                $("h1#Title").text(iTunes.item);
                $("h2#Artist").text(iTunes.artist);
                $("h2#Album").text(iTunes.album);
                old_item = iTunes.item;
                if (iTunes.artwork) {
                    var d=new Date();
                    $("div#Artwork").html(img_url+"?"+d+"\">");
                    console.log(img_url+"?"+d+"\">");
                }
                else {
                    $("div#Artwork").html("");
                }
            }
        }
    }

    $(document).ready(function() {
        update();
    });

    setInterval(function(){update();}, 1000);

    </script>
</head>
<body>
    <div>
        <h1 id="Header">Loading...</h1>
        <h1 id="Title"></h1>
        <h2 id="Artist"></h2>
        <h2 id="Album"></h2>
    </div>
    <div id="Artwork">
    </div>
</body>
</html>