[x3d-public] Cobweb_dom...Script Magic?LoadingDOMsubscenesafterparentinX3DOMand Cobweb.

Andreas Plesch andreasplesch at gmail.com
Sun May 21 16:36:56 PDT 2017


On Sun, May 21, 2017 at 6:32 PM, John Carlson <yottzumm at gmail.com> wrote:

> Yes, that’s what I’ve done.
>
>
>
> See:
>
> https://coderextreme.net/X3DJSONLD/src/main/html/flipper2.html
>
> https://coderextreme.net/X3DJSONLD/src/main/html/prototypes2.html
>
>
>
> Only problem is, I’m loading the scene twice.
>
>
Ah, nice. Do you need the first

loadCobwebJS(json, 0) ?


>
> I’m thinking of writing a  two way channel so the JSON can notified of DOM
> events, and the DOM can get updated from JSON events.  Or two routes.  The
> channel serves as  two queues.  Anyone know something like this?
>
>
Not sure if there are JSON events. There might be a js library which
mirrors a DOM in a json object, and vice versa.
https://www.npmjs.com/package/domjson does some of it.


>
>
> Also here are two pure JSON and pure XML examples from Cobweb, for your
> comparison.  If you have write privileges to the cobweb master, Andreas,
> you might want to consider integrating my changes.
>

I pulled your latest cobweb master branch into a branch of my own cobweb
fork.


> You can now specify X3D JSON files as URLs in Cobweb (BIG ADVANCE!)
>

Looks good.

-Andreas



> *From: *Andreas Plesch <andreasplesch at gmail.com>
> *Sent: *Sunday, May 21, 2017 1:14 PM
> *To: *John Carlson <yottzumm at gmail.com>
> *Cc: *Leonard Daly <Leonard.Daly at realism.com>; X3D Graphics public
> mailing list <x3d-public at web3d.org>; x3dom-users at lists.sourceforge.net
> *Subject: *RE: Cobweb_dom...Script Magic?LoadingDOMsubscenesafterparentinX3DOMand
> Cobweb.
>
>
>
> On May 21, 2017 12:26 PM, "John Carlson" <yottzumm at gmail.com> wrote:
>
> Okay, I don’t have mutation observers yet.  I though I would share working
> pages that don’t meet the goals yet.
>
> Ok. The question was if using mutation observers would help in achieving a
> sequenced loading of first a main scene and then (JSON encoded) content as
> children of a (global) group. I think they might.
>
>
>
> Here is another thought. Why not first assemble a complete scene in JSON,
> or more precisely as the javascript object derived from the JSON ? Rather
> than assemble in the DOM ? It should be easy to add children to a JSON
> object ?
>
>
>
> One of the advantages of having a JSON encoding is that as a native
> javascript object it will be easy to manipulate (and then load into the
> DOM, and then as x3d nodes)
>
>
>
> Andreas
>
>  is the X3D JSON PROTO expander in action folks. The first page
> incorporates a proto expanded box scene placed over a flipper scene, in
> both Cobweb and X3DOM
>
>
>
> https://coderextreme.net/X3DJSONLD/src/main/html/flipper.html
>
>
>
> The second shows two combined proto expanded scenes, one with proto
> expanded VRMLscripts
>
> https://coderextreme.net/X3DJSONLD/src/main/html/prototypes.html both in
> Cobweb and X3DOM.
>
> The source X3D JSON sitting on the file system has PROTOs, please
> confirm.  You may need to press the reload X3DOM button.
>
>
>
> https://coderextreme.net/X3DJSONLD/src/main/data/abox.json
>
> https://coderextreme.net/X3DJSONLD/src/main/data/asmallbox.json
>
> https://coderextreme.net/X3DJSONLD/src/main/data/cobweb.json
>
>
>
> You can try these files and others in the X3D JSON Loader (X3DJSONLD):
>
>
>
> https://coderextreme.net/X3DJSONLD/
>
>
>
> ExternProtos do not work on coderextreme.net, and my server is currently
> in shreds when converting files in /c/x3d-code/www.web3d.org, but I think
> I almost have extern proto expander working on the client.  More to follow,
> just wanted to share some results.
>
>
>
> Plus I am starting to move towards a more standard way of programming
> JavaScript.
>
>
>
> John
>
>
>
>
>
> Sent from Mail <https://go.microsoft.com/fwlink/?LinkId=550986> for
> Windows 10
>
>
>
> *From: *Andreas Plesch <andreasplesch at gmail.com>
> *Sent: *Sunday, May 21, 2017 7:29 AM
> *To: *John Carlson <yottzumm at gmail.com>
> *Subject: *RE: Cobweb_dom...Script Magic? Loading
> DOMsubscenesafterparentinX3DOMand Cobweb.
>
>
>
> That's because I mentioned observers which are more efficient than the
> mutation events. Leonard provided the link to the mdn documentation and
> here is where I install them in cobweb_dom:
>
>
>
> https://github.com/andreasplesch/cobweb_dom/blob/
> master/cobweb/cobweb_dom.js#L79
>
>
>
> Andreas
>
>
>
> On May 20, 2017 11:44 PM, "John Carlson" <yottzumm at gmail.com> wrote:
>
> https://github.com/search?utf8=%E2%9C%93&q=DOMNodeInserted+user%
> 3Aandreasplesch+extension%3Ajs&type=Code&ref=advsearch&l=&l=
>
>
>
> Returns nothing.
>
>
>
> Sent from Mail <https://go.microsoft.com/fwlink/?LinkId=550986> for
> Windows 10
>
>
>
> *From: *John Carlson <yottzumm at gmail.com>
> *Sent: *Saturday, May 20, 2017 11:43 PM
> *To: *Andreas Plesch <andreasplesch at gmail.com>
> *Cc: *x3dom mlist <x3dom-users at lists.sourceforge.net>; X3D Graphics
> public mailing list <x3d-public at web3d.org>; holger.seelig at yahoo.de
> *Subject: *RE: Cobweb_dom...Script Magic? Loading
> DOMsubscenesafterparentinX3DOM and Cobweb.
>
>
>
> And I guess this would only work where there’s a single tag like Scene,
> unless you disabled the event after the if clause.
>
>
>
> Can you give me a link to where your code does DOMNodeInserted.
>
>
>
> John
>
>
>
> Sent from Mail <https://go.microsoft.com/fwlink/?LinkId=550986> for
> Windows 10
>
>
>
> *From: *John Carlson <yottzumm at gmail.com>
> *Sent: *Saturday, May 20, 2017 11:33 PM
> *To: *Andreas Plesch <andreasplesch at gmail.com>
> *Cc: *x3dom mlist <x3dom-users at lists.sourceforge.net>; X3D Graphics
> public mailing list <x3d-public at web3d.org>; holger.seelig at yahoo.de
> *Subject: *RE: Cobweb_dom...Script Magic? Loading DOM
> subscenesafterparentinX3DOM and Cobweb.
>
>
>
> Yes, but if I put that (what is it?) on my top level object, will I get a
> ton of events?  How would I observe when my  Scene node, for example, is
> added to my DOM?  Or my 200th Group node?
>
>
>
> I’m  assuming I do something like:
>
>
>
> $(document).on('DOMNodeInserted', function(e) {
>
>     if ($(e.target) == document.querySelector(“Scene”)) {
>
>                     /* add child scene graph */;
>
>     }
>
> });
>
>
>
> Is this possible?  Can I query in the event?
>
>
>
> Thanks,
>
>
>
> John
>
>
>
> Sent from Mail <https://go.microsoft.com/fwlink/?LinkId=550986> for
> Windows 10
>
>
>
> *From: *Andreas Plesch <andreasplesch at gmail.com>
> *Sent: *Saturday, May 20, 2017 11:21 PM
> *To: *John Carlson <yottzumm at gmail.com>
> *Cc: *x3dom mlist <x3dom-users at lists.sourceforge.net>; X3D Graphics
> public mailing list <x3d-public at web3d.org>; holger.seelig at yahoo.de
> *Subject: *RE: Cobweb_dom...Script Magic? Loading DOM subscenes
> afterparentinX3DOM and Cobweb.
>
>
>
> There are observers which can observe mutations to an element including
> the addition of child elements.
>
>
>
> This is what I use for cobweb_dom.
>
>
>
> Andreas
>
>
>
> On May 20, 2017 8:54 PM, "John Carlson" <yottzumm at gmail.com> wrote:
>
> Ideally, I’d like to specify a CSS querySelector and get an event if an
> element a querySelector refers to is loaded into DOM.
>
>
>
> Yeah, I can use a timeout or interval timer.  Sucks!
>
>
>
> Is there an
>
>
>
> Element.addEventQuerySelector() call?  It should be added!
>
>
>
> Thanks,
>
>
> John
>
>
>
> Sent from Mail <https://go.microsoft.com/fwlink/?LinkId=550986> for
> Windows 10
>
>
>
> *From: *John Carlson <yottzumm at gmail.com>
> *Sent: *Saturday, May 20, 2017 8:46 PM
> *To: *Andreas Plesch <andreasplesch at gmail.com>
> *Cc: *holger.seelig at yahoo.de; X3D Graphics public mailing list
> <x3d-public at web3d.org>; x3dom-users at lists.sourceforge.net
> *Subject: *RE: Cobweb_dom...Script Magic? Loading DOM subscenes after
> parentinX3DOM and Cobweb.
>
>
>
> I would like to separate the main scene loading from the sub scene
> loading, so I can load many, many subscenes, plus it will make coding
> easier.
>
>
>
> I am almost able to do that, but I am not sure when the Scene object loads
> in the main scene.
>
>
>
> What wasn’t working before was that the child scene was added before it
> displayed in Cobweb.  That has been fixed now.
>
>
>
> It’s an Inline, but not in typical X3D parlance.  It’s a DOM object added
> afterwards, by using a selector on the DOM.
>
>
>
> I can expand prototypes inline, as the example now shows.  That’s not a
> problem, really.  I just want to make a way NOT to expand PROTOs for Cobweb.
>
>
>
> Yes, I am loading X3DJSON into Cobweb AND X3DOM, using the same DOM tree
> (probably not a good idea).
>
>
>
> Yes, I am interested in your DOM event which is dispatched when a Scene is
> fully loaded.  Could you go and check?  Thanks!
>
>
>
> John
>
>
>
> Sent from Mail <https://go.microsoft.com/fwlink/?LinkId=550986> for
> Windows 10
>
>
>
> *From: *Andreas Plesch <andreasplesch at gmail.com>
> *Sent: *Saturday, May 20, 2017 8:21 PM
> *To: *John Carlson <yottzumm at gmail.com>
> *Cc: *holger.seelig at yahoo.de; X3D Graphics public mailing list
> <x3d-public at web3d.org>; x3dom-users at lists.sourceforge.net
> *Subject: *Re: Cobweb_dom...Script Magic? Loading DOM subscenes after
> parent inX3DOM and Cobweb.
>
>
>
> Hi John,
>
>
>
> it is difficult for me to see what is not working, in the example. It
> looks like it is working but only by using callbacks in custom methods and
> you would rather use Promises in reusable fashion ?
>
>
>
> By child DOM scenegraph, do you mean a scene which is added as an Inline
> to another (parent) scene ? Hm. it looks more like an appended Transform
> group which would be quite different.
>
>
>
> I think for cobweb_dom I added a dom event which is dispatched when an
> Inline or Scene is fully loaded but I would have to go back and check.
> Events would be another way to guarantee a sequence of loading.
>
>
>
> jquery xhr and regular xhr have mechanisms to allow acting on when a
> request is fulfilled (which is I think what you are using).
>
>
>
> It may be necessary to come up with a minimal, non-working example which
> shows the issue. Is dealing with expanding prototypes related to sequencing
> ?
>
>
>
> I think you are also trying to show how to load json encoded x3d with
> x3dom and cobweb ?
>
>
>
> Sorry to be of no more constructive help, eg. asking all the returned
> questions,
>
>
>
> Andreas
>
>
>
>
>
> On Sat, May 20, 2017 at 5:23 PM, John Carlson <yottzumm at gmail.com> wrote:
>
> Cobweb_dom, X3DOM experts, I need some help adding a child DOM scenegraph
> with prototypes to a parent DOM scenegraph after the primary scene has
> been  loaded, and not before. I have an example of loading before the scene
> is loaded, and in a callback.  If you have an example with Promises instead
> of callback nesting, that would be more ideal, the second $.getJSON()
> (child scenegraph) might finish before the first $.getJSON() (parent
> scenegraph) if I don’t use promises or callback nesting. Also, Promises
> would allow me to separate the parent loading somewhat from the child
> loading, and create separate functions.  Also, X3DOM experts can provide an
> example with Promises as well.  Meanwhile, I will be reading about Promises.
>
>
>
> Here is my example so far:
>
> https://github.com/coderextreme/X3DJSONLD/blob/
> master/src/main/html/flipper.html
>
> Viewable here:
>
> https://coderextreme.net/X3DJSONLD/src/main/html/flipper.html
>
>
>
> The white Box is the subscene of the dolphin scene.
>
>
>
> The following related code is from https://github.com/
> coderextreme/X3DJSONLD/blob/master/src/main/node/loaderJQuery.js
>
> and references code from:
>
>
>
> https://github.com/coderextreme/X3DJSONLD/blob/master/src/main/node/
> X3DJSONLD.js
>
> [ actually, I think the last two reference each other – naughty ]
>
>
>
> Data is here:
>
> [ child scenegraph ]
>
> https://github.com/coderextreme/X3DJSONLD/blob/
> master/src/main/data/abox.json
>
>
>
> [ parent scenegraph ]
>
> https://github.com/coderextreme/X3DJSONLD/blob/master/src/main/data/flipp.
> json
>
>
>
>
>
> Cobweb doesn’t need the prototypeExpander or the flattener (well, it might
> have with prototypes in cobweb_dom, but I think the last release fixed
> that…haven’t checked—here is a good test for you!).  This is a dual
> example, and I haven’t figured out how to conditionally run the
> prototypeExpander on only X3DOM code.  Please test without the
> PrototypeExpander.js and Flattener.js included, and remove X3DOM, since it
> won’t work in that case.  X3DOM folks can include the two JavaScript files
> which are here:
>
>
>
> https://github.com/coderextreme/X3DJSONLD/blob/master/src/main/node/
> PrototypeExpander.js
>
> https://github.com/coderextreme/X3DJSONLD/blob/master/src/main/node/
> Flattener.js
>
>
>
>
>
> You may provide your own appendInline (below) which doesn’t call
> loadSchema.  That may be too complex of a download.  That is, you probably
> don’t want to do all that JSON schema validation in your example.  Try to
> keep my code close to what it is otherwise.
>
>
>
> And if you start supporting X3D JSON in your viewers, that would be even
> better!
>
>
>
> John
>
>
>
> /**
>
> ·         Next is passed the element parameter
>
> ·         */
>
> function appendInline(element, url, next) {
>
>         $.getJSON(url, function(json) {
>
>                 if (typeof prototypeExpander === 'function') {
>
>                         json = prototypeExpander(url, json, "");
>
>                 } else {
>
>                         console.error("Perhaps you need to include the
> PrototypeExpander.js?");
>
>                 }
>
>                 if (typeof flattener === 'function') {
>
>                         json = flattener(json);
>
>                 } else {
>
>                         console.error("Perhaps you need to include the
> Flattener.js?");
>
>                 }
>
>                 // must validate here because we call an inner method.
>
>                 loadSchema(json, url, doValidate, function() {
>
>                         ConvertToX3DOM(json["X3D"]["Scene"], "Scene",
> element, url);
>
>                         next(element);
>
>                 }, function(e) {
>
>                         console.error(e);
>
>                 });
>
>         }).fail(function(jqXHR, textStatus, errorThrown) { alert('getJSON
> request failed! ' + textStatus + ' ' + errorThrown); });
>
> }
>
>
>
> /**
>
> ·         Next is passed the selected element from selector
>
> ·         Selector is the CSS selector to append inline to.
>
> ·         */
>
> function loadSubscene(selector, url, next) {
>
>         appendInline(document.querySelector(selector), url, next);
>
> }
>
>
>
>
>
> --
>
> Andreas Plesch
> 39 Barbara Rd.
> Waltham, MA 02453
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>
>



-- 
Andreas Plesch
39 Barbara Rd.
Waltham, MA 02453
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://web3d.org/pipermail/x3d-public_web3d.org/attachments/20170521/04fd24af/attachment-0001.html>


More information about the x3d-public mailing list