You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Lucio Crusca <lu...@sulweb.org> on 2014/06/24 21:32:54 UTC
ModalWindow positioning
Hi *,
In a long page I need a ModalWindow to position itself at the center of the
browser window even when the page is scrolled way down, so that the
ModalWindow always pops up in front of the user.
I've found this [1], but it dates back to 2009, and it refers to an old
versions of Wicket (1.3.x). I've tried nevertheless (I'm using 1.6.15), but
the JS code seems to be just ignored and nothing happens, e.g. the ModalWindow
still shows in the usual position near the top of the page, so the user has to
scroll back up to understand why the page stopped processing his input.
Can you please provide up to date hints?
[1] http://apache-wicket.1842946.n4.nabble.com/Modal-window-position-always-centred-even-on-long-page-td1889257.html
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: ModalWindow positioning
Posted by Lucio Crusca <lu...@sulweb.org>.
In data mercoledì 25 giugno 2014 18:05:54, Lucio Crusca ha scritto:
> Just in case others need it, my current working code is:
>
> Wicket.Window.prototype.center = function() {
> var myWindow = this.window;
> if (!myWindow)
> myWindow = Wicket.Window.current;
> if (!myWindow)
> myWindow = Wicket.Window.get();
> if (myWindow) {
> $(myWindow).css("position", "fixed");
> $(myWindow).css("top", Math.max(0, ((window.innerHeight -
> $(myWindow).outerHeight) / 2)) + "px");
> $(myWindow).css("left", Math.max(0, ((window.innerWidth -
> $(myWindow).outerWidth) / 2)) + "px");
> }
> };
No, this code works only in my development environment (localhost:8084). Once
deployed to the real domain, the screen dims but the ModalWindow does not show
up, even using the same browser I use in development tests (I guess it
actually shows up but it falls outside the browser window, but I'm not sure).
There's no noticeable difference between development and production
environments, except the Tomcat and Apache versions, but I fail to see how
those could interfere with javascript. The only strange thing is that the JS
console is showing an error in both cases, but in development it seems
harmless:
Error: Permission denied to access property 'toString'
and this error has no reference to any particular line of code in any
particular js file, so I don't even know if it is my mistake and where.
Any clues about why my code could behave differently in the same browser
between development and deployment environments?
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: ModalWindow positioning
Posted by Lucio Crusca <lu...@sulweb.org>.
I always forget I should not change the subject, sorry... I send the message
again with the unchanged subject so that it remains attached to the rest of
this thread.
In data mercoledì 25 giugno 2014 14:54:23, Martin Grigorov ha scritto:
> also try: this.window
Ok thanks, "this.window" seems to be the correct one in my case, but I suspect
other variants are needed to be as much cross browser as possible.
Just in case others need it, my current working code is:
Wicket.Window.prototype.center = function() {
var myWindow = this.window;
if (!myWindow)
myWindow = Wicket.Window.current;
if (!myWindow)
myWindow = Wicket.Window.get();
if (myWindow) {
$(myWindow).css("position", "fixed");
$(myWindow).css("top", Math.max(0, ((window.innerHeight -
$(myWindow).outerHeight) / 2)) + "px");
$(myWindow).css("left", Math.max(0, ((window.innerWidth -
$(myWindow).outerWidth) / 2)) + "px");
}
};
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: ModalWindow positioning [SOLVED]
Posted by Lucio Crusca <lu...@sulweb.org>.
In data mercoledì 25 giugno 2014 14:54:23, Martin Grigorov ha scritto:
> also try: this.window
Ok thanks, "this.window" seems to be the correct one in my case, but I suspect
other variants are needed to be as much cross browser as possible.
Just in case others need it, my current working code is:
Wicket.Window.prototype.center = function() {
var myWindow = this.window;
if (!myWindow)
myWindow = Wicket.Window.current;
if (!myWindow)
myWindow = Wicket.Window.get();
if (myWindow) {
$(myWindow).css("position", "fixed");
$(myWindow).css("top", Math.max(0, ((window.innerHeight -
$(myWindow).outerHeight) / 2)) + "px");
$(myWindow).css("left", Math.max(0, ((window.innerWidth -
$(myWindow).outerWidth) / 2)) + "px");
}
};
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: ModalWindow positioning
Posted by Martin Grigorov <mg...@apache.org>.
also try: this.window
Martin Grigorov
Wicket Training and Consulting
On Wed, Jun 25, 2014 at 2:53 PM, Martin Grigorov <mg...@apache.org>
wrote:
> try with Wicket.Window.current
>
> Martin Grigorov
> Wicket Training and Consulting
>
>
> On Wed, Jun 25, 2014 at 2:51 PM, Lucio Crusca <lu...@sulweb.org> wrote:
>
>> In data mercoledì 25 giugno 2014 11:09:42, Martin Grigorov ha scritto:
>> > Make sure that your code appears *after* the <script
>> src=".../modal.js">.
>> > With the browser Dev Tools you can put a breakpoint inside your function
>> > and see whether it is called/used.
>>
>> I couldn't manage to set a breakpoint with Firebug, so I added two
>> window.alert(). The first, before the "if", gets hit, not the second, so
>> now I
>> wonder what's the code that is centering the window, since my code is
>> executed
>> but it does absolutely nothing...
>>
>> And, I obviously don't know what to write instead of Wicket.Window.get()
>> in
>> order to make the "if" condition true.
>>
>> Wicket.Window.prototype.center = function() {
>> window.alert("!!");
>> var myWindow = Wicket.Window.get();
>> if (myWindow) {
>> window.alert("!!!!");
>> myWindow.css("position", "fixed");
>> myWindow.css("top", Math.max(0, (($(window).height() -
>> $(myWindow).outerHeight()) / 2)) + "px");
>> myWindow.css("left", Math.max(0, (($(window).width() -
>> $(myWindow).outerWidth()) / 2)) + "px");
>> }
>> };
>>
>>
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
>> For additional commands, e-mail: users-help@wicket.apache.org
>>
>>
>
Re: ModalWindow positioning
Posted by Martin Grigorov <mg...@apache.org>.
try with Wicket.Window.current
Martin Grigorov
Wicket Training and Consulting
On Wed, Jun 25, 2014 at 2:51 PM, Lucio Crusca <lu...@sulweb.org> wrote:
> In data mercoledì 25 giugno 2014 11:09:42, Martin Grigorov ha scritto:
> > Make sure that your code appears *after* the <script src=".../modal.js">.
> > With the browser Dev Tools you can put a breakpoint inside your function
> > and see whether it is called/used.
>
> I couldn't manage to set a breakpoint with Firebug, so I added two
> window.alert(). The first, before the "if", gets hit, not the second, so
> now I
> wonder what's the code that is centering the window, since my code is
> executed
> but it does absolutely nothing...
>
> And, I obviously don't know what to write instead of Wicket.Window.get() in
> order to make the "if" condition true.
>
> Wicket.Window.prototype.center = function() {
> window.alert("!!");
> var myWindow = Wicket.Window.get();
> if (myWindow) {
> window.alert("!!!!");
> myWindow.css("position", "fixed");
> myWindow.css("top", Math.max(0, (($(window).height() -
> $(myWindow).outerHeight()) / 2)) + "px");
> myWindow.css("left", Math.max(0, (($(window).width() -
> $(myWindow).outerWidth()) / 2)) + "px");
> }
> };
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: ModalWindow positioning
Posted by Lucio Crusca <lu...@sulweb.org>.
In data mercoledì 25 giugno 2014 11:09:42, Martin Grigorov ha scritto:
> Make sure that your code appears *after* the <script src=".../modal.js">.
> With the browser Dev Tools you can put a breakpoint inside your function
> and see whether it is called/used.
I couldn't manage to set a breakpoint with Firebug, so I added two
window.alert(). The first, before the "if", gets hit, not the second, so now I
wonder what's the code that is centering the window, since my code is executed
but it does absolutely nothing...
And, I obviously don't know what to write instead of Wicket.Window.get() in
order to make the "if" condition true.
Wicket.Window.prototype.center = function() {
window.alert("!!");
var myWindow = Wicket.Window.get();
if (myWindow) {
window.alert("!!!!");
myWindow.css("position", "fixed");
myWindow.css("top", Math.max(0, (($(window).height() -
$(myWindow).outerHeight()) / 2)) + "px");
myWindow.css("left", Math.max(0, (($(window).width() -
$(myWindow).outerWidth()) / 2)) + "px");
}
};
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: ModalWindow positioning
Posted by Martin Grigorov <mg...@apache.org>.
Make sure that your code appears *after* the <script src=".../modal.js">.
With the browser Dev Tools you can put a breakpoint inside your function
and see whether it is called/used.
Martin Grigorov
Wicket Training and Consulting
On Wed, Jun 25, 2014 at 10:53 AM, Lucio Crusca <lu...@sulweb.org> wrote:
> In data mercoledì 25 giugno 2014 09:49:51, Martin Grigorov ha scritto:
> > Hi,
> >
> > What exactly you tried and it didn't work ?
>
> I added the code below, but please note that I'm no JS wizard, so it's
> likely
> my code wouldn't work anyway, but the point is I don't even get JS errors
> and
> the ModalWindow behaves just like my code wasn't there, so either my code
> is
> being actually skipped or it is the exact equivalent of what the default
> wicket code does (unlikely):
>
> Wicket.Window.prototype.center = function() {
> var myWindow = Wicket.Window.get();
> if (myWindow) {
> myWindow.css("position", "fixed");
> myWindow.css("top", Math.max(0, (($(window).height() -
> $(myWindow).outerHeight()) / 2)) + "px");
> myWindow.css("left", Math.max(0, (($(window).width() -
> $(myWindow).outerWidth()) / 2)) + "px");
> }
> };
>
> I add this code in by including a js file in renderHead of my page and I
> confirm
> the code is there when I look at page source in the browser.
>
>
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>
Re: ModalWindow positioning
Posted by Lucio Crusca <lu...@sulweb.org>.
In data mercoledì 25 giugno 2014 09:49:51, Martin Grigorov ha scritto:
> Hi,
>
> What exactly you tried and it didn't work ?
I added the code below, but please note that I'm no JS wizard, so it's likely
my code wouldn't work anyway, but the point is I don't even get JS errors and
the ModalWindow behaves just like my code wasn't there, so either my code is
being actually skipped or it is the exact equivalent of what the default
wicket code does (unlikely):
Wicket.Window.prototype.center = function() {
var myWindow = Wicket.Window.get();
if (myWindow) {
myWindow.css("position", "fixed");
myWindow.css("top", Math.max(0, (($(window).height() -
$(myWindow).outerHeight()) / 2)) + "px");
myWindow.css("left", Math.max(0, (($(window).width() -
$(myWindow).outerWidth()) / 2)) + "px");
}
};
I add this code in by including a js file in renderHead of my page and I confirm
the code is there when I look at page source in the browser.
---------------------------------------------------------------------
To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
For additional commands, e-mail: users-help@wicket.apache.org
Re: ModalWindow positioning
Posted by Martin Grigorov <mg...@apache.org>.
Hi,
What exactly you tried and it didn't work ?
Martin Grigorov
Wicket Training and Consulting
On Tue, Jun 24, 2014 at 10:32 PM, Lucio Crusca <lu...@sulweb.org> wrote:
> Hi *,
>
> In a long page I need a ModalWindow to position itself at the center of the
> browser window even when the page is scrolled way down, so that the
> ModalWindow always pops up in front of the user.
>
> I've found this [1], but it dates back to 2009, and it refers to an old
> versions of Wicket (1.3.x). I've tried nevertheless (I'm using 1.6.15), but
> the JS code seems to be just ignored and nothing happens, e.g. the
> ModalWindow
> still shows in the usual position near the top of the page, so the user
> has to
> scroll back up to understand why the page stopped processing his input.
>
> Can you please provide up to date hints?
>
> [1]
> http://apache-wicket.1842946.n4.nabble.com/Modal-window-position-always-centred-even-on-long-page-td1889257.html
>
> ---------------------------------------------------------------------
> To unsubscribe, e-mail: users-unsubscribe@wicket.apache.org
> For additional commands, e-mail: users-help@wicket.apache.org
>
>