Please download this file public.rar and extract to your public folder (C:\wamp\www\test_laravel\public)
Step 1: Edit route file (C:\wamp\www\test_laravel\app\Http\routes.php) and add
Route::controller('tutorial', 'TutorialController');
Step 2: Create view file resize_upload_image_file.blade.php in C:\wamp\www\test_laravel\resources\views\tutorial (please create tutorial folder if not exist)
<!DOCTYPE html>
<html lang="en">
<head>
<meta name="_token" content="{{ csrf_token() }}"/>
<title>Laravel Tutorials</title>
<!-- Styles -->
<link href="{{ asset('bootstrap-3.3.6/css/bootstrap.min.css') }}" rel="stylesheet">
</head>
<body>
<div class="container-fluid">
<div class="row"></div>
<div class="row">
<div class="col-md-4"></div>
<div class="col-md-4">
<center>
<br/>
<div style="width:200px;height: 200px;border: 1px solid whitesmoke;text-align: center" id="img1">
<img width="100%" height="100%" src="{{asset('images/default.jpg')}}"/>
</div>
<br/>
<p>
<a href="javascript:changeProfile()" style="text-decoration: none;"><i
class="glyphicon glyphicon-edit"></i> Change</a>
<a href="javascript:removeFile()"
style="color: red;text-decoration: none;"><i
class="glyphicon glyphicon-trash"></i>
Remove</a>
</p>
<input type="file" id="file1" style="display: none"/>
</center>
</div>
<div class="col-md-4"></div>
</div>
</div>
<!-- JavaScripts -->
<script src="{{ asset('js/jquery-1.11.2.min.js') }}"></script>
<script src="{{ asset('bootstrap-3.3.6/js/bootstrap.min.js') }}"></script>
<script>
var filename = '';
function changeProfile() {
$('#file1').click();
}
$('#file1').change(function () {
if ($(this).val() != '') {
upload();
}
});
function upload() {
var file_data = $('#file1').prop('files')[0];
var form_data = new FormData();
form_data.append('file', file_data);
$.ajaxSetup({
headers: {'X-CSRF-Token': $('meta[name=_token]').attr('content')}
});
$('#img1').html('<img src="{{asset('images/loader.gif')}}" style="padding-top: 40%"/>');
$.ajax({
url: "{{url('tutorial/resize-upload-image-file')}}", // point to server-side PHP script
data: form_data,
type: 'POST',
contentType: false, // The content type used when sending data to the server.
cache: false, // To unable request pages to be cached
processData: false,
success: function (data) {
if (data.fail) {
$('#img1').html('<img width="100%" height="100%" src="{{asset('images/default.jpg')}}"/>');
alert(data.errors['file']);
}
else {
filename = data;
$('#img1').html('<img width="100%" height="100%" src="{{asset('uploads')}}/' + data + '"/>');
}
},
error: function (xhr, status, error) {
alert(xhr.responseText);
$('#img1').html('<img width="100%" height="100%" src="{{asset('images/default.jpg')}}"/>');
}
});
}
function removeFile() {
if (filename != '')
if (confirm('Are you sure want to remove profile picture?'))
$.ajax({
url: "{{url('tutorial/remove-image-file')}}/" + filename, // point to server-side PHP script
type: 'GET',
contentType: false, // The content type used when sending data to the server.
cache: false, // To unable request pages to be cached
processData: false,
success: function (data) {
$('#img1').html('<img width="100%" height="100%" src="{{asset('images/default.jpg')}}"/>');
filename = '';
},
error: function (xhr, status, error) {
alert(xhr.responseText);
}
});
}
</script>
</body>
</html>
Step 3: Create controller file TutorialController.php in C:\wamp\www\test_laravel\app\Http\Controllers
<?php
namespace App\Http\Controllers;
use App\Lib\ResizeImageFile;
use Illuminate\Http\Request;
use App\Http\Requests;
use Illuminate\Support\Facades\File;
use Illuminate\Support\Facades\Validator;
class TutorialController extends Controller
{
public function getResizeUploadImageFile()
{
return view('tutorial.resize_upload_image_file');
}
public function postResizeUploadImageFile(Request $request)
{
$validator = Validator::make($request->all(),
[
'file' => 'image',
],
[
'file.image' => 'The file must be an image (jpeg, png, bmp, gif, or svg)'
]);
if ($validator->fails())
return array(
'fail' => true,
'errors' => $validator->getMessageBag()->toArray()
);
$extension = $request->file('file')->getClientOriginalExtension(); // getting image extension
$dir = 'uploads/';
$filename = uniqid() . '_' . time() . '.' . $extension;
$request->file('file')->move($dir, $filename);
$resize = new ResizeImageFile($dir . $filename);
$resize->resizeImage(200, 200, 'exact'); // You can play around with these options(exact, portrait, landscape, auto, crop)
$resize->saveImage($dir . $filename, 75); // 75 is image quality (0-100)
return $filename;
}
public function getRemoveImageFile($filename)
{
File::delete('uploads/' . $filename);
}
}
How to test? open your browser and type http://localhost/test_laravel/public/tutorial/resize-upload-image-file. You will see this screen
1 comment:
Untuk menang beberapa ratus juta rupiah di situs judi online pasti bukan perihal gampang yang dapat dikerjakan tiada satu usaha
asikqq
dewaqq
sumoqq
interqq
pionpoker
bandar ceme terpercaya
hobiqq
paito warna
forum prediksi
Post a Comment