diff --git a/400-SOURCECODE/AIAHTML5.Web/AIAHTML5.Web.csproj b/400-SOURCECODE/AIAHTML5.Web/AIAHTML5.Web.csproj index 6693340..22c0e89 100644 --- a/400-SOURCECODE/AIAHTML5.Web/AIAHTML5.Web.csproj +++ b/400-SOURCECODE/AIAHTML5.Web/AIAHTML5.Web.csproj @@ -45186,6 +45186,7 @@ + diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js index d108113..ece0bd0 100644 --- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js +++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/HomeController.js @@ -407,13 +407,21 @@ function ($rootScope, Modules, $log, $location, $timeout, DataService, Authentic $rootScope.isVisibleLogin = false; $rootScope.haveRoleAdmin = true; - + if ($rootScope.refreshcheck == null) { - - $location.path('/'); - + + if ($location.path() == "/lab-exercises-detail") { + + $location.url('/'); + } + else { + + $location.path('/'); + } + } - } + + } else { diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js index e46c749..93e09c4 100644 --- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js +++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js @@ -400,8 +400,8 @@ function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter, $scope.handleDragStart = function (e) { this.style.opacity = '0.4'; - var $ua = navigator.userAgent; - if ($.browser.msie || ($ua.match(/(iPod|iPhone|iPad|android)/i))) { + + if ($.browser.msie) { localStorage.setItem("text", this.innerHTML); } else @@ -470,8 +470,8 @@ function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter, //console.log($rootScope.selectedDivArray); var keywords = $location.search(); - var $ua = navigator.userAgent; - if ($.browser.msie || ($ua.match(/(iPod|iPhone|iPad|android)/i))) { + + if ($.browser.msie) { dataText = localStorage.getItem("text"); localStorage.setItem("text", ''); } @@ -1063,8 +1063,6 @@ AIA.directive('draggable', function () { element[0].addEventListener('dragstart', $scope.handleDragStart, false); element[0].addEventListener('dragend', $scope.handleDragEnd, false); - element[0].addEventListener('touchstart', $scope.handleDragStart, false); - element[0].addEventListener('touchend', $scope.handleDragEnd, false); } } }); @@ -1075,8 +1073,7 @@ AIA.directive('droppable', function () { element[0].addEventListener('drop', $scope.handleDrop, false); element[0].addEventListener('dragover', $scope.handleDragOver, false); - element[0].addEventListener('touchmove', $scope.handleDragOver, false); - element[0].addEventListener('touchend', $scope.handleDrop, false); + } } }); diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js.orig b/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js.orig deleted file mode 100644 index 7361dab..0000000 --- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/LabExercController.js.orig +++ /dev/null @@ -1,1070 +0,0 @@ -/// -AIA.controller("LabExercController", ["$scope", "$rootScope", "pages", "$log", '$http','$timeout', 'DataService', '$filter', '$location', '$document', '$sce', "$compile", "$location", "LabExerciseService","AIAConstants", -function ($scope, $rootScope, pages, log, $http,$timeout, DataService, $filter, $location, $document, $sce, $compile, $location, LabExerciseService,AIAConstants) { - $scope.$sce = $sce; - $scope.LabExerciseName; - $scope.LabExerciseQuiz = null; - $scope.TotalNumberofQuiz = "0"; - $scope.quiznumber = 1; - $scope.activityTitle = ""; - $scope.Title = ""; - $scope.Imagepath = ""; - $scope.DraggedList = []; - $scope.UserAttempt = []; - $scope.UserAnswersForAllQuestions = []; - $scope.LabExerciseUserData = []; - $scope.LabExercise = []; - $scope.dragableId = ""; - $scope.UserAttempt = []; - $scope.blReviewAttempt = false; - $scope.isResetClicked = false; - $scope.$on('$viewContentLoaded', function (event) { - // code that will be executed ... - // every time this view is loaded - - //get current path - var currentURL = $location.path(); - var selectedModuleName = ''; - //set module title - angular.forEach($rootScope.userModules, function (value, key) { - if (value.slug === currentURL.replace('/', '')) { - selectedModuleName = value.name; - } - $rootScope.currentActiveModuleTitle = selectedModuleName; - }) - -<<<<<<< HEAD - $scope.showTabButton = false; - //$rootScope.currentActiveModuleTitle = pages[8].name; -======= - $scope.showme = false; - $rootScope.currentActiveModuleTitle = pages[8].name; ->>>>>>> d0fe2dca5c316aa0281ac40abe66d1137c1f4e7f - $scope.getLabExerciseModules(); - - $scope.scroll(); - $document.find('div#divoptions div.thumbnail').draggable(); - //$document.find("#droppable").droppable({ - // drop: function (event, ui) { - // $(this) - // .find("img") - // .html("Dropped!"); - // } - //}); - - }); - - // $scope.showme = false; - $scope.IsVisible = function () { - // $scope.scroll(); - - - } - - $scope.scroll = function () { - // $window.scrollTo(0, 0); - $("html,body").scrollTop(0); - //alert("scroll"); - } - // $rootScope.currentActiveModuleTitle = pages[8].Name; - - //to get all lab exercise modules from json files - $scope.getLabExerciseModules = function () { - //debugger; - $scope.LabExerciseModules1 = null; - var labExerciseModulePath = '~/../content/data/json/le/labexercise.json'; - - DataService.getAnotherJson(labExerciseModulePath).then( - function (result) { - //debugger; - //alert(JSON.stringify(result)); - $scope.LabExerciseModules1 = result; - }, - function (error) { - console.log(error.statusText) - } - ) - } - - $scope.getLabExerciseTitle = function (title) { - $rootScope.menuLabExer = 1; - $scope.quiznumber = 1; - - if (title != null) { - $scope.LabExerciseQuiz = title; - $scope.LabExerciseName = title.Topic; - $scope.LabExerciseUserData = []; - $location.url("/lab-exercises-detail?labexercise=" + (title.Slug || "")); - } - - } - - $scope.InitializeLabExercise = function () { - - var keywords = $location.search(); - $scope.labExercideIdentifier = (keywords.labexercise.replace('.json', '')).split('dat_')[1]; - var labExerciseInfo = { - userId: JSON.parse(localStorage.getItem('loggedInUserDetails')).Id, - identifier: $scope.labExercideIdentifier, - }; - LabExerciseService.GetLabExercise(labExerciseInfo) - .then( - - function (labResult) { - if (labResult != undefined && labResult.lastQuestion>0 && labResult != AIAConstants.SAVED_LAB_EXERCISE_NOT_FOUND) { - $scope.SavedLabExercise = labResult; - $scope.quiznumber = $scope.SavedLabExercise.lastQuestion; - $scope.initialQuestioNo = $scope.SavedLabExercise.lastQuestion; - $scope.GetQuizByTopic(); - } - else { - $scope.GetQuizByTopic(); - } - }, - function(error){ - console.log('error in getting save ddata'); - } - ) - } - - $scope.GetQuizByTopic = function () { - - $rootScope.isLoading = true; - $('#spinner').css('visibility', 'visible'); - - var keywords = $location.search(); - $scope.LabExerciseName = keywords.labexercise; - $scope.LabExerciseModules = null; - $scope.LabExerciseBoxes = null; - - //alert($scope.LabExerciseName) - var labExerciseModulePath = '~/../content/data/json/le/' + $scope.LabExerciseName + '.json'; - - DataService.getAnotherJson(labExerciseModulePath).then( - function (result) { - $scope.LabExData = result; - - var keywords = $location.search(); - $scope.labExercideIdentifier = (keywords.labexercise.replace('.json', '')).split('dat_')[1]; - - - $.each(result.LabExercise, function (index, value) { - - $scope.LabExerciseName = result.LabExercise[index].Topic; - if (result.LabExercise[index].Slug == keywords.labexercise) { - - $scope.TotalNumberofQuiz = result.LabExercise[index].NumberofQuestions; - $.each(result.LabExercise[index].Questions, function (index1, value1) { - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) { - $scope.MaxScore = result.LabExercise[index].Questions[index1].Options.length; - if (result.LabExercise[index].Questions[index1].ImagePath == "") { - $("#imgblock").css("display", "none"); - //$("#imgblock").remove(); - $scope.IsVisible = false; - $("#textblock").css("display", "block"); - $scope.LabExerciseModules = result.LabExercise[index].Questions[index1]; - $scope.deliberatelyTrustDangerousSnippet = function (html) { - //var htmltag= $compile(html)($scope); - return $sce.trustAsHtml(html); - }; - $scope.activityTitle = result.LabExercise[index].Questions[index1].activityTitle; - $scope.Title = result.LabExercise[index].Questions[index1].Title; - } - else { - $("#imgblock").css("display", "block"); - $scope.IsVisible = true; - $("#textblock").css("display", "none"); - // $("#textblock").remove(); - $scope.LabExerciseModules = result.LabExercise[index].Questions[index1]; - $scope.activityTitle = result.LabExercise[index].Questions[index1].activityTitle; - $scope.Title = result.LabExercise[index].Questions[index1].Title; - $scope.Imagepath = keywords.labexercise + "/" + result.LabExercise[index].Questions[index1].ImagePath; - } - $scope.ShowHideDiv(result.LabExercise[index].Questions[index1].Options[0].textalign); - - } - }); - $timeout(function () - { - if ($scope.SavedLabExercise != undefined && $scope.SavedLabExercise.lastQuestion > 0) { - if ($scope.isResetClicked != true) { - $scope.ShowSavedLabExercise(); - - } - else { - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - $scope.isResetClicked = false; - } - } - else { - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - } - },100); - - - } - - }); - //} - //$scope.ShowHideDiv(); - }, - function (error) { - console.log(error.statusText) - } - ) - - } - - - $scope.isReviewBtnSelected = false; - // $rootScope.selectedDivArray = []; - $scope.nextQuiz = function () { - //need to save all questions till the current question number when user clicks on save - //if ($scope.dragableId!="") { - // $scope.UserAnswersForAllQuestions.push({'QuestionNo':$scope.quiznumber,'UserAnswer':$scope.UserAttempt}) - - //} - //else { - // //need to anattampted question means user ahs not dragged, dropped options so save blank - // $scope.UserAnswersForAllQuestions.push({ 'QuestionNo': $scope.quiznumber, 'UserAnswer': "" }) - //} - $scope.isNextOrPreviousClicked = true; - $scope.dragableId = ""; - - - - if ($scope.quiznumber != $scope.TotalNumberofQuiz) - { - $scope.CreateLabExerciseDataToSave(); - } - - - if ($scope.quiznumber == $scope.TotalNumberofQuiz) - return; - else - $scope.quiznumber++; - - // console.log($rootScope.selectedDivArray); - - - - if ($scope.quiznumber == $scope.TotalNumberofQuiz) { - if ($scope.isReviewBtnSelected == true) { - $("#quizSubmitBtn").css("display", "none"); - } - else { - $("#quizSubmitBtn").css("display", "block"); - } - - } - else - { - $("#quizSubmitBtn").css("display", "none"); - } - - $scope.resetQuiz(); - $scope.ShowHideDiv(); - - - - } - - - - - - - - - - - $scope.prevQuiz = function () { - - if ($scope.quiznumber != 1) { - // $scope.quizQuesNo = $scope.quizQuesNo - 1; - // $scope.selectedQuestionNo = $scope.quizQuesNo; - $scope.CreateLabExerciseDataToSave(); - } - $scope.dragableId = ""; - $scope.UserAttempt = []; - if ($scope.quiznumber == 1) - return; - else - $scope.quiznumber--; - - if ($scope.quiznumber == $scope.TotalNumberofQuiz) { - if ($scope.isReviewBtnSelected == true) { - $("#quizSubmitBtn").css("display", "none"); - } - else { - $("#quizSubmitBtn").css("display", "block"); - } - } - else { - $("#quizSubmitBtn").css("display", "none"); - } - $scope.resetQuiz(); - $scope.ShowHideDiv(); - - - - //for (var i = 0; i <= $rootScope.selectedDivArray.length - 1; i++) { - // if ($scope.quiznumber == $rootScope.selectedDivArray[i].questionNo) { - // alert($rootScope.selectedDivArray[i].draggedText); - // document.getElementById($rootScope.selectedDivArray[i].droppedID).innerHTML = $rootScope.selectedDivArray[i].draggedText; - // // $('#'+$rootScope.selectedDivArray[i].droppedID).html($rootScope.selectedDivArray[i].draggedText); - // document.getElementById($rootScope.selectedDivArray[i].droppedID).style.display = "none"; - // // $('#'+$rootScope.selectedDivArray[i].draggedID).css("display","none!important"); - // } - - //} - } - - - $scope.SubmitAttempt = function () { - - $scope.CreateLabExerciseDataToSave(); - - $("#submitResultHtml").css("display", "block"); - $("#questionHtml").css("display", "none"); - console.log($scope.usersCorrectQuestData); - $("#resultLabData").empty(); - var sortedQuestionHtml = ''; - - for (var j = $scope.TotalNumberofQuiz; j >= 1; j--) { - for (var i = 0; i <= $scope.usersCorrectQuestData.length - 1; i++) { - if (j == $scope.usersCorrectQuestData[i].QuestionNo) - { - if ($scope.usersCorrectQuestData[i].CorrectStatus == "Correct") { - var labExerciseHtml = $("#resultLabData").append("" + $scope.usersCorrectQuestData[i].QuestionNo + "" + $scope.usersCorrectQuestData[i].title + "" + $scope.usersCorrectQuestData[i].CorrectStatus + ""); - $compile(labExerciseHtml)($scope); - } - else { - var labExerciseHtml = $("#resultLabData").append("" + $scope.usersCorrectQuestData[i].QuestionNo + "" + $scope.usersCorrectQuestData[i].title + "" + $scope.usersCorrectQuestData[i].CorrectStatus + ""); - $compile(labExerciseHtml)($scope); - } - $scope.isValueExist = true; - break; - } - else { - $scope.isValueExist = false; - } - } - if ($scope.isValueExist == false) - { - var labExerciseHtml_1 = $("#resultLabData").prepend("" + j + " Incorrect"); - $compile(labExerciseHtml_1)($scope); - } - } - - for (var j = 1;j <= $scope.TotalNumberofQuiz;j++) { - $("#resultLabData tr td:nth-child(1)").each(function () { - if (j == $(this).text()) { - $q = $(this).parent(); - if ($q.find("td:nth-child(3)").text() == "Correct") { - sortedQuestionHtml += '' + $q.find("td:nth-child(1)").text() + '' + $q.find("td:nth-child(2)").text() + '' + $q.find("td:nth-child(3)").text() + ''; - } - else - { - sortedQuestionHtml += '' + $q.find("td:nth-child(1)").text() + '' + $q.find("td:nth-child(2)").text() + '' + $q.find("td:nth-child(3)").text() + ''; - } - } - }); - - } - $("#resultLabData").empty(); - var sortedCompileHtml = $("#resultLabData").append(sortedQuestionHtml); - $compile(sortedCompileHtml)($scope); - $scope.inCorrectAnswer = 0; - $scope.CorrectAnswer = 0; - $scope.scoreResult = 0; - $("#resultLabData tr td:nth-child(3)").each(function () { - if ($(this).text() == "Incorrect") { - $scope.inCorrectAnswer = $scope.inCorrectAnswer + 1; - } - else - { - $scope.CorrectAnswer = $scope.CorrectAnswer + 1; - } - }); - - $scope.scoreResult = (parseInt($scope.CorrectAnswer) / parseInt($scope.inCorrectAnswer)) * 100; - $scope.scoreResult = Math.round($scope.scoreResult); - - } - - - $scope.ReportGen = function () { - $("#submitResultHtml").css("display", "block"); - $("#questionHtml").css("display", "none"); - } - - - $scope.handleDragStart = function (e) { - - this.style.opacity = '0.4'; - e.dataTransfer.setData('text/plain', this.innerHTML); - $scope.dragableId = $(this).attr("Id"); - // alert($scope.dragableId); - $scope.dragableText = $("#" + $scope.dragableId).text(); - // alert($("#" + $scope.dragableId).text()); - - //if user drag already selected answer from one blankbox to another than it gets id of blank box so need to get answer - if ($scope.dragableId.indexOf('T') != -1) { - var optionText = document.getElementById($scope.dragableId).innerHTML; - var currentQuizData = new jinqJs() - .from($scope.LabExData.LabExercise[0].Questions) - .where('Number == ' + $scope.quiznumber) - .select(); - var optionData = new jinqJs() - .from(currentQuizData[0].Options) - .where('OptionTitle == ' + optionText) - .select(); - var option = optionData[0].OptionNumber; - $scope.dragableId = optionText + '-' + option; - } - - //if user drag already selected answer from one blankbox to another than it gets id of blank box so need to get answer - if ($scope.dragableId.indexOf('T') != -1) { - var optionText = document.getElementById($scope.dragableId).innerHTML; - var currentQuizData = new jinqJs() - .from($scope.LabExData.LabExercise[0].Questions) - .where('Number == ' + $scope.quiznumber) - .select(); - var optionData = new jinqJs() - .from(currentQuizData[0].Options) - .where('OptionTitle == ' + optionText) - .select(); - var option = optionData[0].OptionNumber; - //$scope.dragableId = optionText + '-' + option; - } - - }; - - $scope.handleDragEnd = function (e) { - this.style.opacity = '1.0'; - }; - - $scope.handleDrop = function (e) { - e.preventDefault(); - e.stopPropagation(); - var x = $("#droppable").offset(); - - var id = $(this).attr("id"); - - // $scope.dragableText = $("#" + $scope.dragableId).text(); - - //$rootScope.selectedDivArray.push({ - // "questionNo": $scope.quiznumber, - // "draggedID": $scope.dragableId, - // "draggedText": $scope.dragableText, - // "droppedID": id - //}); - - - //console.log($rootScope.selectedDivArray); - - var keywords = $location.search(); - $scope.labExercideIdentifier = (keywords.labexercise.replace('.json', '')).split('dat_')[1]; - - var dataText = e.dataTransfer.getData('text/plain'); - if (id == "divoptions" || id == "divleft" || id == "divright") { - - var item = $('#' + $scope.dragableId).html(); - var rindex = $scope.DraggedList.indexOf(item); - var labExerciseModulePath = '~/../content/data/json/le/' + keywords.labexercise + '.json'; - DataService.getAnotherJson(labExerciseModulePath).then( - function (result) { - - $.each(result.LabExercise, function (index, value) { - if (result.LabExercise[index].Slug == keywords.labexercise) { - $.each(result.LabExercise[index].Questions, function (index1, value1) { - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) { - var Options = result.LabExercise[index].Questions[index1].Options; - - - $.each(Options, function (inx, value2) { - if (Options[inx].OptionTitle == item) { - if ($scope.DraggedList != null) { - $.each($scope.DraggedList, function (inx1, value3) { - $scope.UserAttempt.push({ "BlankBoxName": id.split('-')[1], "OptionName": $scope.dragableId.split('-')[1] }); - //var balnkBox=id.split('-')[1]; - //$scope.UserAttempt.push({balnkBox :+ $scope.dragableId.split('-')[1] }); - if ($scope.DraggedList[inx1].Value == item) { - $scope.DraggedList.splice(inx1, 1); - $('#block-' + Options[inx].OptionNumber).css("display", "block"); - $('#blockans-' + Options[inx].OptionNumber).css("background-color", "transparent !important"); - } - }); - } - } - }); - } - }); - } - - }); - - }, - function (error) { - console.log(error.statusText) - } - ) - } - else { - - var labExerciseModulePath = '~/../content/data/json/le/' + keywords.labexercise + '.json'; - DataService.getAnotherJson(labExerciseModulePath).then( - function (result) { - $.each(result.LabExercise, function (index, value) { - if (result.LabExercise[index].Slug == keywords.labexercise) { - $.each(result.LabExercise[index].Questions, function (index1, value1) { - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) { - var Options = result.LabExercise[index].Questions[index1].OptionBox; - $.each(Options, function (inx, value2) { - if (Options[inx].BoxName == id.split('-')[1]) { - if ($scope.DraggedList != null) { - $.each($scope.DraggedList, function (inx1, value3) { - - if ($scope.DraggedList[inx1].Value == dataText) { - $scope.DraggedList.splice(inx1, 1); - } - }); - } - // $scope.UserAttempt.push({ "BlankBoxName": id.split('-')[1], "OptionName": $scope.dragableId.split('-')[1] }); - //$scope.UserAttempt.push({ balnkBox: +$scope.dragableId.split('-')[1] }); - $scope.UserAttempt.push({ "BlankBoxName": id.split('-')[1], "OptionName": $scope.dragableId.split('-')[1] }); - $scope.DraggedList.push({ "id": id.split('-')[1], "optionName": id.split('-')[1], "Value": dataText, "topcoord": Options[inx].topcoord, "leftcoord": Options[inx].leftcoord }); - $('#' + $scope.dragableId).css("display", "none"); - $('#blockans-' + Options[inx].OptionNumber).css("background-color", "transparent !important"); - - } - }); - } - }); - } - - }); - - }, - function (error) { - console.log(error.statusText) - } - ) - } - $scope.$apply(); - - //alert(JSON.stringify($scope.UserAttempt)); - - - }; - - - - $scope.minLabExPanel = function () { - $("#labExPanel").css("display", "none"); - $("#LabExPageHeading").css("display", "none"); - $("#LabExMinimizedId").css("display", "block"); - - - } - $scope.maxLabExPanel = function () { - $("#labExPanel").css("display", "block"); - $("#LabExPageHeading").css("display", "block"); - $("#LabExMinimizedId").css("display", "none"); - - - } - $scope.handleDragOver = function (e) { - e.preventDefault(); // Necessary. Allows us to drop. - e.dataTransfer.dropEffect = 'move'; // See the section on the DataTransfer object. - //return false; - }; - - $scope.OnResetClick = function () { - - $scope.isResetClicked = true; - $scope.resetQuiz(); - } - - $scope.resetQuiz = function () { - - $scope.DraggedList = []; - $scope.UserAttempt = []; - $scope.GetQuizByTopic(); - }; - - $scope.ReviewAttempt = function () { - var keywords = $location.search(); - var labExerciseModulePath = '~/../content/data/json/le/' + keywords.labexercise + '.json'; - DataService.getAnotherJson(labExerciseModulePath).then( - function (result) { - //alert(result) - $.each(result.LabExercise, function (index, value) { - if (result.LabExercise[index].Slug == keywords.labexercise) { - $.each(result.LabExercise[index].Questions, function (index1, value1) { - if (result.LabExercise[index].Questions[index1].Number == $scope.quiznumber) { - var correctResponse = result.LabExercise[index].Questions[index1].correctResponse; - var Options = result.LabExercise[index].Questions[index1].Options; - $.each(correctResponse, function (inx, value2) { - $scope.OptionName = ""; - $.each(Options, function (inx1, value3) { - if (Options[inx1].OptionTitle == $('#blockans-' + correctResponse[inx].OptionBox).text()) { - $scope.OptionName = Options[inx1].OptionNumber; - } - }); - if (correctResponse[inx].Answer == $scope.OptionName) { - blReviewAttempt = true; - } - else { - blReviewAttempt = false; - $('#blockans-' + correctResponse[inx].OptionBox).css("background", "#ff4e00"); - } - - - }); - } - }); - } - }); - }, - function (error) { - console.log(error.statusText) - } - ) - }; - - $scope.ShowHideDiv = function (status) { - - if (status == "bottom") { - $("#divright").css("display", "none"); - $("#divleft").css("display", "none"); - $("#divoptions").css("display", "block"); - - } - else { - $("#divright").css("display", "block"); - $("#divleft").css("display", "block"); - $("#divoptions").css("display", "none"); - } - - }; - - $scope.SaveAnswer = function () { - - - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - - $scope.CreateLabExerciseDataToSave(); - - - //LabExerciseService.saveLabExerciseAttempt("superadmin", $scope.LabExerciseAttemptedData) - $scope.labExerciseAttempt = []; - $scope.labExerciseAttempt.push({ 'LabExerciseUserData': $scope.LabExerciseUserData, 'userId': $scope.userId, 'labExerciseIdentifier': $scope.labExerciseIdentifier, 'LastQuestion': $scope.LastQuestion, 'TotalQuestions': $scope.TotalQuestions }); - $scope.initialQuestioNo = $scope.LastQuestion; - LabExerciseService.saveLabExerciseAttempt($scope.labExerciseAttempt) - .then( - function (result) { - - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - //saved successfully.variable name is not correct but errorMessage represnts message - $rootScope.errorMessage = result; - $("#messageModal").modal('show'); - }, - function (error) { - - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - - console.log(' Error in saving lab exercise = ' + error.statusText); - // alert(LoginMessageConstants.ERROR_IN_FECTHING_DETAILS); - $rootScope.isVisibleLogin = true; - $rootScope.errorMessage = error; - $("#messageModal").modal('show'); - } - ) - }; - - $scope.usersCorrectQuestData = []; - $scope.CreateLabExerciseDataToSave = function () { - - $scope.LabExerciseAttemptedData = []; - $scope.lb = []; - //get user answers - $scope.getUserAnswers(); - - - //get correct response - $scope.getCorrectResponse(); - - // $scope.correctResponseForSavingDatabaseArray = $scope.correctResponseForSavingDatabase.split(','); - - //get dragItems - $scope.getDragItems(); - - //get score - $scope.getScore(); - - $scope.userId = JSON.parse(localStorage.getItem('loggedInUserDetails')).Id; - $scope.labExerciseIdentifier = $scope.labExercideIdentifier; - $scope.LastQuestion = $scope.quiznumber; - $scope.TotalQuestions = $scope.TotalNumberofQuiz; - - $scope.LabExerciseAttemptedData = { - - MaxScore: $scope.MaxScore, - UserAnswer: $scope.commaSeperatedUserAnswers, - QuestionNo: $scope.quiznumber, - CorrectAnswer: JSON.stringify($scope.correctResponseForSavingDatabase), - DragItems: $scope.DragItems, - Score: $scope.Score, - title: $scope.activityTitle - - } - - - - var thisQuestiondataInLabExerciseUserData = new jinqJs() - .from($scope.LabExerciseUserData) - .where('QuestionNo == ' + $scope.LabExerciseAttemptedData.QuestionNo) - .select(); - if (thisQuestiondataInLabExerciseUserData.length>0) { - - angular.forEach($scope.LabExerciseUserData, function (value, key) { - if (value.QuestionNo == $scope.LabExerciseAttemptedData.QuestionNo) { - - } - else { - $scope.lb.push(value); - } - }) - $scope.LabExerciseUserData = []; - - $scope.lb.push($scope.LabExerciseAttemptedData); - angular.forEach($scope.lb,function(value1,key1){ - $scope.LabExerciseUserData.push(value1); - }) - } - else - $scope.LabExerciseUserData.push($scope.LabExerciseAttemptedData); - - $scope.usersCorrectQuestData = []; - //alert($scope.LabExerciseUserData); - if ($scope.LabExerciseUserData.length > 0) { - - for(var i=0;i<=$scope.LabExerciseUserData.length-1;i++) - { - - if ($scope.LabExerciseUserData[i].MaxScore == $scope.LabExerciseUserData[i].Score) { - $scope.usersCorrectQuestData.push({ - MaxScore: $scope.LabExerciseUserData[i].MaxScore, - UserAnswer: $scope.LabExerciseUserData[i].UserAnswer, - QuestionNo: $scope.LabExerciseUserData[i].QuestionNo, - CorrectAnswer: JSON.stringify($scope.LabExerciseUserData[i].CorrectAnswer), - DragItems: $scope.LabExerciseUserData[i].DragItems, - Score: $scope.LabExerciseUserData[i].Score, - title: $scope.LabExerciseUserData[i].title, - CorrectStatus: 'Correct' - }); - } - else { - $scope.usersCorrectQuestData.push({ - MaxScore: $scope.LabExerciseUserData[i].MaxScore, - UserAnswer: $scope.LabExerciseUserData[i].UserAnswer, - QuestionNo: $scope.LabExerciseUserData[i].QuestionNo, - CorrectAnswer: JSON.stringify($scope.LabExerciseUserData[i].CorrectAnswer), - DragItems: $scope.LabExerciseUserData[i].DragItems, - Score: $scope.LabExerciseUserData[i].Score, - title: $scope.LabExerciseUserData[i].title, - CorrectStatus: 'Incorrect' - }); - } - } - - } - else { - if ($scope.MaxScore == $scope.Score) { - $scope.usersCorrectQuestData.push({ - MaxScore: $scope.MaxScore, - UserAnswer: $scope.commaSeperatedUserAnswers, - QuestionNo: $scope.quiznumber, - CorrectAnswer: JSON.stringify($scope.correctResponseForSavingDatabase), - DragItems: $scope.DragItems, - Score: $scope.Score, - title: $scope.activityTitle, - CorrectStatus: 'Correct' - }); - } - else { - $scope.usersCorrectQuestData.push({ - MaxScore: $scope.MaxScore, - UserAnswer: $scope.commaSeperatedUserAnswers, - QuestionNo: $scope.quiznumber, - CorrectAnswer: JSON.stringify($scope.correctResponseForSavingDatabase), - DragItems: $scope.DragItems, - Score: $scope.Score, - title: $scope.activityTitle, - CorrectStatus: 'Incorrect' - }); - } - } - - // console.log($scope.usersCorrectQuestData); - // console.log($scope.LabExerciseUserData); - } - $scope.reviewAttemptAnswer = function (evt) { - $scope.isReviewBtnSelected = true; - $("#reviewBtn").css("display", "none"); - $("#resetBtn").css("display", "none"); - $("#saveBtn").css("display", "none"); - $("#submitResultHtml").css("display", "none"); - $("#questionHtml").css("display", "block"); - $("#reportBtn").css("display", "block"); - $("#quizSubmitBtn").css("display", "none"); - $scope.quiznumber = evt.target.id; - // $scope.CreateLabExerciseDataToSave(); - $scope.dragableId = ""; - $scope.resetQuiz(); - // $scope.GetQuizByTopic(); - //$scope.ShowHideDiv(); - } - - - $scope.getUserAnswers = function () { - var userAnswers = []; - var blockBoxes = $("div[id*='blockbox']"); - var blockBoxesInTextBlock = $("#textblock").children(); - - var blockBoxLength = blockBoxes.length - blockBoxesInTextBlock.length; - var blockAnswers = $("div[id*='blockans']"); - for (var i = 0; i < blockAnswers.length; i++) { - - var id = (blockAnswers[i].id).split('-')[1]; - userAnswers[id.replace('T', '')] = blockAnswers[i].innerHTML; - } - - $scope.commaSeperatedUserAnswers = ''; - for (var i = 1; i <= blockBoxLength; i++) { - - var userAns = userAnswers[i]; - if (userAns != undefined) { - $scope.commaSeperatedUserAnswers += userAns + ','; - } - else { - $scope.commaSeperatedUserAnswers += '' + ','; - } - } - //remove last comma - $scope.commaSeperatedUserAnswers = $scope.commaSeperatedUserAnswers.replace(/,$/, ''); - } - - $scope.getCorrectResponse = function () { - $scope.correctResponse = ''; - $scope.correctResponseForSavingDatabase = ''; - var cr = new jinqJs() - .from($scope.LabExData.LabExercise[0].Questions) - .where('Number == ' + $scope.quiznumber) - .select(); - for (var i = 0; i < cr[0].correctResponse.length; i++) { - var blankBox = cr[0].correctResponse[i].OptionBox; - - var option; - if (cr[0].correctResponse[i].Answer.indexOf('|') != -1) { - var multipleanswer = cr[0].correctResponse[i].Answer.split('|'); - option = multipleanswer[0]; - } - else - option = cr[0].correctResponse[i].Answer; - - var options = new jinqJs() - .from(cr[0].Options) - .where('OptionNumber == ' + option) - .select(); - var optionText = options[0].OptionTitle; - $scope.correctResponse += blankBox + ' ' + option + ','; - $scope.correctResponseForSavingDatabase += parseInt(blankBox.replace('T', '')) - 1 + ':' + optionText + ','; - } - - $scope.correctResponse = $scope.correctResponse.replace(/,$/, ''); - $scope.correctResonseKeyValue = $scope.correctResponse.split(','); - - $scope.correctResponseForSavingDatabase = $scope.correctResponseForSavingDatabase.replace(/,$/, ''); - } - - - $scope.getDragItems = function () { - var OptionBoxes = $("div[id*='block-']"); - $scope.DragItems = ''; - for (var i = 0; i < OptionBoxes.length; i++) { - $scope.DragItems += OptionBoxes[i].id.replace('block-', '') + ',' + OptionBoxes[i].innerHTML + ';'; - } - $scope.DragItems = $scope.DragItems.replace(/;$/, ''); - - } - - $scope.getScore = function () { - - var abc = $scope.UserAttempt; - $scope.Score = 0; - angular.forEach($scope.UserAttempt, function (value, key) { - - var userOptedAnswer = value.BlankBoxName + ' ' + value.OptionName; - for(var i=0;i<$scope.correctResonseKeyValue.length;i++) { - if (userOptedAnswer == $scope.correctResonseKeyValue[i]) { - $scope.Score += 1; - } - - } - - - }) - } - - $scope.GetSavedLabExerciseFromDatabase = function () { - - var labExerciseInfo = { - userId: 1, - identifier: 'di' - }; - - LabExerciseService.GetLabExercise(labExerciseInfo) - .then( - - function (result) { - if (result != undefined && result != AIAConstants.SAVED_LAB_EXERCISE_NOT_FOUND) { - $scope.SavedLabExercise = result; - - $scope.ShowSavedLabExercise(); - } - }, - function(error){ - console.log(' Error in getting LabExercise = ' + error.statusText); - $rootScope.errorMessage = AdminConstants.ERROR_IN_FECTHING_DETAILS; - $("#messageModal").modal('show'); - }) - - } - - $scope.ShowSavedLabExercise = function () { - - //from database - var lastQuestion = $scope.quiznumber; - var lastQuestionDetails; - var lastQuestionAnswers; - - //if user opted this question, it will have entry in LabExerciseUserData - var thisQuestiondataInLabExerciseUserData = new jinqJs() - .from($scope.LabExerciseUserData) - .where('QuestionNo == ' + $scope.quiznumber) - .select(); - - - //if this exists in LabExerciseUserData, show the new opted else show from database - if (thisQuestiondataInLabExerciseUserData.length > 0){ - - - lastQuestionDetails = thisQuestiondataInLabExerciseUserData; - if (lastQuestionDetails != undefined && lastQuestionDetails.length > 0) - lastQuestionAnswers = lastQuestionDetails[0].UserAnswer.split(','); - } - - else{ - - lastQuestionDetails = new jinqJs() - .from($scope.SavedLabExercise.labExercise) - .where('QuestionNo == ' + lastQuestion) - .select(); - if (lastQuestionDetails != undefined && lastQuestionDetails.length>0) - lastQuestionAnswers = lastQuestionDetails[0].UserAnswers.split(','); - } - if (lastQuestionDetails != undefined && lastQuestionDetails.length > 0) { - $scope.QustionAnsKeyValue = []; - for (var i = 0; i < lastQuestionAnswers.length; i++) { - var num = i + 1; - $scope.QustionAnsKeyValue.push({ blockbox: 'T' + num, text: lastQuestionAnswers[i] }); - - if (lastQuestionAnswers[i] != "") { - var blocks = $("div[id*='block-']"); - for (var j = 0; j < blocks.length; j++) { - - if ((blocks[j].innerHTML).toString() == lastQuestionAnswers[i]) { - $('#' + blocks[j].id).css("display", "none"); - }; - - } - - } - } - - - var labQuestionData = new jinqJs() - .from($scope.LabExData.LabExercise[0].Questions) - .where('Number == ' + lastQuestion) - .select(); - - angular.forEach($scope.QustionAnsKeyValue, function (value, key) { - var questionOptionBox = new jinqJs() - .from(labQuestionData[0].OptionBox) - .where('BoxName == ' + value.blockbox) - .select(); - if (value.text != "") { - - $scope.DraggedList.push({ "id": value.blockbox, "optionName": value.blockbox, "Value": value.text, "topcoord": questionOptionBox[0].topcoord, "leftcoord": questionOptionBox[0].leftcoord }); - - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - } - - }) - } - $rootScope.isLoading = false; - $('#spinner').css('visibility', 'hidden'); - - } - -}] - -); - -AIA.directive('draggable', function () { - return { - link: function ($scope, element, attrs) { - element[0].addEventListener('dragstart', $scope.handleDragStart, false); - element[0].addEventListener('dragend', $scope.handleDragEnd, false); - } - } -}); - -AIA.directive('droppable', function () { - return { - link: function ($scope, element, attrs) { - element[0].addEventListener('drop', $scope.handleDrop, false); - element[0].addEventListener('dragover', $scope.handleDragOver, false); - } - } -}); - -AIA.directive('imageonload', function () { - return { - restrict: 'A', - link: function (scope, element, attrs) { - element.bind('load', function (e) { - $('#imgdiv').css('width', this.naturalWidth + "px"); - }); - element.bind('error', function () { - //alert('image could not be loaded'); - }); - } - }; -}); - -//angular.module('app') -//.filter('to_trusted', ['$sce', function ($sce) { -// return function (text) { -// return $sce.trustAsHtml(text); -// }; -//}]); \ No newline at end of file diff --git a/400-SOURCECODE/AIAHTML5.Web/app/views/LabExerc/LabExerc-view.html b/400-SOURCECODE/AIAHTML5.Web/app/views/LabExerc/LabExerc-view.html index 09f05e4..f773413 100644 --- a/400-SOURCECODE/AIAHTML5.Web/app/views/LabExerc/LabExerc-view.html +++ b/400-SOURCECODE/AIAHTML5.Web/app/views/LabExerc/LabExerc-view.html @@ -122,3 +122,4 @@ + \ No newline at end of file diff --git a/400-SOURCECODE/AIAHTML5.Web/libs/DragDropTouch.js b/400-SOURCECODE/AIAHTML5.Web/libs/DragDropTouch.js new file mode 100644 index 0000000..ceb874d --- /dev/null +++ b/400-SOURCECODE/AIAHTML5.Web/libs/DragDropTouch.js @@ -0,0 +1,407 @@ +var DragDropTouch; +(function (DragDropTouch_1) { + 'use strict'; + /** + * Object used to hold the data that is being dragged during drag and drop operations. + * + * It may hold one or more data items of different types. For more information about + * drag and drop operations and data transfer objects, see + * HTML Drag and Drop API. + * + * This object is created automatically by the @see:DragDropTouch singleton and is + * accessible through the @see:dataTransfer property of all drag events. + */ + var DataTransfer = (function () { + function DataTransfer() { + this._dropEffect = 'move'; + this._effectAllowed = 'all'; + this._data = {}; + } + Object.defineProperty(DataTransfer.prototype, "dropEffect", { + /** + * Gets or sets the type of drag-and-drop operation currently selected. + * The value must be 'none', 'copy', 'link', or 'move'. + */ + get: function () { + return this._dropEffect; + }, + set: function (value) { + this._dropEffect = value; + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(DataTransfer.prototype, "effectAllowed", { + /** + * Gets or sets the types of operations that are possible. + * Must be one of 'none', 'copy', 'copyLink', 'copyMove', 'link', + * 'linkMove', 'move', 'all' or 'uninitialized'. + */ + get: function () { + return this._effectAllowed; + }, + set: function (value) { + this._effectAllowed = value; + }, + enumerable: true, + configurable: true + }); + Object.defineProperty(DataTransfer.prototype, "types", { + /** + * Gets an array of strings giving the formats that were set in the @see:dragstart event. + */ + get: function () { + return Object.keys(this._data); + }, + enumerable: true, + configurable: true + }); + /** + * Removes the data associated with a given type. + * + * The type argument is optional. If the type is empty or not specified, the data + * associated with all types is removed. If data for the specified type does not exist, + * or the data transfer contains no data, this method will have no effect. + * + * @param type Type of data to remove. + */ + DataTransfer.prototype.clearData = function (type) { + if (type != null) { + delete this._data[type]; + } + else { + this._data = null; + } + }; + /** + * Retrieves the data for a given type, or an empty string if data for that type does + * not exist or the data transfer contains no data. + * + * @param type Type of data to retrieve. + */ + DataTransfer.prototype.getData = function (type) { + return this._data[type] || ''; + }; + /** + * Set the data for a given type. + * + * For a list of recommended drag types, please see + * https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Recommended_Drag_Types. + * + * @param type Type of data to add. + * @param value Data to add. + */ + DataTransfer.prototype.setData = function (type, value) { + this._data[type] = value; + }; + /** + * Set the image to be used for dragging if a custom one is desired. + * + * @param img An image element to use as the drag feedback image. + * @param offsetX The horizontal offset within the image. + * @param offsetY The vertical offset within the image. + */ + DataTransfer.prototype.setDragImage = function (img, offsetX, offsetY) { + var ddt = DragDropTouch._instance; + ddt._imgCustom = img; + ddt._imgOffset = { x: offsetX, y: offsetY }; + }; + return DataTransfer; + }()); + DragDropTouch_1.DataTransfer = DataTransfer; + /** + * Defines a class that adds support for touch-based HTML5 drag/drop operations. + * + * The @see:DragDropTouch class listens to touch events and raises the + * appropriate HTML5 drag/drop events as if the events had been caused + * by mouse actions. + * + * The purpose of this class is to enable using existing, standard HTML5 + * drag/drop code on mobile devices running IOS or Android. + * + * To use, include the DragDropTouch.js file on the page. The class will + * automatically start monitoring touch events and will raise the HTML5 + * drag drop events (dragstart, dragenter, dragleave, drop, dragend) which + * should be handled by the application. + * + * For details and examples on HTML drag and drop, see + * https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Drag_operations. + */ + var DragDropTouch = (function () { + /** + * Initializes the single instance of the @see:DragDropTouch class. + */ + function DragDropTouch() { + this._lastClick = 0; + // enforce singleton pattern + if (DragDropTouch._instance) { + throw 'DragDropTouch instance already created.'; + } + // detect passive event support + // https://github.com/Modernizr/Modernizr/issues/1894 + var supportsPassive = false; + document.addEventListener('test', function () { }, { + get passive() { + supportsPassive = true; + return true; + } + }); + // listen to touch events + if ('ontouchstart' in document) { + 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; + d.addEventListener('touchstart', ts, opt); + d.addEventListener('touchmove', tm, opt); + d.addEventListener('touchend', te); + d.addEventListener('touchcancel', te); + } + } + /** + * Gets a reference to the @see:DragDropTouch singleton. + */ + DragDropTouch.getInstance = function () { + return DragDropTouch._instance; + }; + // ** event handlers + DragDropTouch.prototype._touchstart = function (e) { + var _this = this; + if (this._shouldHandle(e)) { + // raise double-click and prevent zooming + if (Date.now() - this._lastClick < DragDropTouch._DBLCLICK) { + if (this._dispatchEvent(e, 'dblclick', e.target)) { + e.preventDefault(); + this._reset(); + return; + } + } + // clear all variables + this._reset(); + // get nearest draggable element + var src = this._closestDraggable(e.target); + if (src) { + // give caller a chance to handle the hover/move events + if (!this._dispatchEvent(e, 'mousemove', e.target) && + !this._dispatchEvent(e, 'mousedown', e.target)) { + // get ready to start dragging + this._dragSource = src; + this._ptDown = this._getPoint(e); + this._lastTouch = e; + e.preventDefault(); + // show context menu if the user hasn't started dragging after a while + setTimeout(function () { + if (_this._dragSource == src && _this._img == null) { + if (_this._dispatchEvent(e, 'contextmenu', src)) { + _this._reset(); + } + } + }, DragDropTouch._CTXMENU); + } + } + } + }; + DragDropTouch.prototype._touchmove = function (e) { + if (this._shouldHandle(e)) { + // see if target wants to handle move + var target = this._getTarget(e); + if (this._dispatchEvent(e, 'mousemove', target)) { + this._lastTouch = e; + e.preventDefault(); + return; + } + // start dragging + if (this._dragSource && !this._img) { + var delta = this._getDelta(e); + if (delta > DragDropTouch._THRESHOLD) { + this._dispatchEvent(e, 'dragstart', this._dragSource); + this._createImage(e); + this._dispatchEvent(e, 'dragenter', target); + } + } + // continue dragging + if (this._img) { + this._lastTouch = e; + e.preventDefault(); // prevent scrolling + if (target != this._lastTarget) { + this._dispatchEvent(this._lastTouch, 'dragleave', this._lastTarget); + this._dispatchEvent(e, 'dragenter', target); + this._lastTarget = target; + } + this._moveImage(e); + this._dispatchEvent(e, 'dragover', target); + } + } + }; + DragDropTouch.prototype._touchend = function (e) { + if (this._shouldHandle(e)) { + // see if target wants to handle up + if (this._dispatchEvent(this._lastTouch, 'mouseup', e.target)) { + e.preventDefault(); + return; + } + // user clicked the element but didn't drag, so clear the source and simulate a click + if (!this._img) { + this._dragSource = null; + this._dispatchEvent(this._lastTouch, 'click', e.target); + this._lastClick = Date.now(); + } + // finish dragging + this._destroyImage(); + if (this._dragSource) { + if (e.type.indexOf('cancel') < 0) { + this._dispatchEvent(this._lastTouch, 'drop', this._lastTarget); + } + this._dispatchEvent(this._lastTouch, 'dragend', this._dragSource); + this._reset(); + } + } + }; + // ** utilities + // ignore events that have been handled or that involve more than one touch + DragDropTouch.prototype._shouldHandle = function (e) { + return e && + !e.defaultPrevented && + e.touches && e.touches.length < 2; + }; + // clear all members + DragDropTouch.prototype._reset = function () { + this._destroyImage(); + this._dragSource = null; + this._lastTouch = null; + this._lastTarget = null; + this._ptDown = null; + this._dataTransfer = new DataTransfer(); + }; + // get point for a touch event + DragDropTouch.prototype._getPoint = function (e, page) { + if (e && e.touches) { + e = e.touches[0]; + } + return { x: page ? e.pageX : e.clientX, y: page ? e.pageY : e.clientY }; + }; + // get distance between the current touch event and the first one + DragDropTouch.prototype._getDelta = function (e) { + var p = this._getPoint(e); + return Math.abs(p.x - this._ptDown.x) + Math.abs(p.y - this._ptDown.y); + }; + // get the element at a given touch event + DragDropTouch.prototype._getTarget = function (e) { + var pt = this._getPoint(e), el = document.elementFromPoint(pt.x, pt.y); + while (el && getComputedStyle(el).pointerEvents == 'none') { + el = el.parentElement; + } + return el; + }; + // create drag image from source element + DragDropTouch.prototype._createImage = function (e) { + // just in case... + if (this._img) { + this._destroyImage(); + } + // create drag image from custom element or drag source + var src = this._imgCustom || this._dragSource; + this._img = src.cloneNode(true); + this._copyStyle(src, this._img); + this._img.style.top = this._img.style.left = '-9999px'; + // if creating from drag source, apply offset and opacity + if (!this._imgCustom) { + var rc = src.getBoundingClientRect(), pt = this._getPoint(e); + this._imgOffset = { x: pt.x - rc.left, y: pt.y - rc.top }; + this._img.style.opacity = DragDropTouch._OPACITY.toString(); + } + // add image to document + this._moveImage(e); + document.body.appendChild(this._img); + }; + // dispose of drag image element + DragDropTouch.prototype._destroyImage = function () { + if (this._img && this._img.parentElement) { + this._img.parentElement.removeChild(this._img); + } + this._img = null; + this._imgCustom = null; + }; + // move the drag image element + DragDropTouch.prototype._moveImage = function (e) { + var _this = this; + if (this._img) { + requestAnimationFrame(function () { + var pt = _this._getPoint(e, true), s = _this._img.style; + s.position = 'absolute'; + s.pointerEvents = 'none'; + s.zIndex = '999999'; + s.left = Math.round(pt.x - _this._imgOffset.x) + 'px'; + s.top = Math.round(pt.y - _this._imgOffset.y) + 'px'; + }); + } + }; + // copy properties from an object to another + DragDropTouch.prototype._copyProps = function (dst, src, props) { + for (var i = 0; i < props.length; i++) { + var p = props[i]; + dst[p] = src[p]; + } + }; + DragDropTouch.prototype._copyStyle = function (src, dst) { + // remove potentially troublesome attributes + DragDropTouch._rmvAtts.forEach(function (att) { + dst.removeAttribute(att); + }); + // copy canvas content + if (src instanceof HTMLCanvasElement) { + var cSrc = src, cDst = dst; + cDst.width = cSrc.width; + cDst.height = cSrc.height; + cDst.getContext('2d').drawImage(cSrc, 0, 0); + } + // copy style (without transitions) + var cs = getComputedStyle(src); + for (var i = 0; i < cs.length; i++) { + var key = cs[i]; + if (key.indexOf('transition') < 0) { + dst.style[key] = cs[key]; + } + } + dst.style.pointerEvents = 'none'; + // and repeat for all children + for (var i = 0; i < src.children.length; i++) { + this._copyStyle(src.children[i], dst.children[i]); + } + }; + DragDropTouch.prototype._dispatchEvent = function (e, type, target) { + if (e && target) { + var evt = document.createEvent('Event'), t = e.touches ? e.touches[0] : e; + evt.initEvent(type, true, true); + evt.button = 0; + evt.which = evt.buttons = 1; + this._copyProps(evt, e, DragDropTouch._kbdProps); + this._copyProps(evt, t, DragDropTouch._ptProps); + evt.dataTransfer = this._dataTransfer; + target.dispatchEvent(evt); + return evt.defaultPrevented; + } + return false; + }; + // gets an element's closest draggable ancestor + DragDropTouch.prototype._closestDraggable = function (e) { + for (; e; e = e.parentElement) { + if (e.hasAttribute('draggable') && e.draggable) { + return e; + } + } + return null; + }; + return DragDropTouch; + }()); + /*private*/ DragDropTouch._instance = new DragDropTouch(); // singleton + // constants + DragDropTouch._THRESHOLD = 5; // pixels to move before drag starts + DragDropTouch._OPACITY = 0.5; // drag image opacity + DragDropTouch._DBLCLICK = 500; // max ms between clicks in a double click + DragDropTouch._CTXMENU = 900; // ms to hold before raising 'contextmenu' event + // copy styles/attributes from drag source to drag image element + DragDropTouch._rmvAtts = 'id,class,style,draggable'.split(','); + // synthesize and dispatch an event + // returns true if the event has been handled (e.preventDefault == true) + DragDropTouch._kbdProps = 'altKey,ctrlKey,metaKey,shiftKey'.split(','); + DragDropTouch._ptProps = 'pageX,pageY,clientX,clientY,screenX,screenY'.split(','); + DragDropTouch_1.DragDropTouch = DragDropTouch; +})(DragDropTouch || (DragDropTouch = {})); \ No newline at end of file