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

Should resolve issues #25 and #2 using a backbone view to control those nav buttons

Browse Source
This commit is contained in:
Jason White 2015-09-09 12:36:36 -04:00
parent e928871d2a
commit 9348a0d70e
4 changed files with 62 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
webgoat-container/src/main/webapp/WEB-INF/pages/main_new.jsp
View File

@ -37,8 +37,8 @@
<!-- Require.js used to load js asynchronously -->
<script src="js/libs/require.min.js" data-main="js/main.js"></script>
<script src="js/jquery/jquery-1.10.2.min.js"></script>
<script src="plugins/bootstrap/js/bootstrap.min.js"></script>
<!--<script src="js/jquery/jquery-1.10.2.min.js"></script>
<script src="plugins/bootstrap/js/bootstrap.min.js"></script>-->
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>WebGoat</title>
</head>
@ -58,9 +58,9 @@
<div id="lesson-title-wrapper" >
</div><!--lesson title end-->
<div class="user-nav pull-right" style="margin-right: 75px;">
<div class="user-nav pull-right" id="user-and-info-nav" style="margin-right: 75px;">
<div class="dropdown" style="display:inline">
<button type="button" data-toggle="dropdown" class="btn btn-default dropdown-toggle" id="dropdownMenu1" >
<button type="button" data-toggle="dropdown" class="btn btn-default dropdown-toggle" id="user-menu" >
<i class="fa fa-user"></i> <span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-menu-left">
@ -74,7 +74,7 @@
</ul>
</div>
<button type="button" data-toggle="modal" data-target="#aboutModal" class="btn btn-default right_nav_button" title="About WebGoat">
<button type="button" id="about-button" class="btn btn-default right_nav_button" title="About WebGoat" data-toggle="modal" data-target="#about-modal">
<i class="fa fa-info"></i>
</button>
<a href="mailto:${contactEmail}?Subject=Webgoat%20feedback" target="_top">
@ -176,7 +176,7 @@
<!-- About WebGoat Modal -->
<div class="modal fade" id="aboutModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal" id="about-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<jsp:include page="../pages/about.jsp"/>

4
webgoat-container/src/main/webapp/css/main.css
View File

@ -659,6 +659,10 @@ fieldset[disabled] .btn-warning.active {
max-height: 375px;
overflow-y: auto;
}
#about-modal {
opacity: 95%;
}
/* ==========================================================================
Media Queries
========================================================================== */

9
webgoat-container/src/main/webapp/js/goatApp/controller/LessonController.js
View File

@ -11,7 +11,8 @@ define(['jquery',
'goatApp/view/CookieView',
'goatApp/view/ParamView',
'goatApp/model/ParamModel',
'goatApp/support/GoatUtils'
'goatApp/support/GoatUtils',
'goatApp/view/UserAndInfoView'
],
function($,
_,
@ -26,7 +27,8 @@ define(['jquery',
CookieView,
ParamView,
ParamModel,
GoatUtils
GoatUtils,
UserAndInfoView
) {
'use strict'
@ -36,8 +38,11 @@ define(['jquery',
this.lessonView = options.lessonView;
_.extend(Controller.prototype,Backbone.Events);
this.start = function() {
this.listenTo(this.lessonContent,'contentLoaded',this.onContentLoaded);
//'static' elements of page/app
this.userAndInfoView = new UserAndInfoView();
};
//load View, which can pull data
this.loadLesson = function(scr,menu,stage) {

45
webgoat-container/src/main/webapp/js/goatApp/view/UserAndInfoView.js Normal file
View File

@ -0,0 +1,45 @@
//UserAndInfoView
define(['jquery',
'underscore',
'backbone'],
function($,
_,
Backbone) {
return Backbone.View.extend({
el:'#user-and-info-nav', //Check this,
events: {
'click #about-button': 'showAboutModal',
'click #user-menu': 'showUserMenu'
},
initialize: function() {
},
render:function(title) {
},
showUserMenu: function() {
var menu = this.$el.find('.dropdown-menu');
if (menu.is(':visible')) {
menu.hide(200);
} else {
menu.show(400);
/*menu.on('mouseout', function() {
$('#user-and-info-nav .dropdown-menu').hide(200);
});*/
}
},
showAboutModal: function() {
$('#about-modal').show(400);
$('#about-modal div.modal-header button.close').unbind('click').on('click', function() {
$('#about-modal').hide(200);
});
}
});
});