Hello everyone,
Hopefully someone is also interested on what I am doing.
I have uploaded this extension:
http://www.opencart.com/index.php?route ... rch=avatar
It working great!!! as always... but I want to customize it so that photo is just one click upload like social media (FB).
Just one click upload.
Then I plan it to place also in my Module/Account Right-side Panel.
It was successfully uploaded in Account/edit after save.
but module/account dont have a save function. I a planning to put a save function also via Javascript but no luck.
I dont have an idea how to save an image. hoping someone have an idea.
it already exists, for cheap, so, why waste lot's of time ?
Avatars for customers. Easy upload any image as avatar
http://www.opencart.com/index.php?route ... n_id=17062
Ernie
Update: Just found a free Extension, more by accident, unfortunately, it's only for OC v.1.5.x,
but at least, you will find the 'Content', to be used/placed in the other files, to make it work.
http://www.opencart.com/index.php?route ... n_id=17549
---
Avatars for customers. Easy upload any image as avatar
http://www.opencart.com/index.php?route ... n_id=17062
Ernie
Update: Just found a free Extension, more by accident, unfortunately, it's only for OC v.1.5.x,
but at least, you will find the 'Content', to be used/placed in the other files, to make it work.
http://www.opencart.com/index.php?route ... n_id=17549
---
My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.
I successfully Upload picture by 1 click only.
First modify 3 part of catalog side.
Controller side:
File name: catalog/controller/module/account.php
Add below: $this->load->language('module/account');
Then add in Language file: catalog/language/english/module/account.php
$_['text_upload'] = 'Your photo was successfully uploaded!';
In template side, carefully check codes based on your theme.
File: /catalog/view/theme/*/template/module/account.tpl
below: <?php if ($logged) { ?>
add
add this important Js file:
I add this
$('input[type="submit"]').click();
For me to submit file without double clicking save button
First modify 3 part of catalog side.
Controller side:
File name: catalog/controller/module/account.php
Add below: $this->load->language('module/account');
Code: Select all
if (($this->request->server['REQUEST_METHOD'] == 'POST')) {
$this->model_account_customer->editCustomer($this->request->post);
$this->session->data['success'] = $this->language->get('text_upload');
$this->response->redirect($this->url->link('account/account', '', 'SSL'));
}
Then add in Language file: catalog/language/english/module/account.php
$_['text_upload'] = 'Your photo was successfully uploaded!';
In template side, carefully check codes based on your theme.
File: /catalog/view/theme/*/template/module/account.tpl
below: <?php if ($logged) { ?>
add
Code: Select all
<form action="<?php echo $action; ?>" method="post" enctype="multipart/form-data" class="form-horizontal">
<div class="profile-img-container-account">
<?php if ($avatar) { ?>
<img id="button-upload" src="<?php echo $avatar; ?>" style="width: <?php echo $avatarwidth; ?>px; height: <?php echo $avatarheight; ?>px; padding: <?php echo $avatarpadding; ?>px;" alt="AVATAR" class="img-thumbnail img-square img-responsive"/><i class="fa fa-camera fa-2x"></i>
<?php } else { ?>
<img id="button-upload" src="<?php echo $davatarimage; ?>" style="width: <?php echo $avatarwidth; ?>px; height: <?php echo $avatarheight; ?>px; padding: <?php echo $avatarpadding; ?>px;" alt="AVATAR" class="img-thumbnail img-square img-responsive" /><i class="fa fa-camera fa-2x"></i>
<?php } ?></div>
<input type="hidden" name="avatar" value="" id="input-avatar" />
<input type="submit" value="submit" style="display:none; ?>;" />
</form>
add this important Js file:
Code: Select all
<script type="text/javascript"><!--
$('img[id^=\'button-upload\']').on('click', function() {
var node = this;
$('#form-upload').remove();
$('body').prepend('<form enctype="multipart/form-data" id="form-upload" style="display: none;"><input type="file" name="file" /></form>');
$('#form-upload input[name=\'file\']').trigger('click');
timer = setInterval(function() {
if ($('#form-upload input[name=\'file\']').val() != '') {
clearInterval(timer);
$.ajax({
url: 'index.php?route=tool/avatarupload',
type: 'post',
dataType: 'json',
data: new FormData($('#form-upload')[0]),
cache: false,
contentType: false,
processData: false,
beforeSend: function() {
$('img[id=\'button-upload\']').after(' <i class="fa fa-circle-o-notch fa-spin fa-2x"></i>');
},
complete: function() {
$('.fa-spin').remove();
},
success: function(json) {
$('.text-danger').remove();
if (json['error']) {
$(node).parent().find('input').after('<div class="text-danger">' + json['error'] + '</div>');
}
if (json['success']) {
alert(json['success']);
$(node).parent().find('img').replaceWith('<img id="button-upload" src="' + json['code'] + '" style="width: <?php echo $avatarwidth; ?>px; height: <?php echo $avatarheight; ?>px; padding: <?php echo $avatarpadding; ?>px;" class="img-thumbnail img-square img-responsive"/></div>');
$('#input-avatar').replaceWith('<input type="hidden" name="avatar" value="' + json['code'] + '" id="input-avatar" />');
$('input[type="submit"]').click();
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
}
});
}
}, 500);
});
//--></script>
I add this
$('input[type="submit"]').click();
For me to submit file without double clicking save button
Who is online
Users browsing this forum: No registered users and 27 guests