Nice plugin :)

I like this plugin, because it able to add custom text in the progress bar.
Btww, does this plugin support on Yii2 Framework?

Thanks

hi

bower main is loading "src/boostrap-waitingfor.js" file while "boostrap-waitingfor.js" is inside build directory, so cannot use gulp main-bower-files for tasks

I noticed that if I run $("#someModal").modal right after waitingDialog.hide() "expands" the page, or more like it moves the page to the left and I could see a space on the right side of my navigation bar. My solution is:

/**
 * Closes dialog
 */
hide: function (callback) {
	$dialog.modal('hide');

	if(callback){
		$dialog.on('hidden.bs.modal', function(){
			callback();
		});
	}
}

now, you can show the next modal asynchronously AFTER hiding the waitingDialog.

waitingDialog.hide(function(){
	$("#someModal").modal();
});	

Hi, just a small typo In bower.json.

{
"main": "src/boostrap-waitingfor.js",
}

it should be

{
"main": "src/bootstrap-waitingfor.js",
}

In my grunt file, I have task (bowerInstall) that inject Bower components into the HTML file. It looks at where the bower dependencies are and copies all the paths into my index.html as script or style imports. ( That stuff is made by Yeoman, not me )

Anyway, when importing your package, it failed to do so because of the typo above.

Thanks

I want that waitingDialog.show() blocks only some part of my page, and not entire page. Like happens in http://bootsnipp.com/snippets/Oe5XM .
But I didn't found how do that.

bs - 4.0.0
bootstrap-waitingfor - 1.2.7

with wf - https://monosnap.com/file/GUoNePszp7AKhuazOINrwmhmWpG1jt
without wf - https://monosnap.com/file/3sEnc3ir9j7BycFAdHKqijEBVztJRw

Hello,

I'm having an issue with this plugin in Safari 10.0.2 on macOS

code works well on Firefox and Chrome but while testing in Safari the popup doesn't load on click, only loads after page redirects.

<a class="btn btn-lg btn-block btn-warning" onclick="{literal}waitingDialog.show();setTimeout(function () {waitingDialog.hide();}, 3000);{/literal}" href="{#domainnamesslportal#}

*using smarty v3 hence the literal / # code

If i click on the link and stop the page from loading then the popup launches.

Using JQuery 3.1.1

remove line 94 $dialog.find('.progress-bar').addClass('progress-bar-' + settings.progressType);
add $dialog.find('.progress-bar').addClass('bg-' + settings.progressType);

Hello,

Thanks for this script.

How we can add callback function to this?
when I run waitingDialog.hide();, I want to alert('1'); after it's gone hidden.

Right now if you do:
waitingDialog.hide();
alert('1');

You will get the alert while the modal is still there, I want to have the alert after the modal is completely hidden.

Thanks

Hi,
I've try bootstrap-waitingfor with boostrap 4 but I found if I try to invoke hide() method, dialog not closing.
Problem I is fade can not permit to close it immediately.

I able to correct this issue by modify hide() method with this code at line 143:

hide: function () {
            if (typeof $dialog !== 'undefined') {
                $dialog.on('shown.bs.modal', function(e) {
                    $dialog.modal('hide');
                });
            }
        }

It does not work in Safari.

Hey there,

For CDN control purposes, could we define versions numbers, and add a Changelog.md to the project. Can I help with that somehow?

First of all, thanks for this great tool. It's very easy to use and adds so much to websites.

Feature 1
I am about to add something to this library that will make it easy to have access to some basic documentation.

It's a help method that people can just call at the console using waitingDialog.help(). This will write in the console a least the structure of the options object that can be passed to the code.

Feature 2

An init function that can be called once after loading the library for setting default options. That way, there will be no need to pass the options every time we are calling the show() method unless we need to temporarily override the default.

What do you guys think? Is it something you could accept as a pull request?

Thanks

PR #21 probably fixes this (haven't checked though). Opening an issue to provide more detail as to what the issue is and how we could address it.

First of all, fantastic library. Really makes things much simpler when I want to show the user that a task is in progress, and the fact that I don't have to add any extra markup to the page makes it all that much easier to use.

There is an issue, however, when a web application uses a content security policy that doesn't specify unsafe-inline, which is considered bad practice and sacrifices a substantial amount of security. The generated element (below) contains 4 inline style attributes, which the client will refuse to apply:

<div class="modal fade" data-backdrop="static" data-keyboard="false" tabindex="-1" role="dialog" aria-hidden="true" style="padding-top:15%; overflow-y:visible;"> 
	<div class="modal-dialog modal-m"> 
		<div class="modal-content"> 
			<div class="modal-header" style="display: none;"></div> 
			<div class="modal-body"> 
				<div class="progress progress-striped active" style="margin-bottom:0;"> 
					<div class="progress-bar" style="width: 100%"></div> 
				</div> 
			</div> 
		</div> 
	</div> 
</div>

The result is a modal that works, but contains no visible progress bar (because its width is 0) and has layout issues to the padding-top and overflow-y CSS attributes not being applied.

There are a few approaches we can take to fix this issue:

• Move things to an external style sheet and make sure that style-src includes self - from PR #21 I am guessing this isn't a particularly appealing option.
• Place the burden on the CSP implementer to add specific exceptions for the SHA256 hashes of the inline styles included - Not particularly user-friendly and even the slightest change to the inline styles in this library will completely break it everywhere until users update their CSPs.
• Extend the script to allow a 'nonce' to be specified - Probably the best option. As long as your users securely (i.e. unpredictably) generate a unique nonce for each page request. This won't break anything if no nonce is specified and no CSP is in place.

I'll submit a PR with the proposed change shortly.

If in a situation the script calls show function with an already dialog visible, there is no way to hide it. Even with subsequent calls of hide();

Hello, first off, nice plugin!

I want to know if would be possible to add support for Bootstrap 4 to this cool plugin.

Thanks!

Hi,

As this plugin uses the modal component of Bootstrap, one would expect the default events to be usable (such as 'show.bs.modal'). However, when calling waitingDialog.show();, that event doesn't seem to be triggered as expected.

Am I missing something, or is this a bug?

Example: https://bootsnipp.com/snippets/PElzm (check the HTML. The second console.log() is never executed).