Codeigniter image resize before upload - php

Question

I am trying to upload multiple images in Codeigniter and reduce the size of each image.
here is my view
<?php echo form_open_multipart('main_controller/do_insert');?>
<div id="mainDiv">
<div class='group'>
<div><input type="text" name="name[]"/></div>
<div><input type="file" name="img[]"/></div>
</div>
</div>
<input type="button" id="add an entry">
<input type="submit" value="save all"/>
<?php from_close();?>
and my javascript is look like
<script>
function add(x)
{
var str1="<div><input type='text' name='name"+x+"'/></div>"
var str2="<div><input type='file' name='img"+x+"'/></div>"
var str3="<input type='button' value='add an entry' onClick='add(x+1)'>";
$("#mainDiv").append(str1+str2+str3);
}
</script>
here is my controller
function do_insert{
while($i<=$counter) /*conter have value of total number for images just ignore*/
{
$config['upload_path'] = './images/';
$config['allowed_types'] = 'gif|jpg|png';
$this->load->library('upload', $config);
if ( ! $this->upload->do_upload($userfileName))
{
echo "error".count;
}
else
{
$data = array('upload_data' => $this->upload->data());
$img=$data['upload_data']['file_name']; /*for geting uploaded image name*/
$config['image_library'] = 'gd2';
$config['source_image'] = './images/'.$img;
$config['new_image'] = './images/';
$config['maintain_ratio'] = TRUE;
$config['width'] = 640;
$config['height'] = 480;
$this->load->library('image_lib', $config);
if (!$this->image_lib->resize()) {
echo $this->image_lib->display_errors();
}
else
{
echo "success"; /*and some code here*/
}
}
}
}
my problem is that only the first image is getting re-sized remains kept as its original size.
And the image is resized after once uploaded. I think this is not a proper way now
Is there any alternative way to resize the image? it may be better if resize before doing the upload.

Answer 1

I have solved the problem resizing first image by making changes in my controller as `
$this->load->library('image_lib');
while($i<=$counter) /*conter have value of total number for images just ignore*/
{
$config['upload_path'] = './images/';
$config['allowed_types'] = 'gif|jpg|png';
$this->load->library('upload', $config);
if ( ! $this->upload->do_upload($userfileName))
{
echo "error".count;
}
else
{
$image_data = $this->upload->data();
$configer = array(
'image_library' => 'gd2',
'source_image' => $image_data['full_path'],
'maintain_ratio' => TRUE,
'width' => 250,
'height' => 250,
);
$this->image_lib->clear();
$this->image_lib->initialize($configer);
$this->image_lib->resize();
}
}

Answer 2

I solved image resize before upload image in codeigniter use this simple code.
image.php
<form id="thumb_form" enctype="multipart/form-data" method="post">
<div style="margin-bottom: 5px;">
<label>Choose Image File</label>
<input id="image" name="image" type="file" class="form-control"/>
</div>
<div>
<input type="submit" class="btn btn-primary" name="add_video" id="add_video" value="Submit">
</div>
</form>
//ajax call write here
ajax call or script
<script>
$("form#thumb_form").submit(function(event)
{
event.preventDefault();
var formData = new FormData($(this)[0]);
$.ajax({
url : "<?php echo site_url('Welcome/add_image_thumb');?>",
type : "POST",
data: formData,
contentType: false,
processData: false,
dataType:"JSON",
success : function(result)
{
alert(result);
}
});
});
Welcome.php
public function add_image_thumb()
{
if($_FILES['image']['name']=='')
{
$data['file_err']='please choose image';
}
else
{
$data = $_FILES['image']['name'];
$config['image_library'] = 'gd2';
$config['source_image'] = $_FILES['image']['tmp_name'];
$config['create_thumb'] = FALSE;
$config['maintain_ratio'] = FALSE;
$config['width'] = 300;
$config['height'] = 300;
$config['new_image'] = 'asstes/thumb/' . $data;
$this->load->library('image_lib', $config);
$this->image_lib->resize();
$img = '<img src="' . base_url() . 'asstes/thumb/' . $data . '">';
echo json_encode(array('img' => $img));
}
}

Answer 3

//Here is my upload controller and really works in local and server
//load you image_lib to your config
$config = array(
'upload_path' => './upload/',
'log_threshold' => 1,
'allowed_types' => 'jpg|png|jpeg|gif|JPEG|JPG|PNG',
'max_size' => 10000,
'max_width'=>0,
'overwrite' => false
);
for($i = 1 ; $i <=8 ; $i++) {
$upload = 'upload'.$i; //set var in upload
if(!empty($upload)){
$this->load->library('upload', $config);
$this->upload->do_upload('upload'.$i);
$upload_data = $this->upload->data();
$file_name = $upload_data['file_name'];
// process resize image before upload
$configer = array(
'image_library' => 'gd2',
'source_image' => $upload_data['full_path'],
'create_thumb' => FALSE,//tell the CI do not create thumbnail on image
'maintain_ratio' => TRUE,
'quality' => '40%', //tell CI to reduce the image quality and affect the image size
'width' => 640,//new size of image
'height' => 480,//new size of image
);
$this->image_lib->clear();
$this->image_lib->initialize($configer);
$this->image_lib->resize();
}
}