Posted 29 октября, 20186 yr comment_152456 Добра, делаю расширение для браузера с форумом ipb. Поставил кнопку с прогресбаром, но она по итогу никак не запускает нужную ссылку. Сам же браузер кричит, что ошибок в js дофига, хоть целиком удалять.. Что не так я делаю и как мне установить открытие ссылки по окончанию работы бара? <a id="actionButton" class="progress-button" data-loading="Working.." data-finished="Finished!" data-type="background-bar">PLAY GEN</a></div> $(document).ready(function(){ $('.progress-button').progressInitialize(); $('#submitButton').click(function(e){ e.preventDefault(); $(this).progressTimed(2); }); $('#actionButton').click(function(e){ e.preventDefault(); $(this).progressTimed(2); }); $('#generateButton').one('click', function(e){ e.preventDefault(); // It can take a callback var button = $(this); button.progressTimed(3, function(){ button.click(function(){ alert('Showing how a callback works!'); }); }); }); var controlButton = $('#controlButton'); controlButton.click(function(e){ e.preventDefault(); controlButton.progressStart(); }); $('.command.increment').click(function(){ controlButton.progressIncrement(); }); $('.command.set-to-1').click(function(){ controlButton.progressSet(1); }); $('.command.set-to-50').click(function(){ controlButton.progressSet(50); }); $('.command.finish').click(function(){ controlButton.progressFinish(); }); }); (function($){ $.fn.progressInitialize = function(){ return this.each(function(){ var button = $(this), progress = 0; var options = $.extend({ type:'background-horizontal', loading: 'Loading..', finished: 'Done!' }, button.data()); button.attr({'data-loading': options.loading, 'data-finished': options.finished}); var bar = $('<span class="tz-bar ' + options.type + '">').appendTo(button); button.on('progress', function(e, val, absolute, finish){ if(!button.hasClass('in-progress')){ bar.show(); progress = 0; button.removeClass('finished').addClass('in-progress') } if(absolute){ progress = val; } else{ progress += val; } if(progress >= 100){ progress = 100; } if(finish){ button.removeClass('in-progress').addClass('finished'); bar.delay(500).fadeOut(function(){ // Trigger the custom progress-finish event button.trigger('progress-finish'); setProgress(0); }); } setProgress(progress); }); function setProgress(percentage){ bar.filter('.background-horizontal,.background-bar').width(percentage+'%'); bar.filter('.background-vertical').height(percentage+'%'); } }); }; $.fn.progressStart = function(){ var button = this.first(), last_progress = new Date().getTime(); if(button.hasClass('in-progress')){ // Don't start it a second time! return this; } button.on('progress', function(){ last_progress = new Date().getTime(); }); var interval = window.setInterval(function(){ if( new Date().getTime() > 5000+last_progress){ button.progressIncrement(5); } }, 500); button.on('progress-finish',function(){ window.clearInterval(interval); }); return button.progressIncrement(10); }; $.fn.progressFinish = function(){ return this.first().progressSet(100); }; $.fn.progressIncrement = function(val){ val = val || 10; var button = this.first(); button.trigger('progress',[val]) return this; }; $.fn.progressSet = function(val){ val = val || 10; var finish = false; if(val >= 100){ finish = true; } return this.first().trigger('progress',[val, true, finish]); }; $.fn.progressTimed = function(seconds, cb){ var button = this.first(), bar = button.find('.tz-bar'); if(button.is('.in-progress')){ return this; } bar.css('transition', seconds+'s linear'); button.progressSet(99); window.setTimeout(function(){ bar.css('transition',''); button.progressFinish(); if($.isFunction(cb)){ cb(); } }, seconds*10000); }; })(jQuery);
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.