<!DOCTYPE html>
<html>
<html>
<head>
<meta charset="utf-8"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://rawgit.com/create3000/x_ite/master/dist/x_ite.css"/>
<script type="text/javascript" src="https://rawgit.com/create3000/x_ite/master/dist/x_ite.js"></script>
<link rel="stylesheet" type="text/css" href="https://www.x3dom.org/download/dev/x3dom.css"></link>
<script type="text/javascript" src="https://www.x3dom.org/download/dev/x3dom-full.debug.js"></script>
<style>
X3D {
width: 400px;
height:400px;
background:#000;
}
X3DCanvas {
width: 100px;
height:100px;
background:#000;
}
body {
margin:0px;
padding:0px;
}
</style>
<script>
function f3 ()
{
var content = `{ "X3D": {
"encoding": "UTF-8",
"@profile": "Full",
"@version": "3.3",
"@xsd:noNamespaceSchemaLocation": "http://www.web3d.org/specifications/x3d-3.3.xsd",
"JSON schema": "http://www.web3d.org/specifications/x3d-3.3-JSONSchema.json",
"Scene": {
"-children": [
{ "Transform":
{
"@DEF": "Cone",
"-children": [
{ "Shape":
{
"-appearance": { "Appearance":
{
"-material": { "Material":
{
"@diffuseColor": [ 1, 1, 1 ]
}
}
}
},
"-geometry": { "Sphere":
{
}
}
}
}
]
}
}
]
}
}
}`;
for (var click = 0; click < 10; click++) {
for (var c = 0; c < 14; c++) {
X3D(function()
{
var browser = X3D.getBrowser("#canvas"+c);
var importedScene = browser.importJS($.parseJSON (content));
browser.replaceWorld(importedScene);
},
function () {
alert("Failed to render XML to X_ITE");
});
}
}
}
function f2 ()
{
var content = `<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE X3D PUBLIC "ISO//Web3D//DTD X3D 3.3//EN" "http://www.web3d.org/specifications/x3d-3.3.dtd">
<X3D xmlns:xsd="http://www.w3.org/2001/XMLSchema-instance" profile="Interchange" version="3.3" xsd:noNamespaceSchemaLocation="http://www.web3d.org/specifications/x3d-3.3.xsd">
<head>
<meta name='title' content='sphere.x3d'/>
<meta name='creator' content='John Carlson'/>
<meta name='generator' content='manual'/>
<meta name='identifier' content='https://coderextreme.net/X3DJSONLD/sphere.x3d'/>
<meta name='description' content='a sphere'/>
</head>
<Scene>
<Group>
<Shape>
<Appearance>
<Material diffuseColor="1 1 1"/>
</Appearance>
<Box/>
</Shape>
</Group>
</Scene>
</X3D>`;
for (var click = 0; click < 10; click++) {
for (var c = 0; c < 14; c++) {
X3D(function()
{
var browser = X3D.getBrowser("#canvas"+c);
var importedScene = browser.createX3DFromString(content);
browser.replaceWorld(importedScene);
},
function () {
alert("Failed to render XML to X_ITE");
});
}
}
}
function loadX3DOM(xml) {
var content = `<X3D>
<Scene>
<Inline url="box.x3d">
</Scene>
</X3D>`;
for (var click = 0; click < 10; click++) {
document.querySelector('#x3dom').innerHTML = content.replace(/((?!<X3D).)*<X3D(.|\n)*<Scene[^>]*>((.|\n)*)<\/Scene>(.|\n)*/, '$3');
x3dom.reload();
}
}
</script>
</head>
<body>
<X3DCanvas id="canvas0" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas1" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas2" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas3" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas4" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas5" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas6" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas7" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas8" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas9" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas10" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas11" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas12" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas13" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<!--
<X3DCanvas id="canvas14" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas15" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas16" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
<X3DCanvas id="canvas17" cache='false''>
<p>Your browser may not support all features required by X_ITE!</p>
</X3DCanvas>
-->
<input type="button" onclick="f2()" value="createX3DFromString"\>
<input type="button" onclick="f3()" value="importJS"\>
<input type="button" onclick="loadX3DOM()" value="loadX3DOM"\>
<X3D xmlns:xsd="http://www.w3.org/2001/XMLSchema-instance" profile="Immersive" version="3.3" xsd:noNamespaceSchemaLocation="http://www.web3d.org/specifications/x3d-3.3.xsd" showProgress="false" showStat='false' showLog='false' width='400px' height='400px' backend='webgl'>
<Scene id="x3dom">
<Inline id="url" url="box.x3d">
</Scene>
</X3D>
</body>
</html>