jQuery(function(){
//jQuery(document).ready(function ($) {
{
// Change this to the location of your server-side upload handler:
var count = 0;
var url = "<?php echo $this->url(array('module' => 'advalbum', 'controller' => 'index', 'action' => 'upload-photo'), 'default')?>";
jQuery('#fileupload').fileupload({
url: url,
dataType: 'json',
done: function (e, data)
{
$('files').style.display = 'block';
jQuery('.files-contain').addClass('success');
jQuery.each(data.result.files, function (index, file)
{
let thumbcounta = 0;
var text2 = "";
var text = "";
var textmove = "";
var ele = jQuery('<li/>');
var ele2 = jQuery('<li/>');
ele.attr('id', count);
//thumbmovecount++;
if(file.status)
{
//text = '<span id="progress-thumb" class="file-picture"><img src="/externals/fancyupload/assets/gnome-emblem-photos-upload-photo-icon-hd.png?c=59" alt="" class="thumb_profile item_photo_user "></span>';
text = '<span id="progress-thumb'+thumbmovecount+'" class="file-picture"></span>';
text += '<span id="filetemp" class="file-name"><span>' + file.name + '</span></span>';
text += '<span class="file-check"><span><?php echo $this->translate("Uploaded")?><div class="progress-bar progress-bar-success" style="width:0%;"></div></span></span>';
text += '<span class="buttonblue"><a class="file-remove blue" onclick = " " href="javascript:;"><span><?php echo $this->translate("Start")?></span></a></span>';
text += '<span class="buttonorange"><a class="file-remove orange" onclick = "removeFile('+ count +', ' + file.photo_id + ')" href="javascript:;" title="<?php echo $this->translate("Cancel")?>"><span><?php echo $this->translate("Cancel")?></span></a></span>';
textmove = '#progress-thumbmove'+thumbmovecount+'';
ele.addClass('file-success');
ele.addClass("photoFile");
ele.html(text).appendTo('#files');
$('html5uploadfileids').value = $('html5uploadfileids').value + ' ' + file.photo_id;
jQuery(textmove).detach().prependTo('#progress-thumb'+thumbmovecount+'');
thumbmovecount++;
successcounta++;
successupdateDisplay();
}
else
{
text = '<a class="file-remove" onclick = "removeFile('+ count +', 0)" href="javascript:;" title="<?php echo $this->translate("del")?>"><?php echo $this->translate("Remove")?></a>';
if(file.name)
text += '<span class="file-name">' + file.name + '</span>';
text += '<span class="file-info"><span>' + file.error +'</span></span>';
ele.html(text).appendTo('#files');
}
});
$('submit-wrapper').style.display = 'block';
count ++;
},
progressall: function (e, data)
{
$('progress').style.display = 'block';
var fi = document.getElementById('fileupload');
if (fi.files.length > 0) {
for (var i = 0; i <= fi.files.length - 1; i++) {}}
else {for (var i = 0; i <= fi.files.length - 1; i++) {}};
var progresstotal = ''+ fi.files.length +'';
var progress = parseInt(data.loaded / data.total * 100, 10);
var progressloaded = parseInt(count + 1);
var progresserror = ''+ fi.files.length +'';
//var progresstotal2 = ''+ fi.files.length +'';
var progresstotalleft = ''+ fi.files.length +'';
//var photoidx = 'progress-thumbmove'+thumbcounta+'';
//jQuery("#progress-thumb2").attr('id', photoidx);
jQuery('#progress .progress-bar').css(
'width',
progress + '%'
);
jQuery('#progress-loaded').css('display', 'inline-block').text(successcounta);
jQuery('#progress-loadedtext').css('display', 'inline-block').text(
'Success:'
);
jQuery('#progress-loadedtext2').css('display', 'inline-block').text(
','
);
jQuery('#progress-error').css('display', 'inline-block').text(
progresserror
);
jQuery('#progress-errortext').css('display', 'inline-block').text(
'Error:'
);
jQuery('#progress-errortext2').css('display', 'inline-block').text(
''
);
jQuery('#progress-total').css('display', 'inline-block').text(
progresstotal
);
jQuery('#progress-totaltext').css('display', 'inline-block').text(
'Total:'
);
jQuery('#progress-totaltext2').css('display', 'inline-block').text(
','
);
jQuery('#progress-totalleft').css('display', 'inline-block').text(
progresstotalleft
);
jQuery('#progress-totallefttext').css('display', 'inline-block').text(
'Left:'
);
jQuery('#progress-totallefttext2').css('display', 'inline-block').text(
','
);
jQuery('#progress-percent').css('display', 'inline-block').text(
progress + '%'
);
}
}).prop('disabled', !jQuery.support.fileInput)
.parent().addClass(jQuery.support.fileInput ? undefined : 'disabled');
}});
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
// Loop through the FileList and render image files as thumbnails.
for (var i = 0, f; f = files[i]; i++) {
// Only process image files.
if (!f.type.match('image.*')) {
continue;
}
var reader = new FileReader();
var ii = -1
// Closure to capture the file information.
reader.onload = (function(theFile) {
return function(e) {
// Render thumbnail.
var span = document.createElement('span');
ii++
span.innerHTML = ['<img class="file-picture2" id="progress-thumbmove'+ii+'" src="', e.target.result,
'" title="', escape(theFile.name), '"/>'].join('');
document.getElementById('list').insertBefore(span, null);
};
})(f);
// Read in the image file as a data URL.
reader.readAsDataURL(f);
}
}
document.getElementById(‘fileupload’).addEventListener(‘change’, handleFileSelect, false);
function photoFile(photo_id) {
loadImage(
this.files[0],
function (img) {
document.body.appendChild(img)
},
{ maxWidth: 300 } // Options
)
return false;
}
function removeFile(count, photo_id)
{
//var progress2 = parseInt(data.loaded / data.total * 100, 10);
var iDiv = document.createElement(‘div’);
iDiv.id = ‘progress-thumb’;
iDiv.className = ‘file-picture’;
document.getElementById(‘file-remove’).appendChild(iDiv);
jQuery('#' + count).remove();
successcounta--;
successupdateDisplay();
//jQuery('#progress .progress-bar').css('width', progress2-- + '%');
if(photo_id) {
$('html5uploadfileids').value = $('html5uploadfileids').value.replace(photo_id, '');
}
if( $('files').getChildren().length==0 ) {
$('files').hide();
$('progress').hide();
$('progress-percent').set('style', 'margin-top: 10px; display: none');
$$('.files-contain')[0].set('class','files-contain');
}
return false;
}
function clearList()
{
var iDiva = document.createElement(‘div’);
iDiva.id = ‘progress-thumb’;
iDiva.className = ‘file-picture’;
document.getElementById(‘file-remove’).appendChild(iDiva);
$('files').style.display = 'none';
jQuery('.files-contain').removeClass('success');
jQuery('#files').text('');
$('html5uploadfileids').value = '';
$('submit-wrapper').style.display = 'none';
$('progress').style.display = 'none';
$('progress-percent').innerHTML = '';
jQuery('#progress .progress-bar-success.success').css('width', '0%');
jQuery('#progress .progress-bar-success.success').removeClass('success');
successcounta = 0;
successupdateDisplay();
return false;
}
function successupdateDisplay(){
successcounterDisplayElem.innerHTML = successcounta;
};
function thumbupdateDisplay(){
thumbcounterDisplayElem.innerHTML = thumbcounta;
};
function thumbupdatemoveDisplay(){
thumbcounterDisplayElem.innerHTML = thumbmovecount;
};
