From: soufiane <soufiane@cubedesigners.com>
Date: Thu, 14 Sep 2023 12:11:49 +0000 (+0200)
Subject: wip #6182 @1:30 question drag and drop
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=dd716ca2d5d87c4134b5a99ac6eb43704ed1ef33;p=fluidbook-toolbox-quiz.git

wip #6182 @1:30 question drag and drop
---

diff --git a/js/quiz.animations.js b/js/quiz.animations.js
index 22bfb52..c581f16 100644
--- a/js/quiz.animations.js
+++ b/js/quiz.animations.js
@@ -20,7 +20,6 @@ QuizAnimations.prototype = {
         });
     },
 
-
     // Load the animation "name" in container
     load: function (name, container, replace, loop = false) {
         let json = this.quiz.data.animations[name];
@@ -122,7 +121,7 @@ QuizAnimations.prototype = {
             },
             ease: "power1.inOut",
             stagger: .15,
-            onComplete: function(index, target) {
+            onComplete: function() {
                 $(".active-screen .list-item").addClass("complete")
             }
         }, .7)
diff --git a/js/quiz.draganddrop.js b/js/quiz.draganddrop.js
index 1235a68..22c49d2 100644
--- a/js/quiz.draganddrop.js
+++ b/js/quiz.draganddrop.js
@@ -22,8 +22,6 @@ QuizDragAndDrop.prototype = {
     },
 
     start: function() {
-        const $this = this;
-
         this.activeScreen = this.quiz.screens.getActiveScreen()
         this.list = this.activeScreen.find(".list")
         this.listHtml = this.list.html()
@@ -98,10 +96,10 @@ QuizDragAndDrop.prototype = {
                             target.addClass("isValidated")
                         },
                         onComplete: function () {
-                            let html = target.html(),
+                            let text = target.text(),
                                 id = "answer-"+target.data("id")
 
-                            $(zone).find(".slot:not(.active)").eq(0).addClass("active").html(html).attr('data-order',target.data("id"))
+                            $(zone).find(".slot:not(.active)").eq(0).addClass("active").append("<span>"+text+"</span>").attr('data-order',target.data("id"))
                             $this.saveAnswer(zone,id)
                             target.remove()
                         }
@@ -119,7 +117,6 @@ QuizDragAndDrop.prototype = {
                         duration: 0
                     }, "+=0.3")
                 }
-
             },
             onRelease: function() {
                 //
@@ -133,6 +130,11 @@ QuizDragAndDrop.prototype = {
                     })
                 }
 
+                //
+                if($this.activeScreen.find(".list-item:not(.isDragging)").length === 0) {
+                    $this.toggleScreen(0,"none")
+                }
+
                 $(this.target).removeClass("isDragging")
 
                 // reset list rotation
@@ -168,6 +170,13 @@ QuizDragAndDrop.prototype = {
         $(".zone-1,.zone-2").removeClass("active")
     },
 
+    toggleScreen: function(opacity,pointer) {
+        gsap.to(".active-screen .screen", {
+            opacity: opacity,
+            pointerEvents: pointer
+        })
+    },
+
     getZoneOverlap: function(offsetLeft, offsetRight) {
         let zone = false,
             zone1 = ".zone-1",
@@ -211,8 +220,7 @@ QuizDragAndDrop.prototype = {
 
     saveAnswer: function(zone,id) {
         $(zone).find("input[id="+id+"]").prop("checked", true)
-
-        console.log($("input:checked"))
+        this.quiz.screens.updateUserAnswers();
     }
 }
 
diff --git a/js/quiz.screens.js b/js/quiz.screens.js
index 6fb9bee..7765e98 100644
--- a/js/quiz.screens.js
+++ b/js/quiz.screens.js
@@ -199,6 +199,7 @@ QuizScreens.prototype = {
         this.getCurrentForm().find("input").prop("checked", false)
         if(!only) {
             if(this.quiz.question.isDragAndDrop()) {
+                this.quiz.draganddrop.toggleScreen(1,"initial")
                 this.quiz.draganddrop.retreiveAnswer()
             }
         }