Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

X_ITE fails to load additional modules from my local server when loaded as ES6 module #147

Closed
gwhitney opened this issue Aug 30, 2023 · 6 comments
Labels
confirmed The issue can be reproduced enhancement New feature or request fixed The issue is already fixed

Comments

@gwhitney
Copy link
Contributor

I am attempting to try out x_ite with some simple files on my local (http://127.0.0.1/) server. I have a webpage with exactly one <a> link to a WRL97 file; the file is also hosted on the local server. My webpage also has a
<script src="js/giveAwrl.js" type="module"></script> tag, and the contents of that giveAwrl.js JavaScript module are

import "https://code.jquery.com/jquery-3.7.1.js"
import "https://create3000.github.io/code/x_ite/latest/x_ite.js"

const canvas = X3D.createBrowser()
const site = $('a[href^="http"]')
canvas.setAttribute('src', site.attr('href'))
site.after(canvas)

(I am just trying to insert an in-line viewer right after the link.)

However, the above code fails when I load the page, with the following errors:

🚫 GET http://127.0.0.1:8080/assets/components/Scripting.js
🚫 GET http://127.0.0.1:8080/assets/components/Text.js

Naturally, I don't have these two JavaScript files on my server, and I don't understand why x_ite is looking for them locally rather than back at create3000.github.io. Sorry if this is an uninformed question, but was there some X3D call I was supposed to make to tell it where to get its submodules? Thanks for any guidance.

@create3000 create3000 added the confirmed The issue can be reproduced label Aug 30, 2023
@gwhitney
Copy link
Contributor Author

I have found a workaround that leads to my .wrl file displaying correctly:

import "https://code.jquery.com/jquery-3.7.1.js"

jQuery.getScript('https://create3000.github.io/code/x_ite/latest/x_ite.js', () => {
   const canvas = X3D.createBrowser()
   const site = $('a[href^="http"]')
   canvas.setAttribute('src', site.attr('href'))
   return site.after(canvas)
})

but still it would be ideal if x_ite.js did not become confused about the location of its assets when it is (es6) imported. Thanks for confirming the issue and any future progress you make on resolving it.

@create3000
Copy link
Owner

Unfortunately X_ITE is not yet made to be loaded via ES6 import statement, so as a module. The recommended way to include it is via the script element and that is also, I believe, what jQuery does.

<script src="https://create3000.github.io/code/x_ite/latest/x_ite.min.js"></script>

@create3000 create3000 added the enhancement New feature or request label Aug 31, 2023
@create3000 create3000 changed the title x_ite fails attempting to load additional modules from my local server X_ITE fails to load additional modules from my local server when loaded as ES6 module Aug 31, 2023
@create3000 create3000 added the fixed The issue is already fixed label Aug 31, 2023
@create3000
Copy link
Owner

create3000 commented Aug 31, 2023

With new version, probably released on Sunday, this will be possible:

import "https://code.jquery.com/jquery-3.7.1.js";
import X3D from "https://create3000.github.io/code/x_ite/latest/x_ite.mjs";

const
   canvas  = X3D .createBrowser (),
   browser = canvas .browser;

$("body")
   .append (canvas)
   .append ($("<p></p>") .text ("X_ITE loaded as JavaScript module."));

browser .loadURL (new X3D .MFString ("https://create3000.github.io/media/examples/Geometry2D/Disk2D/Disk2D.x3d"));

Please note: the extension of the imported x_ite file is .mjs.

@gwhitney
Copy link
Contributor Author

Terrific, looking forward to it, thanks.

@create3000
Copy link
Owner

Have right now released a new version 8.12.0 with ES module support.

@gwhitney
Copy link
Contributor Author

gwhitney commented Sep 5, 2023

Works for me :)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
confirmed The issue can be reproduced enhancement New feature or request fixed The issue is already fixed
Projects
None yet
Development

No branches or pull requests

2 participants