OSD layout configuration

[hydra]

@skaman82

At the moment the firmware doesn’t support layout options, but basically if you think that each item will have an id, x,y cords and a size then the layout GUI should be able to do this:

1) Ask the OSD for a list of items, X/Y cords and sizes and flags (uint8_t, first bit to indicate it is enabled). 2) Set an individual item’s X/Y cords and flags.

At a later date we can support ‘pages’ but the above API would not change (we’d do a get page/set page first).

X/Y cords and sizes would be uint8_t. Items will be uint16_t.

Suggest making the UI look something like this:

http://diydrones.com/profiles/blogs/minimosd-meets-arducam-osd-config

The font data is already in the firmware repository, you can allow the configurator to use the font too.

We can confirm the items and their sizes as we add them to the firmware.

Sound OK?

[skaman82]

@hydra ok, after I am through with concept/layout and HTML/CSS side. Somebody needs to take over to bring this home

[skaman82]

Regarding the OSD font: I need it as OTF or TTF file format to use with configurator.

[skaman82]

@hydra forget my comment about the font file format. Since the font characters are most likely duotone (white plus black outline/shadow) the OTF and TTF formats will not work. We need each character as a single image file in GIF/PNG/SVG file format or as a sprite image.

I can convert the characters myself if you can point me to an app that can do that.

[gaelj]

@skaman82 @hydra I'd be glad to help in on the js side of the configurator. And if you have test hardware I am willing to contribute in that aspect as well.

[skaman82]

@gaelj looking forward to work with you on that one

[skaman82]

Woud be great if (at least basic) support of other OSDs (like MWOSD) would be possible. If yes: That requires a OSD type selector (or it will be recognized automatically depending on target). The file structure should be well thought through to make adding another osd type easy (like in a separate file).

[skaman82]

@hydra what will be the layout grid size? 30x13 as in the screenshot linked above?

[skaman82]

@hydra here is a sketch of possible GUI element positions. Do we need some other settings?

[skaman82]

@gaelj I started to work on this. I will prepare a "template" OSD Tab for you to work with. So you don't have to bother much with HTML/CSS. In the meantime: could you please figure out how to display the .mcm font in configurator? We need to display some character groups in a preview window and modify position with the arrow buttons. This could maybe help a bit: https://github.com/betaflight/betaflight-configurator/tree/max-osd-development

[gaelj]

The link you provide does everything already. I'll just have to port that part into your fork.

[skaman82]

@hydra I am working in this feature branch on this: https://github.com/cleanflight/cleanflight-configurator/tree/osd-tab This is what I have made so far. Are all controls there you wanted?

It would be great if we could move the selected OSD elements directly in the preview window, if we could get that done, we wouldn't need the arrow buttons. @gaelj you can start to work on this if you like.

[gaelj]

@skaman82 @hydra just started to look into this. I will reuse as much of @nathantsoi's code as possible, including the bluebirdjs library.

[gaelj]

See PR https://github.com/cleanflight/cleanflight-configurator/pull/404 for a first cut.

@hydra, I have a few open points before I implement MSP:

1. flags byte. 1st bit is enabled, got any ideas for the others already ?
2. items: will items be always derived from the font ?
3. should we provide for font change (flashing) ?
4. size. How does this work exactly ? Stretch the font vertically + horizontally ? Is the strech factor an integer multiplier to keep the grid simple ? Or a fraction ?

[hydra]

@gaelj and @skaman82 hi guys!

As of yesterday the firmware now supports configurable OSD elements. The MSP side of things is not yet done.

1. no other ones yet.
2. the protocol should support element positioning and flags for any type of element that the OSD can draw, be it text based or later via some full-graphic solution.
3. yes - likely that bit you can lift from the betaflight configuration implementation.
4. size - well, after more work i don't think we need this now. i was thinking a simple width/height solution at the time. at the moment there are no elements that support 'size' since they all use a fixed size.

[hydra]

I used the betaflight configurator recently I found the drag/drop to be a bit funky. I like your original layout where you had the list of items and arrows. drag and drop is fine but if two items are on top of each other it's a real problem without a way to select the element to move. i'm sure it's possible to have both drag and drop and arrows.

it would be also good if the selected item had a focus border around it (e.g. green dashed line) to highlight it.

[hydra]

with regards to how the configurator currently works, please grab the latest osd-support branch.

You will see there are a few pages available 'osd setup', 'osd configuration'. The page you're working on should be called 'osd layout'.

Do you have time to work on this in the next day or so? I want to get the production OSD boards shipping next week and this needs to be done. To get things rolling I will take the PR you made and merge it with the osd-support branch and we can then work on it together.

This is what it currently looks like:

Notice the 'battery' icon is reused and needs alighment fixing.

[hydra]

Font upload can go on the 'osd setup' or 'osd configuration' tab to keep the 'layout' tab uncluttered. The latter currently makes more sense to me.

I'll be renaming the 'OSD' tab to 'OSD Configuration' soon.

[skaman82]

@hydra I would at least combine the OSD and OSD Setup tabs. There is so much space...

[hydra]

The current list of elements is:

enum osdElementIds_e {
    OSD_ELEMENT_ON_DURATION = 1,
    OSD_ELEMENT_ARMED_DURATION = 2,
    OSD_ELEMENT_MAH_DRAWN = 3,
    OSD_ELEMENT_AMPERAGE = 4,
    OSD_ELEMENT_VOLTAGE_5V = 6,
    OSD_ELEMENT_VOLTAGE_12V = 7,
    OSD_ELEMENT_VOLTAGE_BATTERY = 8,
    OSD_ELEMENT_VOLTAGE_BATTERY_FC = 9,
    OSD_ELEMENT_FLIGHT_MODE = 10,
    OSD_ELEMENT_INDICATOR_MAG = 11,
    OSD_ELEMENT_INDICATOR_BARO = 12,
    OSD_ELEMENT_RSSI_FC = 13,
};

an MSP command to retrive the list of supported elements must be used. So don't hard-code the list of elements. e.g. query the element list from the fc, then build the contents of the OSD Elements selection box from the result.

[hydra]

@skaman82 don't forget the big picture. The OSD boards need a 'landing page'. the 'osd-setup' page is that. We can add a 'help' section or some other content to the landing page in due course (e.g. wiring diagram).

also, the osd setup and configuration pages were combined at one point, see commit history :smile:

[skaman82]

@hydra My son was born just three weeks ago, so I will have almost no time resources in the next weeks till we get our routine going again :) I hope @gaelj has some time to offer and work with you on this in the next days.

[hydra]

@skaman82 congrats. Hope the missus is doing well too. I'll do what I can to get this done then without relying on your availability.

[hydra]

also, fyi, it's possible for the OSD to display the same information in more than one place on screen at the same time. since it just works from a dynamic list of elements now. :smile: It's not like the old MWOSD/Betaflight code where everything is hard-coded.

[skaman82]

@hydra I am happy to clean up the GUI afterwards bit by bit.

[hydra]

@skaman82 great, I just merged the osd-tab branch into #418.

Since this a ground up write of OSD display code in the firmware rather than a port of the MWOSD code I deleted some stuff we don't need, e.g. pages, for now, we can add it back later when firmware supports it, if users need it.

[hydra]

I'll carry on looking at the code that's been written so far and will chop and change it and update the firmware as required.

[gaelj]

@hydra I was just catching up with the latest discussions. I've got quite a lot going on at the moment with my job, which explains why I'm not so available here. It's not over yet but it shouldn't last forever. If you're taking over the CFC OSD @hydra, maybe you can assign me somer sub-tasks (if you want). Even though I have less time, I don't want you to feel you sent me a dev board and now I'm letting you down. In the meantime I'll carry on with the RGBW work, as I've finally received an SK6812 led strip. @skaman82, again, congrats to you and your wife !

On Wed, Aug 24, 2016 at 3:38 PM, Dominic Clifton notifications@github.com wrote:

I'll carry on looking at the code that's been written so far and will chop and change it and update the firmware as required.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/cleanflight/cleanflight-configurator/issues/395#issuecomment-242066633, or mute the thread https://github.com/notifications/unsubscribe-auth/AIeRmMcnP8s3jcaLd8DUIJ2EqE2_PsTsks5qjEljgaJpZM4I2V8x .