I have been showing what has been growing slowly in the designing of the web UI and while the app is running. This is more of the same. We have taken it a bit further and consolidated some of the functions that I think one needs when fine-tuning the look and feel of a web application.

There are four foldup sections in the TK Live View: Live Edit, Server Setup, Assets TK Synk, and Debug Information.

Turnkey Live Editor

We have an icon that calls the Turnkey Live Editor. This is sort of a hybrid between the ViewModel Editor, where you change the definition of the views, but this way, you can run the application. It is a combination of the run button which we had before - where you prototype and start the system in either WPF or in the local Turnkey prototyper. When the icon is pushed, you get a corresponding ViewModel connected to it because they share some of the logic.

It is basically an embedded browser, the new WebView2, Microsoft's embedded Edge browser, which is replacing the old Internet Explorer and Edge.

Server Setup

The new button looks like the play button and you can check if you have the current Turnkey core installed. It is optional; you can run it either towards a local XML file or use the MDriven server which will use the settings from the cloud connection for data.

If you choose the MDriven Server, the "Settings for MDrivenServer" button will light up. Click on it and it will open a new window labeled CloudForm where you can set the server you want to run against.

Live Edit

When we choose to fold down the live edit tab, you get the view model tree, and also some of the few of the settings that are interesting per view model column.

When you click something there, like "all things", you can see that this is positioned at the position 0x and 0y, and if you were to change this to like 10 instead, this would immediately jump, and you don't have to refresh or anything, and that's the beauty of running within a harness like this, because we can do the push and refresh for you, to make things move smoother. And as I've shown before, we can also move things around like this, and since this is the running application, I can expect to find the actions, I can create a new thing, and you can save that.

Watch the video to learn more

(Video)