<?php
  if (isset($_GET['source'])) {
        highlight_file($_SERVER['SCRIPT_FILENAME']);
        exit;
  }
?>
<html>
<head>
<title>Art Gallery</title>
    
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="theme-color" content="#B5C7DD" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="../css/reset.css">
        <link rel="stylesheet" href="../css/mandy.css">
        <link rel="stylesheet" href="../css/form.css">

<link rel="shortcut icon" href="../favicon.ico" type="image/x-icon">
    
    <style>
        div img {display: block; margin: .5em auto; max-width: 600px}
        div {max-width: 600px}
        input:not([type="submit"]), input:hover:not([type="submit"]), input:active:not([type="submit"]) {width: inherit}
        [type="hidden"]{display: none}
    </style>    
    
    
</head>
<body>
  
<h2 class="pad-top">    
    
<?php   # need this to be able to view source in the below anchor tag
  $urlPath=dirname($_SERVER['SCRIPT_URL']).'/'; 
  $labsPath=$urlPath.'labs/'; 
?>     

    <a href="../index.php">CS 130A</a> → Lab 10
<a href="<?=$urlPath?>index.php?source" target="labs">Source code</a>

</h2>   


<h4>File Input/Output - Art Gallery</h4>
    <p class="nudge in">A little art gallery where you can add your own images! Currently, .png, .jpg, .jpeg, .gif files with a <strong>max size of 1MB</strong> are accepted. Larger widths will (in the future) be resized down to fit the website formatting. For now please keep uploads under 600px in width. Or not.</p>

    
<form method="post" action="index.php" enctype="multipart/form-data">
    
<input type="hidden" name="MAX_FILE_SIZE" value="1048576">
    
Your file: <input class="button" type="file" name="uploadedfile[]"><br/>
<input class="button right" type="submit" value="Send it!">
</form>   
    
<pre>

<?php 
    
    
// uploading files example, skipping the file_library.php since I'm displaying images, not their filepaths as links
    
 $galleryfolder = 'images/';
  $filetypes = "{*.gif,*.jpg, *.jpeg,*.png}";

  // process submitted file upload; currently disabled for server safety
//   if (is_array($_FILES) && count($_FILES) && isset($_FILES['uploadedfile'])) 
//     {
//     foreach ($_FILES["uploadedfile"]["error"] as $key => $error) 
//         {
//         if ($error == UPLOAD_ERR_OK) 
//             {
//             $tmp_name = $_FILES["uploadedfile"]["tmp_name"][$key];
//             // basename() may prevent filesystem traversal attacks;
//             // further validation/sanitation of the filename may be appropriate
//             $name = basename($_FILES["uploadedfile"]["name"][$key]);
//             move_uploaded_file($tmp_name, "$galleryfolder/$name");
//             }
//         }
//     }    
    
    
    
//  slightly modified art gallery source code, changed to increase the range of image file extensions
$dirname = 'images/';
$filelist = glob("$dirname*.{png,jpeg,jpg,gif}", GLOB_BRACE);
if ($filelist != false) 
    {
    print "<h3 class=\"pad-top\">Here are some pictures:</h3>";
    foreach ($filelist as $file) 
        {
//        $url = "http://hills.ccsf.edu/~mchen75/cs130a/images/" 
        // url modified to a relative link to allow the server files to be moved together anywhere 
        $url = "images/" 
        . substr($file, strrpos($file, '/') + 1);
        print "<div><img src='$url'></div>";
        }
    } 
else 
    {
    print "No pictures yet. Try uploading some!";
    }  
    
  
?>     

</pre>   

    
    <p class="hide">
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 
</p>

    <div class="stretch"></div>
</body>
</html>