X3D and HTML5 examples - Revision history

Vmarchetti: Removed TODO item related to XHTML, XHTML being yet another has-been technology

2022-09-06T11:34:08Z

Removed TODO item related to XHTML, XHTML being yet another has-been technology

2022-09-06T11:27:03Z

Deleted HTML section as obsolete

2022-09-06T10:43:02Z

Added note that X3D in object tags not supported by known browsers

2012-07-10T19:45:51Z

another typo found

2012-07-10T19:45:08Z

use :several" when more examples will go here, no number need to be updated, fix typos

2009-11-06T03:49:17Z

‎X3D - Making direct updates on the tree

2009-11-06T03:48:13Z

‎X3D - Making direct updates on the tree

2009-11-06T03:47:17Z

‎X3D - Making direct updates on the tree

2009-11-06T03:46:52Z

‎X3D - Making direct updates on the tree

2009-11-06T03:44:52Z

‎Possible future X3D extension - Box has added html onclick event

@@ Line 73: / Line 73: @@
 * Opens nested browsing context in parent block element
 * Set of negotiated <param> pairs for initialization and runtime
 == X3D served as text/html (no namespace prefix) ==

@@ Line 59: / Line 59: @@
 * If X3D file format is unrecognized, browser might save file or else provide the user a choice to launch an external application (such as an X3D viewer or editor)
 * Show source (if http server [http://www.web3d.org/x3d/learn/mimetypes X3D MIME type settings] are incorrect)
 == X3D embedded using HTML5 object element ==

← Older revision		Revision as of 10:43, 6 September 2022
Line 85:		Line 85:

	== X3D embedded using HTML5 object element ==		== X3D embedded using HTML5 object element ==
		+	September 2022 status: There are no publicly distributed plug-ins for current web browsers that display X3D content
		+	referenced in an object tag. Current practice is to render X3D on a web page using a javascript library such as [https://xwdom.org X3DOM] or [https://github.com/create3000/x_ite X_ITE]
		+

	<object name='x3dBlock' type='model/x3d+xml' allow-same-origin allow-scripts>		<object name='x3dBlock' type='model/x3d+xml' allow-same-origin allow-scripts>

@@ Line 42: / Line 42: @@
      &lt;/Scene>
    &lt;/X3D>
 ==  HTML Anchor link to X3D document ==

@@ Line 1: / Line 1: @@
-Here are eight examples that show different ways of combining HTML web pages and X3D scenes.
+Here are several examples that show different ways of combining HTML web pages and X3D scenes.
-−
 == HelloWorld.x3d standalone scene ==
@@ Line 61: / Line 60: @@
 * If X3D file format is unrecognized, browser might save file or else provide the user a choice to launch an external application (such as an X3D viewer or editor)
 * Show source (if http server [http://www.web3d.org/x3d/learn/mimetypes X3D MIME type settings] are incorrect)
 == X3D embedded in HTML page using object tag ==
@@ Line 86: / Line 84: @@
    &lt;/body>
   &lt;/html>
 == X3D embedded using HTML5 object element ==

@@ Line 215: / Line 215: @@
             &lt;/Scene>
           &lt;/x3d:X3D>
-        &lt;script type="text/javascript">&lt;! CDATA
+         &lt;script type="text/javascript">&lt;! CDATA
-        var colSel = true;
+         var colSel = true;
-        function toggleRendering()
+         function toggleRendering()
-−
+         {
              var button = document.getElementById("color");
              colSel = !colSel;
@@ Line 230: / Line 230: @@
              aMat.setAttribute("diffuseColor", (!colSel ? "0 0 1" : "1 0 0"));
              return false;
-−
+         }
-        >&lt;/script>
+         >&lt;/script>
-        &lt;p class="case"> &nbsp;
+          &lt;p class="case"> &nbsp;
-          Dynamic material update
+            Dynamic material update
-          &lt;input type="button" id="color" value="Change Color" onclick="toggleRendering();" />
+            &lt;input type="button" id="color" value="Change Color" onclick="toggleRendering();" />
-        &lt;/p>
+          &lt;/p>
-        &lt;/body>
+          &lt;/body>
          &lt;/html>

@@ Line 194: / Line 194: @@
         &lt;?xml version="1.0" encoding="utf-8" ?>
-        &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+        &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
-         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
         &lt;html xmlns="http://www.w3.org/1999/xhtml">
           &lt;head>
@@ Line 203: / Line 202: @@
           &lt;/head>
           &lt;body>
-            &lt;x3d:X3D name='x3dBlock'
+            &lt;x3d:X3D name='x3dBlock' xmlns:x3d="http://www.web3d.org/specifications/x3d-3.2.xsd">
-             xmlns:x3d=
-             "http://www.web3d.org/specifications/x3d-3.2.xsd">
               &lt;Scene>
                 &lt;Shape>
@@ Line 218: / Line 215: @@
             &lt;/Scene>
           &lt;/x3d:X3D>
          &lt;script type="text/javascript">&lt;! CDATA
          var colSel = true;