Solution: Using WebServer PHP to display Animated Images

Posted on
Tue Oct 16, 2018 5:53 pm
GlennNZ offline
User avatar
Posts: 1555
Joined: Dec 07, 2014
Location: Central Coast, Australia

Solution: Using WebServer PHP to display Animated Images

Hi all.

Thought would post this as has solved a small problem for me; and thought may be of use to others.

I largely use Indigo Touch on mounted Ipads and was needing a solution for animated images.

I came upon writing a small php webpage which returns a image alone (so works from within Indigo Touch) but uses php to cycle through a list of images.

Essentially what the below does is cycle through the Weather Radar images available on bom.gov.au and creates a refreshing URL. It uses PHP to do this.

Prerequisites:
Website access with php - either local (works well) and I have run xampp on a VM for some years - serving the odd page and bit and pieces.
It also works remotely on a website fine - and have it here for a test run:
http://www.frontviewplus.com/radar2.php
Click on it and see - nothing to exciting a simple static radar image...
(on first run for 1/2hour takes 10-15 seconds to display as downloading all images)

BUT - refresh it - there we go a new image and so and so on.

It uses PHP to change the image returned at every request.
To Indigo Touch this looks like a simple image return and it works well from with IndigoTouch as a refreshing URL.

Basically every time the image is requested by Indigo Touch, the below code -cycles to the next image and sends that.

Simply use the above as a 'refreshing URL' from within Indigo and Indigo Touch. Everytime the refreshing URL is refreshed the image will change.

In fact it works so well - I'm now on the look-out to see what else I can animated from within Indigo Touch!
And for static images - eg. animated Gifs - should be very straightforward as no image downloading needed....

Glenn

Php Webpage example - same as within link as above:
Code: Select all
<?php
// Example php page to download image and then cycle through images
// at all times looking like a simple direct url image to requesting program
// compatible with indigoTouch
// GlennNZ
// 2018


// Can use session details below to save information between sessions
// Unfortunatly does not work with Indigo and within IndigoTouch so moved to
// saving locale file for persistent information
// session_start();
// if( empty($_SESSION['image']) ) {
     // $_SESSION['image'] = 1;
// }

// Checks to see whether index file exists - if exists reads it for image number_format
if (file_exists('imageupto.txt') )
{
   $imagenumber = file_get_contents('imageupto.txt');
} else {
   $imagenumber = 1;
}

// send the request appearing like a Ipad - over coming the 403 errors for bom.gov.au website

$options = array(
  'http'=>array(
    'method'=>"GET",
    'header'=>"Accept-language: en\r\n" .
              "Cookie: foo=bar\r\n" .  // check function.stream-context-create on php.net
              "User-Agent: Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.102011-10-16 20:23:10\r\n" // i.e. An iPad
  )
);
// if png files don't exist or age of files more than 1/2hr redownload....
if ( !file_exists('1.png') || (time()-filemtime('1.png') > 0.5 * 3600))
{
   // create the background from the various transparent layers from bom.gov.au
   $context = stream_context_create($options);
   $backgroundurl = 'ftp://ftp.bom.gov.au/anon/gen/radar_transparencies/IDR714.background.png';
   $topourl = 'ftp://ftp.bom.gov.au/anon/gen/radar_transparencies/IDR714.topography.png';
   $locations = 'ftp://ftp.bom.gov.au/anon/gen/radar_transparencies/IDR714.locations.png';
   $url = 'ftp://ftp.bom.gov.au/anon/gen/radar/IDR714.gif';
   $ftpradar = 'ftp.bom.gov.au';
   $img = 'radar714.gif';
   file_put_contents($img, file_get_contents($url, false, $context));
   $image_1 = imagecreatefrompng($backgroundurl);
   $image_2 = imagecreatefrompng($topourl);
   $image_3 = imagecreatefrompng($locations);
   imagealphablending($image_1, true);
   imagesavealpha($image_1, true);
   imagecopy($image_1, $image_2, 0, 0, 0, 0, 512, 512);
   imagecopy($image_1, $image_3, 0, 0, 0, 0, 512, 512);
   imagepng($image_1, 'background.png');
   // Above: Background image created.
   // Below: Login to ftp server and download the directory
   $conn_id = ftp_connect($ftpradar);
   $login_result = ftp_login($conn_id, 'Anonymous', 'Anonymous');
   ftp_pasv($conn_id,true);
   $contents = ftp_nlist($conn_id, "/anon/gen/radar/");
   $IDR714 = array();

   $index = 0;
   foreach ($contents as $subarray)
   {
      if (stristr( $subarray,'IDR714.T.') !== FALSE) { // Yoshi version
         //create a new array with just Radar images for Radar IDR714
         $index++;
         array_push($IDR714,$subarray);
         $image_4 = imagecreatefrompng('ftp://ftp.bom.gov.au/'.$subarray);
         $background = imagecreatefrompng('background.png');
         imagealphablending($background, true);
         imagesavealpha($background, true);
         imagecopy($background, $image_4, 0, 0, 0, 0, 512, 512);
         // Create new png files of all the radar images renamed to 1-18.png
         // So overwritten when updated.
         imagepng($background, $index.'.png');
         //imagepng($background, str_replace('/anon/gen/radar/','',$subarray));
      }   
   }
}
// Abandoned Session usage as doesn't work with Indigo
//$imagetouse = $_SESSION['image'].'.png';
// $_SESSION['image'] = $_SESSION['image']+1;
// if ($_SESSION['image'] == 17){
   // $_SESSION['image'] = 1;
// }

if ($imagenumber >=19){
   $imagenumber = 1;
}
$file = $imagenumber.'.png';
$imagenumber++;
// Write new index number to file to use new image
file_put_contents("imageupto.txt",$imagenumber ) ;
$type = 'image/png';
header('Content-Type:'.$type);
readfile($file);
?>

Posted on
Tue Oct 16, 2018 8:07 pm
mclass offline
Posts: 312
Joined: May 13, 2015
Location: Melbourne, Australia

Re: Solution: Using WebServer PHP to display Animated Images

Very timely, Glenn.

I spent quite some time writing a script to (successfully!) download a series of BoM radar images and convert into an animated GIF - only to discover Touch wouldn’t display it .
Can’t wait to find the time to try out your approach!

mclass


Sent from my iPhone using Tapatalk

Posted on
Tue Oct 16, 2018 11:34 pm
GlennNZ offline
User avatar
Posts: 1555
Joined: Dec 07, 2014
Location: Central Coast, Australia

Re: Solution: Using WebServer PHP to display Animated Images

mclass wrote:
Very timely, Glenn.
spent quite some time writing a script to (successfully!) download a series of BoM radar images and convert into an animated GIF - only to discover Touch wouldn’t display it .
Can’t wait to find the time to try out your approach!
mclass
Sent from my iPhone using Tapatalk


Hi
I did the same! and was most annoyed when gif didn't work....

This solution works really well - and was going to say welcome to share my radar - but see you are slightly further away....
(sharing should be possible - but would need to change the php to index the connected IP otherwise would jump out of order)

Might for the fun of it look at a solution with selectable radar ID via ?radar= and make counting IP specific and put online which anyone could use....

Glenn

Posted on
Wed Oct 17, 2018 12:45 am
GlennNZ offline
User avatar
Posts: 1555
Joined: Dec 07, 2014
Location: Central Coast, Australia

Re: Solution: Using WebServer PHP to display Animated Images

Try this one:

Takes a variable within url ?radar=IDRcode from BOM website. (include the IDR bit)
(works with all rain radars)
And works with all BOM radars and saves progress via IP addressing - so should work online with multiple users.

Posted online here:

http://www.frontviewplus.com/radar/rada ... dar=IDR714
eg
or more useful for Melbourne:
http://www.frontviewplus.com/radar/rada ... dar=IDR024

!

A bit slow when first selected as takes 60 seconds or so to download and save all images - but after that cycles through nicely.
Redownloads BOM images if more than 1/2 hr passed.

Give it a go!

Glenn

Update:
Updated to include Radar details in file-up-to so can have multiple radars on same screen displaying correctly.
Update 2:
Delete files if timelimit over before redownloading them (BOM sometimes serves different number of images)


Code: Select all
<?php
// Example php page to download image and then cycle through images
// at all times looking like a simple direct url image to requesting program
// compatible with indigoTouch
// GlennNZ
// 2018

function getUserIP()
{
    // Get real visitor IP behind CloudFlare network
    if (isset($_SERVER["HTTP_CF_CONNECTING_IP"])) {
              $_SERVER['REMOTE_ADDR'] = $_SERVER["HTTP_CF_CONNECTING_IP"];
              $_SERVER['HTTP_CLIENT_IP'] = $_SERVER["HTTP_CF_CONNECTING_IP"];
    }
    $client  = @$_SERVER['HTTP_CLIENT_IP'];
    $forward = @$_SERVER['HTTP_X_FORWARDED_FOR'];
    $remote  = $_SERVER['REMOTE_ADDR'];

    if(filter_var($client, FILTER_VALIDATE_IP))
    {
        $ip = $client;
    }
    elseif(filter_var($forward, FILTER_VALIDATE_IP))
    {
        $ip = $forward;
    }
    else
    {
        $ip = $remote;
    }

    return $ip;
}

// Can use session details below to save information between sessions
// Unfortunatly does not work with Indigo and within IndigoTouch so moved to
// saving locale file for persistent information
// session_start();
// if( empty($_SESSION['image']) ) {
     // $_SESSION['image'] = 1;
// }
// Add passing radar information

if (empty ($_GET['radar']) ) {
   $_GET['radar'] = 'IDR714';
}
$radar_sel = $_GET['radar'];

$user_ip = getUserIP();

// Checks to see whether index file exists - if exists reads it for image number_format
if (file_exists($user_ip.'.imageupto.'.$radar_sel.'.txt') )
{
   $imagenumber = file_get_contents($user_ip.'.imageupto.'.$radar_sel.'.txt');
} else {
   $imagenumber = 1;
}

// send the request appearing like a Ipad - over coming the 403 errors for bom.gov.au website

$options = array(
  'http'=>array(
    'method'=>"GET",
    'header'=>"Accept-language: en\r\n" .
              "Cookie: foo=bar\r\n" .  // check function.stream-context-create on php.net
              "User-Agent: Mozilla/5.0 (iPad; U; CPU OS 3_2 like Mac OS X; en-us) AppleWebKit/531.21.10 (KHTML, like Gecko) Version/4.0.4 Mobile/7B334b Safari/531.21.102011-10-16 20:23:10\r\n" // i.e. An iPad
  )
);

// if png files don't exist or age of files more than 1/2hr redownload....

if ( !file_exists('1-'.$radar_sel.'.png') || (time()-filemtime('1-'.$radar_sel.'.png')  > 0.5 * 3600))
{
   
   // create the background from the various transparent layers from bom.gov.au
   $context = stream_context_create($options);
   $backgroundurl = 'ftp://ftp.bom.gov.au/anon/gen/radar_transparencies/'.$radar_sel.'.background.png';
   $topourl = 'ftp://ftp.bom.gov.au/anon/gen/radar_transparencies/'.$radar_sel.'.topography.png';
   $locations = 'ftp://ftp.bom.gov.au/anon/gen/radar_transparencies/'.$radar_sel.'.locations.png';
   $url = 'ftp://ftp.bom.gov.au/anon/gen/radar/'.$radar_sel.'.gif';
   $ftpradar = 'ftp.bom.gov.au';
   $img = $radar_sel.'.gif';

   file_put_contents($img, file_get_contents($url, false, $context));

   $image_1 = imagecreatefrompng($backgroundurl);
   $image_2 = imagecreatefrompng($topourl);
   $image_3 = imagecreatefrompng($locations);
   imagealphablending($image_1, true);
   imagesavealpha($image_1, true);
   imagecopy($image_1, $image_2, 0, 0, 0, 0, 512, 512);
   imagecopy($image_1, $image_3, 0, 0, 0, 0, 512, 512);
   imagepng($image_1, $radar_sel.'.background.png');
    // Delete old radar images (BOM sometimes changes number of images available)
   //
   foreach (glob('*-'.$radar_sel.'.png') as $filename) {
      //ECHO "$filename size " . FILESIZE($filename) . "\n";
      UNLINK($filename);
   }
   
   // Above: Background image created.
   // Below: Login to ftp server and download the directory
   $conn_id = ftp_connect($ftpradar);
   $login_result = ftp_login($conn_id, 'Anonymous', 'Anonymous');
   ftp_pasv($conn_id,true);
   $contents = ftp_nlist($conn_id, "/anon/gen/radar/");
   $IDR714 = array();

   $index = 0;
   foreach ($contents as $subarray)
   {
      if (stristr( $subarray, $radar_sel.'.T.') !== FALSE) {
         //create a new array with just Radar images for Radar Selected
         $index++;
         array_push($IDR714,$subarray);
         $image_4 = imagecreatefrompng('ftp://ftp.bom.gov.au/'.$subarray);
         $background = imagecreatefrompng($radar_sel.'.background.png');
         imagealphablending($background, true);
         imagesavealpha($background, true);
         imagecopy($background, $image_4, 0, 0, 0, 0, 512, 512);
         // Create new png files of all the radar images renamed to 1-18.png
         // So overwritten when updated.
         imagepng($background, $index.'-'.$radar_sel.'.png');
         //imagepng($background, str_replace('/anon/gen/radar/','',$subarray));
      }   
   }
}


// Abandoned Session usage as doesn't work with Indigo
//$imagetouse = $_SESSION['image'].'.png';
// $_SESSION['image'] = $_SESSION['image']+1;
// if ($_SESSION['image'] == 17){
   // $_SESSION['image'] = 1;
// }
$directory = "";
$maxfiles = 0;
$files = glob($directory . "*".$radar_sel.".png");
if ($files){
 $maxfiles = count($files);
}
// count the number of images and don't go above this number
if ($imagenumber >=$maxfiles){
   $imagenumber = 1;
}

$file = $imagenumber.'-'.$radar_sel.'.png';
$imagenumber++;
// Write new index number to file to use new image
file_put_contents($user_ip.'.imageupto.'.$radar_sel.'.txt',$imagenumber ) ;
$type = 'image/png';
header('Content-Type:'.$type);
readfile($file);

?>

Page 1 of 1

Who is online

Users browsing this forum: No registered users and 1 guest