dubey/WebGoat
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'next' of https://github.com/WebGoat/WebGoat into next

Browse Source 
Conflicts:
	src/main/webapp/WEB-INF/pages/main_new.jsp
	src/main/webapp/css/main.css
overrode the local with the remote version
This commit is contained in:
diver-sity 2014-09-05 06:03:48 +10:00
commit 6d431ca1fd
10 changed files with 644 additions and 297 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
newDesign/assets/css/main.css
View File

@ -100,7 +100,8 @@ img {
color: #F6F6F6; color: #F6F6F6;
} }
#header .toggle-navigation.toggle-left { #header .toggle-navigation.toggle-left {
margin: 23px 0 0 20px; margin-top: 5px;
margin-left: 20px;
display: inline-block; display: inline-block;
} }
#header .btn-default { #header .btn-default {
@ -119,10 +120,31 @@ img {
cursor: pointer; cursor: pointer;
color: #797979; color: #797979;
} }
#header .btn-default .fa-info,
#header .btn-default .fa-envelope,
#header .btn-default .fa-user {
color: #797979;
}
#header .user-nav button:hover,
#header .user-nav button:active {
background: #e84c3d;
}
#header .user-nav button:hover i {
color: #F6F6F6;
}
#header .lessonTitle {
display: inline-block;
margin:0 0 0 20px;
}
#header .pull-right {
float: right !important;
margin-top:25px;
margin-right:20px;
}
/* Sidebar */ /* Sidebar */
.sidebar { .sidebar {
width: 240px; width: 240px;
height: auto; height: 100%;
background: #222; background: #222;
position: absolute; position: absolute;
-webkit-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out;
@ -324,8 +346,8 @@ a.btn-primary:visited {
a.btn-primary:hover, a.btn-primary:hover,
a.btn-primary:active { a.btn-primary:active {
color: #ffffff; color: #ffffff;
background-color: #1dd2af; background-color: #C62F28;
border-color: #1dd2af; border-color: #C62F28;
} }
.btn-primary:hover, .btn-primary:hover,
.btn-primary:focus, .btn-primary:focus,
@ -333,8 +355,8 @@ a.btn-primary:active {
.btn-primary.active, .btn-primary.active,
.open .dropdown-toggle.btn-primary { .open .dropdown-toggle.btn-primary {
color: #ffffff; color: #ffffff;
background-color: #1dd2af; background-color: #C62F28;
border-color: #1dd2af; border-color: #C62F28;
} }
.btn-primary:active, .btn-primary:active,
.btn-primary.active, .btn-primary.active,

44
newDesign/index.html
View File

@ -1,4 +1,4 @@
s<!DOCTYPE html> <!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]--> <!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]--> <!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]--> <!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
@ -53,6 +53,20 @@ s<!DOCTYPE html>
<i class="fa fa-bars"></i> <i class="fa fa-bars"></i>
</button> </button>
</div><!--toggle navigation end--> </div><!--toggle navigation end-->
<div class="lessonTitle">
<h1>Lesson Title in here</h1>
</div><!--lesson title end-->
<div class="user-nav pull-right">
<button type="button" class="btn btn-default">
<i class="fa fa-info"></i>
</button>
<button type="button" class="btn btn-default">
<i class="fa fa-envelope"></i>
</button>
<button type="button" class="btn btn-default">
<i class="fa fa-user"></i>
</button>
</div>
</header> </header>
<!--sidebar left start--> <!--sidebar left start-->
<aside class="sidebar"> <aside class="sidebar">
@ -161,10 +175,19 @@ s<!DOCTYPE html>
<section class="main-content-wrapper"> <section class="main-content-wrapper">
<section id="main-content"> <section id="main-content">
<div class="row"> <div class="row">
<div class="col-md-8">
<div class="col-md-12" align="left">
<div class="panel">
<div class="panel-body">
<button type="button" class="btn btn-primary">Java [Source]</button>
<button type="button" class="btn btn-primary">Solution</button>
</div>
</div>
</div>
<div class="col-md-12"> <div class="col-md-12">
<div class="panel"> <div class="panel">
<div class="panel-body"> <div class="panel-body">
<h1>About WebGoat</h1> <span style="btn">Text</span> <h1>About WebGoat</h1>
<hr /> <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>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> <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>
@ -174,6 +197,23 @@ s<!DOCTYPE html>
</div> </div>
</div> </div>
</div> </div>
</div><!--col-md-8 end-->
<div class="col-md-4">
<div class="col-md-12">
<div class="panel">
<div class="panel-body">
<div align="left">
<button type="button" class="btn btn-default">Params</button>
<button type="button" class="btn btn-default">Hints</button>
<button type="button" class="btn btn-default">Cookies</button>
</div>
<hr />
<h3>Hints</h3>
<p>Nam placerat magna in massa euismod fringilla. Pellentesque in cursus risus, eu hendrerit ligula. Quisque ultrices eget tortor ut eleifend. Praesent auctor libero nec quam fringilla faucibus. Curabitur cursus risus eu faucibus rutrum. Morbi dapibus nulla risus, et euismod eros posuere volutpat. Quisque ut diam diam. Quisque sed enim tortor. Suspendisse commodo magna nec felis ultricies laoreet. Donec sit amet vehicula eros. Phasellus at dapibus enim. Sed massa quam, aliquet eu mattis at, porttitor a nisi.</p>
</div>
</div>
</div>
</div><!--col-md-4 end-->
</div> </div>
</section> </section>
</section> </section>

131
src/main/webapp/WEB-INF/pages/main_new.jsp
View File

@ -14,16 +14,15 @@
<!--[if gt IE 8]><!--> <!--[if gt IE 8]><!-->
<!-- CSS --> <!-- CSS -->
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon"/>
<!-- Bootstrap core CSS --> <!-- Bootstrap core CSS -->
<link rel="stylesheet" href="plugins/bootstrap/css/bootstrap.min.css"> <link rel="stylesheet" href="plugins/bootstrap/css/bootstrap.min.css"/>
<!-- Fonts from Font Awsome --> <!-- Fonts from Font Awsome -->
<link rel="stylesheet" href="css/font-awesome.min.css"> <link rel="stylesheet" href="css/font-awesome.min.css"/>
<!-- CSS Animate --> <!-- CSS Animate -->
<link rel="stylesheet" href="css/animate.css"> <link rel="stylesheet" href="css/animate.css"/>
<!-- Custom styles for this theme --> <!-- Custom styles for this theme -->
<link rel="stylesheet" href="css/main.css"> <link rel="stylesheet" href="css/main.css"/>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"/>
<!-- end of CSS --> <!-- end of CSS -->
<!-- JS --> <!-- JS -->
@ -50,68 +49,104 @@
<script type="text/javascript" src="js/goatConstants.js"></script> <script type="text/javascript" src="js/goatConstants.js"></script>
<script type="text/javascript" src="js/goatUtil.js"></script> <script type="text/javascript" src="js/goatUtil.js"></script>
<script type="text/javascript" src="js/goatData.js"></script> <script type="text/javascript" src="js/goatData.js"></script>
<script type="text/javascript" src="js/goatLesson.js"></script>
<script type="text/javascript" src="js/goatControllers.js"></script> <script type="text/javascript" src="js/goatControllers.js"></script>
<script type="text/javascript" src="js/jquery/jquery-ui-1.10.4.custom.min.js"></script>
<!-- end of JS --> <!-- end of JS -->
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>WebGoat V6.0 fsdafasd</title> <title>WebGoat V6.0</title>
</head> </head>
<body class="animated fadeIn" ng-app="goatApp" ng-controller="goatLesson"> <body class="animated fadeIn" ng-app="goatApp">
<section id="container"> <section id="container">
<header id="header"> <header id="header">
<!--logo start--> <!--logo start-->
<div class="brand"> <div class="brand">
<a href="/webgoat/start.mvc" class="logo"><span>Web</span>Goat</a> <a href="${pageContext.request.contextPath}/start.mvc" class="logo"><span>Web</span>Goat</a>
</div> </div>
<!--logo end--> <!--logo end-->
<div class="toggle-navigation toggle-left"> <div class="toggle-navigation toggle-left">
<button type="button" class="btn btn-default" id="toggle-left" data-toggle="tooltip" data-placement="right" title="Toggle Navigation"> <button type="button" class="btn btn-default" id="toggle-left" data-toggle="tooltip" data-placement="right" title="Toggle Navigation">
<i class="fa fa-bars"></i> <i class="fa fa-bars"></i>
</button> </button>
<span id="lessonTitle">Welcome To WebGoat</span>
</div><!--toggle navigation end--> </div><!--toggle navigation end-->
<div class="lessonTitle">
<h1>Lesson Title in here</h1>
</div><!--lesson title end-->
<div class="user-nav pull-right">
<button type="button" class="btn btn-default">
<i class="fa fa-info"></i>
</button>
<button type="button" class="btn btn-default">
<i class="fa fa-envelope"></i>
</button>
<button type="button" class="btn btn-default">
<i class="fa fa-user"></i>
</button>
</div>
</header> </header>
<!--sidebar left start--> <!--sidebar left start-->
<aside class="sidebar"> <aside class="sidebar">
<div id="leftside-navigation" class="nano" > <div id="leftside-navigation" class="nano" ng-controller="goatLessonMenu">
<ul id="accordion" class="nano-content"> <ul class="nano-content">
<li class="sub-menu" ng-repeat="item in menuTopics"> <li class="sub-menu" ng-repeat="item in menuTopics">
<h6>
<a ng-click="expanded = !expanded" href=""><i class="fa {{item.class}}"></i><span>{{item.name}}</span></a> <a ng-click="expanded = !expanded" href=""><i class="fa {{item.class}}"></i><span>{{item.name}}</span></a>
</h6>
<div>
<ul class="slideDown" ng-show="expanded"> <ul class="slideDown" ng-show="expanded">
<li ng-repeat="lesson in item.children"> <li ng-repeat="lesson in item.children">
<a ng-click="renderLesson(lesson.link)" title="link to {{lesson.name}}" <a ng-click="renderLesson(lesson.link)" title="link to {{lesson.name}}" href="">{{lesson.name}}</a>
href="">{{lesson.name}}</a>
<span ng-repeat="stage in lesson.children" > <span ng-repeat="stage in lesson.children" >
<a ng-click="renderLesson(stage.link)" title="link to {{stage.name}}" <a ng-click="renderLesson(stage.link)" title="link to {{stage.name}}" href="">{{stage.name}}</a>
href="">{{stage.name}}</a>
</span> </span>
</li> </li>
</ul> </ul>
</div>
</li> </li>
</ul> </ul>
</div> </div>
</aside> </aside>
<!--sidebar left end--> <!--sidebar left end-->
<!--main content start--> <!--main content start-->
<section class="main-content-wrapper"> <section class="main-content-wrapper">
<section id="main-content"> <section id="main-content" ng-controller="lessonHelpController">
<div class="row"> <div class="row">
<div class="col-md-8">
<div class="col-md-12" align="left">
<div class="panel">
<div class="panel-body">
<button type="button" id="showSourceBtn" class="btn btn-primary">Java [Source]</button>
<button type="button" id="showSolutionBtn" class="btn btn-primary">Solution</button>
</div>
</div>
</div>
<div class="col-md-12"> <div class="col-md-12">
<div class="panel" id="buttonPanel"> <div class="panel" id="buttonPanel">
<button type="button" class="btn btn-primary btn-xs">Params/Cookies</button> <button type="button" id="showParamsCookiesBtn" class="btn btn-primary btn-xs" ng-click="viewCookiesAndParams()">Params/Cookies</button>
<button type="button" class="btn btn-primary btn-xs">Hints</button> <button type="button" id="showHintsBtn" class="btn btn-primary btn-xs lessonHelpBtn">Hints</button>
<button type="button" class="btn btn-primary btn-xs">Lesson Plan</button> <button type="button" id="showPlanBtn" class="btn btn-primary btn-xs lessonHelpBtn">Lesson Plan</button>
<button type="button" class="btn btn-primary btn-xs" ng-click="showSource('lg')">Java [Source]</button> <button type="button" id="showSourceBtn" class="btn btn-primary btn-xs lessonHelpBtn">Java [Source]</button> <!-- ng-click="showSource('lg') -->
<button type="button" class="btn btn-primary btn-xs" ng-click="showSolution('lg')">Solution</button> <button type="button" id="showSolutionBtn" class="btn btn-primary btn-xs lessonHelpBtn">Solution</button> <!-- ng-click="showSolution('lg') -->
</div>
<div class="panel" id="cookiesAndParams">
<div class="cookiesView">
cookies:
<ul ng-repeat="cookie in cookies">
<li ng-repeat="(key, value) in cookie">{{key}} :: {{ value}} </td>
</ul>
</div>
<div> <!--class="paramsView"-->
params:<br/>
<ul>
<li ng-repeat="param in params">
{{param.name}} = {{param.value}}
</li>
</ul>
</div>
</div> </div>
<div class="panel" > <div class="panel" >
<div class="panel-body" id="lesson_content"> <div class="panel-body" id="lesson_content">
@ -120,18 +155,36 @@
</div> </div>
</div> </div>
</div><!--col-md-8 end-->
<div class="col-md-4">
<div class="col-md-12">
<div class="panel">
<div class="panel-body">
<div align="left">
<button id="showParamsCookiesBtn" type="button" class="btn btn-default">Params / Cookies</button>
<button id="showHintsBtn" type="button" class="btn btn-default">Hints</button>
<button id="showPlanBtn" type="button" class="btn btn-default">Lesson Plan</button>
</div> </div>
<div class="row" id="lesson_cookies_row"> <hr />
<h3>Hints</h3>
<p>Nam placerat magna in massa euismod fringilla. Pellentesque in cursus risus, eu hendrerit ligula. Quisque ultrices eget tortor ut eleifend. Praesent auctor libero nec quam fringilla faucibus. Curabitur cursus risus eu faucibus rutrum. Morbi dapibus nulla risus, et euismod eros posuere volutpat. Quisque ut diam diam. Quisque sed enim tortor. Suspendisse commodo magna nec felis ultricies laoreet. Donec sit amet vehicula eros. Phasellus at dapibus enim. Sed massa quam, aliquet eu mattis at, porttitor a nisi.</p>
</div>
</div>
</div>
</div><!--col-md-4 end-->
</div>
<div id="lessonHelpsWrapper">
<div class="row lessonHelp" id="lesson_cookies_row">
<div class="col-md-12"> <div class="col-md-12">
<h4>Lesson Parameters and Cookies</h4> <h4>Lesson Parameters and Cookies</h4>
<div class="panel" > <div class="panel" >
<div class="panel-body" id="lesson_cookies"> <div class="panel-body" id="lesson_cookies">
1
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<div class="row" id="lesson_hint_row"> <div class="row lessonHelp" id="lesson_hint_row">
<div class="col-md-12"> <div class="col-md-12">
<h4>Lesson Hints</h4> <h4>Lesson Hints</h4>
<div class="panel" > <div class="panel" >
@ -141,7 +194,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row" id="lesson_plan_row"> <div class="row lessonHelp" id="lesson_plan_row">
<div class="col-md-12"> <div class="col-md-12">
<h4>Lesson Plan</h4> <h4>Lesson Plan</h4>
<div class="panel" > <div class="panel" >
@ -151,7 +204,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row" id="lesson_solution_row"> <div class="row lessonHelp" id="lesson_solution_row">
<div class="col-md-12"> <div class="col-md-12">
<h4>Lesson Solution</h4> <h4>Lesson Solution</h4>
<div class="panel" > <div class="panel" >
@ -160,7 +213,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="row" id="lesson_source_row"> <div class="row lessonHelp" id="lesson_source_row">
<div class="col-md-12"> <div class="col-md-12">
<h4>Lesson Source Code</h4> <h4>Lesson Source Code</h4>
<div class="panel" > <div class="panel" >
@ -169,11 +222,16 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</section> </section>
</section> </section>
<!--main content end--> <!--main content end-->
</section>
<!--main content end-->
</section> </section>
<!-- TODO pull source into project instead of loading from external --> <!-- TODO pull source into project instead of loading from external -->
@ -187,13 +245,14 @@
$(document).ready(function() { $(document).ready(function() {
// bind to click events on menu links // bind to click events on menu links
$('.menu-link').bind('click', function(event) { /*$('.menu-link').bind('click', function(event) {
event.preventDefault(); event.preventDefault();
$.get(this.href, {}, function(reply) { $.get(this.href, {}, function(reply) {
$("#lesson_content").html(reply); $("#lesson_content").html(reply);
goat.utils.showLessonSource(); goat.utils.showLessonSource();
}, "html"); }, "html");
}); });*/
app.init(); app.init();
}); });

51
src/main/webapp/css/main.css
View File

@ -100,7 +100,8 @@ img {
color: #F6F6F6; color: #F6F6F6;
} }
#header .toggle-navigation.toggle-left { #header .toggle-navigation.toggle-left {
margin: 23px 0 0 20px; margin-top: 5px;
margin-left: 20px;
display: inline-block; display: inline-block;
} }
#header .btn-default { #header .btn-default {
@ -119,9 +120,31 @@ img {
cursor: pointer; cursor: pointer;
color: #797979; color: #797979;
} }
#header .btn-default .fa-info,
#header .btn-default .fa-envelope,
#header .btn-default .fa-user {
color: #797979;
}
#header .user-nav button:hover,
#header .user-nav button:active {
background: #e84c3d;
}
#header .user-nav button:hover i {
color: #F6F6F6;
}
#header .lessonTitle {
display: inline-block;
margin:0 0 0 20px;
}
#header .pull-right {
float: right !important;
margin-top:25px;
margin-right:20px;
}
/* Sidebar */ /* Sidebar */
.sidebar { .sidebar {
width: 240px; width: 240px;
/*height: 100%;*/
background: #222; background: #222;
position: absolute; position: absolute;
-webkit-transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out;
@ -341,8 +364,8 @@ a.btn-primary:visited {
a.btn-primary:hover, a.btn-primary:hover,
a.btn-primary:active { a.btn-primary:active {
color: #ffffff; color: #ffffff;
background-color: #1dd2af; background-color: #C62F28;
border-color: #1dd2af; border-color: #C62F28;
} }
.btn-primary:hover, .btn-primary:hover,
.btn-primary:focus, .btn-primary:focus,
@ -350,8 +373,8 @@ a.btn-primary:active {
.btn-primary.active, .btn-primary.active,
.open .dropdown-toggle.btn-primary { .open .dropdown-toggle.btn-primary {
color: #ffffff; color: #ffffff;
background-color: #1dd2af; background-color: #C62F28;
border-color: #1dd2af; border-color: #C62F28;
} }
.btn-primary:active, .btn-primary:active,
.btn-primary.active, .btn-primary.active,
@ -748,3 +771,21 @@ fieldset[disabled] .btn-warning.active {
padding:3px; padding:3px;
width:auto; width:auto;
} }
#topLinks {
float:right;
margin-right:5px;s
margin-top:3px;
}
.lessonHelp, .lessonHelpBtn {
display: none;
}
/*
.paramsView {
float:right;
width 50%;
margin-right:10px;
border-left:2px solid #333;
}
*/

12
src/main/webapp/js/goatConstants.js
View File

@ -11,6 +11,16 @@ var goatConstants = {
children:null, children:null,
class:'fa-bars static' class:'fa-bars static'
}], }],
lessonService: 'service/lessonmenu.mvc' //services
lessonService: 'service/lessonmenu.mvc',
cookieService: 'service/cookie.mvc', //cookies_widget.mvc
hintService:'service/hint.mvc',
sourceService:'service/source.mvc',
solutionService:'service/solution.mvc',
lessonPlanService:'service/lessonplan.mvc',
menuService: 'service/lessonmenu.mvc',
// literals
notFound: 'Could not find'
}; };

39
src/main/webapp/js/goatControllers.js
View File

@ -6,7 +6,7 @@
/** Menu Controller /** Menu Controller
* prepares and updates menu topic items for the view * prepares and updates menu topic items for the view
*/ */
goat.controller('goatLesson', function($scope, $http, $modal, $log, $templateCache) { goat.controller('goatLessonMenu', function($scope, $http, $modal, $log, $templateCache) {
//TODO: implement via separate promise and use config for menu (goat.data.loadMenuData()) //TODO: implement via separate promise and use config for menu (goat.data.loadMenuData())
$http({method: 'GET', url: goatConstants.lessonService}).then( $http({method: 'GET', url: goatConstants.lessonService}).then(
function(menuData) { function(menuData) {
@ -19,30 +19,23 @@ goat.controller('goatLesson', function($scope, $http, $modal, $log, $templateCac
} }
); );
$scope.renderLesson = function(url) { $scope.renderLesson = function(url) {
console.log(url + ' was passed in'); //console.log(url + ' was passed in');
// use jquery to render lesson content to div // use jquery to render lesson content to div
goat.data.loadLessonContent(url).then( goat.data.loadLessonContent(url).then(
function(reply) { function(reply) {
$("#lesson_content").html(reply); $("#lesson_content").html(reply);
// hook forms // hook forms
goat.utils.makeFormsAjax(); goat.utils.makeFormsAjax();
//render lesson title
$('#lessonTitle').text(goat.utils.extractLessonTitle($(reply))); $('#lessonTitle').text(goat.utils.extractLessonTitle($(reply)));
// adjust menu to lessonContent size if necssary // adjust menu to lessonContent size if necssary
//@TODO: this is still clunky ... needs some TLC
if ($('div.panel-body').height() > 400) { if ($('div.panel-body').height() > 400) {
$('#leftside-navigation').height($(window).height()); $('#leftside-navigation').height($(window).height());
} }
// hook into our pseudo service calls goat.lesson.lessonInfo = new goat.lesson.CurLesson(url);
// @TODO make these real services during phase 2 goat.lesson.lessonInfo.loadInfo(); //uses pseudo and actual service calls
// show cookies and params // @TODO: convert to real services (and more angularjs, likely ... in phase 2)
goat.utils.showLessonCookiesAndParams();
// show hints
goat.utils.showLessonHint();
// show plan
goat.utils.showLessonPlan();
// show solution
goat.utils.showLessonSolution();
// show source
goat.utils.showLessonSource();
} }
); );
}; };
@ -62,8 +55,22 @@ goat.controller('goatLesson', function($scope, $http, $modal, $log, $templateCac
}; };
}); });
goat.controller('lessonHelpController', function($scope) {
$scope.cookies=[];
$scope.params=[];
$scope.viewCookiesAndParams = function() {
$scope.cookies=goat.lesson.lessonInfo.cookies;
console.log($scope.cookies);
$scope.params=goat.lesson.lessonInfo.params;
/* Controllers for modal instances */ //@TODO: issue callback to track view
};
//$scope.watch()
});
/*
*DEPRECATED
//Controllers for modal instances
var showSourceController = function($scope, $modalInstance, lessonSource) { var showSourceController = function($scope, $modalInstance, lessonSource) {
$scope.lessonSource = lessonSource; $scope.lessonSource = lessonSource;
@ -89,7 +96,7 @@ var showSolutionController = function($scope, $modalInstance, lessonSolutionUrl)
$modalInstance.dismiss('cancel'); $modalInstance.dismiss('cancel');
}; };
}; };
*/

23
src/main/webapp/js/goatData.js
View File

@ -1,13 +1,34 @@
/* ### GOAT DATA/PROMISES ### */ /* ### GOAT DATA/PROMISES ### */
goat.data = { goat.data = {
/**** jQuery loads ... ****/
loadLessonContent: function (_url) { loadLessonContent: function (_url) {
//TODO: switch to $http (angular) later //TODO: switch to $http (angular) later
//return $http({method:'GET', url: _url}); //return $http({method:'GET', url: _url});
return $.get(_url, {}, null, "html"); return $.get(_url, {}, null, "html");
}, },
loadCookies: function() {
return $.get(goatConstants.cookieService, {});
},
loadHints: function () {
return $.get(goatConstants.hintService, {});
},
loadSource: function() {
return $.get(goatConstants.sourceService, {});
},
loadSolution: function () {
return $.get(goatConstants.solutionService, {})
},
loadPlan: function () {
return $.get(goatConstants.lessonPlanService, {});
},
loadParams: function() {
return $.get(goatConstants.paramsService,{});
},
/*** angular data grabs ***/
loadMenuData: function() { loadMenuData: function() {
//TODO use goatConstants var for url //TODO use goatConstants var for url
return $http({method: 'GET', url: 'service/lessonmenu.mvc'}); return $http({method: 'GET', url: goatConstants.menuService});
} }
}; };

110
src/main/webapp/js/goatLesson.js Normal file
View File

@ -0,0 +1,110 @@
// goat.lesson name space
goat.lesson = {
CurLesson: function(_lessonUrl) {
return {
hints:[],
hintIndex:0,
solution:null,
plan:null,
cookiesAndParams:[],
params:[],
source:null,
lessonUrl:(_lessonUrl || null),
clearInfo: function() {
this.hints = null;
this.solution = null;
this.plan = null;
this.cookies = null;
this.source = null;
this.params = null;
},
loadInfo: function() {
this.getHints();
this.getPlan();
this.getSolution();
this.getCookies();
this.getSource();
this.getParams();
},
getHints:function() {
var scope = this;
goat.data.loadHints().then(
function(resp) {
scope.hints = resp;
if (scope.hints.length > 0) {
goat.utils.displayButton('showHintsBtn',true);
} else {
goat.utils.displayButton('showHintsBtn',false);
}
return scope;
},
function(err){
goat.utils.displayButton('showHintsBtn',false);
//TODO handle errors
}
);
},
getSolution:function() {
var scope = this;
goat.data.loadSolution().then(
function(resp) {
scope.solution = resp;
goat.utils.displayButton('showSolutionBtn',true);
$('#showSolutionBtn').unbind().click(goat.utils.showLessonSolution);
return scope;
},
function(err){
scope.solution = null;
goat.utils.displayButton('showSolutionBtn',false);
//TODO handle errors
}
);
},
getPlan: function() {
var scope = this;
goat.data.loadPlan().then(
function(resp) {
scope.plan = resp;
goat.utils.displayButton('showPlanBtn',true);
$('#showPlanBtn').unbind().click(goat.utils.showLessonPlan);
return scope;
},
function(err){
goat.utils.displayButton('showPlanBtn',false);
//TODO handle errors
}
);
},
getSource: function() {
var scope = this;
goat.data.loadSource().then(
function(resp) {
scope.source = resp;
goat.utils.displayButton('showSourceBtn',true);
$('#showSourceBtn').unbind().click(goat.utils.showLessonSource);
return scope;
},
function(err){
goat.utils.displayButton('showSourceBtn',false);
//TODO handle errors
}
);
},
getCookies: function() {
var scope = this;
goat.data.loadCookies().then(
function(resp) {
scope.cookies = resp;
return scope;
},
function(err){
//TODO handle errors
}
);
},
getParams: function() {
this.params = goat.utils.scrapeParams(this.lessonUrl)
}
}
}
};

73
src/main/webapp/js/goatUtil.js
View File

@ -23,35 +23,72 @@ goat.utils = {
var title = $('h1', el).text(); var title = $('h1', el).text();
return title; return title;
}, },
displayButton: function(id,show) {
if ($('#'+id)) {
if (show) {
$('#'+id).show();
} else {
$('#'+id).hide();
}
}
},
showLessonCookiesAndParams: function() { showLessonCookiesAndParams: function() {
$.get("service/cookies_widget.mvc", {}, function(reply) { $.get(goatConstants.cookieService, {}, function(reply) {
$("#lesson_cookies").html(reply); $("#lesson_cookies").html(reply);
}, "html"); }, "html");
}, },
showLessonHint: function() { showLessonHints: function() {
$.get("service/hint_widget.mvc", {}, function(reply) { $('.lessonHelp').hide();
$("#lesson_hint").html(reply); $('#lesson_hint').html();
}, "html"); $('#lesson_hint_row').show();
}, },
showLessonSource: function() { showLessonSource: function(source) {
$.get("service/source.mvc", {}, function(reply) { $('.lessonHelp').hide();
$("#lesson_source").html("<pre>"+reply+"</pre>"); $('#lesson_source').html("<pre>"+goat.lesson.lessonInfo.source+"</pre>");
}, "html"); $('#lesson_source_row').show();
goat.utils.scrollToHelp();
}, },
showLessonSolution: function() { showLessonSolution: function() {
$.get("service/solution.mvc", {}, function(reply) { $('.lessonHelp').hide();
$("#lesson_solution").html(reply); $('#lesson_solution').html(goat.lesson.lessonInfo.solution);
}, "html"); $('#lesson_solution_row').show();
goat.utils.scrollToHelp();
}, },
showLessonPlan: function() { showLessonPlan: function(plan) {
$.get("service/lessonplan.mvc", {}, function(reply) { $('.lessonHelp').hide();
$("#lesson_plan").html(reply); $("#lesson_plan").html(goat.lesson.lessonInfo.plan);
}, "html"); $('#lesson_plan_row').show();
goat.utils.scrollToHelp();
},
scrollToHelp:function() {
var target = $('#lessonHelpsWrapper');
goat.utils.scrollEasy(target);
},
scrollToTop: function() {
var target= $('#container');
goat.utils.scrollEasy(target);
},
scrollEasy:function(target) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
},
scrapeParams: function(url) {
if (!url) {
return;
}
var params = url.split('?')[1].split('&');
var paramsArr = [];
for (var i=0;i< params.length;i++) {
var paramObj = {};
paramObj.name = params[i].split('=')[0];
paramObj.value = params[i].split('=')[1];
paramsArr.push(paramObj);
}
return paramsArr;
} }
}; };
// ### GLOBAL FUNCTIONS ## //
$(window).resize(function() { $(window).resize(function() {
//$('#leftside-navigation').css('height',$('div.panel-body').height()); //$('#leftside-navigation').css('height',$('div.panel-body').height());

4
src/main/webapp/lessonJS/sameOrigin.js
View File

@ -7,8 +7,8 @@ function submitXHR(){
document.getElementById("responseArea").innerHTML=""; document.getElementById("responseArea").innerHTML="";
alert("creating XHR request for: " + document.getElementById("requestedURL").value); //alert("creating XHR request for: " + document.getElementById("requestedURL").value);
console.log("creating XHR request for: " + document.getElementById("requestedURL").value);
try{ try{