You are viewing a plain text version of this content. The canonical link for it is here.
Posted to users@wicket.apache.org by Marieke Vandamme <ma...@tvh.com> on 2014/10/14 10:32:09 UTC

ModalWindow - full screen

Hi,

I know you can set initial width and height for a modalwindow,
but we now get the requirement to open it full screen.
Is this something built in already, or has somebody done this before?

Thanks ! Kind Regards, Marieke Vandamme

-- 


**** DISCLAIMER ****

http://www.tvh.com/glob/en/email-disclaimer

"This message is delivered to all addressees subject to the conditions
set forth in the attached disclaimer, which is an integral part of this
message."

Re: ModalWindow - full screen

Posted by Martin Grigorov <mg...@apache.org>.
Hi,

I see two ways to do it then:
1) ModalWindow#setMarkupId("myFullscreenId"); $("#myFullscreenId")
2) $(".OWN_CLASS_NAME").closest("div)

both gives you a reference to the div.modal-window.
>From there on you can manipulate it to make it fullscreen.





Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Tue, Oct 21, 2014 at 12:18 PM, Marieke Vandamme <marieke.vandamme@tvh.com
> wrote:

> Hi,
>
> We've tried your proposal, but it doesn't work, because the setCssClassName
> doesn't apply to the div that needs to be resized.
> In code underneath you can see the structure. The class should be place on
> the div that now has wicket-modal, but this is not possible, or is it?
> - cannot depend on element higher in the html, because the only element
> would be the body, and this modalwindow is used onto multiple pages
> - cannot use "wicket-modal" class, because it the full screen may not
> reflect on all modal windows
>
> <div class="wicket-modal" id="_wicket_window_0" role="dialog" style="top:
> 54px; left: 76px; width: 1000px; position: absolute; visibility: visible;">
> <form
>
> style="background-color:transparent;padding:0px;margin:0px;border-width:0px;position:static"<div
> id="_wicket_window_1" class="OWN_CLASS_NAME">
>
> Thanks ! Kind Regards, Marieke
>
>
> Met vriendelijke groeten,
>
>
> *MARIEKE VANDAMMECORPORATE SERVICES* • *Domain Coordinator*
> T +32 56 43 42 45 • F +32 56 43 44 46 • marieke.vandamme@tvh.com
>
> *TVH GROUP NV*
> Brabantstraat 15 • BE-8790 WAREGEM
> T +32 56 43 42 11 • F +32 56 43 44 88 • www.tvh.com
> Watch our company movies on www.tvh.tv
>
> 2014-10-14 11:10 GMT+02:00 Martin Grigorov <mg...@apache.org>:
>
> > Hi,
> >
> > With #setCssClassName() (
> >
> >
> https://github.com/apache/wicket/blob/master/wicket-extensions/src/main/java/org/apache/wicket/extensions/ajax/markup/html/modal/ModalWindow.java#L513
> > )
> > you can set your custom CSS class that should be applied on the main
> modal
> > window <div> element.
> > In your own .css file you can define CSS rules to show any element having
> > this custom CSS class as fullscreen.
> > I am not CSS master but I guess you have to play with "position", "top",
> > "left". "width" and "height" properties.
> >
> > Martin Grigorov
> > Wicket Training and Consulting
> > https://twitter.com/mtgrigorov
> >
> > On Tue, Oct 14, 2014 at 11:32 AM, Marieke Vandamme <
> > marieke.vandamme@tvh.com
> > > wrote:
> >
> > > Hi,
> > >
> > > I know you can set initial width and height for a modalwindow,
> > > but we now get the requirement to open it full screen.
> > > Is this something built in already, or has somebody done this before?
> > >
> > > Thanks ! Kind Regards, Marieke Vandamme
> > >
> > > --
> > >
> > >
> > > **** DISCLAIMER ****
> > >
> > > http://www.tvh.com/glob/en/email-disclaimer
> > >
> > > "This message is delivered to all addressees subject to the conditions
> > > set forth in the attached disclaimer, which is an integral part of this
> > > message."
> > >
> >
>
> --
>
>
> **** DISCLAIMER ****
>
> http://www.tvh.com/glob/en/email-disclaimer
>
> "This message is delivered to all addressees subject to the conditions
> set forth in the attached disclaimer, which is an integral part of this
> message."
>

Re: ModalWindow - full screen

Posted by Marieke Vandamme <ma...@tvh.com>.
Hi,

We've tried your proposal, but it doesn't work, because the setCssClassName
doesn't apply to the div that needs to be resized.
In code underneath you can see the structure. The class should be place on
the div that now has wicket-modal, but this is not possible, or is it?
- cannot depend on element higher in the html, because the only element
would be the body, and this modalwindow is used onto multiple pages
- cannot use "wicket-modal" class, because it the full screen may not
reflect on all modal windows

<div class="wicket-modal" id="_wicket_window_0" role="dialog" style="top:
54px; left: 76px; width: 1000px; position: absolute; visibility: visible;">
<form
style="background-color:transparent;padding:0px;margin:0px;border-width:0px;position:static"<div
id="_wicket_window_1" class="OWN_CLASS_NAME">

Thanks ! Kind Regards, Marieke


Met vriendelijke groeten,


*MARIEKE VANDAMMECORPORATE SERVICES* • *Domain Coordinator*
T +32 56 43 42 45 • F +32 56 43 44 46 • marieke.vandamme@tvh.com

*TVH GROUP NV*
Brabantstraat 15 • BE-8790 WAREGEM
T +32 56 43 42 11 • F +32 56 43 44 88 • www.tvh.com
Watch our company movies on www.tvh.tv

2014-10-14 11:10 GMT+02:00 Martin Grigorov <mg...@apache.org>:

> Hi,
>
> With #setCssClassName() (
>
> https://github.com/apache/wicket/blob/master/wicket-extensions/src/main/java/org/apache/wicket/extensions/ajax/markup/html/modal/ModalWindow.java#L513
> )
> you can set your custom CSS class that should be applied on the main modal
> window <div> element.
> In your own .css file you can define CSS rules to show any element having
> this custom CSS class as fullscreen.
> I am not CSS master but I guess you have to play with "position", "top",
> "left". "width" and "height" properties.
>
> Martin Grigorov
> Wicket Training and Consulting
> https://twitter.com/mtgrigorov
>
> On Tue, Oct 14, 2014 at 11:32 AM, Marieke Vandamme <
> marieke.vandamme@tvh.com
> > wrote:
>
> > Hi,
> >
> > I know you can set initial width and height for a modalwindow,
> > but we now get the requirement to open it full screen.
> > Is this something built in already, or has somebody done this before?
> >
> > Thanks ! Kind Regards, Marieke Vandamme
> >
> > --
> >
> >
> > **** DISCLAIMER ****
> >
> > http://www.tvh.com/glob/en/email-disclaimer
> >
> > "This message is delivered to all addressees subject to the conditions
> > set forth in the attached disclaimer, which is an integral part of this
> > message."
> >
>

-- 


**** DISCLAIMER ****

http://www.tvh.com/glob/en/email-disclaimer

"This message is delivered to all addressees subject to the conditions
set forth in the attached disclaimer, which is an integral part of this
message."

Re: ModalWindow - full screen

Posted by Martin Grigorov <mg...@apache.org>.
Hi,

With #setCssClassName() (
https://github.com/apache/wicket/blob/master/wicket-extensions/src/main/java/org/apache/wicket/extensions/ajax/markup/html/modal/ModalWindow.java#L513)
you can set your custom CSS class that should be applied on the main modal
window <div> element.
In your own .css file you can define CSS rules to show any element having
this custom CSS class as fullscreen.
I am not CSS master but I guess you have to play with "position", "top",
"left". "width" and "height" properties.

Martin Grigorov
Wicket Training and Consulting
https://twitter.com/mtgrigorov

On Tue, Oct 14, 2014 at 11:32 AM, Marieke Vandamme <marieke.vandamme@tvh.com
> wrote:

> Hi,
>
> I know you can set initial width and height for a modalwindow,
> but we now get the requirement to open it full screen.
> Is this something built in already, or has somebody done this before?
>
> Thanks ! Kind Regards, Marieke Vandamme
>
> --
>
>
> **** DISCLAIMER ****
>
> http://www.tvh.com/glob/en/email-disclaimer
>
> "This message is delivered to all addressees subject to the conditions
> set forth in the attached disclaimer, which is an integral part of this
> message."
>