lab-exercises-detail.html
7.95 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
<!--Body-->
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<div class="bodyWrap row" ng-controller="LabExercController">
<div class="" ng-init="GetQuizByTopic()">
<div class="col-sm-12 pageHeading" id="LabExPageHeading">
<!--<button type="button" class="btn btn-default pull-left toggleBar hidden-lg"> <i class="fa fa-bars"></i> </button>
<div class=" pull-left toggleBar toggleHeadingButton" data-toggle="tooltip" data-placement="top" title="Show/Hide Sidebar"> <i class="fa fa-bars"></i> </div>-->
<h4 class="pull-left">Lab Exercise - {{LabExerciseName}}</h4>
<div class="pull-right btn-group paddTop4"> <a href="#" class="btn btn-xs btn-default" ng-click="minLabExPanel()"><i class="fa fa-minus"></i></a> <a href="#" class="btn btn-xs btn-default"><i class="fa fa-clone"></i></a> <a href="lab-exercises" ng-click="IsVisible()" class="btn btn-xs btn-default"><i class="fa fa-close"></i></a> </div>
<div class="clearfix"></div>
</div>
<div class="col-sm-12">
<div class="pull-left btn-group LabEx-Panel-state-minimized" id="LabExMinimizedId">
<p class="pull-left" style="color:#fff">LAB Ex ...</p>
<a href="#" class="btn btn-xs btn-default"><i class="fa fa-minus"></i></a> <a href="#" class="btn btn-xs btn-default" ng-click="maxLabExPanel()"><i class="fa fa-clone"></i></a> <a href="lab-exercises" ng-click="IsVisible()" class="btn btn-xs btn-default"><i class="fa fa-close"></i></a>
</div>
</div>
<div class="col-sm-12">
<div class="container-fluid main-full">
<div class="row">
<div class="panel panel-default" id="labExPanel">
<div class="panel-heading">
{{activityTitle}}<p style="margin:-20px 474px -1px;" class="text-primary">{{Title}}</p>
<div class="pull-right" style="margin: -20px 20px;">
<p>Question <strong>{{quiznumber}}</strong> of {{TotalNumberofQuiz}}</p>
</div>
</div>
<div class="panel-body" style="padding:2px;overflow:scroll">
<div id="textblock" style="margin:20px;">
<div style="margin:14px;" ng-repeat="optionbox in LabExerciseModules.OptionBox" droppable="true" class="droppable ui-droppable options" id="blockbox-{{optionbox.BoxName}}">
<div ng-bind-html="deliberatelyTrustDangerousSnippet(optionbox.QuizText)"></div>
</div>
<!--<ul>
<li ng-repeat="optionbox in LabExerciseModules.OptionBox" droppable="true" ng-bind-html="'{{optionbox.QuizText}}' | to_trusted"></li>
</ul>-->
</div>
<div align="center" class="dragger">
<div class="col-sm-1" style="padding-top: 150px; height: 500px; " id="divleft" droppable="true">
<div draggable="true" ng-repeat="option in LabExerciseModules.Options | filter:{'textalign':'left'}" ng-style="{'width': '150px', 'height':'40px','font-size':'8px;','valign':'middle','text-align':'center', 'vertical-align:middle','background-color': '#808080','margin':'10px !important','float':'{{option.textalign}}'} " style="margin-bottom: 10px !important; width: 180px;" class="thumbnail caption col-sm-2 col-lg-3 ui-draggable marginR5 " id="block-{{option.OptionNumber}}">{{option.OptionTitle}}</div>
</div>
<div class="col-sm-9">
<div style="position: relative; margin-left: 70px;" id="imgdiv">
<div id="imgblock">
<img id="droppable" ng-src="content/images/LE/{{Imagepath}}" alt="" ng-click="onClick()" imageonload />
</div>
<div ng-show="IsVisible" ng-repeat="optionbox in LabExerciseModules.OptionBox" droppable="true" class="droppable ui-droppable options" id="blockbox-{{optionbox.BoxName}}" ng-style="{'top':{{optionbox.topcoord}}, 'left':{{optionbox.leftcoord}},'position': 'absolute', 'width': '155px', 'height':'30px', 'border':'0px solid #333', 'background': '#E8E8E8' }">{{optionbox.Answervalue}}</div>
<div draggable="true" ng-repeat="ans in DraggedList" droppable="true" class="droppable ui-droppable answerdroppable" id="blockans-{{ans.id}}" ng-style="{'top':{{ans.topcoord}}, 'left':{{ans.leftcoord}},'position': 'absolute', 'width': '158px', 'height':'30px', 'border':'0px solid #333', 'background': 'transparent','font-size': '12px','border-color':'#FF0000','padding-top':'5px'}">{{ans.Value}}</div>
</div>
<div class="col-sm-12" style="margin-left: 200px; margin-top: 10px; height:80px;" id="divoptions" droppable="true">
<!--<div class="col-sm-3 col-lg-3 ui-draggable" >-->
<div draggable="true" ng-repeat="option in LabExerciseModules.Options | filter:{'textalign':'bottom'}" ng-style="{'width': '150px', 'height':'40px','font-size':'8px;','valign':'middle','text-align':'center', 'vertical-align:middle','background-color': '#808080','margin':'5px !important','float':'{{option.textalign}}'} " style="margin-bottom: 5px !important; width: 180px;" class="thumbnail caption col-sm-2 col-lg-3 ui-draggable marginR5 " id="block-{{option.OptionNumber}}">{{option.OptionTitle}}</div>
<!--</div>-->
</div>
</div>
<div class="col-sm-1" style="padding-top: 150px; height: 500px; " id="divright" droppable="true">
<div draggable="true" ng-repeat="option in LabExerciseModules.Options | filter:{'textalign':'right'}" ng-style="{'width': '150px', 'height':'40px','font-size':'8px;','valign':'middle','text-align':'center', 'vertical-align:middle','background-color': '#808080','margin':'10px !important','float':'{{option.textalign}}'} " style="margin-bottom: 10px !important; width: 180px;" class="thumbnail caption col-sm-2 col-lg-3 ui-draggable marginR5 " id="block-{{option.OptionNumber}}">{{option.OptionTitle}}</div>
</div>
</div>
</div>
<div class="panel-footer">
<div class="pull-left">
<!--<p>Question <strong>{{quiznumber}}</strong> of {{TotalNumberofQuiz}}</p>-->
</div>
<div class="pull-right">
<div class="btn-group pull-left marginR5">
<button class="btn btn-sm btn-primary">Save</button>
<button class="btn btn-sm btn-primary" ng-click="ReviewAttempt()">Review Your Attempt</button>
<button class="btn btn-sm btn-primary" ng-click="resetQuiz()">Reset</button>
</div>
<div class="btn-group">
<button class="btn btn-sm btn-black" ng-click="prevQuiz()"><i class="fa fa-arrow-left"></i></button>
<button class="btn btn-sm btn-black" ng-click="nextQuiz()"><i class="fa fa-arrow-right"></i></button>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>