ADAM / AIAHTML5

Commit 3961a190e226fa0f321aa42a5a357ae324f11fe5

Authored by Amit Kumar
1 parent d776869b

Drag and drop the option into the option box - done

Inline Side-by-side
Showing 3 changed files with 112 additions and 50 deletions
400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js
  View file @3961a19
... ... @@ -95,7 +95,7 @@ function ($scope, $rootScope, pages, log, $http, DataService, $filter, $location
95 95 if (result.LabExercise[index].Questions[index1].ImagePath == "") {
96 96 $("#imgblock").css("display", "none");
97 97 $("#textblock").css("display", "block");
98   - $scope.LabExerciseModules = result.LabExercise[index].Questions[index1];
  98 + $scope.LabExerciseModules = result.LabExercise[index].Questions[index1];
99 99 $scope.activityTitle = result.LabExercise[index].Questions[index1].activityTitle;
100 100 $scope.Title = result.LabExercise[index].Questions[index1].Title;
101 101 }
... ... @@ -107,14 +107,15 @@ function ($scope, $rootScope, pages, log, $http, DataService, $filter, $location
107 107 $scope.Title = result.LabExercise[index].Questions[index1].Title;
108 108 $scope.Imagepath = keywords.topic + "/" + result.LabExercise[index].Questions[index1].ImagePath;
109 109 }
110   -
  110 + $scope.ShowHideDiv(result.LabExercise[index].Questions[index1].Options[0].textalign);
111 111 }
112 112 });
113 113 //$scope.quiznumber++;
  114 +
114 115 }
115 116  
116 117 });
117   -
  118 + //$scope.ShowHideDiv();
118 119 },
119 120 function (error) {
120 121 console.log(error.statusText)
... ... @@ -128,7 +129,7 @@ function ($scope, $rootScope, pages, log, $http, DataService, $filter, $location
128 129 else
129 130 $scope.quiznumber++;
130 131 $scope.resetQuiz();
131   -
  132 + $scope.ShowHideDiv();
132 133 }
133 134  
134 135 $scope.prevQuiz = function () {
... ... @@ -138,6 +139,7 @@ function ($scope, $rootScope, pages, log, $http, DataService, $filter, $location
138 139 $scope.quiznumber--;
139 140  
140 141 $scope.resetQuiz();
  142 + $scope.ShowHideDiv();
141 143 }
142 144  
143 145 $scope.handleDragStart = function (e) {
... ... @@ -161,50 +163,94 @@ function ($scope, $rootScope, pages, log, $http, DataService, $filter, $location
161 163 var id = $(this).attr("id");
162 164 var keywords = $location.search();
163 165 var dataText = e.dataTransfer.getData('text/plain');
164   - var commondataJsonPath = '~/../content/data/json/le/' + keywords.topic + '.json';
165   - DataService.getAnotherJson(commondataJsonPath).then(
166   - function (result) {
  166 + if (id == "divoptions" || id == "divleft" || id == "divright") {
  167 + var item = $('#' + $scope.dragableId).html();
  168 + var rindex = $scope.DraggedList.indexOf(item);
  169 + var commondataJsonPath = '~/../content/data/json/le/' + keywords.topic + '.json';
  170 + DataService.getAnotherJson(commondataJsonPath).then(
  171 + function (result) {
  172 +
  173 + $.each(result.LabExercise, function (index, value) {
  174 + if (result.LabExercise[index].Slug == keywords.topic) {
  175 + $.each(result.LabExercise[index].Questions, function (index1, value1) {
  176 + if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
  177 + var Options = result.LabExercise[index].Questions[index1].Options;
  178 + $.each(Options, function (inx, value2) {
  179 + if (Options[inx].OptionTitle == item) {
  180 + if ($scope.DraggedList != null) {
  181 + $.each($scope.DraggedList, function (inx1, value3) {
  182 +
  183 + if ($scope.DraggedList[inx1].Value == item) {
  184 + $scope.DraggedList.splice(inx1, 1);
  185 + $('#block-' + Options[inx].OptionNumber).css("display", "block");
  186 + }
  187 + });
  188 + }
  189 + }
  190 + });
  191 + }
  192 + });
  193 + }
167 194  
168   - $.each(result.LabExercise, function (index, value) {
169   - if (result.LabExercise[index].Slug == keywords.topic) {
  195 + });
170 196  
171   - $.each(result.LabExercise[index].Questions, function (index1, value1) {
172   - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
173   - var Options = result.LabExercise[index].Questions[index1].OptionBox;
174   - $.each(Options, function (inx, value2) {
175   - if (Options[inx].BoxName == id.split('-')[1]) {
176   - if ($scope.DraggedList != null) {
177   - $.each($scope.DraggedList, function (inx1, value3) {
178   -
179   - if ($scope.DraggedList[inx1].Value == dataText) {
180   - $scope.DraggedList.splice(inx1, 1);
181   - }
182   - });
  197 + },
  198 + function (error) {
  199 + console.log(error.statusText)
  200 + }
  201 + )
  202 + }
  203 + else {
  204 +
  205 + var commondataJsonPath = '~/../content/data/json/le/' + keywords.topic + '.json';
  206 + DataService.getAnotherJson(commondataJsonPath).then(
  207 + function (result) {
  208 + $.each(result.LabExercise, function (index, value) {
  209 + if (result.LabExercise[index].Slug == keywords.topic) {
  210 + $.each(result.LabExercise[index].Questions, function (index1, value1) {
  211 + if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
  212 + var Options = result.LabExercise[index].Questions[index1].OptionBox;
  213 + $.each(Options, function (inx, value2) {
  214 + if (Options[inx].BoxName == id.split('-')[1]) {
  215 + if ($scope.DraggedList != null) {
  216 + $.each($scope.DraggedList, function (inx1, value3) {
  217 +
  218 + if ($scope.DraggedList[inx1].Value == dataText) {
  219 + $scope.DraggedList.splice(inx1, 1);
  220 + }
  221 + });
  222 + }
  223 +
  224 + $scope.DraggedList.push({ "id": id.split('-')[1], "optionName": id.split('-')[1], "Value": dataText, "topcoord": Options[inx].topcoord, "leftcoord": Options[inx].leftcoord });
  225 + //$('#' + $scope.dragableId).remove();
  226 + $('#' + $scope.dragableId).css("display", "none");
  227 + //$('#' + id).remove();
183 228 }
  229 + });
  230 + }
  231 + });
  232 + }
184 233  
185   - $scope.DraggedList.push({ "id": id.split('-')[1], "optionName": id.split('-')[1], "Value": dataText, "topcoord": Options[inx].topcoord, "leftcoord": Options[inx].leftcoord });
186   - $('#' + $scope.dragableId).remove();
187   - //$('#' + id).remove();
188   - }
189   - });
190   - }
191   - });
192   - }
193   -
194   - });
  234 + });
195 235  
196   - },
197   - function (error) {
198   - console.log(error.statusText)
  236 + },
  237 + function (error) {
  238 + console.log(error.statusText)
  239 + }
  240 + )
199 241 }
200   - )
201 242 $scope.$apply();
  243 + //alert($("#divoptions").css("display") + "," + $("#divoptions").html());
  244 + //if ($("#divoptions").css("display") == "block" && $("#divoptions").html()=="")
  245 + //{
  246 + // $("#divoptions").html("<br><br><br><br>")
  247 + //}
202 248 };
203 249  
204 250 $scope.handleDragOver = function (e) {
205 251 e.preventDefault(); // Necessary. Allows us to drop.
206 252 e.dataTransfer.dropEffect = 'move'; // See the section on the DataTransfer object.
207   - return false;
  253 + //return false;
208 254 };
209 255  
210 256 $scope.resetQuiz = function () {
... ... @@ -252,6 +298,22 @@ function ($scope, $rootScope, pages, log, $http, DataService, $filter, $location
252 298 )
253 299 };
254 300  
  301 + $scope.ShowHideDiv = function (status) {
  302 +
  303 + if (status == "bottom") {
  304 + $("#divright").css("display", "none");
  305 + $("#divleft").css("display", "none");
  306 + $("#divoptions").css("display", "block");
  307 +
  308 + }
  309 + else {
  310 + $("#divright").css("display", "block");
  311 + $("#divleft").css("display", "block");
  312 + $("#divoptions").css("display", "none");
  313 + }
  314 +
  315 + };
  316 +
255 317 }]
256 318  
257 319 );
... ...
400-SOURCECODE/AIAHTML5.Web/app/views/LabExerc/lab-exercises-detail.html
  View file @3961a19
... ... @@ -32,27 +32,27 @@
32 32 </ul>-->
33 33 </div>
34 34 <div align="center" class="dragger">
35   - <div class="col-sm-2">
36   - <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':'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>
  35 + <div class="col-sm-2" style="padding-top: 150px; height: 500px; " id="divleft" droppable="true">
  36 + <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>
37 37 </div>
38 38 <div class="col-sm-8">
39 39 <div style="position: relative;" id="imgdiv">
40 40 <div id="imgblock">
41   - <img id="droppable" ng-src="content/images/LE/{{Imagepath}}" droppable="true" alt="" ng-click="onClick()" imageonload />
  41 + <img id="droppable" ng-src="content/images/LE/{{Imagepath}}" alt="" ng-click="onClick()" imageonload />
42 42 </div>
43 43  
44 44 <div 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>
45 45 <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': '#E8E8E8','font-size': '12px','border-color':'#FF0000','padding-top':'5px'}">{{ans.Value}}</div>
46 46 </div>
47 47  
48   - <div class="col-sm-12" style="margin-left:100px;margin-top:0px;" id="divoptions" droppable="true">
  48 + <div class="col-sm-12" style="margin-left: 100px; margin-top: 0px; height:80px;" id="divoptions" droppable="true" >
49 49 <!--<div class="col-sm-3 col-lg-3 ui-draggable" >-->
50 50 <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>
51 51 <!--</div>-->
52 52 </div>
53 53 </div>
54   - <div class="col-sm-2">
55   - <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':'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>
  54 + <div class="col-sm-2" style="padding-top: 150px; height: 500px; " id="divright" droppable="true">
  55 + <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>
56 56 </div>
57 57 </div>
58 58 </div>
... ...
400-SOURCECODE/AIAHTML5.Web/content/data/json/le/CS.json
  View file @3961a19
... ... @@ -46,10 +46,10 @@
46 46 {"BoxName": "T3","topcoord":"242","leftcoord":"12","Answervalue":"","QuizText":""},{"BoxName": "T4","topcoord":"2","leftcoord":"600","Answervalue":"","QuizText":""},
47 47 {"BoxName": "T5","topcoord":"41","leftcoord":"600","Answervalue":"","QuizText":""},{"BoxName": "T6","topcoord":"186","leftcoord":"600","Answervalue":"","QuizText":""},
48 48 {"BoxName": "T7","topcoord":"239","leftcoord":"600","Answervalue":"","QuizText":""},{"BoxName": "T8","topcoord":"387","leftcoord":"600","Answervalue":"","QuizText":""}],
49   - "Options": [{"OptionNumber": "A","OptionTitle": "Left pulmonary artery"},{"OptionNumber": "B","OptionTitle": "Left subclavian artery"},
50   - {"OptionNumber": "C","OptionTitle": "Right brachiocephalic vein"},{"OptionNumber": "D","OptionTitle": "Left common carotid artery"},
51   - {"OptionNumber": "E","OptionTitle": "Right pulmonary artery"},{"OptionNumber": "F","OptionTitle": "Right pulmonary vein"},
52   - {"OptionNumber": "G","OptionTitle": "Left pulmonary vein"},{"OptionNumber": "H","OptionTitle": "Inferior vena cava"}],
  49 + "Options": [{"OptionNumber": "A","OptionTitle": "Left pulmonary artery","textalign":"left"},{"OptionNumber": "B","OptionTitle": "Left subclavian artery","textalign":"left"},
  50 + {"OptionNumber": "C","OptionTitle": "Right brachiocephalic vein","textalign":"left"},{"OptionNumber": "D","OptionTitle": "Left common carotid artery","textalign":"right"},
  51 + {"OptionNumber": "E","OptionTitle": "Right pulmonary artery","textalign":"right"},{"OptionNumber": "F","OptionTitle": "Right pulmonary vein","textalign":"right"},
  52 + {"OptionNumber": "G","OptionTitle": "Left pulmonary vein","textalign":"right"},{"OptionNumber": "H","OptionTitle": "Inferior vena cava","textalign":"right"}],
53 53 "correctResponse": [{"OptionBox": "T1","Answer": "B"},{"OptionBox": "T2","Answer": "A"},{"OptionBox": "T3","Answer": "G"},{"OptionBox": "T4","Answer": "D"},
54 54 {"OptionBox": "T5","Answer": "C"},{"OptionBox": "T6","Answer": "E"},{"OptionBox": "T7","Answer": "F"},{"OptionBox": "T8","Answer": "H"}]
55 55 },
... ... @@ -62,10 +62,10 @@
62 62 {"BoxName": "T3","topcoord":"277","leftcoord":"12","Answervalue":"","QuizText":""},{"BoxName": "T4","topcoord":"387","leftcoord":"12","Answervalue":"","QuizText":""},
63 63 {"BoxName": "T5","topcoord":"236","leftcoord":"621","Answervalue":"","QuizText":""},{"BoxName": "T6","topcoord":"301","leftcoord":"621","Answervalue":"","QuizText":""},
64 64 {"BoxName": "T7","topcoord":"395","leftcoord":"621","Answervalue":"","QuizText":""}],
65   - "Options": [{"OptionNumber": "A","OptionTitle": "Occipital artery"},{"OptionNumber": "B","OptionTitle": "Superficial temporal artery"},
66   - {"OptionNumber": "C","OptionTitle": "External carotid artery"},{"OptionNumber": "D","OptionTitle": "Internal carotid artery"},
67   - {"OptionNumber": "E","OptionTitle": "Facial artery"},{"OptionNumber": "F","OptionTitle": "Vertebral artery"},
68   - {"OptionNumber": "G","OptionTitle": "Common carotid artery"}],
  65 + "Options": [{"OptionNumber": "A","OptionTitle": "Occipital artery","textalign":"left"},{"OptionNumber": "B","OptionTitle": "Superficial temporal artery","textalign":"left"},
  66 + {"OptionNumber": "C","OptionTitle": "External carotid artery","textalign":"left"},{"OptionNumber": "D","OptionTitle": "Internal carotid artery","textalign":"left"},
  67 + {"OptionNumber": "E","OptionTitle": "Facial artery","textalign":"right"},{"OptionNumber": "F","OptionTitle": "Vertebral artery","textalign":"right"},
  68 + {"OptionNumber": "G","OptionTitle": "Common carotid artery","textalign":"right"}],
69 69 "correctResponse": [{"OptionBox": "T1","Answer": "B"},{"OptionBox": "T2","Answer": "A"},{"OptionBox": "T3","Answer": "D"},{"OptionBox": "T4",
70 70 "Answer": "F"},{"OptionBox": "T5","Answer": "C"},{"OptionBox": "T6","Answer": "E"},{"OptionBox": "T7","Answer": "G"}]
71 71 },
... ...