The Gallery

BBC Holding Slides

using the programme images from iPlayer (July 2017)

This site closed in March 2021 and is now a read-only archive
SP
Steve in Pudsey
So, I had a stupid idea. Every programme has an image associated with it in iPlayer, so how difficult would it be to generate old-school holiding slides for the whole day's schedule on the fly?

*

See it in action at http://slidegen.byethost9.com/bbcone.php - you can get the slides for yesterday, today or tomorrow, or any other date that still has a schedule available if you tweak the URL.

The black fringe at the bottom is a bit of artistic license - I've exaggerated it a bit more than it was on the real slides to make the text legible - I don't have the benefit of being able to pick and choose the images to make sure there's a decent background for the caption. (It was there on some of the originals, eg https://i.ytimg.com/vi/fyg-WZd421o/hqdefault.jpg)

I've had to offset the images a bit, which gives some slightly odd framing, mainly because the news ones are covered in text outside the safe areas.

Just for the hell of it - BBC2's version http://slidegen.byethost9.com/bbctwo.php
Last edited by Steve in Pudsey on 8 July 2017 10:23pm
NJ
Neil Jones Founding member
Not bad Very Happy

By the way if you want to add a drop shadow to the text to stop it vanishing on a white background, use this in your CSS for your titles:
Quote:
text-shadow: black 0.1em 0.1em 0.2em, black 0.1em 0.1em 0.2em, black 0.1em 0.1em 0.2em


So for example:
Quote:
<div style="position:relative;top:-231px;left:67px;font-family:futura;color:#ffffff;font-size:90%;text-shadow: black 0.1em 0.1em 0.2em, black 0.1em 0.1em 0.2em, black 0.1em 0.1em 0.2em">BARGAIN HUNT </div>
VM
VMPhil
Nice work! I've tried my hand at recreating old holding slides before using those images. As you say it's hard to find suitable images where the text doesn't clash with the background. But when it works, it looks pretty realistic.

SP
Steve in Pudsey
Not bad Very Happy

By the way if you want to add a drop shadow to the text to stop it vanishing on a white background, use this in your CSS for your titles:


I thought about that method, but I preferred to use the method I used because that was used in some of the originals. It's what I would do if I was designing something from scratch though!
NJ
Neil Jones Founding member
As you wish, just trying to help.
SP
Steve in Pudsey
That wasn't supposed to be an arsey response, sorry if it came across that way - I appreciate the input.
EL
elmarko
This is really nice, any chance of having a shufti at the php? chuck it on github or something?
SP
Steve in Pudsey
The PHP is actually fairly minimal, I used a script from http://simplehtmldom.sourceforge.net/ to parse the schedules page and pull out the programme title and image URL into two arrays

Quote:

require('simple_html_dom.php');

$html = file_get_html('http://www.bbc.co.uk/iplayer/schedules/bbctwo/'.$date);


$i=0;
$baseslides=[];
foreach ($html->find('source') as $programme) {

$slideurl=$programme->srcset;

//in case we want a different size at some point in the future eg 1200x675 or 1920x1080
$baseslides[$i]=str_replace("336x189","336x189",$slideurl);

$i++;
}


$i=0;
$titles=[];
foreach ($html->find('div.title') as $progtitle) {

$titles[$i]=$progtitle->plaintext;
$i++;
}


After that it's just another for loop to iterate through that pair of arrays and out them.

Newer posts