How to get Width and Height of browser

Hi,

I need to get the height and width of browser’s client.
The following code gives infos about the name of the browser, but doesn’t give the dimensions.
Where i am wrong ?


public class Launcher extends Application {

	@Override
	public void init() {
		Window main = new Window("Hello window");
		setMainWindow(main);
		main.addComponent(new Label("Hello World!"));

		
		ApplicationContext context = this.getContext();
		if (context instanceof WebApplicationContext) {
		       String userAgent = ((WebApplicationContext)this.getContext()).getBrowser().getBrowserApplication();
		       System.out.println("appli context : "+userAgent);
		       int a = ((WebApplicationContext)this.getContext()).getBrowser().[color=#e80d40]
getScreenHeight();
[/color]
		       int b = ((WebApplicationContext)this.getContext()).getBrowser().[color=#e80d40]
getScreenWidth();
[/color]
		       boolean boo = ((WebApplicationContext)this.getContext()).getBrowser().isFirefox();
		       System.out.println("Height : "+a+", Width: "+b+", isfirefox : "+boo);
		}
	}
}

Result :
appli context :
Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.1; … .NET4.0E; BRI/2; InfoPath.3)


Height: 0, Width: 0
,
isfirefox : false

Hello,

Try it…

getMainWindow().getBrowserWindowHeight();
getMainWindow().getBrowserWindowWidth();

Hi Luis Fernando,

Thank you for your answer

public class Launcher extends Application {

    @Override
    public void init() {
        
        Window main = new Window("Hello window");
        setMainWindow(main);
        main.addComponent(new Label("Hello World!"));
        
        getMainWindow().getBrowserWindowHeight();
        getMainWindow().getBrowserWindowWidth();

=> gives only “-1”, so it is not the expected result :frowning:

Is it working fine for you ?
I see in the javadoc the
BrowserInfo
object, do you know how to use it ?

Eric

Hi

This worked for me to get the resolution:

WebBrowser browser = (WebBrowser) getMainWindow().getTerminal();
browser.getScreenWidth();
browser.getScreenHeight()

… and this to get the window size:

Window mainWindow = new Window("Demo");
mainWindow.getWidth();
mainWindow.getHeight();

Greets

Hi,

Works for me, because I use the dimensions after application init(). Do you need this information at init method? If YES, You need a workaround.

When the browser request the url (at first time you access), it sends to webserver header request. The webserver (vaadin server-side) processes the request and delivery the HTML content to browser. So, the vaadin client-side can get the dimensions (by javascript) and send to server-side via ajax. Finally, the server-side processes the ajax request and populate the getBrowserWindowHeight() and getBrowserWindowWidth().

The flow of the web application not delivery this information for server-side in the first request. If you really need it on the
first
second* request, try it:

  1. Implements HttpServletRequestListener on your application.

  2. On the method onRequestStart write it:

if (getContext() == null) return;
WebBrowser browser = ((com.vaadin.terminal.gwt.server.WebApplicationContext)getContext()).getBrowser();
int width = browser.getScreenWidth();
int height = browser.getScreenHeight();

The method onRequestEnd can stay empty.

  • Apparently first request.

Good luck!

Regards,

Murara

Thank for your help Vincent,

public class Launcher extends Application {

    @Override
    public void init() {
       
        Window main = new Window("Hello window");
        setMainWindow(main);
        main.addComponent(new Label("Hello World!"));

        main.getWidth();             [color=#ea1d6f]
=> gives -1, so doesn't work here
[/color]
        main.getHeight();            [color=#ea1d6f]
=> gives -1, so doesn't work here
[/color]

        WebBrowser browser = (WebBrowser) getMainWindow().getTerminal();
        browser.getScreenWidth();      [color=#ea1d6f]
=> NullPointerException because browser is NULL
[/color]
        browser.getScreenHeight();    [color=#ea1d6f]
 => NullPointerException because browser is NULL
[/color]
    Any other idea ?

Luis Fernando,

i tried to put your code outside of init() method, but it doesn’t work.
[color=#e41515]
Do you have a simple example with “Hello world” + your code ??

[/color]

i think that, if this code is located inside the init() method, the result is -1 because the Http’s header does not contain width and height of the browser window.
So this info has to be gathered by javascript on client side, and send back to Vaadin by Json or html.

Eric

Here is my sandbox…

package com.example.testheight;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.vaadin.Application;
import com.vaadin.terminal.gwt.server.HttpServletRequestListener;
import com.vaadin.terminal.gwt.server.WebBrowser;
import com.vaadin.ui.Button;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Label;
import com.vaadin.ui.Window;

public class TestheightApplication extends Application implements HttpServletRequestListener {

	@Override
	public void init() {
		Window mainWindow = new Window("Testheight Application");
		setMainWindow(mainWindow);
		mainWindow.addComponent(new Button("Get Size", new Button.ClickListener() {
			
			@Override
			public void buttonClick(ClickEvent event) {
				getMainWindow().showNotification("Width: "+getMainWindow().getBrowserWindowWidth()+"px - Height: "+getMainWindow().getBrowserWindowHeight()+"px");
			}
		}));
		
	}

	@Override
	public void onRequestStart(HttpServletRequest request,
			HttpServletResponse response) {
		if (getContext() == null) return;
		WebBrowser browser = ((com.vaadin.terminal.gwt.server.WebApplicationContext)getContext()).getBrowser();
		getMainWindow().addComponent(new Label("Width: "+browser.getScreenWidth()+"px - Height: "+browser.getScreenHeight()+"px"));
	}

	@Override
	public void onRequestEnd(HttpServletRequest request,
			HttpServletResponse response) {
		// TODO Auto-generated method stub
		
	}

}

The flow:
[font=Courier New]

  • Browser Request
    • Server side return html content without dimensions
      • Browser request via ajax with parameters (dimensions and other things)
        • Server side creates the Label and send back to browser
          • Browser render the label

[/font]

Look in the exemple, I used the vaadin way (button) and my suggestion for your case.

In fact,
WebBrowser.getScreenHeight()
gives the resolution of the client’s screen, not the height of the client’s browser !
Javadoc says : "
This is the height of the screen and not the height available for the application.
"
Thank you for your code Luis Fernando.

There is no method , inside the WebBrowser class, allowing to get the size of the remote browser.
My problem is still there … :frowning:

Eric

Here is the final solution. I find it in
this post
which says :
=>
The client area size is sent by the client to the server as URL parameters (cw and ch) in certain requests
(what requests ??)
where also the screen size is sent, but AbstractApplicationServlet.updateBrowserProperties() does not store it anywhere even though screen size does get stored in the WebBrowser object. As it is not used, I am not certain if it is tested and reliable on all browsers.

I succeeded in getting the size of the client’s browser by using the following code : :slight_smile:


UserProfile userProfile = new UserProfile();      [color=#0dad42]
 // Object for storing the size of the client's browser
[/color]
Button browserSize = new Button("", this, "displayBrowserSize");
public void displayBrowserSize(Button.ClickEvent event) {
		
		System.out.println("Width of the browser : "+getWindow().getWidth());
		System.out.println("Height of the browser : "+getWindow().getHeight());
		userProfile.setScreenWidth((int)getWindow().getWidth());   [color=#0dad42]
// I store this data for reusing it later
[/color]
		userProfile.setScreenHeight((int)getWindow().getHeight());
}

Eric

Nice, it’ll help to improve my application too!

I’ll test it.

Thanks!