Page 1 of 1

Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 9:41 am
by MiniMonty
Hi all,

I've got a multiple upload script which does this:

Upload 5 images to a dir. Count the images already in the dir and rename the new images incrementally (1.jpg, 2.jpg etc)
Make a thumbnail of each image. (sml_1.jpg, sml2.jpg etc))

I have a small problem which I can't seem to solve.

At the end of the script I want to print the 5 new thumbnails for the user to see.
I'm doing this (wrong) by declaring a variable "$thumbToPrint" but it's inside the loop so when the script finishes the html
prints the last thumb created 5 times.

Any ideas ?

Best wishes
Monty

Code: Select all

 
  for ($i=0;$i<5;$i++)
  {
if ((!empty($_FILES['userfile'])) && ($_FILES['userfile']['error'][$i] == 0)){
    $image = $_FILES['userfile']['name'][$i];
    $filename = stripslashes($_FILES['userfile']['name'][$i]);
    $extension = getExtension($filename);
    $extension = strtolower($extension);
   
        //Filetype check
    if (!in_array($extension,$acceptableextensions)){
        exit("Upload failed.<BR>Unacceptable file type.<br. Use only jpg, jpeg, png or fig formats");
        echo '<h1>Only try to upload .jpg, .jpeg, .png and .gif files!</h1>';
        $errors=1;
       
        //Filesize check
    } else if ($_FILES['userfile']['size'][$i] > $maxfilesize ) {
        $error_msg = 'Ooops - your image was too large,<br> 250kb Maximum. Please try again.';
        unlink($_FILES['userfile']['tmp_name'][$i]);
    } else {
            // rename the picture incrementally
        $extension = getExtension($filename);
        $extension = strtolower($extension);
        $groovy = sizeof(glob("members/$id/images/course_pics/*"));
        $groovy = ++$groovy;
 
        $image_name=$groovy.'.'.$extension;
        $newname="".$image_name;
       
        
            // NOW make the resize call !
        //img_resize ($_FILES ['fileField'] [ 'name'], $_FILES [ 'fileField'] [ 'tmp_name'], 25, $newname);
 
 
            // INSERT image into the DB
        //$sql = mysql_query("INSERT INTO pictures
        //(UID,filename,dirpath,gallery,dtadded)
        //VALUES ('$id','$newname','/members/$id/images/$newname','$gowhere',now())")
        //or die (mysql_error());
                       
        $place_file = move_uploaded_file( $_FILES['userfile']['tmp_name'][$i], "members/$id/images/course_pics/".$newname);
        chmod ("members/$id/images/course_pics/$newname", 0644);
        //////////  MY RESIZE EFFORT !!
        
              $save = "members/$id/images/course_pics/" .$newname; //This is the new file you saving
              $file = "members/$id/images/course_pics/" .$newname; //This is the original file
 
              list($width, $height) = getimagesize($file) ; 
 
              $modwidth = 750; 
 
              $diff = $width / $modwidth;
 
              $modheight = $height / $diff; 
              $tn = imagecreatetruecolor($modwidth, $modheight) ; 
              $image = imagecreatefromjpeg($file) ; 
              imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ; 
 
              imagejpeg($tn, $save, 100) ; 
 
            /////////  NOW MAKE A THUMBNAIL OF THE IMAGE
 
              $save = "members/$id/images/course_pics/sml_" . $newname; //This is the new file you saving
              $file = "members/$id/images/course_pics/" . $newname; //This is the original file
 
              list($width, $height) = getimagesize($file) ; 
 
              $modwidth = 80; 
 
              $diff = $width / $modwidth;
 
              $modheight = $height / $diff; 
              $tn = imagecreatetruecolor($modwidth, $modheight) ; 
              $image = imagecreatefromjpeg($file) ; 
              imagecopyresampled($tn, $image, 0, 0, 0, 0, $modwidth, $modheight, $width, $height) ; 
 
              imagejpeg($tn, $save, 100) ; 
           
            $thumbToPrint = "<img src='members/$id/images/course_pics/sml_".$newname."'>";
 
       
        $success_msg = '<span class="Big_Orange_Times">Your image has been uploaded. it may take a few moments to appear in your gallery, please be patient.<br>';
 
         
        } else if ((!empty($_FILES['userfile'])) && ($_FILES['userfile']['error'][$i] == 4)){ 
        //Error code 4: No image uploaded
    $error_msg = 'Please browse for an image before you press Go.';
    
}
  }
 

Re: Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 10:38 am
by AbraCadaver
I don't see the code where you actually output the thumbs, but here are two suggestions.

You can assign $thumbToPrint as an array and at the end of your script loop through them:

Code: Select all

$thumbToPrint[] = "<img src='members/$id/images/course_pics/sml_".$newname."'>";
Or, you can just concatenate them together and display the one var at the end:

Code: Select all

//at the top of your script outside of the loop
$thumbToPrint = '';
//where you have it now
$thumbToPrint .= "<img src='members/$id/images/course_pics/sml_".$newname."'>";

Re: Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 12:54 pm
by MiniMonty
Thanks - that works.

Using your second method and this in the html
<?php print_r ("$thumbsToPrint"); ?>
I get the five images in a line, which, after a day of trying to make this whole
script work is pretty satisfying !

So now I need to be a bit more clever - I actually want to print the thumbnails
into five separate cells in a table - with your first method how would I loop through the array
and be able to print each one with a separate print command ?
(I'm still an official newb) :?

Best wishes
Monty

Re: Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 1:00 pm
by AbraCadaver
Look at foreach() and loop through the array and echo your td and img tags.

With the second method you could do something like this:

Code: Select all

$thumbToPrint .= "<td><img src='members/$id/images/course_pics/sml_".$newname."'></td>";
 
//and after the loop
echo "<table><tr>".$thumbToPrint."</tr></table>";

Re: Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 5:52 pm
by MiniMonty
OK - this is going pretty well (and I'm learning a fair bit too).
foreach() is a handy little number !

So I'm using this within the loop:

Code: Select all

 
$thumbsToPrint [] = "<td><img src='members/$id/images/course_pics/sml_".$newname. "'></td>";
 
and then this in the html of the page:

Code: Select all

 
<form name="form1" method="post" action="TBC">
      <span class="orangeText">
      <?php foreach( $thumbsToPrint as $img_src){
    echo "<tr>$img_src</tr> ";
    }
   ?></span>
    </form>
 
The reason it's wrapped in a form will become clear in a second....

This combo gives me the output I was looking for - i.e. five thumbnails in a table like this:

Image

So, next step.... For the past couple of hours via a combination of reading, research and trial and error I have been trying to
add a text area next to each thumbnail - no joy. A picture is worth a thousand words so what I want to end up with is this:

Image

A table where each thumbnail has a text area aligned with it and then a submit button (hence wrapping it all in a form).
I've tried ALL kinds of ways and means, all kinds of syntax and cannot get it right :oops:

So all and any help much appreciated as this is almost the last step in my project !

I'd really like to learn how to echo out a table with a few elements in it - some from variables (the thumbnails), some from html
(the text area and button)- and make a useable form for the user to post comments on the uploaded inages.

Best wishes
Monty

Re: Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 5:57 pm
by AbraCadaver
You just need a <td><textarea></textarea></td> after the image. Also, you need to actually have <table> and </table> tags. In addition, I'm pretty sure you can't wrap a table row <tr></tr> in a span.

Re: Printing thumbnails out of a loop ?

Posted: Wed Feb 03, 2010 7:19 pm
by MiniMonty
I've got the table tags - and you are right about <td><textarea></textarea></td> after the image.
I works and gives a text area. But nowhere near where I want it :banghead:

THIS works and gives a text area:

Code: Select all

 
<table width="56%" height="18"  border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="44%"><form name="form1" method="post" action="">
      <span class="orangeText">
      <?php foreach( $thumbsToPrint as $img_src){
    echo "<tr>$img_src<td><textarea></textarea></td></tr> ";
    }
   ?></span>
      <br>
      <input type="submit" name="Submit" value="Critique please">
        </form>      </td>
    <td width="56%"><div align="center"><span class="orangeText"><?php print "$error_msg"; ?></span></div></td>
  </tr>
</table>
 
But when I give it the "full code" (which I assumed would be "allowed" ) like this:

Code: Select all

 
<table width="56%" height="18"  border="0" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="55%"><form name="form1" method="post" action="TBC">
      <span class="orangeText">
      <?php foreach( $thumbsToPrint as $img_src){
    echo "<tr>$img_src<td><textarea name="textarea" cols="45" rows="2" wrap="VIRTUAL"></textarea></td></tr> ";
    }
   ?></span>
    </form>      </td>
    <td width="45%"><div align="center"><span class="orangeText"><?php print "$error_msg"; ?></span></div></td>
  </tr>
</table>
 

I get an unexpected T_STRING (and with or without the span I get the T_STRING error).
So how do I control the look and feel here ? Where is the T_STRING error coming from ???

And how (oh how) do I place the submit button because all my efforts so far have only had it show up BEFORE the images !!!!

Best wishes
Monty