additonal help control changes

This commit is contained in:
Jason White 2015-07-08 19:54:29 -04:00
parent 6312b1a08c
commit 7ace23ec0c
13 changed files with 105 additions and 46 deletions

View File

@ -34,7 +34,7 @@
</div><!--toggle navigation end-->
<div class="lessonTitle" >
<h1 id="lessonTitle">Please login</h1>
</div><!--lesson title end-->
</header>

View File

@ -54,8 +54,8 @@
<i class="fa fa-bars"></i>
</button>
</div><!--toggle navigation end-->
<div id="lessonTitleWrapper" >
<h1 class="lessonTitle"></h1>
<div id="lesson-title-wrapper" >
</div><!--lesson title end-->
<div class="user-nav pull-right" style="margin-right: 75px;">
<div class="dropdown" style="display:inline">
@ -98,13 +98,13 @@
<div class="col-md-8">
<div class="col-md-12" align="left">
<div class="panel" id="help-controls">
<div id="help-buttons" class="panel-body">
<!-- <div id="help-buttons" class="panel-body"> -->
<!-- <button type="button" id="showSourceBtn" ng-show="showSource" class="btn btn-primary btn-xs" onclick="showLessonSource()">Java [Source]</button>
<button type="button" id="showSolutionBtn" class="btn btn-primary btn-xs" onclick="showLessonSolution()">Solution</button>
<button type="button" id="showPlanBtn" class="btn btn-primary btn-xs" onclick="showLessonPlan()">Lesson Plan</button>
<button type="button" id="showHintsBtn" ng-show="showHints" class="btn btn-primary btn-xs" onclick="viewHints()">Hints</button>
<button type="button" id="restartLessonBtn" class="btn btn-xs" onclick="restartLesson()">Restart Lesson</button> -->
</div>
<!-- </div> -->
</div>
<div class="lessonHelp" id="lesson-hint-row">
<h4>Hints</h4>

View File

@ -1,2 +1,2 @@
#lessonTitle {position:absolute;left:94px;top:75px;width:690px;height:22px;z-index:1;float: right;font-size: 20px;color: #FFFFFF;}
#lesson-title {position:absolute;left:94px;top:75px;width:690px;height:22px;z-index:1;float: right;font-size: 20px;color: #FFFFFF;}
#hMenuBar {position:absolute;left:245px;top:108px;width:538px;height:22px;z-index:2;}

View File

@ -132,7 +132,7 @@ img {
#header .user-nav button:hover i {
color: #F6F6F6;
}
#header .lessonTitle {
#header #lesson-title-wrapper {
display: inline-block;
margin:0 0 0 20px;
}
@ -849,8 +849,16 @@ cookieContainer {
cursor: pointer;
}
.info {
color:#e84c3d;
font-weight: bold;
}
#help-controls {
padding-left: 4px;
padding-top: 4px
}
.help-button {
margin-right:4px;
}

View File

@ -6,7 +6,8 @@ define(['jquery',
'goatApp/view/PlanView',
'goatApp/view/SourceView',
'goatApp/view/SolutionView',
'goatApp/view/LessonHintView'
'goatApp/view/LessonHintView',
'goatApp/view/HelpControlsView'
],
function($,
_,
@ -16,7 +17,8 @@ define(['jquery',
PlanView,
SourceView,
SolutionView,
LessonHintView
LessonHintView,
HelpControlsView
) {
'use strict'
@ -33,7 +35,7 @@ define(['jquery',
_.extend(Controller.prototype,Backbone.Events);
this.start = function() {
this.listenTo(this.lessonContent,'contentLoaded',this.onContentLoaded);
}
};
//load View, which can pull data
this.loadLesson = function(scr,menu) {
@ -60,19 +62,37 @@ define(['jquery',
//load title view (initially hidden) << currently handled via menu click but need to be able to handle via routed request
//plan view (initially hidden)
this.planView = new PlanView();
this.listenTo(this.planView,'plan:loaded',this.areHelpsReady);
//solution view (initially hidden)
this.solutionView = new SolutionView();
this.listenTo(this.solutionView,'solution:loaded',this.areHelpsReady);
//source (initially hidden)
this.sourceView = new SourceView();
this.listenTo(this.sourceView,'source:loaded',this.areHelpsReady);
//load help controls view (contextul to what helps are available)
this.lessonHintView = new LessonHintView();
this.listenTo(this.lessonHintView,'hints:loaded',this.areHelpsReady);
},
this.areHelpsReady = function (curHelp) {
this.helpsLoaded[curHelp.helpElement] = curHelp.value;
// check if all are ready
}
};
this.areHelpsReady = function (curHelp) {
this.addCurHelpState(curHelp);
// check if all are ready
if (this.helpsLoaded['hints'] && this.helpsLoaded['plan'] && this.helpsLoaded['solution'] && this.helpsLoaded['source']) {
//
this.helpControlsView = new HelpControlsView({
hasPlan:(this.planView.model.get('content') !== null),
hasSolution:(this.solutionView.model.get('content') !== null),
hasSource:(this.sourceView.model.get('content') !== null),
hasHints:(this.lessonHintView.collection.length > 0),
});
this.helpControlsView.render();
}
};
this.addCurHelpState = function (curHelp) {
this.helpsLoaded[curHelp.helpElement] = curHelp.value;
};
};
return Controller;
});

View File

@ -18,4 +18,4 @@ define(['jquery',
this.trigger('menuData:loaded');
}
});
})
});

View File

@ -8,18 +8,3 @@ define(['jquery',
});
});
// accordionMenu = function(id) {
// if ($('ul#' + id).attr('isOpen') == 0) {
// $scope.expandMe = true;
// } else {
// $('ul#' + id).slideUp(300).attr('isOpen', 0);u
// return;
// }
// $scope.openMenu = id;
// $('.lessonsAndStages').not('ul#' + id).slideUp(300).attr('isOpen', 0);
// if ($scope.expandMe) {
// $('ul#' + id).slideDown(300).attr('isOpen', 1);
// }
// }

View File

@ -4,6 +4,14 @@ define(['jquery',
function($,_,Backbone) {
return Backbone.View.extend({
el:'#help-controls', //Check this
helpButtons: {
//TODO: move this into a template
showSource:$('<button>',{id:'showSourceBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Java [Source]'}),
showSolution:$('<button>',{id:'showSolutionBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Solution'}),
showPlan:$('<button>',{id:'showPlanBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Lesson Plan]'}),
showHints:$('<button>',{id:'showHintsBtn','class':'btn btn-primary btn-xs help-button',type:'button',text:'Hints'}),
restartLesson:$('<button>',{id:'restartLessonBtn','class':'btn btn-xs help-button',type:'button',text:'Restart Lesson'})
},
initialize: function (options) {
if (!options) {
return;
@ -14,7 +22,20 @@ function($,_,Backbone) {
this.hasHints = options.hasHints;
},
render:function(title) {
if (this.hasSource) {
this.$el.append(this.helpButtons.showSource);
}
if (this.hasSolution) {
this.$el.append(this.helpButtons.showSolution);
}
if (this.hasPlan) {
this.$el.append(this.helpButtons.showPlan);
}
if (this.hasHints) {
this.$el.append(this.helpButtons.showHints);
}
//
this.$el.append(this.helpButtons.restartLesson);
}
});
});

View File

@ -0,0 +1,23 @@
define(['jquery',
'underscore',
'backbone',
'goatApp/model/LessonSourceModel'],
function($,
_,
Backbone,
LessonSourceModel) {
return Backbone.View.extend({
el:'#lessonHelpWrapper .lessonHelp.lessonPlan', //Check this
initialize: function() {
this.model = new LessonSourceModel();
this.listenTo(this.model,'loaded',this.onModelLoaded);
this.model.loadData();
},
render:function(title) {
},
onModelLoaded: function() {
this.trigger(this.loadedMessage,this.helpElement);
}
});
});

View File

@ -17,7 +17,7 @@ function($,
},
onModelLoaded: function() {
// ???
this.trigger('plan:loaded',{'helpElement':'plan','value':true});
}
});
});

View File

@ -2,6 +2,7 @@ define(['jquery',
'underscore',
'backbone',
'goatApp/model/LessonSolutionModel'],
//TODO: create a base 'HelpView class'
function($,_,Backbone,LessonSolutionModel) {
return Backbone.View.extend({
el:'#lessonHelpWrapper .lessonHelp.lessonSolution', //Check this
@ -9,12 +10,13 @@ function($,_,Backbone,LessonSolutionModel) {
this.model = new LessonSolutionModel();
this.listenTo(this.model,'loaded',this.onModelLoaded);
this.model.loadData();
//TODO: handle error cases
},
render:function(title) {
},
onModelLoaded: function() {
// ???
this.trigger('solution:loaded',{'helpElement':'solution','value':true});
}
});
});

View File

@ -1,23 +1,21 @@
define(['jquery',
'underscore',
'backbone',
'goatApp/model/LessonSourceModel'],
'goatApp/model/LessonSourceModel',
'goatApp/view/HelpView'],
function($,
_,
Backbone,
LessonSourceModel) {
return Backbone.View.extend({
LessonSourceModel,
HelpView) {
return HelpView.extend({
helpElement:{'helpElement':'source','value':true},
loadedMessage:'source:loaded',
el:'#lessonHelpWrapper .lessonHelp.lessonPlan', //Check this
initialize: function() {
this.model = new LessonSourceModel();
this.listenTo(this.model,'loaded',this.onModelLoaded);
this.model.loadData();
},
render:function(title) {
},
onModelLoaded: function() {
// ???
}
});
});

View File

@ -3,9 +3,11 @@ define(['jquery',
'backbone'],
function($,_,Backbone) {
return Backbone.View.extend({
el:'#lessonTitleWrapper',
el:'#header #lesson-title-wrapper',
render:function(title) {
this.$el.find('.lessonTitle').html(title);
var lessonTitleEl = $('<h1>',{id:'lesson-title',text:title});
this.$el.html(lessonTitleEl);
//this.$el.append(lessonTitleEl);
}
});
});