Mit Shoutcast Anzeige Jetzt Spielen Albumcover

Habe ich einen kleinen 70x70-Feld in einer HTML-player gebaut habe, wo ich möchte, um Platz in den album-artwork zusammen mit meiner jetzt spielen Informationen aus meinem shoutcast-server. Gibt es eine Möglichkeit, mit dem Künstler-song-Informationen der shoutcast-server bietet, dass kann ich Suche ein web service (amazon/last.fm) und haben, es Ort, der (wahrscheinlich) album-cover gibt?

Hier der JS code, den ich jetzt verwende:

jQuery(document).ready(function() {
    pollstation();
    //refresh the data every 30 seconds
    setInterval(pollstation, 30000);
});

//Accepts a url and a callback function to run.  
function requestCrossDomain( callback ) {  
    //Take the provided url, and add it to a YQL query. Make sure you encode it!  
    var yql = 'http://s7.viastreaming.net/scr/yql.php?port='+port+'&username='+user+'&callback=?';
    //Request that YSQL string, and run a callback function.  
    //Pass a defined function to prevent cache-busting.  
    jQuery.getJSON( yql, cbFunc );

    function cbFunc(data) {  
    //If we have something to work with...  
    if ( data ) {  
        //Strip out all script tags, for security reasons. there shouldn't be any, however
        data = data[0].results.replace(/<script[^>]*>[\s\S]*?<\/script>/gi, '');
        data = data.replace(/<html[^>]*>/gi, '');
        data = data.replace(/<\/html>/gi, '');
        data = data.replace(/<body[^>]*>/gi, '');
        data = data.replace(/<\/body>/gi, '');

        //If the user passed a callback, and it  
        //is a function, call it, and send through the data var.  
        if ( typeof callback === 'function') {  
            callback(data);  
        }  
    }  
    //Else, Maybe we requested a site that doesn't exist, and nothing returned.  
    else throw new Error('Nothing returned from getJSON.');  
    }  
}  

function pollstation() {
    requestCrossDomain(function(stationdata) {

        var lines = stationdata.split('|+|');

        jQuery('#sname').html(lines[0]);

        jQuery('#sgenre').html(lines[1]);

        jQuery('#clisteners').html(lines[2]);

        jQuery('#bitrate').html(lines[3]);

        jQuery('#artist_block').html('' + jQuery.trim(lines[4]) + '');

        var prev = lines[5].split('+|+');
        jQuery('#np_table').html('');

        for (var i = 0; i < 8; i++) 
        {    
            if(typeof(prev[i]) != 'undefined')
            {           
                jQuery('#np_table').append('<tr>'+'<td>'+ prev[i] + '</td>'+'</tr>');
                jQuery("tr:odd").css("background-color", "#154270");
            }

        }   

        jQuery('#mplayers').html(lines[6]); 

        jQuery('#mobile').html(lines[7]);

        jQuery();
    } );
}

und hier die HTML:

<div id="col_left">
        <div id="now_playing">
            <div id="np_ribbon"><span>Now Playing</span></div>
            <div id="np_img"><img name="nowplayingimage" src="" width="70" height="70" alt="album cover" style="background-color: #000000" /></div>
            <div id="artist_block">
                <span class="artist_name"><strong>Artist:</strong> Artist name</span><br />
                <span class="song_name"><strong>Song:</strong> &quot;song title&quot;</span><br />
                <span class="album_name"><strong>Album:</strong> Album Name</span> <br />


            </div> 
            <div id="player">
            <div id="container"><script type="text/javascript" src="http://shoutcast.mixstream.net/js/external/flash/s7.viastreaming.net:8790:0:::999999:::1"></script></div>
        </div>
        </div><!-- end now playing -->
    <div id="recent">
            <div class="table_title">Recently Played</div>
    <table id="np_table">

     </table>
        </div><!-- end recent -->


    </div><!-- end col_left -->

Ist So natürlich, dass ich das Bild angezeigt werden soll, wo die div "np_img" ist. Irgendwelche Ideen, welcher code zu verwenden ist und wie es zu implementieren. Kann man wohl sagen, durch die mein code, ich bin ein amateur, so seien Sie bitte klar und sanft. 🙂

InformationsquelleAutor FatimaBurke | 2012-08-09

Schreibe einen Kommentar