johanneskreuzer / jquery-loadmask Goto Github PK

What steps will reproduce the problem?
1. Have a page with a large scroll

Please update so the div shows in the view port not the auto height of the div 
when applying a load to the body.  i.e. $("body").mask()

Currently, this plugin cannot be chained.
Please add "return this;" statements to the tails of $.fn.mask and $.fn.unmask 
to make it chainable.
Same for the jQueryUI themeroller-compatible version, which is the one I plan 
to use.

I couldn't find discussions so I am posted some revised code that may be
useful.

I made the html rendered by loadmask to correspond with jquery-ui's overlay.
Example found here. http://jqueryui.com/themeroller/ 

I also improved centering to use outerwidth rather than manually adding
paddings. This gives a more accurate reading in cross browser scenarios.

I also added the ability to have the label parameter passed to mask(label)
to either be a string or a jquery object (for custom formats).

What steps will reproduce the problem?
1. jQuery UI 1.8.11
2. Internet Explorer
3. FullCalendar (http://arshaw.com/fullcalendar/)

What is the expected output? What do you see instead?
Masks instead, in Internet Explorer I do not see the mask or message (I believe 
it is being generated correctly but is being overlapped by some element of the 
jQuery UI CSS)

What version of the product are you using? On what operating system?
0.4

Please provide any additional information below.
I have tried to use the jquery-loadmask for jQuery UI listed on Project Home, 
but function 'unmask()' does not fire correctly, and the mask message is still 
behind some elements

What steps will reproduce the problem?
1. ("body").mask()
2. The loader is not seen if I am on top or bottom of the web page
3.

What is the expected output? What do you see instead?
It should be relative to the window not the webpage. It always displays in
the middle of the webpage. But when I am at the bottom of the webpage,
loader is not visible.

What version of the product are you using? On what operating system?
Latest, Win and Ubuntu

Please provide any additional information below.

Maybe you can pay attention to this:

     var isIE = ua.indexOf("msie") > -1;
     var isIE7 = ua.indexOf("msie 7");  // this is the problem..

What steps will reproduce the problem?
1. In business function abc(){
$("#content").mask("Waiting...");
//here do sth
//here do others
}//here business function end
2. debug codes .mask bellow
3. mask not show

What is the expected output? What do you see instead?
I want see the mask,but nothing instead.In fact, <div class="loadmask"></div> 
already existed after execute .mask.

What version of the product are you using? On what operating system?
may

Please provide any additional information below.

Current jquery-loadkmask doesn't support scrollLeft and scrollTop.

I have fixed it. Please see the attached file.

What steps will reproduce the problem?
1.IE6 and a combobox 

What is the expected output? What do you see instead?
masking of all elements on page

What version of the product are you using? On what operating system?
IE6

Please provide any additional information below.
Possible solution (have not tried, just thinking out loud):
adding a "marker" class to all comboboxes requiring a visibility: hidden style
during masking and then unmarking (remove marking class) and make combobox
visible during unmask.

What steps will reproduce the problem?
1. Mask an element
2. Mask an inner element
3. Unmask the outer element

What is the expected output? What do you see instead?

When outer element is unmasked, the inner mask persists

What version of the product are you using? On what operating system?

0.4 Linux

Please provide any additional information below.

When unmasking, jquery.find() is used to find the mask elements.  Use 
jquery.children() instead:

Patch:

102c102
<     element.find(".loadmask-msg,.loadmask").remove();

---
>     element.children(".loadmask-msg,.loadmask").remove();

Version 0.4

This code:

maskMsgDiv.css("top", Math.round(element.height() / 2 - (maskMsgDiv.height() - 
parseInt(maskMsgDiv.css("padding-top")) - 
parseInt(maskMsgDiv.css("padding-bottom"))) / 2)+"px");

maskMsgDiv.css("left", Math.round(element.width() / 2 - (maskMsgDiv.width() - 
parseInt(maskMsgDiv.css("padding-left")) - 
parseInt(maskMsgDiv.css("padding-right"))) / 2)+"px");

in result in sets top and left properties to NaN (detected with alert()). Any 
fixes?

My requirement was to be able to apply load mask to the entire page when 
submitting a form, and show the loading message at a height where the user can 
actually see it if the page is too long.

It works like this: $("#wrap").mask("Loading..",0,240);

The third parameter specifies how many pixels from top to place the loading 
message.

Hope someone finds it useful and will be somehow integrated in a newer version.

Nice plugin, thanks!

What steps will reproduce the problem?
1. Just use a standard jquery mask call in Chrome or IE 8
2. The mask doesn't show


What is the expected output? What do you see instead?
I expect the mask to appear, then dissapear, and then the result

What version of the product are you using? On what operating system?
latest, windows 7

Please provide any additional information below.

This inst necessarily a problem but I was wanting to be able to have this 
display load then unmask after the images / page load.  Made a minor adjustment 
to the code.  Rather have it delay the unload process than the loading of the 
"loading" mask.  Great JQuery plugin though, Kudos


$.maskElement($(this), label);
element.data("_mask_timeout", setTimeout(function() { 
$.unmaskElement(element)}, delay));



M97

What steps will reproduce the problem?

html:
<div id="updateBox">
<form action="#" id="exampleForm">
<input type="submit" />
</form>
</div>

JQuery (with the problem)
<script type="text/javascript">
$("#exampleForm").submit(function(){
$("#exampleForm").mask("Doing something..");
alert("you should see this too");
return false;
});
</script>

the problem here is, it doesnt even shows the alert, it just sends the form 
even though there is a return false, doing this without the mask plugin will 
result in a succes.
masking the Parent DIV doesnt works either.


What is the expected output? What do you see instead?
in the example above, an alert and not sending the form, instead it doesnt 
shows the alert and sends the form.

What steps will reproduce the problem?
1. open console and write this code $(document.body).mask("loading...");
2. The image and label doesn't come in the center of the page, even people can 
not able to see.

What is the expected output? What do you see instead?
The image and label should come in center of the page.

What version of the product are you using? On what operating system?
Window XP, IE 8, Mozila 23.

There is a link in the css file to ../images/loading.gif.  This forces a 
specific setup or requires changing the file.  It'd be much more flexible to 
just change the background to:

background: #fbfbfb 
url(data:image/gif;base64,R0lGODlhEAAQALMMAKqooJGOhp2bk7e1rZ2bkre1rJCPhqqon8PBud
DOxXd1bISCef///wAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh+QQFAAAMACwAAAAAEAAQAAAET5
DJyYyhmAZ7sxQEs1nMsmACGJKmSaVEOLXnK1PuBADepCiMg/DQ+/2GRI8RKOxJfpTCIJNIYArS6aRajW
YZCASDa41Ow+Fx2YMWOyfpTAQAIfkEBQAADAAsAAAAABAAEAAABE6QyckEoZgKe7MEQMUxhoEd6FFdQW
lOqTq15SlT9VQM3rQsjMKO5/n9hANixgjc9SQ/CgKRUSgw0ynFapVmGYkEg3v1gsPibg8tfk7CnggAIf
kEBQAADAAsAAAAABAAEAAABE2QycnOoZjaA/IsRWV1goCBoMiUJTW8A0XMBPZmM4Ug3hQEjN2uZygahD
yP0RBMEpmTRCKzWGCkUkq1SsFOFQrG1tr9gsPc3jnco4A9EQAh+QQFAAAMACwAAAAAEAAQAAAETpDJyU
qhmFqbJ0LMIA7McWDfF5LmAVApOLUvLFMmlSTdJAiM3a73+wl5HYKSEET2lBSFIhMIYKRSimFriGIZiw
WD2/WCw+Jt7xxeU9qZCAAh+QQFAAAMACwAAAAAEAAQAAAETZDJyRCimFqbZ0rVxgwF9n3hSJbeSQ2rCW
IkpSjddBzMfee7nQ/XCfJ+OQYAQFksMgQBxumkEKLSCfVpMDCugqyW2w18xZmuwZycdDsRACH5BAUAAA
wALAAAAAAQABAAAARNkMnJUqKYWpunUtXGIAj2feFIlt5JrWybkdSydNNQMLaND7pC79YBFnY+HENHMR
gyhwPGaQhQotGm00oQMLBSLYPQ9QIASrLAq5x0OxEAIfkEBQAADAAsAAAAABAAEAAABE2QycmUopham+
da1cYkCfZ94UiW3kmtbJuRlGF0E4Iwto3rut6tA9wFAjiJjkIgZAYDTLNJgUIpgqyAcTgwCuACJssAdL
3gpLmbpLAzEQA7) no-repeat 5px 5px;

What steps will reproduce the problem?
1. using this along with mask plugin 
http://digitalbush.com/projects/masked-input-plugin/

What is the expected output? What do you see instead?
The loadmask plugin doesnt work due to function name collision

I suggest renaming the functions so this will  not occur:
mask -> loadmask
unmask -> unloadmask

What steps will reproduce the problem?
1. mask element A with a delay of 5000 (to be observable)
2. mask again element A with a delay of 5000
3. unmask element A

What is the expected output? What do you see instead?
I expect the element A never to be masked, or to be unmasked is mask appeared 
(because of delay)
What I see is that enven if unmask is called, the mask will appear seconds 
later...

What version of the product are you using? On what operating system?
Don't know: no revision number is written in the file :/