Add the welcome and error screen

[Hjdskes]

No description provided.

[Hjdskes]

Still need to test this with more than one device, but for that I'm going to need to get ratbagd.devel running with at least one test device.

Also the MousePerspective is going to need a back button in case there is more than one connected device, and the WelcomePerspective needs to look a bit better still.

[julianrichen]

Hello I have a Corsair Raptor M45 Gaming Mouse which isn't supported by ratbag and the screen seems to be working as intended :)

I would recommend making the ratbag icon symbolic and put the text under. Like so:

               +----------+
               |          |
               |   icon   |
               |          |
               +----------+
                 
             No devices found
Your device might not be plugged-in or support.

It would more closely follow GNOME's empty state & explain why it's not working.

See: https://github.com/gnome-design-team/gnome-mockups/tree/master/empty-app-states

[Hjdskes]

Hello I have a Corsair Raptor M45 Gaming Mouse which isn't supported by ratbag and the screen seems to be working as intended :)

That's good news, thanks for trying :)

I would recommend making the ratbag icon symbolic and put the text under. It would more closely follow GNOME's empty state & explain why it's not working.

Thanks, that's a good suggestion. For the symbolic icon, see #87.

[Hjdskes]

Only a single issue with the welcome screen remaining: the device SVGs used to display connected devices all have the device in a different position (due to some having left- and right-aligned leaders and others only right-aligned):

Not sure there's a good way to solve this.

[Hjdskes]

I'll do the back button later when I have more in the works for #89 and #90.

This is then ready for review :)

[whot]

can we detect the device (it's on its own layer after all) and crop the SVG?

[Hjdskes]

I'm already retrieving the device on its own layer, but it keeps its "global" coordinates from the complete SVG it seems. Hence the issue.

[whot]

any way we can crop the image? or not with the current architecture?

[Hjdskes]

any way we can crop the image? or not with the current architecture?

Doesn't look like it :\ I've tried a few things within the SVG, but ultimately it comes down to librsvg reporting the sub's position relative within the "global" SVG space. Gtk.Image doesn't allow you to reposition elements within its image (and rightfully so, that's none of its business), and neither does GdkPixbuf.Pixbuf as far as I can see. That means we'd need to solve it with Cairo, but I'm not too familiar with that. I've asked on #cairo but have yet receive a reply there.

[julianrichen]

I'm not really sure about the limitations of Rsvg as I briefly read the docs but in SVG you can place groups inside of <defs> and retrieve just the group with <use>. Would that work?

<svg width="500" height="500" xmlns="http://www.w3.org/2000/svg">
    <style>
        ...
    </style> 
    <defs>
        <g id="Device">
            ...
        </g>
        <g id="Buttons">
            ...
        </g>
        <g id="LEDs">
            ...
        </g>
    </defs>

    <use x="0" y="0" href="#Device" />
</svg>

Maybe only have the groups inside of <defs> in the file (ex. logitech-g303.svg) and then let Rsvg create a new SVG document and import the file and declare the image with <use>? Would require changing the current SVG files.

[Hjdskes]

Would that work?

A quick test shows that librsvg doesn't support this; the SVG comes up empty now, but weirdly it does have the right dimensions.

[whot]

Merging this for now because it works, the welcome screen is a niche case anyway and we don't have a solution for the svg just yet. I'd still like you to figure out a solution for that, but for now let's get this in.