Hi Fake Pilot, thanks, I'm glad that you're having fun with MoI!


> Curious about how the css and html renders in the UI. What browser engine is it? If it is one.

MoI v1 and v2 used the Internet Explorer browser engine (mshtml). For the start of v3 I changed over to using a packaged WebKit engine instead, which v2.52 also uses as well.


> I guess, does it support CSS3 gradients and border-radius etc?

Yup, although the packaged version of WebKit is a few years old now and slightly pre-dates some newer pieces of CSS3 so like for gradients you need to use a slightly older -webkit-gradient syntax for gradients.

The v1 UI was based off of PNG images for all backgrounds, while for v3/v2.52 almost everything has been switched over to CSS properties for doing rounded corners and gradient backgrounds. There are still a couple of remnants of the v1 image based backgrounds like for popup menu borders though.



> And, how would I best edit it?

The main way is to edit the files in a text editor. It probably won't work all that well to try and use a graphical HTML editor.



> Could I just drag the whole ui folder to a web browser and start editing? Could I copy
> the ui folder to a localhost:5000 server and see it live?

That kind of thing won't work all that well because there is some customized browser behavior in MoI that you won't get when the same stuff is loaded into a regular browser.

For example, moi.css is implicitly injected into every page without it needing to be actually declared... Some controls like text edits and slider bars are custom controls implemented by MoI which won't work in a regular browser, stuff like that.

You would sort of get a page displayed in a regular browser but it's not going to be like you're seeing the regular MoI UI if you do it that way.


The main window frame is controlled by a separate (non-HTML engine based) MoI implemented layout manager that positions UI panels, and it's a UI panel that can contain HTML inside of it. The main window is controlled by MainWindowLayout.xml . The moi:// protocol that you see in there is a protocol handler implemented by MoI which loads files from sub-directories inside of MoI's main installation directory.

On the OSX version to get to the UI folder, right-click on the app and choose "Show package contents" and then inside there go to drive_c\moi\ui , that's where you'll find all the various UI definition files. The easiest thing to tweak to start with is moi.css you can change a lot of things from just editing that one file alone.


- Michael