Initial commit for separate menus

src/main/webapp/WEB-INF/pages/main_new.jsp

@@ -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> -->
 

src/main/webapp/css/main.css

@@ -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;

src/main/webapp/js/goat.js

@@ -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");