[SOLVED] Plain HTML and JavaScript in PlayCanvas?

I’m using HTML CSS project to test the waters, seems like JavaScript in script tags acts differently in PlayCanvas, upon button click new modal should appear like in this CodePen
But nothing happens in case of this scene
Any thoughts how to make it work? My guess that click detection isn’t working

Hi @Newbie_Coder,

No JavaScript should function the exact same way in PlayCanvas, since the browser is the one executing it in both cases.

Try sharing your editor project url so we can take a look at your code.

https://playcanvas.com/project/921156/overview/test

The code in html file is 1 to 1 compared to codepen

Well, that’s not plain HTML, that’s a full webpage with head and body elements plus JavaScript.

That can’t work just like that, a webpage can only have a single html/head and body elements.

Try cleaning up your code to work together with your PlayCanvas script that is calling it.

If you check the example project that you forked it only includes a div element in the .html file. That div element gets appended on top of the PlayCanvas webpage.

1 Like

Solved

    function loadScript(url) {
	return new Promise(function(resolve, reject) {
		let script = document.createElement('script');
		script.src = url;
		script.async = false;
		script.onload = function() {
			resolve(url);
		};
		script.onerror = function() {
			reject(url);
		};
		document.head.appendChild(script);
	});
}

let scripts = [
				'https://political-sweet-net.glitch.me/script.js'
			];

// save all Promises as array
let promises = [];
scripts.forEach(function(url) {
	promises.push(loadScript(url));
});

Promise.all(promises)
.then(function() {
	console.log('all scripts loaded');
}).catch(function(script) {
	console.log(script + ' failed to load');
});