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

View File

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

View File

@ -4,7 +4,9 @@
{
echo "\n\t<head>\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";
}

View File

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

View File

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

View File

@ -5,7 +5,16 @@
<body>
<?php include("header.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"); ?>
<script src="js/MultiSphere.js"></script>
</body>

View File

@ -5,7 +5,22 @@
<body>
<?php include("header.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"); ?>
<script src="js/main.js"></script>
</body>

View File

@ -5,7 +5,22 @@
<body>
<?php include("header.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"); ?>
<script src="js/Params.js.php?<?php echo htmlentities($_SERVER['QUERY_STRING']); ?>"></script>
<script src="js/main.js"></script>