Need help with displaying photos via Flickr API - changing tag based on database data

Hi guys, rather than explain in detail what I'm attempting to do it's easier just to show another site doing something very similar:

http://downloads.linkinpark.com/store/container.aspx?year=2011

If you click on a show with photos listed note they're displayed from Flickr via tags. Wanting to do something similar I acquired an API key for Flickr and did some searching around for help to get it working, as API usage in general is pretty new to me. I found this simple way to use it to display the photos based on tags:

<script src="http://api.flickr.com/services/rest/?format=json&method=flickr.photos.search&tags=exampletag1000&tag_mode=all&sort=date-taken-desc&api_key=[REMOVED]"></script>
 

With the jquery function of this:

function jsonFlickrApi(rsp) {
	if (rsp.stat != "ok"){
  	// If this executes, something broke!
  	return;
 	}
 	//variable "s" is going to contain 
 	//all the markup that is generated by the loop below
 	var s = "";

 	//this loop runs through every item and creates HTML that will display nicely on your page
 	//this example displays 10 photos because because variable i is set to 20
 	//you can change that number depending on how many photos you want to show
 	//to show all the photos, replace that number with rsp.photos.photo.length
 	for (var i=0; i < 20; i++) {
  	photo = rsp.photos.photo[i];

  	//notice that "s.jpg" is where you change the size of the image
  	t_url = 'http://farm'+ photo.farm +'.static.flickr.com/'+ photo.server +'/'+ 
  	photo.id +'_'+ photo.secret +'_s.jpg';

  	p_url = 'http://www.flickr.com/photos/'+ photo.owner +'/'+ photo.id;

  	s += '<li><a href="'+ p_url +'" title="'+ photo.title +'"><img alt="'+ photo.title +'" src="'+ t_url +'" /></a></li>';
 	}

 	//this tells the JavaScript to write everything in variable s onto the page
 	document.writeln("<ul>"+s+"</ul>"); 
}

Which I found here - http://viget.com/inspire/using-the-flickr-api

That was pretty old so I didn't know if it was still relevent but it seems to be, it's working in my test. There are issues however. Firstly it seems the javascript has to be placed in the page where I want the photos to appear, rather than placing it at the end as recommended and just using HTML in the place where they load.

The second, larger issue is that my site like the example will be running on a database, there is one show.php file and each show has it's own ID. If I were to place the above into the show page then obviously for every show ID the same photos would be displayed on each one, based on the tags I'm searching for on flickr. So what I need is a way to change that tag somehow based on the ID of the show. I just did an example in the above but the real tags would be something like #FFLIVE2014-09-03, #FFLIVE2014-09-04 and so on.

I can generate those tags within my page quite easily with PHP -

<?php echo '#FFLIVE' . date('Y-m-d',strtotime($drShowInfo['show_date'])) ?>

However I'm not sure that'd be much use with the above setup would it, since the tag is inside the script?

So somehow I need to build that unique tag into the script so the unique photos for each show is displayed. Is that possible or am I way out of my depth here and better getting paid help?

Edited March 9, 201412 yr by Killer