Text as polygon mesh

[The Leftover]

Yeah, that playground was more for you.  The Type API doesn't take functions as parameters.  I recommend taking the five changed lines out of THIS playground and proceeding forward:  https://www.babylonjs-playground.com/#XWVXN9#42 

My first language without line numbers (lookin' at you Fortran) was Pascal.  Functions/Procedures should remain firmly blocked on the left side of the code and should run only when spoken to.  The approach of sprinkling functions willy-nilly in JavaScript struck me as unnecessary and confusing.  [My son called JavaScript the language of the devil.]  Then I started doing Facebook interfaces and gradually applied these things and became enamored with the power in them.

Anyway, this is really just a side conversation, driven by my use of jQuery to load an outside module (Babylon Type) after everything else is loaded.  Presumably we will find a better way.

[The Leftover]

It seems like we have enough symbols done in Helvetica to issue a PR for Babylon Type (as I am calling it).  https://www.babylonjs-playground.com/#XWVXN9#45

I probably need some coaching on conventions and maybe some mojo to issue a PR.  I was gonna create a branch and put it in a separate subdirectory of https://github.com/BabylonJS/Extensions, called 'Type'.  It was just going to be README and JavaScript.  Similar repository at:  https://github.com/briantbutton/BabylonType

The plan is to support Helvetica (aka Arial) initially.  Next, a Comic font.  After that, I disappear mysteriously.     (kidding!!)  

[Wingnut]

haha

Alright.  That's all good news.  No disappearing.  But I know you have main-line projects to tend-to.

And now I understand what the function-as-parameter thing was all about.  Damn, I'm slow.  You were showing me how to fix my initial letter-thickness problem.  I'll catch up, I promise.  (maybe).  Thanks for the help/hand-hold with that.

Really, the primary next step to powerful font-flying... is getting a good handle on SPS particle positioning/orienting.  And Jerome is definitely on-board for that... plus he is a big dog in path3D ops.  So, you can relax soon, and I'll start torturing @jerome  (he loves it).

Just now, I got my "physics chains" working again.

http://playground.babylonjs.com/#1KPF49#5

Faster, you say?  Ok:  http://playground.babylonjs.com/#1KPF49#6 

NOW we got some "on-a-rope" going, huh?  It is VERY unlikely that a SPS particle could be controlled by a physicsImpostor... but... what if?

Also, I'm trying a strange shader-based reflection texture...

https://www.babylonjs-playground.com/#XWVXN9#46

(original at http://www.babylonjs-playground.com/#1IZ4X0 )  (an old old shaderStore playground, from the 30's) 

I'm getting a this._emissiveTexture.isReadyOrNotBlocking is not a function error that I am battling.  WebGL2 headerLess something or another?  Yikes. 

[jerome]

RaananW and Adam did some PG with the SPS under a physics engine once (I don't know how such a tool works). Basically, they simply created an impostor for each solid particles, then let the engine set the position, rotation and velocity of each of them, as they would do with any other standard mesh, just before calling setParticles(). 

[Wingnut]

Yeah, some kind of position and rotation binding from physicsImpostor.physicsBody. position/quaternion... to the sps particle position and rotation... should do it.

Gruesome.  We can use the SPS particle-collision stuff that you invented... for SOME things, too.  https://www.babylonjs-playground.com/#CNMNR#1

Perhaps that's spheres only.  And, no links/joints, of course.

If each particle in the above PG... were a word... I bet we couldn't read any sentences.  Too fast 

It would be cool to make a standard sentence... follow a path3d similar to your rollercoaster, @jerome.

Man, there's some fun... laying around here.  Stuff to mess-with. 

[The Leftover]

Wingnut and Jerome, plus any others:

Survey question on Babylon Text.

Right now each letter mesh is relative to the "origin" as defined by the font.  See the red star.

Actually, it is relative to the "origin" of the first letter in the string.  So I am thinking of changing it so that each letter mesh is relative to its own origin.  The text string will not appear any different but people like Wingnut who wish to do special effects may find the meshes easier to manipulate.

The only other sensible option to consider is to define the mesh relative to the "center" of the letter.  This will take a bit longer and is not "text-like", although it might be similar to other particle types.  For example, the vertical origin will bounce up and down as a function of the height of the individual letters.

I am OK with either approach but do not plan on doing this twice.

Again, the generated string will look and behave the same as it does today.

[Wingnut]

http://playground.babylonjs.com/#1KPF49#11

Wingy gettin' ready to do something demented. 

letter.baseline = bottom, or center, or top. 

letter.kernline = left, or center, or right.  Yeah!

Let us set our own baseline and kernline.  Can do-skis?

Settable... on each letter of a text!  WOW!

Then, the point where the kernline meets the baseline... is the rotational pivot point of that letter's SPS shape.

That opens-up lots of "rocking/swinging the letter" options.

There could/should be a depthline, too... front, center, or back. 

Total... 27 potential pivot points.  (9 on the back, 9 in the thickness-center, and 9 in the front.)  WOWSERS, Penny!

Aw heck... CSS for 3D text?  Yeah... might as well shoot the moon.  heh

"Ohhh... I'll never swim Kern River... again."  - Merle Haggard

Update:  http://playground.babylonjs.com/#1KPF49#12   yay!
No rotations, yet.  Me thinks chain[0].physicsImpostor.physicsBody.quaternion (which is physicsBody rotation prop for Oimo) ...is a Quaternion (duh), and sps.getParticles()[0].rotation needs a Euler.  I'm scared. 

More update:  http://playground.babylonjs.com/#1KPF49#13  Lines 191-197... sps particles handle .rotationQuaternion values... just fine.  YAY!  Miller Time!

If any of these PG's fail, just hit RUN again... should be fine.  Surely bad Wingnut coding.  Puppies with power tools, ya know? 

[Wingnut]

http://playground.babylonjs.com/#1KPF49#15

There's NOT a perfect pos/orient sync-up between the impostors and the SPS particle fonts.  Strange.  *scratch scratch*

The "BABYLON" seems to lower its position during forward swings, and stretch the verti-kerning.  The chain "beads" seem to leave the fonts behind, sometimes.  (esp during violent swings)

In http://playground.babylonjs.com/#1KPF49#14 ... activating lines 191-197 does SOMETHING, but still does not allow left/right swinging. But it DOES appear to make forward/backward swinging... more "fluid" somehow.

In lines 221-233... I try to physics-spin each letter around its Y axis (after 15 seconds)... and that's not working, either.  It MIGHT involve my rotation of the tmesh in line 89 (makes text aim-towards the z-looking cam).

Activate the bake in line 91, and stuff REALLY goes to hell.    Fun!  Activate some visibility in line 258... to see the hidden chain beads/spheres.

Line 267 shows that I have used boxImpostors... with sphere mesh.  Maybe that is weird/stupid.  Haven't tried sphereImpostors yet.

Lines 275-278 shows that I have used the easy-connector setPhysicsLinkWith() func... to do the physicsJoint generating.  MAYBE... this makes a certain kind of hinge joint.

Perhaps I should use "manual joint connecting"... seen in disabled lines 351-365. 

Lots to learn, but I am seeing good progress, so far.  Too fun!   My dog is smiling, too.

[The Leftover]

10 hours ago, Wingnut said:

CSS for 3D text?

This is why nobody wants to ask for customer input.      ?

Moving right along . . . I am speechless. 

[Guest]

I may have a few users interested to use it but we need to move it to extensions and add a bit of doc on doc.babylonjs,com

[The Leftover]

Deltakosh, I am up for that.  What is the next step?  I don't seem to have authorization to make a branch or push on the Extensions repo.  See my note.

On 6/3/2018 at 8:47 PM, The Leftover said:

I probably need some coaching on conventions and maybe some mojo to issue a PR.  I was gonna create a branch and put it in a separate subdirectory of https://github.com/BabylonJS/Extensions, called 'Type'.  It was just going to be README and JavaScript.  Similar repository at:  https://github.com/briantbutton/BabylonType

[Guest]

You are now admin of Extensions repo

For doc the process for a PR is straightforward (I hope :))

[Wingnut]

Keep in mind...TL... you are allowed to finish initial dev, first.  Otherwise, you'll be editing the docs every 2 days and backwards-compat will haunt you.  No reason to start "wrapping this up" in any kind of packaging, yet.  Too much idea-bubbling/brainstorming... still happening, in my opinion. 

If anything, publish a "core" textMesh, and semi-freeze THAT, and doc it.  Then we demented experimenters will work on a higher layer... a user API layer... very fluid and no docs yet.  For me, I couldn't start to explain what I have done, so far, because I don't even know what I've done.  :)

Keep it in alpha stage for 2-3 years, so when you make a breaking change, you can direct/refer all the whiners whose projects broke... to the alpha label, and blow them off.

And you're going to need an agent/manager, too, to help with the super-stardom and with booking the lecture tour.

Then you'll need your "ping helmet", cuz you'll be chief custodian of the meshText system, and most forum helpers will ping-delegate meshText issues... to you.  Feel the love.  hah

And leather pants cuffs... for when the puppies (noobs) start tugging on your pants legs, and leave you soaked in puppy slobber (spit).  (like I do to you) 

(They usually want feature additions, or help with the 2500 hours of textMesh work for their BJS project.)

Are you ready for all this lovin'?    Ready for TypeScript?  Aren't I a good BJS extension development promoter?  heh

I'm just havin' fun, as usual... even though everything I said... is apropos.

[Guest]

extensions do not have the same constraints (not even forced to do TS)

[Wingnut]

Yeah, I guess you're right... but... Lefty... check out DK's pants cuffs!  Ever seen anything more puppy-chewed in your entire life?  Even the sneakers, socks, and leg hairs are gone!

Deltakosh is a super-star...  a puppy magnet... and he gets all the girls, too.  I think he enjoys being a super-star.  How weird is that? 

(silence)

Tough room.  Difficult to get laughs in this thread. 

[The Leftover]

Ha ha haha!!!

Well, I do step away from the computer from time to time.  I just finished a hike in the hills (you would call them mountains).  Stand by for possible rejoinders after dinner.  Or maybe tomorrow after coffee . . . 

[The Leftover]

Wingnut, I do humor on Internet (because I cannot resist) but I miss a *lot*.  Or that is what I suspect.  Hard to know for sure.  It's a tough medium for humor and, separately, for humorists.  There are not many cues going either direction.

 

[Wingnut]

Absolutely correct.  Without physical clues/expressionism... it's rough water.  I appreciate the thoughts/consids.  Also, you probably don't know about Deltakosh, long-ago, referring to noobs... as "puppies".  He and I have been doing "puppy jokes" and fun... ever since.  Of course, he has experienced puppy attacks FAR MORE than I... so... every time he sees me under attack from puppies, he likes to chuckle at me, and offers to sell me a 4 oz spray can of puppy repellent... for $3500.  heh  (not really, of course).

Sometimes... we have children visiting.  And sometimes... they cannot read English very well, so the docs are somewhat isolated from them.  And, they haven't yet learned to do playground searches, and/or are SO NEW to 3D, that they haven't yet learned what terms to search for.  They are somewhat boxed-out.  That's when Wingy needs to muster every ounce of patience and teaching (smoke a pile of skunk bud)... and use mental telepathy to cause the puppy to think like a bigger dog.  heh. 

Playground-based tutorials are the answer to box-outs... but... I have not been able to pursue them much, yet, because... I go fishing too often.    (actually, I get distracted by cool new toys that BJS people invent, and I get lost in their fun, like what has happened to me with meshText).

It's all good.  I love it here, I love the people, I love BJS, I love the inventions people create.  BJS and its forum/people might be the #5 most-enjoyable thing in my life, just behind eating, sleeping, fishing, and... umm... another thing. 

Speaking of playing with toys... http://playground.babylonjs.com/#1KPF49#19

Not a damned thing new in that PG.  Actually, lots new, but... nothing conclusive.  I changed to manual joint-adding... no more setLinkMeshWith() calls, and I changed to a Oimo Ball (and socket) joint.  But I still can't seem to get any left/right swinging... to happen.  The chain DOES left-right swing... a little bit... just after RUN.  But... hmm.  The chain always results in Z-swing (around X axis).  The chain SHOULD be just as likely to result in a left-right swing... as in a forward/backward swing.  *scratch scratch*

Maybe physics god @RaananW will visit and teach me how to properly yank my chain.  I also tried an Oimo Wheel joint... (same as a Cannon Hinge2 joint)... but that made everything disappear and no error at console.  Hinge2 (two stacked hinges with different axes), when configged correctly,  SHOULD be the same as a ball & socket.  All in all, I'm working to get equal rights for left/right swinging. 

Also, I am experimenting with lines 145-150... which is the every-frame "copying" of each chain-bead impostor pos/rot... to the sps particle (the letter) pos/rot.  To get these orientations "squared up"... I tried rotating EACH particle... to face the camera.  In earlier versions, I rotated the main SPS mesh (and then played with baking it there, or not).  In earlier versions, I had to bind impostor.position.x with -particle.position.z, etc... cross-mapping the axes values.  erf.  I am trying to make the text and the impostors... square-up and get sane.  Not doing so well, so far.  SO, battles on 2-fronts.

I have a tendency to treat SPS particles as if they were full-power BJS mesh nodes, and they are not so.  It seems... that the Writer core-layer... is going to need writeVertical and writeHorizontal power... and maybe faceWhichDirection (probably an SPS adjustment).

Sorry for the long-winded post.  Lots happening... but... it might be time to go fishing.  The temps and winds and sun levels... have been SO GOOD this spring, here, so far.  I find it difficult to stay in front of my puter. 

[Wingnut]

Ok, http://playground.babylonjs.com/#1KPF49#21

We got some left/right swing... on the orange balls.  They use a ballJoint called "beadjoint"... lines 154-168.  Workin' ok, though they seem stiff.

The ball link/joint between the purple box, and the top bead...is failing left/right swing.  Joint1 code at lines 243-257.   This ball joint is a longer one... 10 worldUnit Y-axis gap... but that should not prevent it from swinging left/right.  hmm.  Still thinkin'/testin'.  (yawn)  It appears to be resistant-to swinging forward/backward, too... almost as-if it were a lockJoint.  hmm.

For those wanting to experiment with "the binding" (connecting beads to text chars)... just activate lines 351/352/353 for position binding, and 354 for rotationQuaternion binding.  None of that stuff is acting as expected, yet.  Experimenters... expect brain tumors. 

The problem... Wingnut is still treating SPS as real meshNodes (or some other obvious mistake).  When I rotate each particle/char to face the z-looking camera instead of facing the sky (line 95)... something goes to hell. 

Only JohnK and a few others... understand rotations.  People like me... just try stuff until it works.  It feels like I need a particle.bakeCurrentTransformIntoVertices(), [after the rotation]... but we all know that sps particles have no bakery goods.  

I need to learn matrix transforms... someday.  I think it relates to "orthographic projection", but... somehow... I get "orthopedic projection" instead, and my bones get stuck to the walls of my computer room.     (Was that joke-line too long?  Too non-funny?)

With GUI textInput and new GUI grid... I think we can view/edit matrices... on-screen, real-time... a potential high-learning environment for matrices.

[Wingnut]

update:  http://playground.babylonjs.com/#1KPF49#24   (might need to click RUN after load finishes)

A bit better left/right swing on green beads/chain.  Yay!

Joint1 (lines 257-269) is still failing to swing (between purple box and top chain-bead).  It's acting like a lockJoint, or even LESS flexible than a lockJoint.  Weird.  Still studying. 

Experimented with matrix transform in lines 103-107... to see if I could avoid using line 101 particle.rotation (to make letters face camera).  Failed.  Don't know what I am doing.

What's the problem with the way I am currently rotating them, you ask?   Line 397 in the impostor-to-letter pos/rot "binding" code.  Activate that line... for a good laugh.    Even if I DO get the impostor rots correctly "bound" to the letter shapes, I think we would quickly learn that... the chain beads never rotate around their Y axis.

I'm not sure that we want Y-axis rotation from the physics engine.  That could cause letters to become backwards, or unreadable because they are edge-to-the-camera.  it is better to animate the Y-axis of the letters... with renderLoop or animation code.  More control.

Real-life ball & socket joints CAN allow Y-axis spin, but Oimo ballJoints are two-axis, it appears.  They cannot rotate around the Y-axes, as I currently am using them.  They are an "r2"-type joint.  I think there IS an "r3" Oimo joint, or an r2 can be hacked into an r3, but sometimes it is easier to add one more hingeJoint and a tiny invisible mesh... onto the end of each ballJoint.  We will wait with that... and currently require programmers/artists to rock/spin the letter Y-axis... with standard animation.

Even if we drag our physics-active chain-o-sentence... across a bumpy physics-active heightMap terrain, we don't want the mesh to "tip over" and lay face-down or back-down in the dirt.  The AMOUNT-of, and TYPE-of rotation we allow for our letter shapes... will always be very limited, or none at all, I predict.  Physics-driven rotations are unpredictable.  Animation-driven rotations... will keep the letters standing upright after slamming into mountains and other unsuspecting onlooker mesh.

I don't want to stop the "Sentence Train" because a letter or word has tipped-over and derailed. 

Lastly, in the PG, initial letter-positioner in line 99... has been disabled.  It is replaced with (i*-2.05) in line 391... which x-shifts each letter leftward.  Tough goin', but still fun.

[The Leftover]

Holeee Sheeeit!

May I suggest you switch from type.min.js to meshwriter.min.js?

This is the newer version and, as promised, each individual letter origin is the calculated letter-center.
http://playground.babylonjs.com/#1KPF49#26

 

[Wingnut]

Very good, thanks.  Still learning.  http://playground.babylonjs.com/#1KPF49#27

No getLetterCenter() calls anymore (lines 108-110)... and no sps pivots-setting.  BUT... each spsParticle is still pivoting on its front face, so no thickness is being considered (understandable).  I simply adjust the bead size precisely for the letter height and vertical kern (which I also set with line 114).  The letter positions/origins are bound to the beads, for me.... so the bead positions are the boss of the letter positions.

Testing a little wave-animating and specular shine... in another PG #28.  Not quite the same light flashes as sweet retina-scorching godrays, but we'll get there. 

Are you 'bout tired of me flooding your thread with yapping, yet, Lefty?

I tried to adjust the not-thickness-centered particle pivot-point...  by setting line 110 in this PG #29, but that has a nice, but unwanted effect. 

Keep in mind that these sps particles/letters were flat on their backs, on the ground (by default).  I needed to rotate each of them... to face the camera. 

I chose to adjust the Y-axis pivot in line 110 (#29 PG), because THAT is the thickness-centering WHEN the sps particle is laying on a ground. 

I chose incorrectly.  Currently, I cannot find a way to "sink" the thickness-depth of the particle pivot-point... further into the letter shape.  Still studying... I need to read SPS docs more.

[Wingnut]

http://playground.babylonjs.com/#1KPF49#35

Early work with the CannonJS heightMap physics... dragging a sentence across a bumpy terrain. 

Cannon is fighting me all the way.  Lots of SHAPE IS UNDEFINED errors when I try to get the chain linked together (in makeChain func).

Also...  babylon.js:4:11308
BJS - [17:42:03]: Physics not enabled. Please use scene.enablePhysics(...) before creating impostors. babylon.js:4:11308
BJS - [17:42:04]: Physics not enabled. Please use scene.enablePhysics(...) before creating impostors. babylon.js:4:11308
etc... constantly being printed to my console... until I save, then do fresh reload of scene.  REAL frustrating.

https://www.babylonjs-playground.com/#1RKZXB#83

That is the merged-in Cannon physics heightMap.

I can't remember if Oimo does heightMap physics.  I should check, cuzzz... Cannon is giving me a tumor.... trying to joint-up the bead chain.

I can't wait to see some sentence trains... pulling words and phrases up through the mountains... belching steam... watching the back-half of a sentence... derail and tumble down a steep slope.   FUN!  And, of course, sentence trains are subject to gruesome cannonball attacks from we demented folk.  POOM - dangling participle.    But these letter-couplers are, so far, unbreakable.  Will the word-couplers ALSO be unbreakable? 

How 'bout the sentence couplers?   That's right, there's such a thing as "paragraph trains"... and page trains, and document trains.  WOW!  Sometimes it takes 5 locomotives to pull a document train through the mountain pass.  Need good kern brakes for descending the slopes on the other side, too.  Text librarians with steady hands and nerves of steel. 

[Wingnut]

Update:  http://playground.babylonjs.com/#1KPF49#39   (as always, ya might need to click RUN, after loading.)

Basic word train, dragged by helicopter... headed across a CannonJS heightMap.  YAY! 

SHAPE IS UNDEFINED errors were caused by Wingnut using BABYLON.PhysicsEngine.SphereImpostor.  Should be BABYLON.PhysicsImpostor.SphereImpostor.

Oimo thought it was okay to do that.  Cannon said "Hey, cut it out!" 

Lines 202/203 and lines 288/289, I am experimenting with making SOME of these axes... be negative.  Cannon seems to like ONE of them... either the mainAxis or the connectedAxis... being negative.  Still experimenting/learning.  As you can tell, things aren't really "hanging" correctly, and this train ride is a rather violent and unpredictable thing. 

I'm using all HingeJoints, as Cannon has no BallJoints.  Probably should be using Hinge2Joints... not sure yet.

Green beads are set .viz .2, but seem to disappear soon-after scene start.  Not sure why.

Joint1 is working now, somewhat (between purple box and top chain bead).  It seemed to enjoy line 289 connectedAxis... being negative.  Go fig.

[The Leftover]

Train?  I was thinking of maybe a segmented worm having convulsions.  (Or maybe a clump of balloons with excessively high static charge.)  You gotta admit the basic framework is some creepy alien planet.  I am going with the worm . . . 

This week, I should figure out how to create documentation for MeshWriter (the final name).  I may want to tap you for a simple sweet playground showing a conceivably useful application.  (My only application, until yesterday was labeling pieces of real-estate.)