...

View Full Version : Format data returned by API



prital09
12-01-2012, 02:24 PM
I would like to know how to format the images are retrieved when the following function is called. Is there any way I can apply css style to it?

myscript.js file



function bio()
{
echonest.artist("ARH6W4X1187B99274F").biographies( function(biographyCollection) {
$('#gallery').append( biographyCollection.at(1).to_html('<p>${text} </p>') );
});
}

DanInMa
12-01-2012, 02:40 PM
short answer, Yes.

long answer - sure all kinds of ways, but we cant help without seeing the resulting html or an example of it. your bio function is using a lot of code out of the current scope you have shown us so it's not really much to go on.


I suppose you could add a class or id to the <p> tag and use css to target the image within that class or id

prital09
12-01-2012, 03:00 PM
Thank you for your reply.


<html>

<head>
<title>Test</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />

<link rel="stylesheet" type="text/css" href="mystyle.css" />
<script src="jquery-1.4.4.js"></script>
<script src="jquery.tmpl.min.js"></script>
<script src="jquery.echonest.js"></script>
<script src="lastfm.api.js"></script>
<script src="lastfm.api.md5.js"></script>
<script src="lastfm.api.cache.js"></script>
<script src="testScript.js"></script>
</head>

<body>
<div id="page">
<div id = "header">
<div class="title">Music Recommendation</div>
<div class="subText">Recommendation: a test site!</div>
</div>
<div id="menu">
<div class="menuLink"><a href="index.html">Home</a></div>
<div class="menuLink"><a href="index.html">About</a></div>
<div class="menuLink"><a href="index.html">Contact</a></div>
</div>

<div id="pageContent">
<div class="articleTitle">TITLE</div>
<div class="articleContent">
<p>This is a test</p>
<input type="text" id="artist" name="artist" />
<button id="search-artist">Find</button>
<div id = "container">
<div id = "gallery">
<button type="button" onclick="bio()">Try it</button>
</div>
</div>
</div>
</div>
</div>
</body>

</html>

The above is the html I am using.


function bio()
{
var echonest = new EchoNest("I7BZAXMQ7B77C9MEJ");
echonest.artist("ARH6W4X1187B99274F").biographies( function(biographyCollection) {
$('.articleContent').append( biographyCollection.to_html('<p>${text} </p>') );
});
}

The above is the function I am calling.

prital09
12-01-2012, 03:17 PM
I took your suggestion in assigning an id and it worked, thank you!
I was wondering how to do that to images as follows.

How would I go about formatting the following?


function getSong()
{
echonest.artist("Radiohead").images( function(imageCollection) {
$('#gallery').prepend( imageCollection.to_html('<img src="${url}">', {start: 0, end: 5}) );
});;
}

prital09
12-01-2012, 03:32 PM
Managed to find a solution by adding div tags around the image tags.

Thank you for your help.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum