Initial commit for separate menus

This commit is contained in:
Jason White 2014-08-24 06:55:11 -04:00
parent 064c0e8066
commit 8177a6276a
5 changed files with 38 additions and 8 deletions

View File

@ -164,7 +164,7 @@ s<!DOCTYPE html>
<div class="col-md-12">
<div class="panel">
<div class="panel-body">
<h1>About WebGoat</h1>
<h1>About WebGoat</h1> <span style="btn">Text</span>
<hr />
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque volutpat feugiat nunc, non vulputate urna dictum ut. Nam consectetur porttitor diam ut ultricies. Aenean dolor dolor, congue sed ornare non, elementum in mauris. Phasellus orci sem, rhoncus eu laoreet eu, aliquam nec ante. Suspendisse sit amet justo eget eros tempor tincidunt vel quis justo. Sed pulvinar enim id neque pellentesque, eu rhoncus lorem eleifend. Morbi congue tortor sit amet pulvinar posuere.</p>
<p>Integer rhoncus gravida arcu, at bibendum magna feugiat sit amet. Vivamus id lacinia massa. Praesent eu quam ullamcorper, tempor elit nec, lobortis massa. In in eros eu augue rhoncus semper. Vestibulum ornare purus vitae bibendum vulputate. Cras eleifend commodo lectus, eget pharetra justo mollis quis. Donec tempor magna lectus, vitae suscipit turpis venenatis et. Nulla facilisi.</p>

View File

@ -26,7 +26,9 @@
<!-- JS -->
<script src="js/angular/angular.min.js"></script>
<!-- angular modules -->
<script src="js/angular/angular-animate.min.js"></script>
<script src="js/angular/ui-bootstrap-tpls-0.11.0.min.js"></script>
<!-- Feature detection -->
<script src="js/modernizr-2.6.2.min.js"></script>
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
@ -34,12 +36,19 @@
<script src="js/html5shiv.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
<!--Global JS-->
<script src="js/jquery/jquery-1.10.2.min.js"></script>
<script src="plugins/bootstrap/js/bootstrap.min.js"></script>
<script src="js/application.js"></script>
<script type="text/javascript">
var goat=angular.module("goatApp", ['ngAnimate']);
var goat=angular.module("goatApp", ['ngAnimate','ui.bootstrap']);
</script>
<script type="text/javascript" src="js/ui-util.js"></script>
<script type="text/javascript" src="js/goat.js"></script>
<script type="text/javascript" src="js/goatConstants.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>WebGoat V6.0</title>
@ -52,7 +61,7 @@
<header id="header">
<!--logo start-->
<div class="brand">
<a href="index.html" class="logo"><span>Web</span>Goat</a>
<a href="/webgoat/start.mvc" class="logo"><span>Web</span>Goat</a>
</div>
<!--logo end-->
<div class="toggle-navigation toggle-left">
@ -103,9 +112,6 @@
</section>
<!--Global JS-->
<script src="js/jquery/jquery-1.10.2.min.js"></script>
<script src="plugins/bootstrap/js/bootstrap.min.js"></script>
<!-- <script src="plugins/waypoints/waypoints.min.js"></script> -->
<!-- <script src="js/application.js"></script> -->

View File

@ -122,7 +122,6 @@ img {
/* Sidebar */
.sidebar {
width: 240px;
height: auto;
background: #222;
position: absolute;
-webkit-transition: all 0.3s ease-in-out;
@ -132,6 +131,19 @@ img {
transition: all 0.3s ease-in-out;
z-index: 100;
}
#leftside-navigation {
height:400px;
overflow-y:scroll;
overflow-x:hidden;
}
#sidebar {
/*background-color:#333;*/
background-color:blue;
}
.sidebar-toggle {
margin-left: -240px;
}
@ -207,8 +219,9 @@ img {
-ms-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
background: #f1f2f7;
min-height: 1000px;
min-height: 400px;
}
.main-content-wrapper #main-content {
background: url('img/webBg.png') no-repeat top left;
border-top: solid thin #e7e8ec;

View File

@ -26,6 +26,10 @@ goat.controller('goatMenu', function($scope, $http) {
$("#lesson_content").html(reply);
// hook forms
makeFormsAjax();
// adjust menu to lessonContent size if necssary
if ($('div.panel-body').height() > 400) {
$('#leftside-navigation').height($(window).height());
}
}
);
};
@ -61,6 +65,9 @@ goat.addMenuClasses = function(arr) {
};
/* ### GOAT DATA/PROMISES ### */
function loadLessonContent(_url) {
//TODO: switch to $http (angular)
return $.get(_url,{},null,"html");

4
webapp/js/ui-util.js Normal file
View File

@ -0,0 +1,4 @@
$(window).resize(function() {
//$('#leftside-navigation').css('height',$('div.panel-body').height());
console.log($(window).height());
});