Get large artist image from last.fm xml (api artist.getinfo) - last.fm

This is the xml response from last fm:
<lfm status="ok">
<artist>
<name>Adele</name>
<mbid>1de93a63-3a9f-443a-ba8a-a43b5fe0121e</mbid>
<url>http://www.last.fm/music/Adele</url>
<image size="small">http://userserve-ak.last.fm/serve/34/71796928.png</image>
<image size="medium">http://userserve-ak.last.fm/serve/64/71796928.png</image>
<image size="large">http://userserve-ak.last.fm/serve/126/71796928.png</image>
<image size="extralarge">http://userserve-ak.last.fm/serve/252/71796928.png</image>
<image size="mega">http://userserve-ak.last.fm/serve/_/71796928/Adele+PNG.png</image>
...
I'm trying to echo that large image, but it doesn't return anything...
<?php
$xml = simplexml_load_file("http://ws.audioscrobbler.com/2.0/?method=artist.getinfo&artist=ARTISTNAME&api_key=b25b959554ed76058ac220b7b2e0a026");
$largeimg = $xml->artist->image['large'];
echo '<img src="'.$largeimg.'" />';
?>
If I just put $largeimg = $xml->artist->image; it just grabs that first image (small one). Any idea how I can fix this?

Use PHP's children() function to get the artist node's children:
$artistTag= $xml->artist->children();
$largeImage = $artistTag[5]; // 5 is the index of the Large Image child

Related

Displaying multiple xml information in html via ajax

I have the AirPlayHistory.xml file that shows the last 3 streamed songs and is updated every time the song changes..
AirPlayHistory:
<Event status="happened">
<Song title="Forbidden Voices">
<Artist name="Martin Garrix" ID="344518"> </Artist>
<Info StartTime="11:06:31" JazlerID="7235" PlayListerID=""/>
</Song>
<Song title="Faded">
<Artist name="Alan Walker" ID="343769"> </Artist>
<Info StartTime="11:10:28" JazlerID="7769" PlayListerID=""/>
</Song>
<Song title="Afterlife">
<Artist name="Illenium" ID="344414"> </Artist>
<Info StartTime="11:13:30" JazlerID="10668" PlayListerID=""/>
</Song>
</Event>
I have this code:
var speed = 10000; // 10 seconds
function $(e){if(typeof e=='string')e=document.getElementById(e);return e};
function collect(a,f){var n=[];for(var i=0;i<a.length;i++){var v=f(a[i]);if(v!=null)n.push(v)}return n};
ajax={};
ajax.x=function(){try{return new ActiveXObject('Msxml2.XMLHTTP')}catch(e) {try{return new ActiveXObject('Microsoft.XMLHTTP')}catch(e){return new XMLHttpRequest()}}};
ajax.serialize=function(f){var g=function(n){return f.getElementsByTagName(n)};var nv=function(e){if(e.name)return encodeURIComponent(e.name)+'='+encodeURIComponent(e.value);else return ''};var i=collect(g('input'),function(i){if((i.type!='radio'&&i.type!='checkbox')||i.checked)return nv(i)});var s=collect(g('select'),nv);var t=collect(g('textarea'),nv);return i.concat(s).concat(t).join('&');};
ajax.send=function(u,f,m,a){var x=ajax.x();x.open(m,u,true);x.onreadystatechange=function(){if(x.readyState==4)f(x.responseText)};if(m=='POST')x.setRequestHeader('Content-type','application/x-www-form-urlencoded');x.send(a)};
ajax.get=function(url,func){ajax.send(url,func,'GET')};
ajax.gets=function(url){var x=ajax.x();x.open('GET',url,false);x.send(null);return x.responseText};
ajax.post=function(url,func,args){ajax.send(url,func,'POST',args)};
ajax.update=function(url,elm){var e=$(elm);var f=function(r){e.innerHTML=r};ajax.get(url,f)};
ajax.submit=function(url,elm,frm){var e=$(elm);var f=function(r){e.innerHTML=r};ajax.post(url,f,ajax.serialize(frm))};
function process(xml) {
document.getElementById('contentfile').innerHTML=xml;
var title = document.getElementById('contentfile').getElementsByTagName('Song')[0].title;
var name = document.getElementById('contentfile').getElementsByTagName('Artist')[0].name;
document.getElementById('contentfile').innerHTML='NOW ON AIR: '+name+' | '+title;
}
function checkXml() {
ajax.get('http://website.com/jazler/NowOnAir.xml',process)
}
window.onload=function() {
checkXml();
tId=setInterval('checkXml()',speed)
}
<div id="contentfile">
but he shows only one song of 3..
Clear! you have the first only you write name and title!! you simply rewrote the innerHTML BUT code line document.getElementById('contentfile').innerHTML=xml; is not good you have to loop through! now you write all inner.HTMl content with the first element title[0] name[0]

AMP-Access-Control-Allow-Source-Origin header not found

I have amp-list element whose src is a search.php file containing product information.
When validating, I'm tld there is no AMP-Access-Control-Allow-Source-Origin header, although I have set one. Here is the php file:
<?php
header('Content-Type: application/json');
// header('AMP-Access-Control-Allow-Source-Origin: http://localhost');
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Origin: https://www-xt2-extenders-com.cdn.ampproject.org');
header('Access-Control-Expose-Headers: AMP-Access-Control-Allow-Source-Origin');
header('AMP-Access-Control-Allow-Source-Origin: https://www.xt2-extenders.com');
// filter parameters
$filter = isset($_REQUEST["filter"])?$_REQUEST["filter"]:"";
$products = array(
array(
"name"=>"HXT²",
"price"=>2050.00,
"color"=>"blue",
"description"=>"Super cool super power t-shirt",
"image"=>"../img/hxt-set-500-1.png"
),
array(
"name"=>"DXT²",
"price"=>1980.00,
"color"=>"yellow",
"description"=>"Super cool super power t-shirt",
"image"=>"../img/dxt²-set-500-2.png"
),
array(
"name"=>"SXT²",
"price"=>2050.00,
"color"=>"green",
"description"=>"Super cool super power t-shirt",
"image"=>"../img/sxt²-set-500-2.png"
),
array(
"name"=>"DPXT²",
"price"=>3350.00,
"color"=>"red",
"description"=>"Super cool super power t-shirt",
"image"=>"../img/dpxt²-set-500.png"
)
)
// Filter by subcategory
if(!empty($filter) && !in_array($filter, array('null', 'none'))) {
$filtered = array();
foreach ($products as $product) {
if($product['color']==$filter) {
$filtered[] = $product;
}
}
$products = $filtered;
}
header("HTTP/1.0 200 Ok");
And the html:
<!-- amp-list to fetch and display search results -->
<!-- with amp-bind, the search keywords, filter, and sort options are all bound to the amp-list src URL -->
<!-- This means that whenever one of them changes, amp-list will update and fetch the new URL -->
<amp-list credentials="include"
width="auto" height="600" layout="fixed-height"
src="/amp/templates/search.php?filter="
[src]="'/amp/templates/search.php?filter='+(filter||'')">
<!-- amp-mustache template to display returned results -->
<template type="amp-mustache">
<ul class="related-items">
{{#results}}
<li>
<figure class="related-thumb">
<amp-img src="{{image}}"
width="60" height="60" layout="responsive">
</amp-img>
<figcaption>
<span class="title">{{name}}</span>
<span class="price">€{{price}}</span>
<span class="description">{{description}}</span>
</figcaption>
</figure>
</li>
{{/results}}
</ul>
{{#empty}}
<p>No products matched your search terms</p>
{{/empty}}
</template>
</amp-list>
What do I do wrong? I have read other questions here, and tried to modify my code, but it didn't work.
Try this code in my case it solved an issue
$domain_url = (isset($_SERVER['HTTPS']) ? "https" : "http") . "://$_SERVER[HTTP_HOST]";
$http_origin = isset($_SERVER['HTTP_ORIGIN']) && $_SERVER['HTTP_ORIGIN'] ? $_SERVER['HTTP_ORIGIN'] : $domain_url;
header("Content-type: application/json");
header("Access-Control-Allow-Credentials: true");
header("Access-Control-Allow-Origin: " .$http_origin);
header("AMP-Access-Control-Allow-Source-Origin: " . $domain_url);
header("Access-Control-Expose-Headers: AMP-Access-Control-Allow-Source-Origin");
Hope it gonna help you too

How do I isolate just Keywords from exif_read_data function?

After using the example from this page which talks about exif_read_data:
<?php
echo "images/image.jpg:<br />\n";
$exif = exif_read_data('images/image.jpg', 'IFD0');
echo $exif===false ? "No header data found.<br />\n" : "Image contains headers<br />\n";
$exif = exif_read_data('images/image.jpg', 0, true);
echo "images/image.jpg:<br />\n";
foreach ($exif as $key => $section) {
foreach ($section as $name => $val) {
echo "$key.$name: $val<br />\n";
}
}
?>
I got the following result:
images/image.jpg:
Image contains headers
images/image.jpg:
FILE.FileName: image.jpg
FILE.FileDateTime: 1477597739
FILE.FileSize: 65777
FILE.FileType: 2
FILE.MimeType: image/jpeg
FILE.SectionsFound: ANY_TAG, IFD0, EXIF, WINXP
COMPUTED.html: width="640" height="480"
COMPUTED.Height: 480
COMPUTED.Width: 640
COMPUTED.IsColor: 1
COMPUTED.ByteOrderMotorola: 1
IFD0.Orientation: 1
IFD0.Exif_IFD_Pointer: 2122
IFD0.Keywords: Tag_1;Tag_2;Tag_3 <--- info I need
IFD0.UndefinedTag:0xEA1C: �
EXIF.ExifVersion: 0221
EXIF.ColorSpace: 65535
EXIF.UndefinedTag:0xEA1C: �
WINXP.Keywords: ?????????????????
So I just now need to know how to isolate the IFD0.Keywords: Tag_1;Tag_2;Tag_3 part of the results.
How would be able to do this?
(Orginal question was about how to extract meta data from an image and display it on a webpage, which I managed to do, the question evolved to something else. Placing original question details below)
When using Dreamweaver, if I "Insert>Image" it will add the code
<img src="images/Image.jpg" width="400" height="757" />
in automatically, along with the width and height.
I'd like to add in the image metadata automatically too (it obviously won't be part of the <img> tag, it would be output as just text.)
Something like
<img src="images/Image.jpg" width="400" height="757" />
<p> Tags: something; something; something </p>
I would suppose a script would have to be written that would target a folder and pull the metadata out of all the images. I don't even know if that is possible.
How would I be able to do this?

I want to display individual categories (wordpress) on page, but be able to fully style each category title

I am nearing the end of a project and one of the last things I need to do is take some static html divs and enter category links into them.
The thumbnails have transitions styled into them, so when a user hovers over, the category title will appear over the top of a css mask effect.
http://lukwebdesign.co.uk/projects/chinwe-roy/
The thumbnails are towards the bottom of the home page, so any suggestions as to what to look at would be much appreciated.
TIA.
So there are a few ways to do this(especially depending on your setup) so I'm gonna have to make some assumptions on your site.
I'm assuming you're using default Wordpress posts and categories and not custom post types.
<?php
//Get the terms in the taxonomy "category" and assign it to the variable $terms
$terms = get_terms ('category');
//Use a foreach loop to loop through the terms
//i.e. for each term (e.g. workshop, exhibitions etc) do something
foreach ($terms as $term) {
//html for each category goes here
//e.g. display thumnail/featured image/display category title/link
}
?>
So for example within your foreach loop you could out each category url like so:
<a href="<?php echo site_url() . '/' . $term -> taxonomy . '/' . $term -> slug;?>">
<?php echo $term -> name; ?>
</a>
So for each category you can output a div and style it accordingly.

How to streamline repetitive HTML in GMap locations Array?

I'm trying to tighten up some repetitive HTML in a Google Map (v3 API).
The map contains 50 markers.
Each marker has a styled infoWindow.
Each infoWindow includes HTML that denotes both text and an image.
The text for each infoWindow is the same but the image is unique.
I would like to put the text HTML into a single variable, then use it to replace the repeated strings in the code.
This is how the infoWindows are presented:
var locations = [
[39.11009, -120.03169, '<same text html><unique image html>'],
[37.77493, -122.41942, '<same text html><unique image html>'],
[48.85320, -119.30206, '<same text html><unique image html>'],
[48.77734, -121.81320, '<same text html><unique image html>']
];
Create a variable containing the html string common to each array [], then use it to replace the common strings. The proper syntax looks like this:
var Links ='<div class="photo">Shop Here | Shop There</div>';
var locations = [
[39.19, -12.9, Links + '<img width="300" height="239" src="images/img01.jpg"/>'],
[37.73, -12.4, Links + '<img width="300" height="239" src="images/img02.jpg"/>'],
[48.82, -12.3, Links + '<img width="300" height="239" src="images/img03.jpg"/>'],
[48.74, -12.8, Links + '<img width="300" height="239" src="images/img04.jpg"/>'],
[39.37, -12.7, Links + '<img width="300" height="239" src="images/img05.jpg"/>']
];