ittnerpa60944
/
MDTWebApp
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Added exercise04

master
ittnerpa60944 5 years ago
parent
766789654b
commit
057ed8e2dd
13 changed files with 206 additions and 0 deletions
Split View Show Diff Stats
  1. BIN
      code/code/.vs/MDT5/v15/.suo
  2. 27
    0
      code/code/exercise04/app/css/mobile.css
  3. BIN
      code/code/exercise04/app/img/bootstrap.png
  4. BIN
      code/code/exercise04/app/img/css3.png
  5. BIN
      code/code/exercise04/app/img/html5.png
  6. BIN
      code/code/exercise04/app/img/jQuery.png
  7. BIN
      code/code/exercise04/app/img/js.png
  8. BIN
      code/code/exercise04/app/img/react.png
  9. 32
    0
      code/code/exercise04/app/index.html
  10. 3
    0
      code/code/exercise04/app/scripts/app.js
  11. 77
    0
      code/code/exercise04/app/scripts/landung.js
  12. 45
    0
      code/code/exercise04/app/templates/AboutTemplate.html
  13. 22
    0
      code/code/exercise04/app/templates/NavbarTemplate.html

BIN
code/code/.vs/MDT5/v15/.suo View File


+ 27
- 0
code/code/exercise04/app/css/mobile.css View File

@@ -0,0 +1,27 @@
.btn-style{
min-width: 150px;
margin-right: 10px;
margin-top: 20px;
}

body{
padding-top: 70px;
}

.menu {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 30px;
padding: 10px;
color: white;
background-color: black;
}

.img-center{
margin-top: 30px;
margin-left: auto;
margin-right: auto;
}


BIN
code/code/exercise04/app/img/bootstrap.png View File


BIN
code/code/exercise04/app/img/css3.png View File


BIN
code/code/exercise04/app/img/html5.png View File


BIN
code/code/exercise04/app/img/jQuery.png View File


BIN
code/code/exercise04/app/img/js.png View File


BIN
code/code/exercise04/app/img/react.png View File


+ 32
- 0
code/code/exercise04/app/index.html View File

@@ -0,0 +1,32 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title></title>

<!--css-->
<link rel="stylesheet" href="css/mobile.css">
<link rel="stylesheet" href="../../lib/bootstrap.min.css">


</head>
<body>
<div id="navigation"></div>
<div class="container">
<div id="content"></div>
</div>



<!--scripts-->
<script src="../../lib//jquery-2.2.4.min.js"></script>
<script src="../../lib/es6-shim.min.js"></script>
<script src="../../lib/bootstrap.min.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/landung.js"></script>


</body>
</html>

+ 3
- 0
code/code/exercise04/app/scripts/app.js View File

@@ -0,0 +1,3 @@
function loadTemplates() { $('#navigation').load('templates/NavbarTemplate.html');
$('#content').load('templates/AboutTemplate.html');
} $(document).ready(loadTemplates);

+ 77
- 0
code/code/exercise04/app/scripts/landung.js View File

@@ -0,0 +1,77 @@
function simulation() {
var v;
var s;
var fuel;
var schub = false;

setStartValues(50000, -1000, 10000);

function switchon() {
schub = true;
update();
checkGameOver();
}

function switchoff() {
schub = false;
update();
checkGameOver();
}

function a() {
if (schub == false || fuel <= 0)
return -1.63;
else {
fuel = fuel - 100;
return -1.63 + 12;
}
}

function showValues() {
$("#height").html("Höhe: " + s + " m");
$("#speed").html("Geschwindigkeit: " + v + " m/s");
$("#fuel").html("Teibstoffvorrat: " + fuel + " l");
}


function update() {
v = v + a();
s = s + v;
showValues();
}

function checkGameOver() {
if (s <= 0) {
if (v < -10)
alert("Fehlschlag");
else
alert("Erfolgreich");
setStartValues(50000, -1000, 10000);
showValues();
}
}

function setStartValues(height, velocity, Newfuel) {
v = velocity;
s = height;
fuel = Newfuel;
}

$('#content').html("<h2>Mondlandung</h2>");
$("#content").append("<div class='menu'>Hauptmenü</div>")
$("#content").append("<div id='height'>Höhe: </div>");
$("#content").append("<div id='speed'>Geschwindikgiet: </div>");
$("#content").append("<div id='fuel'>Treibstoffvorrat: </div>");
$("#content").append("<button id='energy' class='btn-style'>Triebwerk an</button>");
$("#content").append("<button id='no-energy' class='btn-style'>Triebwerk aus</button>");



$("#energy").click(switchon);
$("#no-energy").click(switchoff);

showValues();
}



+ 45
- 0
code/code/exercise04/app/templates/AboutTemplate.html View File

@@ -0,0 +1,45 @@
<div class="row">
<h2 class="col-xs-12 page-header">
Patientenverwaltung
<small>Ein Demoprojekt</small>
</h2>
</div>
<div class="row">
<div class="col-lg-4 col-sm-6 col-xs-12 text-center">
<img class="img-circle img-responsive img-center"
src="img/html5.png" alt="HTML5 LOGO" />
<h4>HTML5</h4>
<p>Strukturierte Inhalte für den Browser</p>
</div>
<div class="col-lg-4 col-sm-6 col-xs-12 text-center">
<img class="img-circle img-responsive img-center"
src="img/css3.png" alt="CSS3 LOGO" />
<h4>CSS3</h4>
<p>Flexibles Design und Layout</p>
</div>
<div class="col-lg-4 col-sm-6 col-xs-12 text-center">
<img class="img-circle img-responsive img-center"
src="img/bootstrap.png" alt="Bootstrap" />
<h4>Bootstrap3</h4>
<p>Responsive und schick</p>
</div>

<div class="col-lg-4 col-sm-6 col-xs-12 text-center">
<img class="img-circle img-responsive img-center"
src="img/jQuery.png" alt="JQuery LOGO" />
<h4>JQuery</h4>
<p>Zugriff auf das DOM</p>
</div>
<div class="col-lg-4 col-sm-6 col-xs-12 text-center">
<img class="img-circle img-responsive img-center"
src="img/react.png" alt="REACT LOGO" />
<h4>REACT</h4>
<p>Building User Interfaces</p>
</div>
<div class="col-lg-4 col-sm-6 col-xs-12 text-center">
<img class="img-circle img-responsive img-center"
src="img/js.png" alt="JavaScript" />
<h4>JavaScript</h4>
<p>Die Programmiersprache im Browser</p>
</div>
</div>

+ 22
- 0
code/code/exercise04/app/templates/NavbarTemplate.html View File

@@ -0,0 +1,22 @@

<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<span class="navbar-brand">
Patientenverwaltung
</span>
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menu">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="menu" class="collapse navbar-collapse">
<ul class="nav navbar-nav">
<li><a href="#" onclick="simulation()">Mondladnung</a></li>
<li><a href="#" onclick="$('#content').load('templates/AboutTemplate.html')">Info</a></li>
</ul>
</div>
</div>
</nav>

Write Preview
Loading…
Cancel
Save