[WORKING] - Dedicated BabylonJS Game Editor For Unity

[MackeyK24]

I was just checking to see if there is anyone else in the babylonjs community that would like to be able to use ALL the design time features (that you can pull useful information for serialization into the native .babylon scene file).

Including:

--- Built-in babylon javascript and typescript development right in the UnityEditor (Using whatever text editor you have unity configured to use)

--- Integrated babylon html game preview window features, including debugging (Thanks to David for creating the original WebServer.cs)

--- Node level (camera, light, mesh or simply a game object) metadata including abstract base class BabylonScriptComponent (subclass of monobehaviour) that can be attached as regular unity script components... Just like normal unity scripting, JUST FOR BABYLONJS

--- Babylon.Unity.ts ... A babylonjs loader to automatically parse all scene metadata and provide a fully managed 'tickable' scene components

--- Plus pretty much ANY UnityEditor design-time features

      --- General Asset management

      --- Detailed Scene Level Design

      --- Fully scriptable prefabs

The list goes on.

Now i don't know if its just me going nuts over here, playing with all the stuff i can do with Unity as my dedicated babylon js game IDE or if there are others that would like to use that kind of unity game editor features.

Or even if the babylon community wants to be associated with that much BabylonJS/Unity integration

I have all this code running on my machine (Working great, i might add) but i TOTALLY SUCK at gothic pull request (Note: I still delete and re-fork overtime i want a clean updated babylonjs source download)

I am making a short video showing some of the features...

Its just that, if I'm the only one who wants to do this kinda stuff, i won't bother wasting my time packing up and making available to the rest of babylonjs community (Once i figure out how to package up my extension kinda like babylon.canvas2d... I would like to make a babylon.unity3d extension that provide all the client side typescript that uses the UnityExport metadata)

Also... I add SOOO many features and re-strcutered the /Assets/Plugins/Babylon folder that i don't know if i can just do a pull request to submit back to babylon or if a should just submit as a new 'Exporter/Editor' feature to the github.

Anyways... a video coming soon to see what you all think about think of dedicated babylonjs editor using unity (With ALL runtime features disabled... Just editor stuff)... Let me know

 

[MackeyK24]

 

[Wingnut]

I think this is great.  We can use all the Unity integration and knowledge we can get.  ANY kind of "smoothing the bridges" between modeling packages... and BJS... is good good good.

Quote

39 minutes ago, MackeyK24 said:

but i TOTALLY SUCK at gothic pull request (Note: I still delete and re-fork everytime i want a clean updated babylonjs source download)

Me too.    But a forum friend named Raanan... helped me with this.  Allow me to talk you through an update to my BJS documentation fork.

I first arrive at https://github.com/Wingnutt/Documentation ... it says I am 39 commits behind.  On that same line... far right... there is a compare button.  Whack it.

It reports "There isn’t anything to compare" but then offers a "switching the base" choice.  Whack that.

Scroll back up to the top of the new page that appears.  Now you should have a big green button... "Create pull request". 

Let's pretend this is YOUR repo, Mackey.  This button... is a pull request to YOU, from YOU.  Click that.  Clicking it in MY repo... go for it.  I'll probably see a merge request from you... and I'll probably "commit" it.  You can freshen my docs repo if you wish. No problems.  Anyway... after the click...

...a message panel opens, and just type "updating my own repo" or something like that... and push the "Create pull request" button below that. 

You have just sent a pull request from USER you... to REPO-OWNER you. 

Now, re-browse your forked repository, and "accept" the pull request from USER you.  Merge it in.

If all goes well, your repo will report that you are now 1 commit ahead of master.  This is normal.  The 1 commit... is your pull request that you just did... from USER you to ADMIN you.    All is fine.  You got "fresh". 

But, yes, this procedure is almost more work... than a branch delete and re-fork, eh?  I hear ya. 

Anyway, sorry for that topic tangent.  Let's keep the spotlight on this EXCELLENT and KIND offer of code and expertise... about Unity.  These kinds of offers and sharing attitude... is what we REALLY LOVE around the forum and involved with BJS.  You just became a hero, MackeyK, even if your code sucks or is never ever used.  The offer... and your kindness... means the (webGL) world to us.  THANK YOU!

[meteoritool]

Never tried Unity nor Unreal, but their free-entry offers are nice !
Right now I use my code editor + blender + chrome. So any kind of all-in-one editor would be great !

[gryff]

@MackeyK24 : Hi Mackey, I'm curious about where you want to go

16 hours ago, MackeyK24 said:

dedicated babylonjs editor using unity

I stopped using Unity back in early 2014 (3.5 0r 4.0 ? ) but the Unity editor could do many things:

1: Shaders - do you see converting those shaders with this editor?

2. Blendshapes - Unity could import them and I could animate them in Unity - would the editor export those animations?

3. Scripts - since Unity allows C# scripts - conversion to javascript?

So the editor you propose would do these things - and export them to a .babylon files?

cheers, gryff

[MackeyK24]

I don't really CONVERT anything ... more of a SCRAPE of any useful information obtained using the Unity Script API (Design-Time) and then serializing a NATIVE babylon.js scene file using various pieces of information you retrieved from the Unity Editor Controls or using the Unity API directly.

I do have support for universal GLSL shaders and a unity style script component api i created for babylonjs that allows you to attach "EDITOR" components to unity game object just like a normal MonoBehaviour script. The babylon.js version of the editor control (inserted from a C# class BabylonScriptComponent) has a property called 'customType' that you use to specify the actual 'BACKING' babylon.js class for the component.

Kinda like how blueprint for unreal engine are "Editor" features that have a backing C++ class... In our case the backing class would be you babylon class created by whatever you want... Javascript, Typescript, C# DuoCode... Basically anything that created a javascript class in the long run.

Blend shapes... Don't know what or how to use that yet...

But the theory is the same... Use the Unity API to query information about something, then serialize that info into the scene... Either natively or as metadata.

Here is some example Unity API C# code that i use in the toolkit to support Navigation Meshes generated in Unity:

if (SceneController.sceneOptions.navigationMesh == BabylonNavigationMesh.IncludeNavMesh) {
    ExporterWindow.ReportProgress(0, "Parsing scene navigation mesh...");
    NavMeshTriangulation triangulatedNavMesh = NavMesh.CalculateTriangulation();
    if (triangulatedNavMesh.vertices != null && triangulatedNavMesh.vertices.Length > 0 && triangulatedNavMesh.indices != null && triangulatedNavMesh.indices.Length > 0) {
        ExporterWindow.ReportProgress(0, "Exporting scene navigation mesh...");

        var navData = new UnityMetaData();
        navData.objectId = "0";
        navData.objectName = "Navigation Mesh";
        navData.tagName = "Default";
        navData.layerName = "Navigation";
        navData.layerIndex = 0;

        var areaTable = new List<object>();
        string[] areaNavigation = GameObjectUtility.GetNavMeshAreaNames();
        foreach (string areaName in areaNavigation) {
            var bag = new Dictionary<string, object>();
            int areaIndex = NavMesh.GetAreaFromName(areaName);
            float areaCost = NavMesh.GetAreaCost(areaIndex);
            bag.Add("index", areaIndex);
            bag.Add("area", areaName);
            bag.Add("cost", areaCost);
            areaTable.Add(bag);
        }
        navData.properties.Add("table", areaTable);
        navData.properties.Add("areas", triangulatedNavMesh.areas);

        var navMesh = new UnityBabylonMesh();
        navMesh.name = "sceneNavigationMesh";
        navMesh.id = Guid.NewGuid().ToString();
        navMesh.metadata = navData;
        navMesh.indices = triangulatedNavMesh.indices;
        var vertices = new List<float>();
        int vcount = triangulatedNavMesh.vertices.Length;
        for (int ii = 0; ii < vcount; ii++) {
            Vector3 vec = triangulatedNavMesh.vertices[ii];
            vertices.Add(vec.x);
            vertices.Add(vec.y);
            vertices.Add(vec.z);
        }
        navMesh.positions = vertices.ToArray();
        babylonScene.MeshesList.Add(navMesh);
    }
}

Note how i use : NavMeshTriangulation triangulatedNavMesh = NavMesh.CalculateTriangulation();

to get the info about the nav mesh from unity, then i use the BabylonExporter API create a native Babylon MESH and use the new node.metadata feature to serialize all the native unity information about area and cost... Now in your game you can use that information to implement nav mesh support using the actual nav mesh you created in your scene... Easy Peezy

Thats just one of many features I'm working on. Here is a GLSL Universal Shader... Where you have a native Unity .shader program that uses unity built-in GLSLPROGRAM blocks to define a vertex and fragment (plus an additional #ifdef BABYLON block i added to support attributes and uniforms).

 The there is that you the #ifdef UNITY_EDITOR clock within each vertex and fragment block to handle your platform specific stuff... At minimum... you can just use a simple 'PLACE-HOLDER' type texture in UNITY_EDITOR block that just renders a texture or colors the mesh just for viewing in the editor... BUT you use the NON UNITY_EDITOR to write your native GLSL shader code... If you know enough about unity GLSL shader attributes like gl_Vertex, gl_Normal and so on... You could really write your shader to use #ifdef UNITY_EDITOR bock to JUST get platform specific uniforms and attribute and use the values equally down in your shader code... Example:

Shader "BabylonJS/Templates/Amiga Shader" {
Properties {
	[NoScaleOffset] amigaTexture ("Amiga Texture", 2D) = "white" {}
	shaderColor ("Shader Color", Color) = (255, 255, 255, 255)
	scaleFactor ("Scale Factor", Range (1.0,5.0)) = 1.0
}
SubShader {
Pass {
GLSLPROGRAM

#ifndef UNITY_EDITOR
#define UNITY_EDITOR
#endif

#ifdef BABYLON
	attributes: ["position", "normal", "uv"]
	uniforms: ["worldViewProjection"]
	samplers: []
	defines: []
#endif //BABYLON-END


#ifdef VERTEX
#ifdef UNITY_EDITOR
	vec2 GET_UNITY_TEXCOORD() { return vec2(gl_MultiTexCoord0.xy); }
	vec4 GET_UNITY_POSITION() { return gl_ModelViewProjectionMatrix * gl_Vertex; }
#else
	attribute vec3 position;
	attribute vec3 normal;
	attribute vec2 uv;
	uniform mat4 worldViewProjection;
#endif
precision highp float;

varying vec2 vUV;

void main(void)
{
	#ifdef UNITY_EDITOR
    	gl_Position = GET_UNITY_POSITION();
	    vUV = GET_UNITY_TEXCOORD();
	#else

		// START YOUR BABYLON GLSL VERTEX SHADER HERE
    	gl_Position = worldViewProjection * vec4(position, 1.0);
	    vUV = uv;

	#endif
}
#endif //VERTEX-END


#ifdef FRAGMENT
precision highp float;

varying vec2 vUV;
uniform vec4 shaderColor;
uniform float scaleFactor;
uniform sampler2D amigaTexture;

void main(void)
{
	#ifdef UNITY_EDITOR
	    gl_FragColor = texture2D(amigaTexture, vUV * scaleFactor) * shaderColor;
	#else

		// START YOUR BABYLON GLSL FRAGMENT SHADER HERE
	    gl_FragColor = texture2D(amigaTexture, vUV * scaleFactor);

	#endif
}
#endif //FRAGMENT-END 

ENDGLSL
}}}

I think its pretty sweet... I have a few more things to clean up then ill make a short video

 

[ozRocker]

The Mecanim system for animation is awesome!  The state machine, the animation blending, etc...a must have for modern gaming

[MackeyK24]

I luv BabylonJS... I just used my new BabyonJS Toolkit for Unity... To fully design scenes with scripts and components and run (PREVIEW) my babylonjs game right in the Unity Editor... See live changes... Also... Can do LIVE game previews on Xbox One directly out of the unity editor... No extra software or setup required... Supports both the retail version (EDGE) and the dev mode (UWP).

I can literally make a change in my scene in Unity... Hit "Export" button and refresh the Xbox One to see immediate changes in seen... And play game on Xbox One with gamepad support and everything.... WAY SMOOTHER than using native C# Unity or Unreal C++ that is "CONVERTED" to web via IL2CPP or emscripten and asm.js... Just a simple json scene file that is really no different than any other web application asset... I luv that

 

[Wingnut]

Hi M!  That is an AMAZINGLY fast and fluid work-flow.  Nicely done.  You are just blowing us away with these things you are doing.  Don't go anywhere... we need you to stay nearby, and your "Babylon Soft-Serve Ice Cream" development environment will take some time for people to "absorb" and recognize.  You are a friggin' trailblazer, and it will take some time for your fan club to catch-up with you.

Can you write-up some great documentation about your dev-flow system... maybe with some diagrams and screen grabs... and publish it somewhere?  Then, we will definitely link to it... from our off-site tutorials list (resides in the General section of our docs site).

What you've done... is hot hot hot!  Liquid workflow... no logs, no rocks, no dams... in your river.  How good is that?  WAY GOOD, that's how good. 

Thanks for sharing it with us.  It will feel like you are in an isolation bubble for quite some time, because many people can't swallow what you have accomplished.  (I'm one of them.)  Be patient with our young coders/users, write a nice "how-to" for the kids, be a great helper ABOUT your system, and you are hero-bound.

"Stuck-in-an-innovation-bubble" is somewhat common around here.  Many trailblazing BJS coders... are SO GOOD at what they do, and SO ADVANCED in the things they want to talk-about... that nobody CAN talk with them about their systems/interests.  You might be one of those people (super-innovator).  You might feel lonely and/or under-appreciated, under-acknowledged, and not well understood.  That's the isolation bubble I speak-of. 

Patience and great documentation... opens that bubble and builds those bridges across God-Noob River.  heh

All in all... what a kick-a** workflow you've designed/discovered!  Congrats!  Tell every little detail, eh? Thx!

PS:  Don't ever leave, okay?  Promise?  Cool! 

[MackeyK24]

Thanks Bro

 

[Pryme8]

You just gotta make the tools, unity and bjs I do not think would be comparable in the manner you are thinking and all the tools you are talking about have yet to been developed by someone... I mean they are there but your talking UI scripting basically and a few of us are working on tools

just saw your other post I am most impressed! 

Looks like you did it and quick too.

[dbawel]

@Wingnut -

73 Men sailed up....

[Wingnut]

Yep.  No one heard them calling. 

Perhaps, in this world of advertising... ie. "look at me", "look at this", "8 things YOU need to know today", etc...  some of us learned to ignore show'n'tells (valid/worthy or not)... out of pure sanity-maintaining necessity.  What a shame.  The good noise gets mixed-in with the bad noise, and gets lost in the roar.

Not true with Mackey's thing, here, though.  We're going to stick that onto our refrigerator... with a decorative magnet.