Welcome Guest, Not a member yet? Register   Sign In
can't display images: ci from scratch day 9 tutorial
#1

[eluser]swgj19[/eluser]
My images are uploading fine to my images folder and thumb folder. However, whenever I upload an image, my view page gallery_view.php shows shows the image as a gray box or a missing file. My images folder is outside of application folder.

ci_series_day9/images/thumbs

base url in config.php
Code:
$config['base_url']= "http://localhost/ci_series_day9/index.php";

Here is my code:

view: gallery_view.php
Code:
<!DOCTYPE HTML>
&lt;html lang="en-US"&gt;
&lt;head&gt;
&lt;title&gt;CI Gallery&lt;/title&gt;
&lt;meta charset="UTF-8"&gt;
&lt;style type="text/css"&gt;
  #gallery, #upload {
   border: 1px solid #ccc; margin: 10px auto; width: 570px; padding: 10px;
  }
  #blank_gallery {
   font-family: Arial; font-size: 18px; font-weight: bold;
   text-align: center;
  }
  .thumb {
   float: left; width: 150px; height: 100px; padding: 10px; margin: 10px; background-color: #ddd;
  }
  .thumb:hover {
   outline: 1px solid #999;
  }
  img {
   border: 0;
  }
  #gallery:after {
   content: "."; visibility: hidden; display: block; clear: both; height: 0; font-size: 0;
  }
&lt;/style&gt;
&lt;/head&gt;
&lt;body&gt;
<div id="gallery">
  &lt;?php if (isset($images) && count($images)):
   foreach($images as $image): ?&gt;
   <div class="thumb">
    <a href="&lt;?php echo $image['url']; ?&gt;">
     <img src="&lt;?php echo $image['thumb_url']; ?&gt;" />
    </a>    
   </div>
  &lt;?php endforeach; else: ?&gt;
   <div id="blank_gallery">Please Upload an Image</div>
  &lt;?php endif; ?&gt;
</div>

<div id="upload">
  &lt;?php
  echo form_open_multipart('gallery');       //'gallery' is controller that form is posted to
  echo form_upload('userfile');         //'userfile' is parameter default of file upload library
  echo form_submit('upload', 'Upload');       //input name, value
  echo form_close();
  ?&gt;  
</div>
&lt;/body&gt;
&lt;/html&gt;

model: gallery_model.php

Code:
&lt;?php
class Gallery_model extends CI_Model {

var $gallery_path;
var $gallery_path_url;

function Gallery_model() {
  parent::__construct();
  
  $this->gallery_path = realpath(APPPATH . '../images');     //APPPATH is a constant and set to the path of the application folder
  $this->gallery_path_url = base_url(). 'images/';      //realpath function in php cleans up messy paths
}

function do_upload() {
  
  $config = array(
   'allowed_types' => 'JPEG|jpg|jpeg|gif|png',
   'upload_path' => $this->gallery_path,
   'max_size' => 2000             //size in kilobytes
  );
  
  $this->load->library('upload', $config);        //initialize the library with config parameter
  $this->upload->do_upload();            //Performs upload function above, uploads and saves to the path
  $image_data = $this->upload->data();         //upload data function
  
  $config = array(
   'source_image' => $image_data['full_path'],       //source_image is path of the uploaded image. full path is a key of the array
   'new_image' => $this->gallery_path . '/thumbs',      //set path for new image in thumbs folder
   'maintain_ration' => true,
   'width' => 150,
   'height' => 100
  );
  
  $this->load->library('image_lib', $config);        //load image library
  $this->image_lib->resize();            //call the resize function
  
}

function get_images() {
  
  $files = scandir($this->gallery_path);         //scandir is php function, pass gallery path to $files
  $files = array_diff($files, array('.', '..', 'thumbs'));    //takes two arrays and calculates difference
  
  $images = array();
  
  foreach ($files as $file) {
   $images []= array (
    'url' => $this->gallery_path_url . $file,      //reference image path and filename
    'thumb_url' => $this->gallery_path_url . 'thumbs/' . $file  //reference thumbs path and filename
   );
  }
  
  return $images;
}

}

controller: gallery.php

Code:
&lt;?php
class Gallery extends CI_Controller {      

function index() {          //class is same name as controller name
  
  $this->load->model('Gallery_model');    //Have to load model to execute code on line 9 with do_upload function
  
  if ($this->input->post('upload')) {     //post name from form from view
   $this->Gallery_model->do_upload();    //Gallery_model will handel upload.
  }
  
  $data['images'] = $this->Gallery_model->get_images(); //get images to pass to the view
  
  $this->load->view('gallery_view', $data);   //load gallery_view
  
}

}


.htaccess file

Code:
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /ci_series_day9/index.php/$1 [L]




Theme © iAndrew 2016 - Forum software by © MyBB