Selecting and Texturing One Side of a Box

[Wingnut]

Hi gang! 

 

Is there a way to texture just one side of a box?

 

If so, could someone also explain how to select which side (or top/bottom) of the box... that will receive the texture?

 

Thanks!

[Moon]

Use Blender.

[Dad72]

Yes with software modeling directly will be the easiest.

otherwise with babylon can be see with the submeshs, but I'm not sure.

[JCPalmer]

Hi gang! 

 

Is there a way to texture just one side of a box?

 

If so, could someone also explain how to select which side (or top/bottom) of the box... that will receive the texture?

 

Thanks!

Since you mentioned the word "selecting" I am assuming you talking about in Blender.  If wrong never mind.  Recently found out how to multi-material from a tutorial series Gryff recommended.  

 

Think I may have got that url wrong, but the 3 selecting types, vertex (default), Edge, & Face are buttons down at the bottom.  This is described in episode 5 according to my notes.

 

Do not know have note where applying different materials to different faces, but from your working the key is finding the faces selection button.  They are in a group of three.  They work like radio buttons, but unfortunately do not look natively like them.

[Wingnut]

Hi!  Thanks for the quick replies!  The Blender information is very good, thanks...  I might need to use that method. 

 

I was hoping to use only Babylon framework.  I was hoping that maybe somebody found a 'cheat' to make a standard box 'act' like a skybox, and then I would, for example, only provide a mytexture_ny.png... to only texture the top of the box.  Somehow maybe 'fool' the engine's cubeTexture system.

 

Dad72, your submesh idea is VERY interesting.  I will probably experiment with that idea, too.

 

I realize that I could make a box using 6 separate planes, but the box is going to be physics-active with applyImpulse coming from many different force-angles, and my physics tests on 6-plane boxes has been disappointing. 

 

I suppose the down'n'dirty way... is to place a textured plane against the box and parent it to the box.

 

Thanks again for the informative replies, one and all.

[Temechon]

Hi Wingnut, 

 

In one on our project, we created a function to apply a texture on only one side of a box. Let me some time to retrieve it if you still need it.

 

Cheers, 

 

EDIT : Actually, it's not the inside of the box, but several textures on a box outside of it, and my post is completely out of topic. An admin can remove it if needed.

Sorry Wing'

[Wingnut]

You got it right, Temechon (thanks).  I want the textures on the outside.  In fact, I could texture all 6 sides, but I want full control over each texture. (For example, writing on top and bottom of box, and solid colors on the sides.)  I don't necessarily need to have a separate/different StandardMaterial on each of the 6 sides, but if I did, that would work.

 

I think it can be done with something called a cube map.  I have never used one, and I don't know if BJS supports them.  With a cube map, I would use a single StandardMaterial diffuseTexture (a 6-section bitmap) created in a paint program. In a manner of speaking, it is a way to FAKE being able to specifically texture certain sides.  We are still texturing all 6 sides, but it looks-like/appears-like we are not doing so.

 

looks as if.. ?

appears as if... ?

English sucks! 

 

http://blogs.msdn.com/b/davrous/archive/2014/02/19/coding4fun-tutorial-creating-a-3d-webgl-procedural-qrcode-maze-with-babylon-js.aspx ...

 

Davrous (in step 2) did special top and bottom textures... using multi-materials and submeshes, like Dad72 suggested.  (Good call, Dad72).

 

Leave it to Wingnut to make something simple... suddenly seem complicated.    Thanks for the replies!  Keep them coming.  I am in no hurry to solve this, and I love gathering this knowledge.  Information gathered here... might be going into the materials tutorial.

[Temechon]

In this case, here is my code. The object 'wall' is a simple box (created with CreateBox).

If you have any questions, as usual, don't hesitate

var wall3DInnerMaterial = new BABYLON.StandardMaterial("wall3DINMaterial", scene);wall3DInnerMaterial.diffuseColor = SceneManager.COLOR_WHITE; var wall3DOuterMaterial = new BABYLON.StandardMaterial("wall3DOUTMaterial", this.sceneManager.scene);wall3DOuterMaterial.diffuseColor = SceneManager.COLOR_GREEN; var wall3DSideMaterial = new BABYLON.StandardMaterial("wall3DMaterial", this.sceneManager.scene);wall3DSideMaterial.diffuseColor = SceneManager.COLOR_GREY; var wall3DMaterial = new BABYLON.MultiMaterial("wall3DMaterial", scene);wall3DMaterial.subMaterials.push(wall3DInnerMaterial);wall3DMaterial.subMaterials.push(wall3DOuterMaterial);wall3DMaterial.subMaterials.push(wall3DSideMaterial);wall.subMeshes = [];var verticesCount = wall.getTotalVertices();// Material at index 1 : wall3DOuterMaterialnew BABYLON.SubMesh(1, 0, verticesCount, 0, 3, wall);new BABYLON.SubMesh(1, 0, verticesCount, 3, 3, wall);// material at index 0 : wall3DInnerMaterialnew BABYLON.SubMesh(0, 0, verticesCount, 6, 3, wall);new BABYLON.SubMesh(0, 0, verticesCount, 9, 3, wall);//Material at index 2 : wall3DSideMaterialnew BABYLON.SubMesh(2, 0, verticesCount, 12, 24, wall);

[Wingnut]

Cool, T!  This is much like the Davrous code, but what's really cool, is that you used it to build a wall.  (I assume your simple box was scaled to make it wall-like). 

 

Remember my goofy "wall with a window hole" demo?  It used a miserable 16-plane thing, in order to avoid using CSG boolean subtract... to make the window hole.  I was scared of CSG back then, but I created a playground scene from our CSG demo, and the fear went away, somewhat. 

 

Temechon... your wall making code is a partner to the 16-plane mess.  Your code is able to make walls without a window hole...  much easier than a 6-plane method.  Very good, thanks.  So, not only will your code work for my original situation, but it is useful for a potential future "wall tools" library.  Nice.

 

A bit off-topic, but, I wonder...

 

IF a person used CSG boolean subtract to make the window hole in the wall, would we still be able to set a unique texture on the inside edges of the window hole (the blue panels inside the window hole in the demo)?  Maybe the submesh multi-material method would work for that, as well. 

 

If anyone feels like making a testing demo for that... it would be MOST WELCOMED.  Basic box, scaled to wall shape, CSG boolean subtract a window hole or two... and then use the multimaterial submesh method to texture all planes, including the window hole header, shoulders, and footer.  (How do you like my fancy carpenter terms?)  heh. 

 

I guess we can talk more about that, later, when we start building and contributing to the 'wall tools' library.

 

Keep the comments coming.  Its all good knowledge. I am still wondering about cube map, so if anyone has information on that method, do tell.  Thanks!

[JCPalmer]

I should mention that I do not fully buy into the perception that a "Babylon only framework" as you called it and Blender are mutually exclusive.  I do not want to over commit myself, but that is exactly what I am very close to merging.  I have rewritten the Blender export to produce a .Babylon JSON file that is >10% smaller than the current script.

 

In addition it produces a .log file, but more importantly but also produce a .js which creates a sub-class of Babylon.Mesh or any class that is a sub-class of Babylon.Mesh for un-parented Blender meshes (not counting armatures as parents).  Child Meshes are just instances of the class you specify (default Babylon.Mesh), rather than sub-classed.

 

Sub-classing is really how to construct extensible libraries (I know classes in JS are only fictional). Combine this with the belief that writing code by hand increases in difficulty much quicker than using Blender does.  This is partly why I have gone down this route.

 

Being able to have both python scripts in use during development meant I had to give mine a different name.  I chose Tower of Babel, after the old testament story about communicating in multiple languages.  I still have problems with skeletons & animation.  I never implemented Instances in the .babylon file as the version of the script I started from did not yet have this.  I have a major problem with how instances were implemented anyway.  They were shunted to the side & not built right into AbstractMesh & Mesh, but that is a different story.

 

Here is a sample of a multi-materialed cube .js and .html to call it.  Not sure I'll get around to releasing Tower of Babel, but I am opposed to it.  If no one cares I'll definitely just keep it internal.

 

Jeff

inline_js.html.txt

wall.js.txt

[Wingnut]

Jeff, thanks for the files... I will definitely look them over and give them a test run.  Sweet!

[JCPalmer]

Btw, my idea of merging is really to leverage Blender as an interactive code generator, not to run a modeler inside of a browser using JS.  You get the productivity gain and output results expressed in code without troublesome hand coding.  How it fits is you expressed a desire for a code only solution for a wall section with a window that is much easier to model & generate code than to write it by hand.

 

.js over a .babylon file is not for everyone, but it is :

• synchronous (no callbacks to write as there is no asynchronous file I/O to wait for except for texture files)
• state can be put into a hand written superclass, to manage complicated AI in the render loop.  Having stuff in 2 different places at run time (.babylon and the rest in code) can make things difficult, and means you cannot take advantage of object orientation.
• requires no local web server during development.  (Some IDEs might provide one automatically)

Sorry if this is too programmer like terminology.

[Wingnut]

hehe.  As you noticed, I quickly edited my post because I finally looked at the files and realized what you had done.

 

It is amazing, JC!  Now I am starting to see what you mean by the close integration between Blender and framework.  You took output from Blender, and pretty much 'generated' JS scene code without needing to use a .babylon file.  Drooooool!  Unreal.  Thanks JC!  That is just SCARY levels of COOL!

 

Readers... here is a demo of the slightly-adjusted JCPalmer Brick.  Here is a zip file of it.  (I hope you don't mind me re-publishing it, JC.  Just holler if you prefer I didn't.) 

 

Its not so much that it is a perfectly fine submesh multimaterial any-textured 'brick', but its more about how it was made.  My nipples still haven't relaxed their erection. 

[Temechon]

JC it is really cool. You should make a self post only for this to gain visibility for Delta and Davrous.

[JCPalmer]

JC it is really cool. You should make a self post only for this to gain visibility for Delta and Davrous.

 

Not too interested in gaining lots of visibility for something that only almost works right now.  I could really use examples of .blend files that have both skeletons and animation that fully work when using the existing Blender export script.  The simpler the better.  If I had some help of not having to make my own models might make getting over this hump possible.

 

I would leave instancing issues for this later thread, as it is more the way that instancing is implemented which harms a Babylon.Mesh subclassing approach than a problem with the python script.

[gryff]

I could really use examples of .blend files that have both skeletons and animation that fully work when using the existing Blender export script.

 

Jeff, here is a set of files that hopefully meet your criteria:

 

A Man Walking

 

A .blend file with a low poly mesh (3100 tris in Blender), a 32 bone rig(skeleton) and a 45 frame walking animation. The looping is not great - but tweaking that will take a little time.

 

I've included the babylon file and an html file that I used to test it on my local server.

 

cheers, gryff

[JCPalmer]

gryff,

Thanks great!  Now I only have to do one thing at a time!  I put it into my local server, with renames of index & male1 to index_orig & male1_orig respectively.  Fully operational starting base.  Have done an initial Tower of Babel export and my .babylon file size is 901kb from the original of 1.1mb.  That is a 8.8% reduction (used linux block count to calc).  A little less than 10%.

 

Now I can do that which I do.

 

Jeff

[JCPalmer]

gryff,

Got your walking man to work.  Here is the replacement male1.babylon.  Here is also male1.js & inline.html to call it.  The .js right now goes in the same directory as the .html, but you can change if you like.

 

That took all day.  Will be doing more testing & moving forward.  Where to exactly, I do not know.

 

Thanks again.

 

Jeff

male1.babylon.txt

male1.js.txt

inline.html.txt

[Wingnut]

Of course I have to republish THAT, too. 

 

JCPalmer - Gryff - Walking Man...  and its zip file.

 

I couldn't get male1.js into my Boxer text editor.  It said the lines were too long, and asked if it could wrap it as needed.  And after saving that, it no longer worked.  But as long as I didn't put it in the editor and re-save it, it worked fine.  Good and interesting work, you guys.  Those big piles of coordinates remind me of my VRML days.   

 

290 KB zipped, including BJS.  Unreal.

[gryff]

Will be doing more testing & moving forward.  Where to exactly, I do not know.

 

Jeff, to be honest, I'm not sure what is going on here, but if you need Blender stuff as I have told you before - just ask.

 

Right now, I've have guests from the UK - but that will be over soon.

 

And Wingy, the "Walking Man" - shades of Stephen King. I have to wonder about :

 

Those big piles of coordinates remind me of my VRML days.

 

Actually, VRML was able to use "interpolators" for animations - no need to have every frame. The Blaxxun Contact VRML browser plugin, used in Cybertown an early MMO,  was very good at that.

 

cheers, gryff

[GameMonetize]

We can also use interpolators with babylon.js but the blender exporter does not use them:(

[JCPalmer]

Wingnut,

If you are on Windows, try WordPad with wrap turned off.  I put in strategic lines breaks & indenting to give it that "hand built look".  On OSX, try TextEdit.  Do not know if it works, but it is worth the try.  Netbeans shows it very good.  On Linux, gedit struggles mightily, especially when scrolling.  Will look into putting a couple of line breaks on vertex data lines to avoid viewing issues.  Thanks for the republishing, as I am "host poor" right now.

 

gryff,

Where I am going is a surprise.  Now that I am operational, I think I know how to do more than you have seen so far .  As far a help, sure I'll ask.  I do not see a base-case .blend file in GIT.  It would be nice it you could work in some other stuff into this model.  Things do not have to make sense, just be there so that this model can server as a test to guard against regressions as changes are made.  Things wanted are:

- a node (do not know what that even is)

- Camera animation

- Direct animation of a mesh (rotation_euler, location, scale) only 1 needed

- shadows

- multi material cube somewhere, maybe a side with a texture

- fog

 

Probably sorry you offered now, eh?

 

Jeff

[Wingnut]

A blender-export torture test file.    Just maybe... the folks at Blender Org would make that file for us, or already have one that they tested their SAVE with.

[GameMonetize]

I'm so happy that JCP works on the blender exporter!! this is not my favorite part

[gryff]

Direct animation of a mesh (rotation_euler, location, scale) only 1 needed

 

Jeff, how about this for a test - the mesh is modified with a shape key/morph.

 

Animated Tablecloth

 

cheers, gryff