continued_at_new_forum The Wingnut Chronicles

[Wingnut]

Hi @thiendv, good to see you again.  @dbawel is correct, when no pivot point adjusting has been done.  You can make an invisible "hinge" object, parent the door to it, and then spin the hinge.  I think it's called the "Gryff's Desk Maneuver"... perhaps @gryff will treat us to a URL reminder.

BUT, your door already has its pivot point set perfectly (you did it in the modeling, great!)

So... you can use a very handy feature of our ActionManager ... called "chained actions"  (the wonderful .then feature).

Deltakosh gives a couple "chained actions" examples in his ActionManager docs.  I used the example shown just before the "Sprites" section.  Let's try it on your door:

http://www.babylonjs-playground.com/#BUWYF#49

It all happens in lines 11-15.  I think it works EXCELLENT.  Click the door, click it again, and again, and again. Sweet!  It even has an automatic pointer-change on mouseOver the door.

Too fun, and SUPER easy, thanks to the ActionManager and its genius inventor.  Hope this helps.  I think it will. 

Are you going to do sliding drawers, too?  You would do them the same way, except use .position for action-target, and not .rotation. 

You are becoming an "interact with scene" EXPERT, @thiendv!  Soon, you can write interaction book for us.      (1000th reply in TWC.  yay!)

[thiendv]

Hi @Wingnut I closed my door by other way, but my code very long, your source code very short. I admire you. And i very happy when i have my first application by babylonjs. I'm interested in BabylonJS. tomorrow i will record my screen, i holp you will like it. Thanks you very much because your soon answer.

And I have question I want to fill background for 2D Canvas button by image. I don't see any properties in Canvas 2D reference Image.

[Wingnut]

Cool! 

Perhaps put Sprite2d behind Rectangle2d/Text2D (with no background fill).  Sprite2d is image.

hmm... I wonder if Sprite2D can have text2d or rect2d as children[].  Wow.  Sprite children!   Funny!  Needs researching. 

Update:  (for @thiendv)  http://www.babylonjs-playground.com/#14IJD3#5   Sprite2D can have children!  (like rectangle2d and text2d).

Therefore, sprite2d works great for image/textured background for button or label.  PARTY!!!

[gryff]

@Wingnut: your wish is my command Wingy

Gryff's Desk Maneuver

It uses the Action Manager to open and close things - but the pivot points have been set in Blender. Does not use an invisible hinge - although that is another option.

Hope it helps

cheers, gryff

[thiendv]

20 hours ago, gryff said:

@Wingnut: your wish is my command Wingy

Gryff's Desk Maneuver

It uses the Action Manager to open and close things - but the pivot points have been set in Blender. Does not use an invisible hinge - although that is another option.

Hope it helps

cheers, gryff

Hi @gryff i tried my animation by your way, but unsuccessful. I create animation in 3Dsmax. Can you help me detail because I think some difficult animation, we have to create animation by software (3Dsmax, Blender, Maya...) 

[gryff]

39 minutes ago, thiendv said:

Can you help me detail because I think some difficult animation, we have to create animation by software (3Dsmax, Blender, Maya...) 

Hi @thiendv   Sure I can hopefully help.   Can you give me some detail about what you are trying to animate - a picture to start with ?

And a question,  why does the animation have to be created in 3d software? For this kind of animation the action manager will work fine ?

EDIT: Actually @thiendv: I did use animations from Blender fo3 that particular version(I have 4 different versions) You can see the Remed out code from a previous version

cheers, gryff

[thiendv]

13 minutes ago, gryff said:

Hi @thiendv   Sure I can hopefully help.   Can you give me some detail about what you are trying to animate - a picture to start with ?

And a question,  why does the animation have to be created in 3d software? For this kind of animation the action manager will work fine ?

cheers, gryff

this my object animation(have four door : door1, door2, door3, door4) i tried : https://www.dropbox.com/s/ouxpv6bsduq7yps/DoorAnimation.babylon?dl=0 .

I have some idea about animation script. Some complex path, and some human action, bone ... I have to use software create animation.

Thanks @ gryff

[gryff]

@thiendv : OK I have the file - will take a look at it

cheers, gryff

 

[gryff]

OK @thiendv : I have it running See image below.

The .babylon files from 3Dmax are laid out a little differently - but hopefully I can understand them

One door (on the right) seems to just move backward and forwards - is that right?

cheers, gryff

[thiendv]

3 minutes ago, gryff said:

OK @thiendv : I have it running See image below.

The .babylon files from 3Dmax are laid out a little differently - but hopefully I can understand them

One door (on the right) seems to just move backward and forwards - is that right?

cheers, gryff

Yes, door on the right don't rorate. only backward and forward 0 - 30frame and 31 to 60frame

[gryff]

@thiendv: is this what you are looking for?

Doors

cheers, gryff

[thiendv]

9 minutes ago, gryff said:

@thiendv: is this what you are looking for?

Doors

cheers, gryff

Great!. I spent many times for this work. It is my looking for. Thank you  very much!

[gryff]

The html file with all the code is attached

Just so you know:

1. The doors were not pickable in the .babylon file

2. The animations were set to play automatically in the .babylon file.

So I had to change that in the code

I don't know if you can change either of these in 3Dmax (I can't afford it ).

Make sure at the top of the file that the babylon file path is correct for your setup. I have tried to to document it as well as I can - and I had to add a camera.

cheers, gryff

code.zip

[Wingnut]

Pivotal!  Truly pivotal! 

Hi guys.  I have been doing a little reading in pursuit of silhouette things.  (okay, okay, that link was for FANCY silhouette things)    Can you imagine drawing-on three Shape2D and having it create a model from them?  Cooooool.  But that's for smarter people than I.

My quest... is somewhat more simple.  I want to have an extrusion or displaceMap... that follows the outside edge of a transparent-background image.  Like this... https://c2.staticflickr.com/4/3037/2404820566_c56d3492c9_b.jpg  (truly pivotal)   Doors, flat hockey players, what's the difference, right?

Create a mesh... extruded/displaced the same thickness across entire surface... and the outside edge "shape" follows the outline of an image (non-transparent part).  Cool!

SO, I went experimenting.  (uh oh).  I took the "birdData" from our PolygonMeshBuilder feature... and I stuffed it into the "shape" array of a @jerome extrusion thing!

I had to fiddle with the string, a bit, but it's working pretty good!  http://www.babylonjs-playground.com/#165IV6#34

NASA, we HAVE EXTRUSION!  (At my age, extrusion is rare... ahem.)   

ANYway... set line 73 to 1, 2, or 3... to turn-on the extrusion "caps". 

I think this shape is a little too complicated for the extrusion's capping system... but it gives it one hell of a try, eh?  Notice that the capping system is attempting a wagon-wheel-type of capping, from a central hub-point.  Our bird says "You'll have to do better than that, if you want to cap ME, buddy"    That's a different issue, though.

Would anyone like to build an image "outer edge detector"... that creates arrays of vectors... that approximate the "outline" of that image? 

Vector2 would be fine, but Jerome's extruder uses Vector3's with 0's in the z-component. 

All in all, I would love to have an "image-outline-to-extrusion-shape" thing... converter... shape generator... you know.  Something that makes bird shapes from transparent background bird pictures.  Transparent colors in the middle of an image... can be ignored.  I just need that outer edge of the image... converted to extrusion shape data.  THAT... would be cool.

A bottle of whiskey (not too expensive, please) to anyone who can do it for us.    Party on, everyone.

[thiendv]

Hi @Wingnut, after spent more time for Babylon. I very like it, and I really want to expert about babylon. Thank you for your help me. All my question, you answer very early. It is my result project. I hope you like it.

https://www.youtube.com/watch?v=nLBjRR22KeE

[Wingnut]

VERY nice, @thiendv!   You ARE an expert in BabylonJS! 

I think you are ready to open 3D Graphics School and teach others.  Well done!

Only one (context) menu activated so far?  No door or drawer opening/closing?

It's okay.    Perhaps you can create "Doors, Drawers, Context Menus and Color Changers" ...teaching playground, someday.  Yes?   Maybe in a year, okay? 

In a year, perhaps @Nockawa and his team (he needs MORE team, by the way) will have new context menus.  They will be much easier to use than our current method, T.

Anyway, again, congratulations @thiendv...  your scene looks great and works great!  COOOOOOL!

[Nockawa]

Well, the situation is still the same for me: I'm working to make Canvas2D stable, which isn't the case yet (but almost). I've been faced lately with a situation where I had to rewrite the whole positioning engine, the result will be much better/cooler but it took me an incredible amount of time! But it was a must have and I couldn't leave it like that.

Once this refactoring is done, I have few bugfixes and evol to make and then I go back on the GUI. 

This statement is still true: the Canvas2D feature is a low level 2D Engine, you can build your custom GUI on the top of it but it would requires a lot of work.

Many people are doing so because, well, the GUI is not there (yet), so they don't have other choice. But the goal is still the same: providing a great GUI Lib to give you guys a much higher level lib to make some cool GUI.

Btw, the refactoring is 90% done I think... so the biggest/hardest is behind me...

[Wingnut]

Cool!    Congrats on the new positioning system, Noxxy!   Was the refactor caused by a situation with container flow/overflow/scroll/wrap/wordwrap?

Bet so.  Containment SUCKS! 

The folks at CSS Styles Working Group, and the folks who work-on browser "flow" systems... have all gone insane.  They're all in mental institutes...  getting shock therapy.

It's very big.  Padding == 12 mile nautical boundary waters.  Wrap = South China Sea.  Containment... is a HUGE subject.  Don't let it take you down, Nox.  Borders, paddings, margins, wraps, scrolls, overflows, etc... hasn't yet been learned by earth creators... so YOUR system of working with those... cannot be done perfectly, yet. 

(Wingnut being goofy.)

Did you lose some backward compat on the primitives?  Major changes to some of them?  It's all okay and expected... along with time needed.  Farm-out tasks if you can,  Nockawa.  I'm qualified to do laundry and fetch groceries for you, but that's about all. 

@thiendv's context menus were quite easy, though.  A little steep learning curve, and some problems with isPickable when we installed it in the scene... but... worked good.  Once we learned how the knobs were used, we turned them to the correct values.  We were picking the skybox with the mouse right-click, and the context menu was bouncing around in the scene.  Then we set skybox .isPickable = false (and some other isPickable tweaks)... and it all started working good.

@adam's doing some things, too, I think, right?  Working-with centering prims/wsc2d's on their trackNodes... I think.  Maybe that's what caused the need for positioning refactor, eh?  Thanks alot, Adam, dammit!!!  (just kidding, of course).  Thanks for your work on the perfect-centering issue, truly. Bounding box measuring hell, I bet. 

We also want to find that guy who wrote the "labels can't overlap" demo/system, recently.  I want to make sure that his system STAYS WORKING.  (I can't rem his name).  SO... let's find him and his demos... and make sure the new positioning system... doesn't break his no-overlap system.  If so, let's help him fix it.  I think the "no overlapped labels" is a rather important tool to keep handy.

ok, party on, guys!

[Nockawa]

Currently the autoSize is not working as expected and the padding too. Solving the padding issue was really tricky, I had to rethink everything again, well mainly because I didn't realize at first that I'd to support autoSize then when I figured this out I thought it wouldn't be a big deal.... Anyway, it's almost done now.

Adam made several contribution, his latest is a GridPanel Layout, so it's nice because these are feature that most of the people would need. I'm happy somebody give me some help!

[Wingnut]

http://www.babylonjs-playground.com/#1B1LNW#26

 endCapTri is undefined  (uh oh)

@Rolento... did that label overlap-avoidance thing.

http://www.html5gamedevs.com/topic/26087-render-dynamic-line-connector-linking-label-to-shape/?do=findComment&comment=157124

*nod* *thx* N.

Containers.  Groups.  Borders.  Padding.  Are groups... containers?  Should they wrap, overflow, clip, auto-expand-to-fit? 

Are borders added to padding?  (thus, are border widths part of wrapping/clipping equations/consids?)  Do groups need to communicate very carefully with their "assigned" border prim?  hmmm.  

I love speculating about this crap.  Sometimes Nox teaches me cool stuff.   hehe

[Wingnut]

See?  All those difficult questions about border widths... scared-off @Nockawa.  I don't blame him.  I don't think ANYONE on the planet... knows how to deal with border widths (and their affect-upon container sizes and thus, upon wrapping/overflow as well.)

Anyway, hi everyone!  It has been a while.  I have been thinking more about visualization.  In fact, World Health Organization data visualization.  Can a playground scene... send a query, and build a bar-graph with onSucessful returns?    Sort-of like this... but derived from data retrieved from off-site. 

I once saw Kostar111 query and retrieve map data from a remote server.  (see PG below)  I think it can be done for WHO data, too... maybe. 

I suppose the querying step... needs to be separated from the visualizing step.  I have a labeling tutorial to write, soon.  I need a scene to use... to demo many types of labels.  Some W.H.O. data would be a nice thing to graph (and do lots of labeling), but... HOW to query W.H.O. data from JS? 

http://www.babylonjs-playground.com/#1XBLWB#6

Line 54 - querying a map database (for pngs).  SO COOL!

For W.H.O. data, we would need WHAT returned?  NUMBERS?   Yeah.  How the heck?  JSON?  hmm.

Help/advice/demos welcome.  Thx!  Party on!

[Wingnut]

Hunh, I thought sure I could get nockawa to talk about borders with me.  hmm.

No real news from Wingyville.  I was sad to see the flame-throwers thread get closed.  I prefer "let it flow" free speech, instead of policing.  But, I don't call the shots in this "commune".

I sent email to the World Health Org today... asking their I.T. dept if anyone else was using their data (live-retrieved)... to do off-site graphing/visualization.  I told them of my intention - to use that data to do 3D viz (with our playground).    Goofy idea, huh?

Similar to other graphs/viz, we will want to see the change in a value... across time.  For example, percentage of world folks who have access to "advanced sanitation facilities" (toilets, toilet paper, soap, clean water, etc.)... during the last 30 years.  Perhaps, our (bar) graphs will be "drillable", too.  (click bar to learn more).

Sure, we could graph/viz ANY data, but... why not try to get some really important data... to use for our demos?  Will BJS and someone's playground... be the FIRST EVER 3D visualization of World Health Org statistics?  We could accidentally become (even MORE) famous! 

I bet "the query" is going to be a contorted form submission.... something like that.  I tend to doubt that we will be telnetting into their server and firing SQL commands.    It would be nice if the W.H.O. had a "Please come and get our data"-interface and policies.  I suggested THAT to them, too. 

Hopefully W.H.O. returns a JSON file to us, eh?  Then, onSuccess, we suck the values out of that file and scale some mesh with 'em!  yay!  (I know NOTHING about connecting to DB's) 

But the W.H.O. might just say "um, no." 

On another subject, thanks to umm... @Temechon and his Teme... for doing some stuff to our playground search... improvement attempts.  I just got 66052 returns when searching for 'engine'.  Interesting! 

I guess that means we currently have about 66000 playgrounds, huh?  Wowzers!  Cool.  Thanks T/others.  We may see less 1000-hit returns, now... but I'm not sure if that is good or bad.  Either way, thanks for working on it.

[Wingnut]

Hey @Pryme8 - if you want to help us find that darned impostor.physicsBody is null error in the physics plugin, I could use all the help I can get. 

Here's a basic physics playground from @Hans' series of experiments.

http://playground.babylonjs.com/#15AFCG#17

This is Cannon, and I have hijacked the Cannon plugin (JS version) into the playground.  The error is generated by line 41. 

No use of parenting/compounding in this playground.  (I once thought that the error was related-to parenting/compound impostors.  I was wrong.)

This is a simple scene (sort-of).  I am only impulsing the green box with the cursor keys (after clicking on canvas).

The FIRST time we RUN this, we get good console reports from cursor key handlers (lines 500-524) and impulsing of green box works fine.  No bitching from line 41.

The NEXT time we RUN it (NOT using F5)... impulsing still works fine, but line 41 becomes somehow unhappy.    Plus, I get extra console reports when re-RUN.  Maybe my scene.onDispose is not working, and I am stacking-up eventListeners.  Perhaps I forgot how to code.  heh

Okay, that's all I have learned, so far.  I will keep investigating.  It could be a Wingnut mistake.  I'm really good at making mistakes.    Advice welcome, from anyone.  Thx.

[Pryme8]

Yea I want to solve this let me make a PG that can demonstrate it l and we'll start from there?

 

I'm super busy today, but if I get a moment I'm on it.

[GameMonetize]

Here is a fix:

http://playground.babylonjs.com/#15AFCG#20 (line #527)

You used addEventListener with capture = true. For keyboard it has to be false or you won't be able to undo it