Cobweb — Cobweb WebGL X3D Browser

Introduction

Cobweb is a work in progress. The goal is a full standard WebGL X3D browser for all major web browsers.

For more information and live preview please visit http://titania.create3000.de/cobweb/.

Embedding Cobweb within a Web Page

To display your X3D scene in a HTML5 page first save your scene as X3D XML Encoded file or as X3D Classic Encoded file, i.e. create a file with the extension .x3d ,.x3dv or .wrl.

The HTML5 page is quite easy to create, the HTML5 code below shows you the minimum requirements. The path to the X3D scene is specified in the src attribute of the tag.

Note: it is important to use a HTML5 page and to save it as .html file.

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8"/>
      <link rel="stylesheet" type="text/css" href="https://cdn.rawgit.com/create3000/cobweb/master/stable/2/2.1/cobweb.css"/>
      <script type="text/javascript" src="https://cdn.rawgit.com/create3000/cobweb/master/stable/2/2.1/cobweb.min.js"></script>
   <style>
X3DCanvas {
   width: 768px;
   height: 432px;
}
   </style>
   </head>
   <body>
      <X3DCanvas src="https://github.com/Sgeo/cobweb/raw/master/path/to/your/X3D/world.x3d">
         <p>Your browser may not support all features required by Cobweb!</p>
      </X3DCanvas>
   </body>
</html>

To get Cobweb working you must include the CSS file »cobweb.css« and the JavaScript file »cobweb.min.js «. After cobweb is successfully loaded a new HTML tag is available on your page.

You can style the tag as every HTML tag with CSS as well as you can place it everywhere within the DOM tree.

Supported File Formats

As of version 1.19, Cobweb can now parse either X3D XML Encoding or X3D Classic Encoding. This gives authors the capability to display their existing projects like .wrl worlds, too.

Additionally files can be compressed using GZip compression.

Fallback Content

The element is equal to the

Providing fallback content is very straightforward: just insert the alternate content inside the element. Browsers that don't support will ignore the container and render the fallback content inside it. Browsers that do support will ignore the content inside the container, and just render the canvas normally.

For example, we could provide a text description of the X3D element or provide a static image of the dynamically rendered content. This can look something like this:

<X3DCanvas src="https://github.com/Sgeo/cobweb/raw/master/world.x3d">
   <p>Current stock price: $3.15 +0.15</p>
</X3DCanvas>

<X3DCanvas src="https://github.com/Sgeo/cobweb/raw/master/world.x3dv">
   <img src="https://github.com/Sgeo/cobweb/raw/master/images/clock.png"/>
</X3DCanvas>

Attributes of the X3DCanvas Tag

The HTML tag defines the main content of the X3D document. The tag has two attributes that define different behaviours. All of these attributes are optional.

src

A String value with the URL that should be loaded on page load. If no URL is specified or the src field is empty an empty scene is displayed.

cache

A Boolean value (true or false) to indicate whether files transferred over the internet should be cached on the local computer. The default value for the cache attribute is true. It works by appending "_={timestamp}" to the GET parameters of every request. Example

<X3DCanvas cache="true" src="https://github.com/Sgeo/cobweb/raw/master/path/to/your/X3D/world.x3d"></X3DCanvas>

Programmer's Style Guide

Programmers who want to work on Cobweb shall first read the Style Guide.

Tests

Cobweb Test Page

Authors

All authors contributed to this project can be found in the list of authors.

License

Cobweb is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License version 3 only, as published by the Free Software Foundation.

Sgeo / cobweb

readme