HTML5 gauges for X-Plane 10

[Marcin]

Hi All,

 

As this is my first post here, please let me introduce myself. I am a software developer who created WebSimConnect web addon framework for FSX and P3D. It allows to build virtual panels (2d,3d) with HTML5 content. The idea is that you build a logic of the gauge(system) the classic way (as C++ plugin or Lua plugin) and then use HTML5 + JavaScript for generating display and interacting with the user.

 

After some development effort I managed to port it to X-Plane by creating WebSimGaugeX component. You can find the demonstration video on my YT channel:

 

 

I provide binaries and SDK with samples, include files and documentation. You will find everything on my website: www.websimconnect.webs.com

 

For the moment I have done only Windows version (both, 32 and x64) as a start up to see if the X-Plane developers are interested in the project. If so, I could make Linux and Mac version as well.

 

I hope you'll like it.

 

Best regards

 

Marcin

[ksgy]

If I understand correctly, you can read/write datarefs through the component? If that's right, that's awesome!

 

Thank you!

[gercarst]

Wow, seems really interesting and useful, with many many possibilities!

[vasanta]

Wow. Even though, it seems weird to watch YouTube on your navigation display, this is just awesome. A very powerful tool and a brilliant addition!

[Marcin]

Thx All,

 

 

If I understand correctly, you can read/write datarefs through the component? If that's right, that's awesome!

 

not exactly. The point is, you build your own plugin in C++, Lua. In that plugin you do your own logic, read DataRef and then perfom for example with a timer a javaScript call to WebSimGaugeX to update the HTML5 content. The map example used in the video is done that way. Source code for it is available. It could be done differently as well, you could use HTTP-D plugin (http://forums.x-pilot.com/topic/6042-x-httpd-a-web-server-plugin-for-x-plane/) and HTML5 page would read the DataRefs via http layer, however it is not recommended as it requires extra network layer and web server which is not needed here. WebSimGaugeX can deal with HTML5 without any web server behind... All is well presented in WebSimClientX example with C++ source code where I use different techniques to use WebSimGaugeX...

 

 

 

Wow, seems really interesting and useful, with many many possibilities!

 

 

Wow. Even though, it seems weird to watch YouTube on your navigation display, this is just awesome. A very powerful tool and a brilliant addition!

 

Indeed, there are many possibilities of use. YouTube screening is not one of them ) I just wanted to show rich content as well. In FSX/P3D it is gonna be used in few future releases of virtual aircraft done by 3rd party. They use it for very diffferent purposes, e.g. HUD, radar, movig map (with own tiles), ATR, glass cockpit.

 

Below two examples I did for FSX. Not real systems but just for inspiration:

 

Synthetic Vision System:

 

 

Charts viewer:

 

 

The HTML5 is rendered by separate process in GPU if available. Moreover if you use WebGL, it is even faster. You can use shader etc, in WebGL as it is for GPU accelareted content.

 

Cheers, Marcin

[zoltron_rulez]

If I understand correctly, you can read/write datarefs through the component? If that's right, that's awesome!

 

Thank you!

My plugin will allow you to do this,..- even from an HTML page. Yes, you can write HTML and talk to X-Plane right from your browser.

No C++, just pick a language of your choice (currently, Windows only).

 

Ex:

 

<script type="text/javascript">

  function setFreq(val) {

    var client = new ActiveXObject("xcomm.XPLDeviceClient"); 

    client.Open();

 

    var dev = client.GetDevice();

    var result = dev.Write("sim/cockpit2/radios/actuators/com1_frequency_hz", parseInt(val));

  }

 

</script>

 

.

.

.

<button onclick="setFreq(document.getElementById('txtFreq').value);">Set COM1 Freq.</button>

 

z

Edited May 15, 2015 by zoltron_rulez

[Ben Russell]

Nice to see some progress on this front.

 

Seeing at least Mac + Win with unified rendering engine at the core would get more people interested I think.

 

Linux users are very vocal but make up a very small % of the total market.

 

 

Dealing with two or three web rendering engines is no fun, even less so in this context.

[Marcin]

Thanks Ben, Mac support is on top of my priorities, with Linux I will see how it goes. My ultimate goal would be unified HTML5 content not only for cross-platform, but cross-simulator as well.

[Marcin]

MAC OSX 32 and 64 SUPPORT

 

After some heavy development effort I have completed version 2.0 of WebSimConnect Framework. It has two major changes, I replaced the rendering engine (it is not backward compatible with 1.x components of WSC) and developed X-Plane version for Mac OSX 32 and Mac OSX 64. The biggest challenge for me was X-Plane Mac support. I am a "Windows guy" for many years so I had to learn a lot in a short time. I have dusted off my old MacBook (which I have never liked much), upgraded to OSX Yosemite, installed all the tools, synchronised with my on-line code repository and started coding. First of all, I replaced some core functions with cross-platform code and that was the easy part, Then I had to dig into OSX Cocoa world and investigate a bit how X-Plane for Mac is built. It was quite a challenge, however I am glad that after weeks of ups and downs (oh yes there was a time I was frustrated as hell) I managed to integrate WebSimConnect with X-Plane OSX version. I hope you will like the results. Mac version comes also with simple HTTP server called WebSimConnectX.

Few remarks on the future. The rendering engine version is fixed for all future 2.X versions.I will not replace is for at least 2 years. Every new minor version of the tool for the same major 2.X release (i.e. 2.1, 2.2. etc) will use the same engine and will be always backward compatible with the previous 2.X versions.

I have planned to develop DataRefs API for WebSimGaugeX (i.e. to control HTML5 with DataRefs commands) however I have not managed before holidays which I start this Saturday. I will come back to this task in September.

As usual, the deployment package contains all binaries, SDK and samples. Please consult the "Installation Guide" on how to install and configure the tool. For Mac, apart from copy-paste method you need to run one script to let X-Plane know about the new framework.

no video this time, functionalities has not changed

http://websimconnect.webs.com/download

Cheers,

Marcin

Edited July 30, 2015 by Marcin

[Tom Knudsen]

One thing X-Plane really miss is tools for cockpit building. Any tools that would assist moving external hardware into play is good. This project is very int.

Member of: http://www.xpnorway.com Norwegian X-Plane Community

[Ben Russell]

One thing X-Plane really miss is tools for cockpit building. Any tools that would assist moving external hardware into play is good. This project is very int.

Member of: http://www.xpnorway.com Norwegian X-Plane Community

 

Tom.

 

If you're going to reply to a topic and pretend that you find it "int"(eresting) it helps to bother reading it first.

 

Please explain to me how anything in this topic is relevant to "external hardware interaction".

 

 

What is quite clearly presented here is a set of tools for using HTML5 content inside the virtual cockpit to create virtual cockpit gauges as easily as web pages.

 

It has nothing to do with external hardware and your assumption that it does shows a complete misunderstanding of the project and the content presented thus far.

[Tom Knudsen]

WebSimData is a simple component that reads simulation data with specified frequency and calls pass them to JavaScript function on a web page rendered by WebSimGauge(X) gauge or window. It allows to connect FSX/P3D or X-plane with WebSimGauge(X) without any C++ programming nor the need of WebSimConnect HTTP server

 

 

So in sense you could pass simulation data to a webpage that has an gauge of i.e CDU and have that interact with the simulator or vice versa. Or if I understood this correctly you could have

data passed from the simulator to a dedicated HTML or Javascripted page in order to lets say have a EHSI or an entire PFD displayed. If contenct is that you could only parse from html to x-plane I must have

misread the post. But if you could parse simulation data such as a EHSI screen to a external monitor, then you have options for cockpit builders. Other things this may be awesome for if I am not wrong

is certain things like instructor stations or similar.

 

I believe I remember that SimConnect allows external hardware to utilize simulation data such as Saitec, GoFlight etc. Much in the same way as FSUIPC for FSX or P3D.

This is also a very nice feature for cockpit building.

 

Please excuse my post if this has nothing to do with the above mentioned example. I try to be interested in everything that has with X-Plane and flight simulation 

If not I must have wasted the last 18-20 years. But to state that I am pretending to be interested in x-plane only makes you wrong Ben, I would not have been here if I am not interested.

 

My apologies goes however to the thread starter if I have offended his work in anyway by stating it has anything to do witch cockpit building if it does not.

[Ben Russell]

So in sense you could pass simulation data to a webpage that has an gauge of i.e CDU and have that interact with the simulator or vice versa. Or if I understood this correctly you could have

data passed from the simulator to a dedicated HTML or Javascripted page in order to lets say have a EHSI or an entire PFD displayed. If contenct is that you could only parse from html to x-plane I must have

misread the post. But if you could parse simulation data such as a EHSI screen to a external monitor, then you have options for cockpit builders. Other things this may be awesome for if I am not wrong

is certain things like instructor stations or similar.

 

I believe I remember that SimConnect allows external hardware to utilize simulation data such as Saitec, GoFlight etc. Much in the same way as FSUIPC for FSX or P3D.

This is also a very nice feature for cockpit building.

 

Please excuse my post if this has nothing to do with the above mentioned example. I try to be interested in everything that has with X-Plane and flight simulation 

If not I must have wasted the last 18-20 years. But to state that I am pretending to be interested in x-plane only makes you wrong Ben, I would not have been here if I am not interested.

 

My apologies goes however to the thread starter if I have offended his work in anyway by stating it has anything to do witch cockpit building if it does not.

 

Tom.

 

The text you quote:

WebSimData is a simple component that reads simulation data with specified frequency and calls pass them to JavaScript

function on a web page rendered by WebSimGauge(X) gauge or window.

It allows to connect FSX/P3D or X-plane with WebSimGauge(X) without any C++ programming

nor the need of WebSimConnect HTTP server

..is explaining that the new technology demonstrated in this thread allows users and artists to move away from using any kind of HTTP/network/IPC server.

The entire point of the technology demonstrated here is that you can use the potent multimedia capabilities of a modern browser rendering engine to create avionics, in the sim entirely, without any fiddly interconnects.

There are plenty of other projects, from Arduino to "Cheap Android Tablets" that aim to allow third party hardware/software network IO.

This is not one of them.

 

It allows to connect FSX/P3D or X-plane with WebSimGauge(X) without any C++ programming nor the need of WebSimConnect HTTP server

"WebSimConnect HTTP server" is not the primary subject of this thread.

"WebSimConnect HTTP server" does not represent a break through of technology and possibility.

(Many products have embedded HTTP servers for things like FMC IO.)

The focus of the thread is the use HTML5/Javascript in the virtual cockpit to render to the panel texture gauges.

That is a break through and one that should eventually leady to all sorts of rich content.

Google maps on your EFIS screens anyone?

Edited August 17, 2015 by Ben Russell

[Tom Knudsen]

Ok I see Ben, thanks

[Marcin]

Thanks Ben for your answers as they get to the point what WebSimGaugeX is all about.

 

Tom, please note, WebSimConnect for FSX/P3D with all its components like WebSimData etc. is a bit more reach than the one for X-Plane. Indeed, for FSX it offers functionalities for cockpit builders with duplex HTTP/WebSocket protocol to exchange the data between the sim and browsed web page. I did not provide such functionalities for X-plane because it already existed in other projects (e.g. HTTP-D plugin). I included WebSimConnextX HTTP simple server just to host some files that might be useful for gauge building (e.g. offline map tiles). For X-Plane it offers mainly X-Plane HTML5 rendering and GUI for Virtual Cockpits as Ben correctly pointed out which can controlled by non HTTP layer (c++, lua) or HTTP layer with some 3rd party X-Plane HTTP server. I am not planning HTTP server connected with X-Plane in the near future just because I do not have the time for it right now.

 

In the next weeks I want to enrich WebSimGaugeX with DataRefs API, i,e, the developers would be able to control the HTML content (HTML doc and JavaScript) by changing DataRefs string values. It would allow to develop HTML6 based instruments with any technology behind (c++, lua and other scripting interfaces)

 

cheers

 

Marcin

[Tom Knudsen]

 

in other projects (e.g. HTTP-D plugin).

 

Thanks, did not know that

[Andyrooc]

In flight movies? I'm downloading it now   ...and if I can get it to integrate with WhatApp, I'll be able to order a coffee too (or a night on the couch depending on how it goes).

 

It might be a nice way to deliver flying lessons.

[Marcin]

A very nice creative example of WebSimGauges used in the PRO aircraft model. Here in the upcoming TORNADO PANAVIA by SSW for FSX/P3D

 

3 WebSimGauges used in the DEMO (HUD, RPMD moving map, ESRRD - terrain following radar). There is one more gauge not shown in the DEMO - TV-Tab Head-Down Display.

 

The same gauges could be potentially ported to X-Plane for Win and Mac without any effort !

 

Enjoy

 

 

Marcin

[Marcin]

Version 2.1 was updated and includes X-Plane 10, 11 support for Win & Mac.

 

http://websimconnect.webs.com/download

 

Setup program was added for Windows. Mac has no installer but only copy paste is needed.

 

The API was enriched with DataRefs API, i.e. you can call JavaScript functions of your gauge by setting custom DataRefs, which allows to build the systems using for example lua scripting or anything else that can manipulate DataRefs. Additionally there is native JavaScript function that sets the DataRefs, so you have duplex communication between custom plugin (lua, c++) and JavaScript code.

 

The next version 2.2 shall be released soon. It will target P3D and X-Plane for Windows and will include accelerated rendering. The details were posted on FB fun page:

 

even though the post is about FSX/P3d, the same applies for X-Plane and Open GL rendering. Unfortunately, for the moment the acceleration can be achieved only on Windows .

 

Cheers

 

Marcin

Edited April 30, 2018 by Marcin

[YeHe]

Hi, Marcin

Great plugin. It's really amazing.The download link in your web seems to be unavailable now, could you please help check? I can't wait to try it with X-plane.

Thanks & Regards,

Ye

[Timhalstead]

Hello Marcin, I just discovered your work, does it now work with Xplane11, and where can I download the WebSimGaugeX plugin? 

 

Thanks Tim