www.webdeveloper.com
Results 1 to 5 of 5

Thread: Display the last uploaded image on a page

  1. #1
    Join Date
    Jun 2013
    Location
    New Zealand
    Posts
    4

    Display the last uploaded image on a page

    We have a camera which uploads images to our webserver every 15 seconds. This static image is displayed on a page, and refreshed to show the latest image. This is uploaded as "webcam.jpg".

    I'd like to change the upload such that it uploads a set number of images. This will up upload images as "webcam_1.jpg" through to "webcam_480.jpg".
    Once 480 is uploaded, it resets to 1.

    Is it possible to determine the newest image uploaded to the webserver and display this image each 15 second refresh?
    For example if the latest image is webcam_178, this image is displayed on the page. When next checked, it finds webcam_179 and displays this image.
    Date modified on the image includes the date and time uploaded.


    Ultimately I aim to wrap all 480 images into an 8 minute loop of the previous 2 hours captured.

    Thanks for any help!

  2. #2
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    i suspect that you will need php for that purpose also. is it available on the server?
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  3. #3
    Join Date
    Jun 2013
    Location
    New Zealand
    Posts
    4
    Yes it is. Thanks for the feedback.

  4. #4
    Join Date
    Oct 2010
    Location
    Versailles, France
    Posts
    1,265
    See too this thread

    9 tests are enough with dichotomy to find the last image...
    Last edited by 007Julien; 06-23-2013 at 04:24 AM.

  5. #5
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,648
    i am not very good in php, but this seems to be working:

    index.php
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Webcam</title>
    <style type="text/css">
    body{color:#fff;background-color:#000;font-family:'Bookman Old Style',Georgia,Verdana;font-size:14px;text-align:center;padding-top:50px;}
    img.tmb{border:2px solid #ccc;border-radius:7px;cursor:pointer;margin:10px 10px;}
    #finfo{color:#ccc;background-color:transparent;}
    #finfo i{color:Darkorange;background-color:transparent;font-weight:bold;letter-spacing:1px;}
    </style>
    </head>
    <body>
    <div id="output"><?php include('func.php'); ?></div>
    </body>
    </html>
    func.php
    Code:
    <?php
    function scd($dir){$files=scandir($dir);foreach($files as $key => $val){if($val[$key]==='.'||$val[$key]==='..'){unset($files[$key]);}}sort($files);reset($files);return $files;}
    
    function showpic(){
    $imgdir='./img';
    $pics=scd($imgdir);
    $output='';
    if(count($pics) > 0){
    // repairing filenames for the proper sorting
    foreach($pics as $file){
    $n=substr($file,7,-4);$len=strlen($n);
    if($len < 3){$n=($len==1) ? ('00'.$n) : ('0'.$n);rename($imgdir.'/'.$file,$imgdir.'/webcam_'.$n.'.jpg');}
    }
    unset($pics);$pics=scd($imgdir);
    $maxfiles=2; // set here the desirable number of uploaded files
    $currfiles=count($pics);
    
    if($currfiles > $maxfiles){
    $diff=$currfiles - $maxfiles;
    for($i=0; $i < $diff; $i++){if(@unlink($imgdir.'/'.$pics[0])){unset($pics[0]);}}
    reset($pics);
    foreach($pics as $key => $val){
    $newname='';
    if($key < 99){
    if($key < 9){$newname='00'.$key;}
    else{$newname='0'.$key;}
    }
    else{$newname=$key;}
    rename($imgdir.'/'.$pics[$key],$imgdir.'/webcam_'.$newname.'.jpg');
    }
    }
    unset($pics);$pics=scd($imgdir);
    $output= '<img id="the_last" class="tmb" src="thumbs.php?im='.$imgdir.'/'.$pics[count($pics)-1].'&wd=500&ht=500&d='.time().'" alt="the last uploaded image" />
    <br />
    <div id="finfo">image name: <i>'.$pics[count($pics)-1].'</i></div>
    <script type="text/javascript">setTimeout("location.href=\'index.php\'",15000);</script>
    ';
    }
    else{
    $output='
    <h1 style="margin-top:250px;">The upload directory is empty</h1>
    <script type="text/javascript">setTimeout("location.href=\'index.php\'",15000);</script>
    ';
    }
    echo $output;
    clearstatcache();
    }
    
    /*---------------------------------------------------------------------*/
    $mode=(!empty($_GET['mode']))?$_GET['mode']:$_POST['mode'];
    switch($mode){
    default:showpic();
    }
    ?>
    uploader.php
    Code:
    <?php
    function scd($dir){$files=scandir($dir);foreach($files as $key => $val){if($val[$key]==='.'||$val[$key]==='..'){unset($files[$key]);}}sort($files);reset($files);return $files;}
    function fupld(){
    $rootdir='./img';$files=scd($rootdir);
    $n=count($files)+1;
    if($n < 100){$n=($n < 10) ? '00'.$n : '0'.$n;}
    $uploaddir=$rootdir;
    $ext=substr(basename($_FILES['userfile']['name']),-4);
    $uploadfile=$uploaddir .'/webcam_'.$n.$ext;
    if(move_uploaded_file($_FILES['userfile']['tmp_name'], $uploadfile)){frm();}
    }
    
    function frm(){
    $output='<!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Uploader</title>
    <style type="text/css">
    body{color:#000;background-color:#fff;font-family:\'Bookman Old Style\',Georgia,Verdana;font-size:14px;text-align:center;padding-top:10px;}
    input[type=text]{text-align:center;}
    .btn{margin-left:10px;margin-right:10px;border:none;background-color:transparent;color:#000;font-size:16px;cursor:pointer;}
    </style>
    </head>
    <body>
    <form enctype="multipart/form-data" action="uploader.php?mode=fupld" method="post">
    The max size of the uploaded file is <b>'.ini_get('upload_max_filesize').'</b><br /><br />
    Upload a file:&nbsp;&nbsp;&nbsp;<input name="userfile" type="file" />&nbsp;&nbsp;&nbsp;<input class="btn" type="submit" value="Upload" />
    </form>
    </center>
    </body>
    </html>';
    echo $output;
    }
    /*---------------------------------------------------------------------*/
    $mode=(!empty($_GET['mode']))?$_GET['mode']:$_POST['mode'];
    switch($mode){
    case 'fupld':fupld();break;
    default:frm();
    }
    ?>
    for thumbs.php and the working directory structure see the attachment display_last_uploaded_image.zip
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles