Selfietorium Screen Design - TitaniumBunker/Selfietorium GitHub Wiki

The UI for Selfietorium is based around presenting full screens, with optional web cam overlays.

injecting the PiCam into the screen design.

The template can contain named screen elements, which can be located through XPath querying. for example :

<rect
   style="opacity:0.722;fill:#008000;fill-opacity:1;stroke:#ffffff;stroke-width:1;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none"
   id="preview"
   width="525.71429"
   height="388.57144"
   x="337.14285"
   y="397.14285"
   transform="translate(0,-27.637817)"
   inkscape:label="#rect2985" />

Here a rectangle with the ID preview exists in the page. From the coordinates it can be seen that it is at position 337.14285x397.14285

these positions are from bottom left - therefore once these coordinates have been read from the SVG, it will need to be converted to a raster based position - which leaves the question of what to do about partial pixels

Best answer : Positional coords should be rounded down to the nearest pixel. Width height should be rounded up to the nearest pixel.

Ideally designers should avoid placing preview windows on partial pixel boundaries.

In addition the preview container should be transparent, to avoid interrupting the screen.

blitting order :

the Picam should be blitted to the screen first, with the screen overlayed onto it. this allows elements of the screen design to overlap and float on top of the preview.