responsivewebframework
Version:
Jalasoft Foundation Front End Framework ========================================
71 lines (68 loc) • 2.62 kB
JavaScript
frameworkObject.pogressBar = new function() {
var progresBar = function(id, filetitle, filesize) {
var id = '#'+id;
var filetitle = filetitle;
var filesize = filesize;
{
$(id).prepend("<div>");
var textappend= '<div id="progressTitle">'+filetitle+'</div>'+
'<div class="progress-inside">'+
'<div class="progress-fill"></div>'+
'</div>'+
'<div class="text">'+
'<label class="size-file">0/'+filesize+'MB</label>'+
'<label class="progress-text">0%</label>'+
'</div> </div>'; //the last div belong to prepend
$(id).append(textappend);
}
this.progress = function(advance) {
var advance = advance || 0;
// if advance is equal to size of file not adnance
if(advance >= filesize ) {
return 0;
}
//create animate states
if(advance>0) {
var preprogress = (advance / filesize) * 100;
} else {
var preprogress = 0;
}
var progress = Math.round(preprogress);
$(id).find('.progress-fill').animate( {
width: progress+'%'
},
{
duration: 888,
step: function(progress) {
$(id).find('.progress-text').text(Math.round(progress)+'%');
var myProgress = Math.round(progress*100)/100;
$(id).find('.size-file').text( Math.round((advance-preprogress)+myProgress) +'MB/'+filesize+'MB' );
}
}
);
};
};
//create a list of progressbars
var bars = [];
this.add = function(id, filetitle, filesize) {
bars[id] = new progresBar(id, filetitle, filesize);
};
//Parameters to advanse progressbar by id
this.value = function (id, advance) {
id = id.substring(1,id.length);
bars[id].progress(advance);
}
}
jQuery.fn.extend({
frameworkProgressBar: function() {
$(this).each(function(index, element) {
var id = $(element).attr('id');
var title = "";
if($(element).attr('title')) {
title = $(element).attr('title');
}
var size = $(element).attr('value');
frameworkObject.pogressBar.add(id, title, size);
})
}
});