Groov View dimensions?

groov View
1

Is there any reference to the dotted line or dashed line in groov view for what dimensions or aspect the groov view is configured? I noticed the dotted or dashed line in desktop/tablet vs handled is different but could not find anything that states what this size is. Does anyone know?

2

This thread is the gold standard thread for questions like yours.

Take a look all the way through that for starters.

But bottom line, the dashed lines do not (as far as I know) hold any hard and fast values.
groov View will flip between desktop and handheld based on the view-port size the device reports to the groov web server.

3

Slight correction: the server doesn’t know or care, which layout gets shown is determined entirely in the browser.

1 Like
4

Not an answer to your exact question but I use the browser’s responsive design mode to check this. In Firefox, it is simply <ctrl><shift>M. In Chrome, you have to first open the developer tools (<ctrl><shift>I) and then <ctrl><shift>M.

Then you can select different screen resolutions. If you truly want to know the pixel height, place some gadget near the dotted line and then view it at different resolutions.

5

Clearly, I did not word that right… Both views are not sent to the device right?
So at some point, something has to decide which version to send to the browser?

6

Both views get sent to the browser, and the code running in the browser picks which one to render. Inside a page’s definition, each gadget has its own positioning and layout properties, which look vaguely like this:

{
  "desktopLayout": {
    "x": 2,
    "y": 6,
    "z": 0,
    "width": 21,
    "height": 21,
    "locked": false
  },
  "handheldLayout": {
    "x": 0,
    "y": 5,
    "z": 0,
    "width": 15,
    "height": 15,
    "locked": false
  },
  // Other properties below
}

It’ll pick the appropriate layout when it renders, and if you resize the page and go above/below the mobile breakpoint, it’ll switch on demand without reloading anything from the server.

Waaaaaaaay too many details disguised as a ClojureScript tutorial here: Rendering groov with ClojureScript | Jonathan Fischer

1 Like