tforgione
/
3d-interface
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added css and improved aspect

This commit is contained in:
Thomas FORGIONE 2015-04-11 17:08:43 +02:00
parent 64c8b7de6d
commit 4d79ea6484
8 changed files with 106 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
bouncing/index.php
View File

@ -5,8 +5,13 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<h1>Here is stuff</h1> <section>
<div id="container"></div> <h2>Bouncing cube</h2>
<p>
Click on the cube to make it jump !
</p>
<div id="container"></div>
</section>
<?php include("jsIncludes.php"); ?> <?php include("jsIncludes.php"); ?>
<script src="js/BouncingMain.js"></script> <script src="js/BouncingMain.js"></script>
</body> </body>

44
css/style.css Normal file
View File

@ -0,0 +1,44 @@
body {
font-family: Ubuntu;
margin-left: auto;
margin-right: auto;
width: 1024px;
}
header {
text-align: center;
}
nav {
margin-bottom: 25px;
}
nav ul {
list-style-type: None;
text-align: center;
}
nav ul li {
display: inline-block;
width: 18%;
}
nav a {
color: black;
text-decoration: None;
font-weight: normal;
}
nav a:hover {
font-weight: bold;
}
nav a:visited {
}
section {
}
#container {
position: static;
}

4
include/header_functions.php
View File

@ -4,7 +4,9 @@
{ {
echo "\n\t<head>\n"; echo "\n\t<head>\n";
echo "\t\t<title>The begining - " . $title . "</title>\n"; echo "\t\t<title>The begining - " . $title . "</title>\n";
echo "\t\t<meta charset='utf-8'>\n"; echo "\t\t<meta charset='utf-8' />\n";
echo "\t\t<link rel=\"stylesheet\" href=\"http://fonts.googleapis.com/css?family=Ubuntu:400,700,400italic\" />\n";
echo "\t\t<link rel=\"stylesheet\" href=\"/css/style.css\" />\n";
echo "\t</head>\n\n"; echo "\t</head>\n\n";
} }

18
include/nav.php
View File

@ -1,11 +1,11 @@
<nav> <nav>
<ul> <ul>
<li><a href="/">Index</a></li> <li><a href="/">Index</a></li>
<li><a href="/bouncing/">Bouncing cube</a></li> <li><a href="/bouncing/">Bouncing cube</a></li>
<li><a href="/multisphere/">Multi-sphere</a></li> <li><a href="/multisphere/">Multi-sphere</a></li>
<li><a href="/scene/">Prototype</a></li> <li><a href="/scene/">Prototype</a></li>
<li><a href="/stream/">Streaming simulator</a></li> <li><a href="/stream/">Streaming simulator</a></li>
</ul> </ul>
</nav> </nav>

1
index.php
View File

@ -6,6 +6,7 @@
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<section> <section>
<h2>Index</h2>
<ul> <ul>
<li><a href="/bouncing/">A bouncing cube that jumps when you click on it</a></li> <li><a href="/bouncing/">A bouncing cube that jumps when you click on it</a></li>
<li> <li>

11
multisphere/index.php
View File

@ -5,7 +5,16 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<div id="container"></div> <section>
<h2>Multiresolution sphere</h2>
<p>
This is the first test of multi-resolution. In fact, it's not
really one multi-resolution sphere but many spheres with
different resolutions. You can change resolution by clicking on
the canvas.
</p>
<div id="container"></div>
</section>
<?php include("jsIncludes.php"); ?> <?php include("jsIncludes.php"); ?>
<script src="js/MultiSphere.js"></script> <script src="js/MultiSphere.js"></script>
</body> </body>

17
scene/index.php
View File

@ -5,7 +5,22 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<div style="border-width:1px; border-style: solid;" id="container"></div> <section>
<h2>3D Interface</h2>
<p>
This is the prototype of a 3D interface. You can move the
camera with the arrow keys of your keyboard, and change the
angle of the camera by dragging and dropping the scene around
it (you can also use your numpad, 2 to look lower, 8 to look
higher, 4 to look on the left and 6 to look on the right).
</p>
<p>
Recommended views are displayed with a transparent red screen.
By clicking on this screen, your camera will move to the
recommended viewpoint.
</p>
<div style="border-width:1px; border-style: solid;" id="container"></div>
</section>
<?php include("jsIncludes.php"); ?> <?php include("jsIncludes.php"); ?>
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>

17
stream/index.php
View File

@ -5,7 +5,22 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<div style="border-width:1px; border-style: solid;" id="container"></div> <section>
<h2>Streaming simulator</h2>
<p>
In fact, it's not really streaming. The sphere is fully
preloaded and then, a mesh is created and vertices and faces
are dynamically added to this mesh as time goes by.
</p>
<p>
You can try with a different resolution (between 1 and 25)
<form action="" method="GET">
Resolution : <input id="res" name="res" type="number" min="1" max="25" value="5" length=10/>
<input type="submit" value="Go !" />
</form>
</p>
<div style="border-width:1px; border-style: solid;" id="container"></div>
</section>
<?php include("jsIncludes.php"); ?> <?php include("jsIncludes.php"); ?>
<script src="js/Params.js.php?<?php echo htmlentities($_SERVER['QUERY_STRING']); ?>"></script> <script src="js/Params.js.php?<?php echo htmlentities($_SERVER['QUERY_STRING']); ?>"></script>
<script src="js/main.js"></script> <script src="js/main.js"></script>