ADAM / AIAHTML5

Commit 8b10530d546d11fbd83e0b3f2a1ff9bcd7f97b5c

Authored by Amrita Vishnoi
2 parents 09b72f94 c1a9ec90

against Merge Request #875

Inline Side-by-side
Showing 5 changed files with 414 additions and 1079 deletions
400-SOURCECODE/AIAHTML5.Web/AIAHTML5.Web.csproj
  View file @8b10530
... ... @@ -45186,6 +45186,7 @@
45186 45186 <Content Include="libs\angular\1.4.9\angular-route.min.js" />
45187 45187 <Content Include="libs\angular\1.4.9\ngStorage.js" />
45188 45188 <Content Include="libs\colorpicker\jquery.minicolors.min.js" />
  45189 + <Content Include="libs\DragDropTouch.js" />
45189 45190 <Content Include="libs\FileSaver.js" />
45190 45191 <Content Include="libs\html2canvas.js" />
45191 45192 <Content Include="libs\jcanvas\jcanvas.handle.min.js" />
... ...
400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js
  View file @8b10530
... ... @@ -400,8 +400,8 @@ function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter,
400 400 $scope.handleDragStart = function (e) {
401 401  
402 402 this.style.opacity = '0.4';
403   - var $ua = navigator.userAgent;
404   - if ($.browser.msie || ($ua.match(/(iPod|iPhone|iPad|android)/i))) {
  403 +
  404 + if ($.browser.msie) {
405 405 localStorage.setItem("text", this.innerHTML);
406 406 }
407 407 else
... ... @@ -470,8 +470,8 @@ function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter,
470 470 //console.log($rootScope.selectedDivArray);
471 471  
472 472 var keywords = $location.search();
473   - var $ua = navigator.userAgent;
474   - if ($.browser.msie || ($ua.match(/(iPod|iPhone|iPad|android)/i))) {
  473 +
  474 + if ($.browser.msie) {
475 475 dataText = localStorage.getItem("text");
476 476 localStorage.setItem("text", '');
477 477 }
... ... @@ -545,7 +545,6 @@ function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter,
545 545 // }
546 546 //});
547 547 for (var i = 0; i <= $scope.DraggedList.length - 1; i++) {
548   -
549 548 if ($scope.DraggedList[i].Value == undefined) {
550 549 i = 0;
551 550 continue;
... ... @@ -1063,8 +1062,6 @@ AIA.directive(&#39;draggable&#39;, function () {
1063 1062 element[0].addEventListener('dragstart', $scope.handleDragStart, false);
1064 1063 element[0].addEventListener('dragend', $scope.handleDragEnd, false);
1065 1064  
1066   - element[0].addEventListener('touchstart', $scope.handleDragStart, false);
1067   - element[0].addEventListener('touchend', $scope.handleDragEnd, false);
1068 1065 }
1069 1066 }
1070 1067 });
... ... @@ -1075,8 +1072,7 @@ AIA.directive(&#39;droppable&#39;, function () {
1075 1072 element[0].addEventListener('drop', $scope.handleDrop, false);
1076 1073 element[0].addEventListener('dragover', $scope.handleDragOver, false);
1077 1074  
1078   - element[0].addEventListener('touchmove', $scope.handleDragOver, false);
1079   - element[0].addEventListener('touchend', $scope.handleDrop, false);
  1075 +
1080 1076 }
1081 1077 }
1082 1078 });
... ...
400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js.orig deleted
View file @09b72f9
1   -/// <reference path="../../content/data/json/le/LabExercise.js" />
2   -AIA.controller("LabExercController", ["$scope", "$rootScope", "pages", "$log", '$http','$timeout', 'DataService', '$filter', '$location', '$document', '$sce', "$compile", "$location", "LabExerciseService","AIAConstants",
3   -function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter, $location, $document, $sce, $compile, $location, LabExerciseService,AIAConstants) {
4   - $scope.$sce = $sce;
5   - $scope.LabExerciseName;
6   - $scope.LabExerciseQuiz = null;
7   - $scope.TotalNumberofQuiz = "0";
8   - $scope.quiznumber = 1;
9   - $scope.activityTitle = "";
10   - $scope.Title = "";
11   - $scope.Imagepath = "";
12   - $scope.DraggedList = [];
13   - $scope.UserAttempt = [];
14   - $scope.UserAnswersForAllQuestions = [];
15   - $scope.LabExerciseUserData = [];
16   - $scope.LabExercise = [];
17   - $scope.dragableId = "";
18   - $scope.UserAttempt = [];
19   - $scope.blReviewAttempt = false;
20   - $scope.isResetClicked = false;
21   - $scope.$on('$viewContentLoaded', function (event) {
22   - // code that will be executed ...
23   - // every time this view is loaded
24   -
25   - //get current path
26   - var currentURL = $location.path();
27   - var selectedModuleName = '';
28   - //set module title
29   - angular.forEach($rootScope.userModules, function (value, key) {
30   - if (value.slug === currentURL.replace('/', '')) {
31   - selectedModuleName = value.name;
32   - }
33   - $rootScope.currentActiveModuleTitle = selectedModuleName;
34   - })
35   -
36   -<<<<<<< HEAD
37   - $scope.showTabButton = false;
38   - //$rootScope.currentActiveModuleTitle = pages[8].name;
39   -=======
40   - $scope.showme = false;
41   - $rootScope.currentActiveModuleTitle = pages[8].name;
42   ->>>>>>> d0fe2dca5c316aa0281ac40abe66d1137c1f4e7f
43   - $scope.getLabExerciseModules();
44   -
45   - $scope.scroll();
46   - $document.find('div#divoptions div.thumbnail').draggable();
47   - //$document.find("#droppable").droppable({
48   - // drop: function (event, ui) {
49   - // $(this)
50   - // .find("img")
51   - // .html("Dropped!");
52   - // }
53   - //});
54   -
55   - });
56   -
57   - // $scope.showme = false;
58   - $scope.IsVisible = function () {
59   - // $scope.scroll();
60   -
61   -
62   - }
63   -
64   - $scope.scroll = function () {
65   - // $window.scrollTo(0, 0);
66   - $("html,body").scrollTop(0);
67   - //alert("scroll");
68   - }
69   - // $rootScope.currentActiveModuleTitle = pages[8].Name;
70   -
71   - //to get all lab exercise modules from json files
72   - $scope.getLabExerciseModules = function () {
73   - //debugger;
74   - $scope.LabExerciseModules1 = null;
75   - var labExerciseModulePath = '~/../content/data/json/le/labexercise.json';
76   -
77   - DataService.getAnotherJson(labExerciseModulePath).then(
78   - function (result) {
79   - //debugger;
80   - //alert(JSON.stringify(result));
81   - $scope.LabExerciseModules1 = result;
82   - },
83   - function (error) {
84   - console.log(error.statusText)
85   - }
86   - )
87   - }
88   -
89   - $scope.getLabExerciseTitle = function (title) {
90   - $rootScope.menuLabExer = 1;
91   - $scope.quiznumber = 1;
92   -
93   - if (title != null) {
94   - $scope.LabExerciseQuiz = title;
95   - $scope.LabExerciseName = title.Topic;
96   - $scope.LabExerciseUserData = [];
97   - $location.url("/lab-exercises-detail?labexercise=" + (title.Slug || ""));
98   - }
99   -
100   - }
101   -
102   - $scope.InitializeLabExercise = function () {
103   -
104   - var keywords = $location.search();
105   - $scope.labExercideIdentifier = (keywords.labexercise.replace('.json', '')).split('dat_')[1];
106   - var labExerciseInfo = {
107   - userId: JSON.parse(localStorage.getItem('loggedInUserDetails')).Id,
108   - identifier: $scope.labExercideIdentifier,
109   - };
110   - LabExerciseService.GetLabExercise(labExerciseInfo)
111   - .then(
112   -
113   - function (labResult) {
114   - if (labResult != undefined && labResult.lastQuestion>0 && labResult != AIAConstants.SAVED_LAB_EXERCISE_NOT_FOUND) {
115   - $scope.SavedLabExercise = labResult;
116   - $scope.quiznumber = $scope.SavedLabExercise.lastQuestion;
117   - $scope.initialQuestioNo = $scope.SavedLabExercise.lastQuestion;
118   - $scope.GetQuizByTopic();
119   - }
120   - else {
121   - $scope.GetQuizByTopic();
122   - }
123   - },
124   - function(error){
125   - console.log('error in getting save ddata');
126   - }
127   - )
128   - }
129   -
130   - $scope.GetQuizByTopic = function () {
131   -
132   - $rootScope.isLoading = true;
133   - $('#spinner').css('visibility', 'visible');
134   -
135   - var keywords = $location.search();
136   - $scope.LabExerciseName = keywords.labexercise;
137   - $scope.LabExerciseModules = null;
138   - $scope.LabExerciseBoxes = null;
139   -
140   - //alert($scope.LabExerciseName)
141   - var labExerciseModulePath = '~/../content/data/json/le/' + $scope.LabExerciseName + '.json';
142   -
143   - DataService.getAnotherJson(labExerciseModulePath).then(
144   - function (result) {
145   - $scope.LabExData = result;
146   -
147   - var keywords = $location.search();
148   - $scope.labExercideIdentifier = (keywords.labexercise.replace('.json', '')).split('dat_')[1];
149   -
150   -
151   - $.each(result.LabExercise, function (index, value) {
152   -
153   - $scope.LabExerciseName = result.LabExercise[index].Topic;
154   - if (result.LabExercise[index].Slug == keywords.labexercise) {
155   -
156   - $scope.TotalNumberofQuiz = result.LabExercise[index].NumberofQuestions;
157   - $.each(result.LabExercise[index].Questions, function (index1, value1) {
158   - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
159   - $scope.MaxScore = result.LabExercise[index].Questions[index1].Options.length;
160   - if (result.LabExercise[index].Questions[index1].ImagePath == "") {
161   - $("#imgblock").css("display", "none");
162   - //$("#imgblock").remove();
163   - $scope.IsVisible = false;
164   - $("#textblock").css("display", "block");
165   - $scope.LabExerciseModules = result.LabExercise[index].Questions[index1];
166   - $scope.deliberatelyTrustDangerousSnippet = function (html) {
167   - //var htmltag= $compile(html)($scope);
168   - return $sce.trustAsHtml(html);
169   - };
170   - $scope.activityTitle = result.LabExercise[index].Questions[index1].activityTitle;
171   - $scope.Title = result.LabExercise[index].Questions[index1].Title;
172   - }
173   - else {
174   - $("#imgblock").css("display", "block");
175   - $scope.IsVisible = true;
176   - $("#textblock").css("display", "none");
177   - // $("#textblock").remove();
178   - $scope.LabExerciseModules = result.LabExercise[index].Questions[index1];
179   - $scope.activityTitle = result.LabExercise[index].Questions[index1].activityTitle;
180   - $scope.Title = result.LabExercise[index].Questions[index1].Title;
181   - $scope.Imagepath = keywords.labexercise + "/" + result.LabExercise[index].Questions[index1].ImagePath;
182   - }
183   - $scope.ShowHideDiv(result.LabExercise[index].Questions[index1].Options[0].textalign);
184   -
185   - }
186   - });
187   - $timeout(function ()
188   - {
189   - if ($scope.SavedLabExercise != undefined && $scope.SavedLabExercise.lastQuestion > 0) {
190   - if ($scope.isResetClicked != true) {
191   - $scope.ShowSavedLabExercise();
192   -
193   - }
194   - else {
195   - $rootScope.isLoading = false;
196   - $('#spinner').css('visibility', 'hidden');
197   - $scope.isResetClicked = false;
198   - }
199   - }
200   - else {
201   - $rootScope.isLoading = false;
202   - $('#spinner').css('visibility', 'hidden');
203   - }
204   - },100);
205   -
206   -
207   - }
208   -
209   - });
210   - //}
211   - //$scope.ShowHideDiv();
212   - },
213   - function (error) {
214   - console.log(error.statusText)
215   - }
216   - )
217   -
218   - }
219   -
220   -
221   - $scope.isReviewBtnSelected = false;
222   - // $rootScope.selectedDivArray = [];
223   - $scope.nextQuiz = function () {
224   - //need to save all questions till the current question number when user clicks on save
225   - //if ($scope.dragableId!="") {
226   - // $scope.UserAnswersForAllQuestions.push({'QuestionNo':$scope.quiznumber,'UserAnswer':$scope.UserAttempt})
227   -
228   - //}
229   - //else {
230   - // //need to anattampted question means user ahs not dragged, dropped options so save blank
231   - // $scope.UserAnswersForAllQuestions.push({ 'QuestionNo': $scope.quiznumber, 'UserAnswer': "" })
232   - //}
233   - $scope.isNextOrPreviousClicked = true;
234   - $scope.dragableId = "";
235   -
236   -
237   -
238   - if ($scope.quiznumber != $scope.TotalNumberofQuiz)
239   - {
240   - $scope.CreateLabExerciseDataToSave();
241   - }
242   -
243   -
244   - if ($scope.quiznumber == $scope.TotalNumberofQuiz)
245   - return;
246   - else
247   - $scope.quiznumber++;
248   -
249   - // console.log($rootScope.selectedDivArray);
250   -
251   -
252   -
253   - if ($scope.quiznumber == $scope.TotalNumberofQuiz) {
254   - if ($scope.isReviewBtnSelected == true) {
255   - $("#quizSubmitBtn").css("display", "none");
256   - }
257   - else {
258   - $("#quizSubmitBtn").css("display", "block");
259   - }
260   -
261   - }
262   - else
263   - {
264   - $("#quizSubmitBtn").css("display", "none");
265   - }
266   -
267   - $scope.resetQuiz();
268   - $scope.ShowHideDiv();
269   -
270   -
271   -
272   - }
273   -
274   -
275   -
276   -
277   -
278   -
279   -
280   -
281   -
282   -
283   - $scope.prevQuiz = function () {
284   -
285   - if ($scope.quiznumber != 1) {
286   - // $scope.quizQuesNo = $scope.quizQuesNo - 1;
287   - // $scope.selectedQuestionNo = $scope.quizQuesNo;
288   - $scope.CreateLabExerciseDataToSave();
289   - }
290   - $scope.dragableId = "";
291   - $scope.UserAttempt = [];
292   - if ($scope.quiznumber == 1)
293   - return;
294   - else
295   - $scope.quiznumber--;
296   -
297   - if ($scope.quiznumber == $scope.TotalNumberofQuiz) {
298   - if ($scope.isReviewBtnSelected == true) {
299   - $("#quizSubmitBtn").css("display", "none");
300   - }
301   - else {
302   - $("#quizSubmitBtn").css("display", "block");
303   - }
304   - }
305   - else {
306   - $("#quizSubmitBtn").css("display", "none");
307   - }
308   - $scope.resetQuiz();
309   - $scope.ShowHideDiv();
310   -
311   -
312   -
313   - //for (var i = 0; i <= $rootScope.selectedDivArray.length - 1; i++) {
314   - // if ($scope.quiznumber == $rootScope.selectedDivArray[i].questionNo) {
315   - // alert($rootScope.selectedDivArray[i].draggedText);
316   - // document.getElementById($rootScope.selectedDivArray[i].droppedID).innerHTML = $rootScope.selectedDivArray[i].draggedText;
317   - // // $('#'+$rootScope.selectedDivArray[i].droppedID).html($rootScope.selectedDivArray[i].draggedText);
318   - // document.getElementById($rootScope.selectedDivArray[i].droppedID).style.display = "none";
319   - // // $('#'+$rootScope.selectedDivArray[i].draggedID).css("display","none!important");
320   - // }
321   -
322   - //}
323   - }
324   -
325   -
326   - $scope.SubmitAttempt = function () {
327   -
328   - $scope.CreateLabExerciseDataToSave();
329   -
330   - $("#submitResultHtml").css("display", "block");
331   - $("#questionHtml").css("display", "none");
332   - console.log($scope.usersCorrectQuestData);
333   - $("#resultLabData").empty();
334   - var sortedQuestionHtml = '';
335   -
336   - for (var j = $scope.TotalNumberofQuiz; j >= 1; j--) {
337   - for (var i = 0; i <= $scope.usersCorrectQuestData.length - 1; i++) {
338   - if (j == $scope.usersCorrectQuestData[i].QuestionNo)
339   - {
340   - if ($scope.usersCorrectQuestData[i].CorrectStatus == "Correct") {
341   - var labExerciseHtml = $("#resultLabData").append("<tr><td>" + $scope.usersCorrectQuestData[i].QuestionNo + "</td><td>" + $scope.usersCorrectQuestData[i].title + "</td><td>" + $scope.usersCorrectQuestData[i].CorrectStatus + "</td><td><button ng-click='reviewAttemptAnswer($event);' id=" + $scope.usersCorrectQuestData[i].QuestionNo + " class='btn btn-sm' style='background-color:#007ab3;border-color:#007ab3;color:#ffffff;'><i class='fa fa-times'></i> Review</button></td></tr>");
342   - $compile(labExerciseHtml)($scope);
343   - }
344   - else {
345   - var labExerciseHtml = $("#resultLabData").append("<tr><td>" + $scope.usersCorrectQuestData[i].QuestionNo + "</td><td>" + $scope.usersCorrectQuestData[i].title + "</td><td>" + $scope.usersCorrectQuestData[i].CorrectStatus + "</td><td><button ng-click='reviewAttemptAnswer($event);' id=" + $scope.usersCorrectQuestData[i].QuestionNo + " class='btn btn-sm' style='background-color:#d9534f;border-color:#d9534f;color:#ffffff;'><i class='fa fa-times'></i> Review</button></td></tr>");
346   - $compile(labExerciseHtml)($scope);
347   - }
348   - $scope.isValueExist = true;
349   - break;
350   - }
351   - else {
352   - $scope.isValueExist = false;
353   - }
354   - }
355   - if ($scope.isValueExist == false)
356   - {
357   - var labExerciseHtml_1 = $("#resultLabData").prepend("<tr><td>" + j + "</td><td>&nbsp;</td><td>Incorrect</td><td><button ng-click='reviewAttemptAnswer($event);' id=" + j + " class='btn btn-danger btn-sm'><i class='fa fa-times'></i> Review</button></td></tr>");
358   - $compile(labExerciseHtml_1)($scope);
359   - }
360   - }
361   -
362   - for (var j = 1;j <= $scope.TotalNumberofQuiz;j++) {
363   - $("#resultLabData tr td:nth-child(1)").each(function () {
364   - if (j == $(this).text()) {
365   - $q = $(this).parent();
366   - if ($q.find("td:nth-child(3)").text() == "Correct") {
367   - sortedQuestionHtml += '<tr><td>' + $q.find("td:nth-child(1)").text() + '</td><td>' + $q.find("td:nth-child(2)").text() + '</td><td>' + $q.find("td:nth-child(3)").text() + '</td><td><button ng-click="reviewAttemptAnswer($event);" id=' + $q.find("td:nth-child(1)").text() + ' class="btn btn-sm" style="background-color:#007ab3;border-color:#007ab3;color:#ffffff;"><i class="fa fa-times"></i> Review</button></td></tr>';
368   - }
369   - else
370   - {
371   - sortedQuestionHtml += '<tr><td>' + $q.find("td:nth-child(1)").text() + '</td><td>' + $q.find("td:nth-child(2)").text() + '</td><td>' + $q.find("td:nth-child(3)").text() + '</td><td><button ng-click="reviewAttemptAnswer($event);" id=' + $q.find("td:nth-child(1)").text() + ' class="btn btn-sm" style="background-color:#d9534f;border-color:#d9534f;color:#ffffff;"><i class="fa fa-times"></i> Review</button></td></tr>';
372   - }
373   - }
374   - });
375   -
376   - }
377   - $("#resultLabData").empty();
378   - var sortedCompileHtml = $("#resultLabData").append(sortedQuestionHtml);
379   - $compile(sortedCompileHtml)($scope);
380   - $scope.inCorrectAnswer = 0;
381   - $scope.CorrectAnswer = 0;
382   - $scope.scoreResult = 0;
383   - $("#resultLabData tr td:nth-child(3)").each(function () {
384   - if ($(this).text() == "Incorrect") {
385   - $scope.inCorrectAnswer = $scope.inCorrectAnswer + 1;
386   - }
387   - else
388   - {
389   - $scope.CorrectAnswer = $scope.CorrectAnswer + 1;
390   - }
391   - });
392   -
393   - $scope.scoreResult = (parseInt($scope.CorrectAnswer) / parseInt($scope.inCorrectAnswer)) * 100;
394   - $scope.scoreResult = Math.round($scope.scoreResult);
395   -
396   - }
397   -
398   -
399   - $scope.ReportGen = function () {
400   - $("#submitResultHtml").css("display", "block");
401   - $("#questionHtml").css("display", "none");
402   - }
403   -
404   -
405   - $scope.handleDragStart = function (e) {
406   -
407   - this.style.opacity = '0.4';
408   - e.dataTransfer.setData('text/plain', this.innerHTML);
409   - $scope.dragableId = $(this).attr("Id");
410   - // alert($scope.dragableId);
411   - $scope.dragableText = $("#" + $scope.dragableId).text();
412   - // alert($("#" + $scope.dragableId).text());
413   -
414   - //if user drag already selected answer from one blankbox to another than it gets id of blank box so need to get answer
415   - if ($scope.dragableId.indexOf('T') != -1) {
416   - var optionText = document.getElementById($scope.dragableId).innerHTML;
417   - var currentQuizData = new jinqJs()
418   - .from($scope.LabExData.LabExercise[0].Questions)
419   - .where('Number == ' + $scope.quiznumber)
420   - .select();
421   - var optionData = new jinqJs()
422   - .from(currentQuizData[0].Options)
423   - .where('OptionTitle == ' + optionText)
424   - .select();
425   - var option = optionData[0].OptionNumber;
426   - $scope.dragableId = optionText + '-' + option;
427   - }
428   -
429   - //if user drag already selected answer from one blankbox to another than it gets id of blank box so need to get answer
430   - if ($scope.dragableId.indexOf('T') != -1) {
431   - var optionText = document.getElementById($scope.dragableId).innerHTML;
432   - var currentQuizData = new jinqJs()
433   - .from($scope.LabExData.LabExercise[0].Questions)
434   - .where('Number == ' + $scope.quiznumber)
435   - .select();
436   - var optionData = new jinqJs()
437   - .from(currentQuizData[0].Options)
438   - .where('OptionTitle == ' + optionText)
439   - .select();
440   - var option = optionData[0].OptionNumber;
441   - //$scope.dragableId = optionText + '-' + option;
442   - }
443   -
444   - };
445   -
446   - $scope.handleDragEnd = function (e) {
447   - this.style.opacity = '1.0';
448   - };
449   -
450   - $scope.handleDrop = function (e) {
451   - e.preventDefault();
452   - e.stopPropagation();
453   - var x = $("#droppable").offset();
454   -
455   - var id = $(this).attr("id");
456   -
457   - // $scope.dragableText = $("#" + $scope.dragableId).text();
458   -
459   - //$rootScope.selectedDivArray.push({
460   - // "questionNo": $scope.quiznumber,
461   - // "draggedID": $scope.dragableId,
462   - // "draggedText": $scope.dragableText,
463   - // "droppedID": id
464   - //});
465   -
466   -
467   - //console.log($rootScope.selectedDivArray);
468   -
469   - var keywords = $location.search();
470   - $scope.labExercideIdentifier = (keywords.labexercise.replace('.json', '')).split('dat_')[1];
471   -
472   - var dataText = e.dataTransfer.getData('text/plain');
473   - if (id == "divoptions" || id == "divleft" || id == "divright") {
474   -
475   - var item = $('#' + $scope.dragableId).html();
476   - var rindex = $scope.DraggedList.indexOf(item);
477   - var labExerciseModulePath = '~/../content/data/json/le/' + keywords.labexercise + '.json';
478   - DataService.getAnotherJson(labExerciseModulePath).then(
479   - function (result) {
480   -
481   - $.each(result.LabExercise, function (index, value) {
482   - if (result.LabExercise[index].Slug == keywords.labexercise) {
483   - $.each(result.LabExercise[index].Questions, function (index1, value1) {
484   - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
485   - var Options = result.LabExercise[index].Questions[index1].Options;
486   -
487   -
488   - $.each(Options, function (inx, value2) {
489   - if (Options[inx].OptionTitle == item) {
490   - if ($scope.DraggedList != null) {
491   - $.each($scope.DraggedList, function (inx1, value3) {
492   - $scope.UserAttempt.push({ "BlankBoxName": id.split('-')[1], "OptionName": $scope.dragableId.split('-')[1] });
493   - //var balnkBox=id.split('-')[1];
494   - //$scope.UserAttempt.push({balnkBox :+ $scope.dragableId.split('-')[1] });
495   - if ($scope.DraggedList[inx1].Value == item) {
496   - $scope.DraggedList.splice(inx1, 1);
497   - $('#block-' + Options[inx].OptionNumber).css("display", "block");
498   - $('#blockans-' + Options[inx].OptionNumber).css("background-color", "transparent !important");
499   - }
500   - });
501   - }
502   - }
503   - });
504   - }
505   - });
506   - }
507   -
508   - });
509   -
510   - },
511   - function (error) {
512   - console.log(error.statusText)
513   - }
514   - )
515   - }
516   - else {
517   -
518   - var labExerciseModulePath = '~/../content/data/json/le/' + keywords.labexercise + '.json';
519   - DataService.getAnotherJson(labExerciseModulePath).then(
520   - function (result) {
521   - $.each(result.LabExercise, function (index, value) {
522   - if (result.LabExercise[index].Slug == keywords.labexercise) {
523   - $.each(result.LabExercise[index].Questions, function (index1, value1) {
524   - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
525   - var Options = result.LabExercise[index].Questions[index1].OptionBox;
526   - $.each(Options, function (inx, value2) {
527   - if (Options[inx].BoxName == id.split('-')[1]) {
528   - if ($scope.DraggedList != null) {
529   - $.each($scope.DraggedList, function (inx1, value3) {
530   -
531   - if ($scope.DraggedList[inx1].Value == dataText) {
532   - $scope.DraggedList.splice(inx1, 1);
533   - }
534   - });
535   - }
536   - // $scope.UserAttempt.push({ "BlankBoxName": id.split('-')[1], "OptionName": $scope.dragableId.split('-')[1] });
537   - //$scope.UserAttempt.push({ balnkBox: +$scope.dragableId.split('-')[1] });
538   - $scope.UserAttempt.push({ "BlankBoxName": id.split('-')[1], "OptionName": $scope.dragableId.split('-')[1] });
539   - $scope.DraggedList.push({ "id": id.split('-')[1], "optionName": id.split('-')[1], "Value": dataText, "topcoord": Options[inx].topcoord, "leftcoord": Options[inx].leftcoord });
540   - $('#' + $scope.dragableId).css("display", "none");
541   - $('#blockans-' + Options[inx].OptionNumber).css("background-color", "transparent !important");
542   -
543   - }
544   - });
545   - }
546   - });
547   - }
548   -
549   - });
550   -
551   - },
552   - function (error) {
553   - console.log(error.statusText)
554   - }
555   - )
556   - }
557   - $scope.$apply();
558   -
559   - //alert(JSON.stringify($scope.UserAttempt));
560   -
561   -
562   - };
563   -
564   -
565   -
566   - $scope.minLabExPanel = function () {
567   - $("#labExPanel").css("display", "none");
568   - $("#LabExPageHeading").css("display", "none");
569   - $("#LabExMinimizedId").css("display", "block");
570   -
571   -
572   - }
573   - $scope.maxLabExPanel = function () {
574   - $("#labExPanel").css("display", "block");
575   - $("#LabExPageHeading").css("display", "block");
576   - $("#LabExMinimizedId").css("display", "none");
577   -
578   -
579   - }
580   - $scope.handleDragOver = function (e) {
581   - e.preventDefault(); // Necessary. Allows us to drop.
582   - e.dataTransfer.dropEffect = 'move'; // See the section on the DataTransfer object.
583   - //return false;
584   - };
585   -
586   - $scope.OnResetClick = function () {
587   -
588   - $scope.isResetClicked = true;
589   - $scope.resetQuiz();
590   - }
591   -
592   - $scope.resetQuiz = function () {
593   -
594   - $scope.DraggedList = [];
595   - $scope.UserAttempt = [];
596   - $scope.GetQuizByTopic();
597   - };
598   -
599   - $scope.ReviewAttempt = function () {
600   - var keywords = $location.search();
601   - var labExerciseModulePath = '~/../content/data/json/le/' + keywords.labexercise + '.json';
602   - DataService.getAnotherJson(labExerciseModulePath).then(
603   - function (result) {
604   - //alert(result)
605   - $.each(result.LabExercise, function (index, value) {
606   - if (result.LabExercise[index].Slug == keywords.labexercise) {
607   - $.each(result.LabExercise[index].Questions, function (index1, value1) {
608   - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) {
609   - var correctResponse = result.LabExercise[index].Questions[index1].correctResponse;
610   - var Options = result.LabExercise[index].Questions[index1].Options;
611   - $.each(correctResponse, function (inx, value2) {
612   - $scope.OptionName = "";
613   - $.each(Options, function (inx1, value3) {
614   - if (Options[inx1].OptionTitle == $('#blockans-' + correctResponse[inx].OptionBox).text()) {
615   - $scope.OptionName = Options[inx1].OptionNumber;
616   - }
617   - });
618   - if (correctResponse[inx].Answer == $scope.OptionName) {
619   - blReviewAttempt = true;
620   - }
621   - else {
622   - blReviewAttempt = false;
623   - $('#blockans-' + correctResponse[inx].OptionBox).css("background", "#ff4e00");
624   - }
625   -
626   -
627   - });
628   - }
629   - });
630   - }
631   - });
632   - },
633   - function (error) {
634   - console.log(error.statusText)
635   - }
636   - )
637   - };
638   -
639   - $scope.ShowHideDiv = function (status) {
640   -
641   - if (status == "bottom") {
642   - $("#divright").css("display", "none");
643   - $("#divleft").css("display", "none");
644   - $("#divoptions").css("display", "block");
645   -
646   - }
647   - else {
648   - $("#divright").css("display", "block");
649   - $("#divleft").css("display", "block");
650   - $("#divoptions").css("display", "none");
651   - }
652   -
653   - };
654   -
655   - $scope.SaveAnswer = function () {
656   -
657   -
658   - $rootScope.isLoading = false;
659   - $('#spinner').css('visibility', 'hidden');
660   -
661   - $scope.CreateLabExerciseDataToSave();
662   -
663   -
664   - //LabExerciseService.saveLabExerciseAttempt("superadmin", $scope.LabExerciseAttemptedData)
665   - $scope.labExerciseAttempt = [];
666   - $scope.labExerciseAttempt.push({ 'LabExerciseUserData': $scope.LabExerciseUserData, 'userId': $scope.userId, 'labExerciseIdentifier': $scope.labExerciseIdentifier, 'LastQuestion': $scope.LastQuestion, 'TotalQuestions': $scope.TotalQuestions });
667   - $scope.initialQuestioNo = $scope.LastQuestion;
668   - LabExerciseService.saveLabExerciseAttempt($scope.labExerciseAttempt)
669   - .then(
670   - function (result) {
671   -
672   - $rootScope.isLoading = false;
673   - $('#spinner').css('visibility', 'hidden');
674   - //saved successfully.variable name is not correct but errorMessage represnts message
675   - $rootScope.errorMessage = result;
676   - $("#messageModal").modal('show');
677   - },
678   - function (error) {
679   -
680   - $rootScope.isLoading = false;
681   - $('#spinner').css('visibility', 'hidden');
682   -
683   - console.log(' Error in saving lab exercise = ' + error.statusText);
684   - // alert(LoginMessageConstants.ERROR_IN_FECTHING_DETAILS);
685   - $rootScope.isVisibleLogin = true;
686   - $rootScope.errorMessage = error;
687   - $("#messageModal").modal('show');
688   - }
689   - )
690   - };
691   -
692   - $scope.usersCorrectQuestData = [];
693   - $scope.CreateLabExerciseDataToSave = function () {
694   -
695   - $scope.LabExerciseAttemptedData = [];
696   - $scope.lb = [];
697   - //get user answers
698   - $scope.getUserAnswers();
699   -
700   -
701   - //get correct response
702   - $scope.getCorrectResponse();
703   -
704   - // $scope.correctResponseForSavingDatabaseArray = $scope.correctResponseForSavingDatabase.split(',');
705   -
706   - //get dragItems
707   - $scope.getDragItems();
708   -
709   - //get score
710   - $scope.getScore();
711   -
712   - $scope.userId = JSON.parse(localStorage.getItem('loggedInUserDetails')).Id;
713   - $scope.labExerciseIdentifier = $scope.labExercideIdentifier;
714   - $scope.LastQuestion = $scope.quiznumber;
715   - $scope.TotalQuestions = $scope.TotalNumberofQuiz;
716   -
717   - $scope.LabExerciseAttemptedData = {
718   -
719   - MaxScore: $scope.MaxScore,
720   - UserAnswer: $scope.commaSeperatedUserAnswers,
721   - QuestionNo: $scope.quiznumber,
722   - CorrectAnswer: JSON.stringify($scope.correctResponseForSavingDatabase),
723   - DragItems: $scope.DragItems,
724   - Score: $scope.Score,
725   - title: $scope.activityTitle
726   -
727   - }
728   -
729   -
730   -
731   - var thisQuestiondataInLabExerciseUserData = new jinqJs()
732   - .from($scope.LabExerciseUserData)
733   - .where('QuestionNo == ' + $scope.LabExerciseAttemptedData.QuestionNo)
734   - .select();
735   - if (thisQuestiondataInLabExerciseUserData.length>0) {
736   -
737   - angular.forEach($scope.LabExerciseUserData, function (value, key) {
738   - if (value.QuestionNo == $scope.LabExerciseAttemptedData.QuestionNo) {
739   -
740   - }
741   - else {
742   - $scope.lb.push(value);
743   - }
744   - })
745   - $scope.LabExerciseUserData = [];
746   -
747   - $scope.lb.push($scope.LabExerciseAttemptedData);
748   - angular.forEach($scope.lb,function(value1,key1){
749   - $scope.LabExerciseUserData.push(value1);
750   - })
751   - }
752   - else
753   - $scope.LabExerciseUserData.push($scope.LabExerciseAttemptedData);
754   -
755   - $scope.usersCorrectQuestData = [];
756   - //alert($scope.LabExerciseUserData);
757   - if ($scope.LabExerciseUserData.length > 0) {
758   -
759   - for(var i=0;i<=$scope.LabExerciseUserData.length-1;i++)
760   - {
761   -
762   - if ($scope.LabExerciseUserData[i].MaxScore == $scope.LabExerciseUserData[i].Score) {
763   - $scope.usersCorrectQuestData.push({
764   - MaxScore: $scope.LabExerciseUserData[i].MaxScore,
765   - UserAnswer: $scope.LabExerciseUserData[i].UserAnswer,
766   - QuestionNo: $scope.LabExerciseUserData[i].QuestionNo,
767   - CorrectAnswer: JSON.stringify($scope.LabExerciseUserData[i].CorrectAnswer),
768   - DragItems: $scope.LabExerciseUserData[i].DragItems,
769   - Score: $scope.LabExerciseUserData[i].Score,
770   - title: $scope.LabExerciseUserData[i].title,
771   - CorrectStatus: 'Correct'
772   - });
773   - }
774   - else {
775   - $scope.usersCorrectQuestData.push({
776   - MaxScore: $scope.LabExerciseUserData[i].MaxScore,
777   - UserAnswer: $scope.LabExerciseUserData[i].UserAnswer,
778   - QuestionNo: $scope.LabExerciseUserData[i].QuestionNo,
779   - CorrectAnswer: JSON.stringify($scope.LabExerciseUserData[i].CorrectAnswer),
780   - DragItems: $scope.LabExerciseUserData[i].DragItems,
781   - Score: $scope.LabExerciseUserData[i].Score,
782   - title: $scope.LabExerciseUserData[i].title,
783   - CorrectStatus: 'Incorrect'
784   - });
785   - }
786   - }
787   -
788   - }
789   - else {
790   - if ($scope.MaxScore == $scope.Score) {
791   - $scope.usersCorrectQuestData.push({
792   - MaxScore: $scope.MaxScore,
793   - UserAnswer: $scope.commaSeperatedUserAnswers,
794   - QuestionNo: $scope.quiznumber,
795   - CorrectAnswer: JSON.stringify($scope.correctResponseForSavingDatabase),
796   - DragItems: $scope.DragItems,
797   - Score: $scope.Score,
798   - title: $scope.activityTitle,
799   - CorrectStatus: 'Correct'
800   - });
801   - }
802   - else {
803   - $scope.usersCorrectQuestData.push({
804   - MaxScore: $scope.MaxScore,
805   - UserAnswer: $scope.commaSeperatedUserAnswers,
806   - QuestionNo: $scope.quiznumber,
807   - CorrectAnswer: JSON.stringify($scope.correctResponseForSavingDatabase),
808   - DragItems: $scope.DragItems,
809   - Score: $scope.Score,
810   - title: $scope.activityTitle,
811   - CorrectStatus: 'Incorrect'
812   - });
813   - }
814   - }
815   -
816   - // console.log($scope.usersCorrectQuestData);
817   - // console.log($scope.LabExerciseUserData);
818   - }
819   - $scope.reviewAttemptAnswer = function (evt) {
820   - $scope.isReviewBtnSelected = true;
821   - $("#reviewBtn").css("display", "none");
822   - $("#resetBtn").css("display", "none");
823   - $("#saveBtn").css("display", "none");
824   - $("#submitResultHtml").css("display", "none");
825   - $("#questionHtml").css("display", "block");
826   - $("#reportBtn").css("display", "block");
827   - $("#quizSubmitBtn").css("display", "none");
828   - $scope.quiznumber = evt.target.id;
829   - // $scope.CreateLabExerciseDataToSave();
830   - $scope.dragableId = "";
831   - $scope.resetQuiz();
832   - // $scope.GetQuizByTopic();
833   - //$scope.ShowHideDiv();
834   - }
835   -
836   -
837   - $scope.getUserAnswers = function () {
838   - var userAnswers = [];
839   - var blockBoxes = $("div[id*='blockbox']");
840   - var blockBoxesInTextBlock = $("#textblock").children();
841   -
842   - var blockBoxLength = blockBoxes.length - blockBoxesInTextBlock.length;
843   - var blockAnswers = $("div[id*='blockans']");
844   - for (var i = 0; i < blockAnswers.length; i++) {
845   -
846   - var id = (blockAnswers[i].id).split('-')[1];
847   - userAnswers[id.replace('T', '')] = blockAnswers[i].innerHTML;
848   - }
849   -
850   - $scope.commaSeperatedUserAnswers = '';
851   - for (var i = 1; i <= blockBoxLength; i++) {
852   -
853   - var userAns = userAnswers[i];
854   - if (userAns != undefined) {
855   - $scope.commaSeperatedUserAnswers += userAns + ',';
856   - }
857   - else {
858   - $scope.commaSeperatedUserAnswers += '' + ',';
859   - }
860   - }
861   - //remove last comma
862   - $scope.commaSeperatedUserAnswers = $scope.commaSeperatedUserAnswers.replace(/,$/, '');
863   - }
864   -
865   - $scope.getCorrectResponse = function () {
866   - $scope.correctResponse = '';
867   - $scope.correctResponseForSavingDatabase = '';
868   - var cr = new jinqJs()
869   - .from($scope.LabExData.LabExercise[0].Questions)
870   - .where('Number == ' + $scope.quiznumber)
871   - .select();
872   - for (var i = 0; i < cr[0].correctResponse.length; i++) {
873   - var blankBox = cr[0].correctResponse[i].OptionBox;
874   -
875   - var option;
876   - if (cr[0].correctResponse[i].Answer.indexOf('|') != -1) {
877   - var multipleanswer = cr[0].correctResponse[i].Answer.split('|');
878   - option = multipleanswer[0];
879   - }
880   - else
881   - option = cr[0].correctResponse[i].Answer;
882   -
883   - var options = new jinqJs()
884   - .from(cr[0].Options)
885   - .where('OptionNumber == ' + option)
886   - .select();
887   - var optionText = options[0].OptionTitle;
888   - $scope.correctResponse += blankBox + ' ' + option + ',';
889   - $scope.correctResponseForSavingDatabase += parseInt(blankBox.replace('T', '')) - 1 + ':' + optionText + ',';
890   - }
891   -
892   - $scope.correctResponse = $scope.correctResponse.replace(/,$/, '');
893   - $scope.correctResonseKeyValue = $scope.correctResponse.split(',');
894   -
895   - $scope.correctResponseForSavingDatabase = $scope.correctResponseForSavingDatabase.replace(/,$/, '');
896   - }
897   -
898   -
899   - $scope.getDragItems = function () {
900   - var OptionBoxes = $("div[id*='block-']");
901   - $scope.DragItems = '';
902   - for (var i = 0; i < OptionBoxes.length; i++) {
903   - $scope.DragItems += OptionBoxes[i].id.replace('block-', '') + ',' + OptionBoxes[i].innerHTML + ';';
904   - }
905   - $scope.DragItems = $scope.DragItems.replace(/;$/, '');
906   -
907   - }
908   -
909   - $scope.getScore = function () {
910   -
911   - var abc = $scope.UserAttempt;
912   - $scope.Score = 0;
913   - angular.forEach($scope.UserAttempt, function (value, key) {
914   -
915   - var userOptedAnswer = value.BlankBoxName + ' ' + value.OptionName;
916   - for(var i=0;i<$scope.correctResonseKeyValue.length;i++) {
917   - if (userOptedAnswer == $scope.correctResonseKeyValue[i]) {
918   - $scope.Score += 1;
919   - }
920   -
921   - }
922   -
923   -
924   - })
925   - }
926   -
927   - $scope.GetSavedLabExerciseFromDatabase = function () {
928   -
929   - var labExerciseInfo = {
930   - userId: 1,
931   - identifier: 'di'
932   - };
933   -
934   - LabExerciseService.GetLabExercise(labExerciseInfo)
935   - .then(
936   -
937   - function (result) {
938   - if (result != undefined && result != AIAConstants.SAVED_LAB_EXERCISE_NOT_FOUND) {
939   - $scope.SavedLabExercise = result;
940   -
941   - $scope.ShowSavedLabExercise();
942   - }
943   - },
944   - function(error){
945   - console.log(' Error in getting LabExercise = ' + error.statusText);
946   - $rootScope.errorMessage = AdminConstants.ERROR_IN_FECTHING_DETAILS;
947   - $("#messageModal").modal('show');
948   - })
949   -
950   - }
951   -
952   - $scope.ShowSavedLabExercise = function () {
953   -
954   - //from database
955   - var lastQuestion = $scope.quiznumber;
956   - var lastQuestionDetails;
957   - var lastQuestionAnswers;
958   -
959   - //if user opted this question, it will have entry in LabExerciseUserData
960   - var thisQuestiondataInLabExerciseUserData = new jinqJs()
961   - .from($scope.LabExerciseUserData)
962   - .where('QuestionNo == ' + $scope.quiznumber)
963   - .select();
964   -
965   -
966   - //if this exists in LabExerciseUserData, show the new opted else show from database
967   - if (thisQuestiondataInLabExerciseUserData.length > 0){
968   -
969   -
970   - lastQuestionDetails = thisQuestiondataInLabExerciseUserData;
971   - if (lastQuestionDetails != undefined && lastQuestionDetails.length > 0)
972   - lastQuestionAnswers = lastQuestionDetails[0].UserAnswer.split(',');
973   - }
974   -
975   - else{
976   -
977   - lastQuestionDetails = new jinqJs()
978   - .from($scope.SavedLabExercise.labExercise)
979   - .where('QuestionNo == ' + lastQuestion)
980   - .select();
981   - if (lastQuestionDetails != undefined && lastQuestionDetails.length>0)
982   - lastQuestionAnswers = lastQuestionDetails[0].UserAnswers.split(',');
983   - }
984   - if (lastQuestionDetails != undefined && lastQuestionDetails.length > 0) {
985   - $scope.QustionAnsKeyValue = [];
986   - for (var i = 0; i < lastQuestionAnswers.length; i++) {
987   - var num = i + 1;
988   - $scope.QustionAnsKeyValue.push({ blockbox: 'T' + num, text: lastQuestionAnswers[i] });
989   -
990   - if (lastQuestionAnswers[i] != "") {
991   - var blocks = $("div[id*='block-']");
992   - for (var j = 0; j < blocks.length; j++) {
993   -
994   - if ((blocks[j].innerHTML).toString() == lastQuestionAnswers[i]) {
995   - $('#' + blocks[j].id).css("display", "none");
996   - };
997   -
998   - }
999   -
1000   - }
1001   - }
1002   -
1003   -
1004   - var labQuestionData = new jinqJs()
1005   - .from($scope.LabExData.LabExercise[0].Questions)
1006   - .where('Number == ' + lastQuestion)
1007   - .select();
1008   -
1009   - angular.forEach($scope.QustionAnsKeyValue, function (value, key) {
1010   - var questionOptionBox = new jinqJs()
1011   - .from(labQuestionData[0].OptionBox)
1012   - .where('BoxName == ' + value.blockbox)
1013   - .select();
1014   - if (value.text != "") {
1015   -
1016   - $scope.DraggedList.push({ "id": value.blockbox, "optionName": value.blockbox, "Value": value.text, "topcoord": questionOptionBox[0].topcoord, "leftcoord": questionOptionBox[0].leftcoord });
1017   -
1018   - $rootScope.isLoading = false;
1019   - $('#spinner').css('visibility', 'hidden');
1020   - }
1021   -
1022   - })
1023   - }
1024   - $rootScope.isLoading = false;
1025   - $('#spinner').css('visibility', 'hidden');
1026   -
1027   - }
1028   -
1029   -}]
1030   -
1031   -);
1032   -
1033   -AIA.directive('draggable', function () {
1034   - return {
1035   - link: function ($scope, element, attrs) {
1036   - element[0].addEventListener('dragstart', $scope.handleDragStart, false);
1037   - element[0].addEventListener('dragend', $scope.handleDragEnd, false);
1038   - }
1039   - }
1040   -});
1041   -
1042   -AIA.directive('droppable', function () {
1043   - return {
1044   - link: function ($scope, element, attrs) {
1045   - element[0].addEventListener('drop', $scope.handleDrop, false);
1046   - element[0].addEventListener('dragover', $scope.handleDragOver, false);
1047   - }
1048   - }
1049   -});
1050   -
1051   -AIA.directive('imageonload', function () {
1052   - return {
1053   - restrict: 'A',
1054   - link: function (scope, element, attrs) {
1055   - element.bind('load', function (e) {
1056   - $('#imgdiv').css('width', this.naturalWidth + "px");
1057   - });
1058   - element.bind('error', function () {
1059   - //alert('image could not be loaded');
1060   - });
1061   - }
1062   - };
1063   -});
1064   -
1065   -//angular.module('app')
1066   -//.filter('to_trusted', ['$sce', function ($sce) {
1067   -// return function (text) {
1068   -// return $sce.trustAsHtml(text);
1069   -// };
1070   -//}]);
1071 0 \ No newline at end of file
400-SOURCECODE/AIAHTML5.Web/app/views/LabExerc/LabExerc-view.html
  View file @8b10530
... ... @@ -122,3 +122,4 @@
122 122  
123 123  
124 124 </div>
  125 +<script src="../../../libs/DragDropTouch.js"></script>
125 126 \ No newline at end of file
... ...
400-SOURCECODE/AIAHTML5.Web/libs/DragDropTouch.js 0 → 100644
  View file @8b10530
  1 +var DragDropTouch;
  2 +(function (DragDropTouch_1) {
  3 + 'use strict';
  4 + /**
  5 + * Object used to hold the data that is being dragged during drag and drop operations.
  6 + *
  7 + * It may hold one or more data items of different types. For more information about
  8 + * drag and drop operations and data transfer objects, see
  9 + * <a href="https://developer.mozilla.org/en-US/docs/Web/API/DataTransfer">HTML Drag and Drop API</a>.
  10 + *
  11 + * This object is created automatically by the @see:DragDropTouch singleton and is
  12 + * accessible through the @see:dataTransfer property of all drag events.
  13 + */
  14 + var DataTransfer = (function () {
  15 + function DataTransfer() {
  16 + this._dropEffect = 'move';
  17 + this._effectAllowed = 'all';
  18 + this._data = {};
  19 + }
  20 + Object.defineProperty(DataTransfer.prototype, "dropEffect", {
  21 + /**
  22 + * Gets or sets the type of drag-and-drop operation currently selected.
  23 + * The value must be 'none', 'copy', 'link', or 'move'.
  24 + */
  25 + get: function () {
  26 + return this._dropEffect;
  27 + },
  28 + set: function (value) {
  29 + this._dropEffect = value;
  30 + },
  31 + enumerable: true,
  32 + configurable: true
  33 + });
  34 + Object.defineProperty(DataTransfer.prototype, "effectAllowed", {
  35 + /**
  36 + * Gets or sets the types of operations that are possible.
  37 + * Must be one of 'none', 'copy', 'copyLink', 'copyMove', 'link',
  38 + * 'linkMove', 'move', 'all' or 'uninitialized'.
  39 + */
  40 + get: function () {
  41 + return this._effectAllowed;
  42 + },
  43 + set: function (value) {
  44 + this._effectAllowed = value;
  45 + },
  46 + enumerable: true,
  47 + configurable: true
  48 + });
  49 + Object.defineProperty(DataTransfer.prototype, "types", {
  50 + /**
  51 + * Gets an array of strings giving the formats that were set in the @see:dragstart event.
  52 + */
  53 + get: function () {
  54 + return Object.keys(this._data);
  55 + },
  56 + enumerable: true,
  57 + configurable: true
  58 + });
  59 + /**
  60 + * Removes the data associated with a given type.
  61 + *
  62 + * The type argument is optional. If the type is empty or not specified, the data
  63 + * associated with all types is removed. If data for the specified type does not exist,
  64 + * or the data transfer contains no data, this method will have no effect.
  65 + *
  66 + * @param type Type of data to remove.
  67 + */
  68 + DataTransfer.prototype.clearData = function (type) {
  69 + if (type != null) {
  70 + delete this._data[type];
  71 + }
  72 + else {
  73 + this._data = null;
  74 + }
  75 + };
  76 + /**
  77 + * Retrieves the data for a given type, or an empty string if data for that type does
  78 + * not exist or the data transfer contains no data.
  79 + *
  80 + * @param type Type of data to retrieve.
  81 + */
  82 + DataTransfer.prototype.getData = function (type) {
  83 + return this._data[type] || '';
  84 + };
  85 + /**
  86 + * Set the data for a given type.
  87 + *
  88 + * For a list of recommended drag types, please see
  89 + * https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Recommended_Drag_Types.
  90 + *
  91 + * @param type Type of data to add.
  92 + * @param value Data to add.
  93 + */
  94 + DataTransfer.prototype.setData = function (type, value) {
  95 + this._data[type] = value;
  96 + };
  97 + /**
  98 + * Set the image to be used for dragging if a custom one is desired.
  99 + *
  100 + * @param img An image element to use as the drag feedback image.
  101 + * @param offsetX The horizontal offset within the image.
  102 + * @param offsetY The vertical offset within the image.
  103 + */
  104 + DataTransfer.prototype.setDragImage = function (img, offsetX, offsetY) {
  105 + var ddt = DragDropTouch._instance;
  106 + ddt._imgCustom = img;
  107 + ddt._imgOffset = { x: offsetX, y: offsetY };
  108 + };
  109 + return DataTransfer;
  110 + }());
  111 + DragDropTouch_1.DataTransfer = DataTransfer;
  112 + /**
  113 + * Defines a class that adds support for touch-based HTML5 drag/drop operations.
  114 + *
  115 + * The @see:DragDropTouch class listens to touch events and raises the
  116 + * appropriate HTML5 drag/drop events as if the events had been caused
  117 + * by mouse actions.
  118 + *
  119 + * The purpose of this class is to enable using existing, standard HTML5
  120 + * drag/drop code on mobile devices running IOS or Android.
  121 + *
  122 + * To use, include the DragDropTouch.js file on the page. The class will
  123 + * automatically start monitoring touch events and will raise the HTML5
  124 + * drag drop events (dragstart, dragenter, dragleave, drop, dragend) which
  125 + * should be handled by the application.
  126 + *
  127 + * For details and examples on HTML drag and drop, see
  128 + * https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Drag_operations.
  129 + */
  130 + var DragDropTouch = (function () {
  131 + /**
  132 + * Initializes the single instance of the @see:DragDropTouch class.
  133 + */
  134 + function DragDropTouch() {
  135 + this._lastClick = 0;
  136 + // enforce singleton pattern
  137 + if (DragDropTouch._instance) {
  138 + throw 'DragDropTouch instance already created.';
  139 + }
  140 + // detect passive event support
  141 + // https://github.com/Modernizr/Modernizr/issues/1894
  142 + var supportsPassive = false;
  143 + document.addEventListener('test', function () { }, {
  144 + get passive() {
  145 + supportsPassive = true;
  146 + return true;
  147 + }
  148 + });
  149 + // listen to touch events
  150 + if ('ontouchstart' in document) {
  151 + var d = document, ts = this._touchstart.bind(this), tm = this._touchmove.bind(this), te = this._touchend.bind(this), opt = supportsPassive ? { passive: false, capture: false } : false;
  152 + d.addEventListener('touchstart', ts, opt);
  153 + d.addEventListener('touchmove', tm, opt);
  154 + d.addEventListener('touchend', te);
  155 + d.addEventListener('touchcancel', te);
  156 + }
  157 + }
  158 + /**
  159 + * Gets a reference to the @see:DragDropTouch singleton.
  160 + */
  161 + DragDropTouch.getInstance = function () {
  162 + return DragDropTouch._instance;
  163 + };
  164 + // ** event handlers
  165 + DragDropTouch.prototype._touchstart = function (e) {
  166 + var _this = this;
  167 + if (this._shouldHandle(e)) {
  168 + // raise double-click and prevent zooming
  169 + if (Date.now() - this._lastClick < DragDropTouch._DBLCLICK) {
  170 + if (this._dispatchEvent(e, 'dblclick', e.target)) {
  171 + e.preventDefault();
  172 + this._reset();
  173 + return;
  174 + }
  175 + }
  176 + // clear all variables
  177 + this._reset();
  178 + // get nearest draggable element
  179 + var src = this._closestDraggable(e.target);
  180 + if (src) {
  181 + // give caller a chance to handle the hover/move events
  182 + if (!this._dispatchEvent(e, 'mousemove', e.target) &&
  183 + !this._dispatchEvent(e, 'mousedown', e.target)) {
  184 + // get ready to start dragging
  185 + this._dragSource = src;
  186 + this._ptDown = this._getPoint(e);
  187 + this._lastTouch = e;
  188 + e.preventDefault();
  189 + // show context menu if the user hasn't started dragging after a while
  190 + setTimeout(function () {
  191 + if (_this._dragSource == src && _this._img == null) {
  192 + if (_this._dispatchEvent(e, 'contextmenu', src)) {
  193 + _this._reset();
  194 + }
  195 + }
  196 + }, DragDropTouch._CTXMENU);
  197 + }
  198 + }
  199 + }
  200 + };
  201 + DragDropTouch.prototype._touchmove = function (e) {
  202 + if (this._shouldHandle(e)) {
  203 + // see if target wants to handle move
  204 + var target = this._getTarget(e);
  205 + if (this._dispatchEvent(e, 'mousemove', target)) {
  206 + this._lastTouch = e;
  207 + e.preventDefault();
  208 + return;
  209 + }
  210 + // start dragging
  211 + if (this._dragSource && !this._img) {
  212 + var delta = this._getDelta(e);
  213 + if (delta > DragDropTouch._THRESHOLD) {
  214 + this._dispatchEvent(e, 'dragstart', this._dragSource);
  215 + this._createImage(e);
  216 + this._dispatchEvent(e, 'dragenter', target);
  217 + }
  218 + }
  219 + // continue dragging
  220 + if (this._img) {
  221 + this._lastTouch = e;
  222 + e.preventDefault(); // prevent scrolling
  223 + if (target != this._lastTarget) {
  224 + this._dispatchEvent(this._lastTouch, 'dragleave', this._lastTarget);
  225 + this._dispatchEvent(e, 'dragenter', target);
  226 + this._lastTarget = target;
  227 + }
  228 + this._moveImage(e);
  229 + this._dispatchEvent(e, 'dragover', target);
  230 + }
  231 + }
  232 + };
  233 + DragDropTouch.prototype._touchend = function (e) {
  234 + if (this._shouldHandle(e)) {
  235 + // see if target wants to handle up
  236 + if (this._dispatchEvent(this._lastTouch, 'mouseup', e.target)) {
  237 + e.preventDefault();
  238 + return;
  239 + }
  240 + // user clicked the element but didn't drag, so clear the source and simulate a click
  241 + if (!this._img) {
  242 + this._dragSource = null;
  243 + this._dispatchEvent(this._lastTouch, 'click', e.target);
  244 + this._lastClick = Date.now();
  245 + }
  246 + // finish dragging
  247 + this._destroyImage();
  248 + if (this._dragSource) {
  249 + if (e.type.indexOf('cancel') < 0) {
  250 + this._dispatchEvent(this._lastTouch, 'drop', this._lastTarget);
  251 + }
  252 + this._dispatchEvent(this._lastTouch, 'dragend', this._dragSource);
  253 + this._reset();
  254 + }
  255 + }
  256 + };
  257 + // ** utilities
  258 + // ignore events that have been handled or that involve more than one touch
  259 + DragDropTouch.prototype._shouldHandle = function (e) {
  260 + return e &&
  261 + !e.defaultPrevented &&
  262 + e.touches && e.touches.length < 2;
  263 + };
  264 + // clear all members
  265 + DragDropTouch.prototype._reset = function () {
  266 + this._destroyImage();
  267 + this._dragSource = null;
  268 + this._lastTouch = null;
  269 + this._lastTarget = null;
  270 + this._ptDown = null;
  271 + this._dataTransfer = new DataTransfer();
  272 + };
  273 + // get point for a touch event
  274 + DragDropTouch.prototype._getPoint = function (e, page) {
  275 + if (e && e.touches) {
  276 + e = e.touches[0];
  277 + }
  278 + return { x: page ? e.pageX : e.clientX, y: page ? e.pageY : e.clientY };
  279 + };
  280 + // get distance between the current touch event and the first one
  281 + DragDropTouch.prototype._getDelta = function (e) {
  282 + var p = this._getPoint(e);
  283 + return Math.abs(p.x - this._ptDown.x) + Math.abs(p.y - this._ptDown.y);
  284 + };
  285 + // get the element at a given touch event
  286 + DragDropTouch.prototype._getTarget = function (e) {
  287 + var pt = this._getPoint(e), el = document.elementFromPoint(pt.x, pt.y);
  288 + while (el && getComputedStyle(el).pointerEvents == 'none') {
  289 + el = el.parentElement;
  290 + }
  291 + return el;
  292 + };
  293 + // create drag image from source element
  294 + DragDropTouch.prototype._createImage = function (e) {
  295 + // just in case...
  296 + if (this._img) {
  297 + this._destroyImage();
  298 + }
  299 + // create drag image from custom element or drag source
  300 + var src = this._imgCustom || this._dragSource;
  301 + this._img = src.cloneNode(true);
  302 + this._copyStyle(src, this._img);
  303 + this._img.style.top = this._img.style.left = '-9999px';
  304 + // if creating from drag source, apply offset and opacity
  305 + if (!this._imgCustom) {
  306 + var rc = src.getBoundingClientRect(), pt = this._getPoint(e);
  307 + this._imgOffset = { x: pt.x - rc.left, y: pt.y - rc.top };
  308 + this._img.style.opacity = DragDropTouch._OPACITY.toString();
  309 + }
  310 + // add image to document
  311 + this._moveImage(e);
  312 + document.body.appendChild(this._img);
  313 + };
  314 + // dispose of drag image element
  315 + DragDropTouch.prototype._destroyImage = function () {
  316 + if (this._img && this._img.parentElement) {
  317 + this._img.parentElement.removeChild(this._img);
  318 + }
  319 + this._img = null;
  320 + this._imgCustom = null;
  321 + };
  322 + // move the drag image element
  323 + DragDropTouch.prototype._moveImage = function (e) {
  324 + var _this = this;
  325 + if (this._img) {
  326 + requestAnimationFrame(function () {
  327 + var pt = _this._getPoint(e, true), s = _this._img.style;
  328 + s.position = 'absolute';
  329 + s.pointerEvents = 'none';
  330 + s.zIndex = '999999';
  331 + s.left = Math.round(pt.x - _this._imgOffset.x) + 'px';
  332 + s.top = Math.round(pt.y - _this._imgOffset.y) + 'px';
  333 + });
  334 + }
  335 + };
  336 + // copy properties from an object to another
  337 + DragDropTouch.prototype._copyProps = function (dst, src, props) {
  338 + for (var i = 0; i < props.length; i++) {
  339 + var p = props[i];
  340 + dst[p] = src[p];
  341 + }
  342 + };
  343 + DragDropTouch.prototype._copyStyle = function (src, dst) {
  344 + // remove potentially troublesome attributes
  345 + DragDropTouch._rmvAtts.forEach(function (att) {
  346 + dst.removeAttribute(att);
  347 + });
  348 + // copy canvas content
  349 + if (src instanceof HTMLCanvasElement) {
  350 + var cSrc = src, cDst = dst;
  351 + cDst.width = cSrc.width;
  352 + cDst.height = cSrc.height;
  353 + cDst.getContext('2d').drawImage(cSrc, 0, 0);
  354 + }
  355 + // copy style (without transitions)
  356 + var cs = getComputedStyle(src);
  357 + for (var i = 0; i < cs.length; i++) {
  358 + var key = cs[i];
  359 + if (key.indexOf('transition') < 0) {
  360 + dst.style[key] = cs[key];
  361 + }
  362 + }
  363 + dst.style.pointerEvents = 'none';
  364 + // and repeat for all children
  365 + for (var i = 0; i < src.children.length; i++) {
  366 + this._copyStyle(src.children[i], dst.children[i]);
  367 + }
  368 + };
  369 + DragDropTouch.prototype._dispatchEvent = function (e, type, target) {
  370 + if (e && target) {
  371 + var evt = document.createEvent('Event'), t = e.touches ? e.touches[0] : e;
  372 + evt.initEvent(type, true, true);
  373 + evt.button = 0;
  374 + evt.which = evt.buttons = 1;
  375 + this._copyProps(evt, e, DragDropTouch._kbdProps);
  376 + this._copyProps(evt, t, DragDropTouch._ptProps);
  377 + evt.dataTransfer = this._dataTransfer;
  378 + target.dispatchEvent(evt);
  379 + return evt.defaultPrevented;
  380 + }
  381 + return false;
  382 + };
  383 + // gets an element's closest draggable ancestor
  384 + DragDropTouch.prototype._closestDraggable = function (e) {
  385 + for (; e; e = e.parentElement) {
  386 + if (e.hasAttribute('draggable') && e.draggable) {
  387 + return e;
  388 + }
  389 + }
  390 + return null;
  391 + };
  392 + return DragDropTouch;
  393 + }());
  394 + /*private*/ DragDropTouch._instance = new DragDropTouch(); // singleton
  395 + // constants
  396 + DragDropTouch._THRESHOLD = 5; // pixels to move before drag starts
  397 + DragDropTouch._OPACITY = 0.5; // drag image opacity
  398 + DragDropTouch._DBLCLICK = 500; // max ms between clicks in a double click
  399 + DragDropTouch._CTXMENU = 900; // ms to hold before raising 'contextmenu' event
  400 + // copy styles/attributes from drag source to drag image element
  401 + DragDropTouch._rmvAtts = 'id,class,style,draggable'.split(',');
  402 + // synthesize and dispatch an event
  403 + // returns true if the event has been handled (e.preventDefault == true)
  404 + DragDropTouch._kbdProps = 'altKey,ctrlKey,metaKey,shiftKey'.split(',');
  405 + DragDropTouch._ptProps = 'pageX,pageY,clientX,clientY,screenX,screenY'.split(',');
  406 + DragDropTouch_1.DragDropTouch = DragDropTouch;
  407 +})(DragDropTouch || (DragDropTouch = {}));
0 408 \ No newline at end of file
... ...