[x3d-public] Cobweb_dom...Script Magic? LoadingDOMsubscenesafterparentinX3DOMand Cobweb.
Andreas Plesch
andreasplesch at gmail.com
Sun May 21 10:14:36 PDT 2017
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
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://web3d.org/pipermail/x3d-public_web3d.org/attachments/20170521/f4b45e54/attachment-0001.html>
More information about the x3d-public
mailing list