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> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<h1>Here is stuff</h1> <section>
<h2>Bouncing cube</h2>
<p>
Click on the cube to make it jump !
</p>
<div id="container"></div> <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;
}

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";
} }

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>

View File

@ -5,7 +5,16 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<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> <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>

View File

@ -5,7 +5,22 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<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> <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>

View File

@ -5,7 +5,22 @@
<body> <body>
<?php include("header.php"); ?> <?php include("header.php"); ?>
<?php include("nav.php"); ?> <?php include("nav.php"); ?>
<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> <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>