Timothy Thompson's Take on Historical Markers

by johntynan

HTML

<script src="http://connect.soundcloud.com/sdk.js"></script>
<div id="images"></div>
<ol id="comments"></ol>

CSS

#comments {
    width: 400px;
    margin: auto;
    margin-top: 30px;
    font-family: "Helvetica";
    font-size: 14px;
    visibility: hidden;
}

#comments li {
    border-bottom: 1px solid #eee;
    padding-bottom: 5px;
    padding-top: 5px;
}

#images {
    margin-left:auto;
    margin-right:auto;
    width: 90%;
}

img.image { 
    width: 100%; 
}

JavaScript

SC.initialize({
    client_id: "135d8d7fc64d229deee3ab81570ae6e3"
});

SC.get("/tracks/37504637", function(sound) {
    var author = sound.user.username;
    // alert(sound.user.username);
    // alert(author);
    SC.stream("/tracks/76106568", {
        autoPlay: true,
        ontimedcomments: function(comments) {
            // we only handle the first comment for this timestamp
            // alert(author);
            var firstComment = comments[0];
            var oembedgateway = "http://noembed.com/embed?url=";
            var text = "";
            if (firstComment.user.username == author) {
                var comment = firstComment.body;
                // alert(comment.substr(7,14));
                var startofcomment = comment.substr(7, 14);
                if (startofcomment == "www.flickr.com" || tartofcomment == "twitpic.com") {
                    var oembedurl = oembedgateway + comment;
                    $("#comments").empty();
                    $("<ol/>").text(comment).appendTo("#comments");
                    $("#images").empty();
                    $.getJSON(oembedurl, function(result) {
                        // alert(result.html);
                        // alert(result.provider_name);
                        // $("#images").html(result.html);
                        $("<img class='image' />").attr({
                            src: result.media_url
                        }).appendTo("#images");
                    }); // end getJSON
                } // end if (startofcomment
            } // end if (firstComment.user.username
        } // end ontimedcomments
    }); // end SC.Stream
}); // end SC.get