Web Browser Width?

Targets Web
1

I have a WebPage that presents a WebDialog where I’m trying to use the MouseDown event. The problem is the X and Y parameters sent to Mouse down seem to use absolute coordinates instead of relative coordinates to the WebDialog. The WebDialog is automatically centered in the Browser window so the X and Y coordinates are meaningless unless you can determine the browser width.

WebPage has a Width and Height property, but the browser window can be smaller than the WebPage it displays.

Does anyone know how to determine the actual browser width and height?

Alternatively, does anyone know how to get the local X and Y coordinates clicked within a WebDialog from the X, Y fields of the MouseDown event?

2

Your Web Dialog will be centered on the rendered size of the WebPage by default. At runtime WebPage.Width & WebPage.Height are the greater of the rendered size or the WebPage.MinWidth & WebPage.MinHeight. This makes it hard to determine the actual position of your WebDialog, however you can set the location by specifying the Left & Top positions before showing the dialog. I use this when a dialog is used in conjunction with a specific control.

HTH

3

I’ll try that.

It seems like a bug. In a desktop app, if you put this line in the MouseDown event of a dialog:

MsgBox(“X=”+Str(X)+", Y="+Str(Y))

When the user clicks at the top left corner of the dialog, they see X=1,Y=1

In a Web app, the user sees X=???,Y=??? where ??? is an arbitrary numbered based on the dialog location. The MouseDown event should provide local coordinates just like a desktop app.

4

Web Apps are not Desktop Apps, the UX is different.

5

This is one case where you need to use JavaScript to get the width and height of the window.

dim js as string js = js + "var w = window.innerWidth; var h = window.innerHeight; " js = js + "location.hash = w + 'x' + h;" self.ExecuteJavaScript(js)

This will show the width and height of the window in the HashTag, such as :

http://127.0.0.1:8080/#1281x832

You get this value in the Session.HastagChanged event as 1281x832. Do something like:

Dim size() as string = Hashtag.split("x") WinWidth = val(size(0)) WinHeight = val(size(1))

WinWidth and WinHeight as Integer properties of the WebPage.

There is a more elegant way to get values from JavaScript in the WebSDK (Xojo.triggerServerEvent), but it is more involved, and above the topic of this discussion. The WebSDK documentation is in the Extras folder, next to the Xojo executable.