@gamelearn/arcade-components 0.22.9 → 0.22.11

package/dist/components/chained-image-click-puzzle-component/components/CurrentImagePuzzle.js

@@ -93,26 +93,17 @@ var CurrentImageClickPuzzle = function CurrentImageClickPuzzle(_ref) {
   var info = currentImageProps.info,
       specificFeedbacks = currentImageProps.specificFeedbacks;
   info.description = description;
-  var handleResolve = (0, _react.useCallback)(function () {
-    emitEvent({
-      type: 'puzzleAction',
-      action: 'resolve',
-      payload: {
-        element: puzzleId,
-        rewards: info.resolve.rewards
-      }
-    });
-  }, [emitEvent, puzzleId, info.resolve.rewards]);
   (0, _react.useEffect)(function () {
     correctClicked.current = 0;
   }, [index]);
   var onComplete = (0, _react.useCallback)(function (rw) {
     var correct = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    var finish = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
 
     if (correct) {
       var _specificFeedbacks$co;
 
-      if ((_specificFeedbacks$co = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co !== void 0 && _specificFeedbacks$co.length) {
+      if (specificFeedbacks !== null && specificFeedbacks !== void 0 && (_specificFeedbacks$co = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co !== void 0 && _specificFeedbacks$co.length && !currentImageProps.hasClickOnce && !finish) {
         correctClicked.current += 1;
         setSelected(selected + 1);
       } else {
@@ -141,13 +132,18 @@ var CurrentImageClickPuzzle = function CurrentImageClickPuzzle(_ref) {
         correctClicked.current = 0;
       }
     }
-  }, [index, list.length, currentImageProps.hasClickOrder, currentImageProps.areas.length, handleFinish, specificFeedbacks, setSelected, selected, emitEvent]);
+  }, [index, list.length, currentImageProps.hasClickOrder, currentImageProps.hasClickOnce, currentImageProps.areas.length, handleFinish, specificFeedbacks, setSelected, selected, emitEvent]);
 
   var onResolve = function onResolve() {
     playSound('score');
-    setTimeout(function () {
-      handleResolve();
-    }, 2000);
+    emitEvent({
+      type: 'puzzleAction',
+      action: 'resolve',
+      payload: {
+        element: puzzleId,
+        rewards: info.resolve.rewards
+      }
+    });
   };
 
   (0, _react.useEffect)(function () {
@@ -156,19 +152,9 @@ var CurrentImageClickPuzzle = function CurrentImageClickPuzzle(_ref) {
     }));
   }, [info, setInfo, puzzleId]);
   (0, _react.useEffect)(function () {
-    var timeout;
-
     if (currentPuzzleStatus) {
-      timeout = setTimeout(function () {
-        onComplete([], false);
-      }, 2000);
+      onComplete([], true, true);
     }
-
-    return function () {
-      if (timeout) {
-        clearTimeout(timeout);
-      }
-    };
   }, [onComplete, puzzleId, currentPuzzleStatus]);
   return /*#__PURE__*/_react.default.createElement(_imageClickWrapperComponent.default, _extends({
     key: index

package/dist/components/frame-click-puzzle-component/components/CurrentFramePuzzle.js

@@ -80,13 +80,14 @@ var CurrentFramePuzzle = function CurrentFramePuzzle(_ref) {
   }, [index]);
   var onComplete = (0, _react.useCallback)(function (rw) {
     var correct = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    var finish = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
 
     var updatedCompleted = _objectSpread({}, framesCompleted);
 
     if (correct) {
       var _specificFeedbacks$co;
 
-      if ((_specificFeedbacks$co = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co !== void 0 && _specificFeedbacks$co.length) {
+      if (specificFeedbacks !== null && specificFeedbacks !== void 0 && (_specificFeedbacks$co = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co !== void 0 && _specificFeedbacks$co.length && !props.hasClickOnce && !finish) {
         correctClicked.current += 1;
         setSelected(selected + 1);
       } else {
@@ -117,7 +118,7 @@ var CurrentFramePuzzle = function CurrentFramePuzzle(_ref) {
         correctClicked.current = 0;
       }
     }
-  }, [emitEvent, specificFeedbacks, framesCompleted, props.hasClickOrder, props.areas.length, list.length, selected, setSelected, setRewards, index, setFramesCompleted, setIndex, handleFinish]);
+  }, [emitEvent, specificFeedbacks, framesCompleted, props.hasClickOrder, props.hasClickOnce, props.areas.length, list.length, selected, setSelected, setRewards, index, setFramesCompleted, setIndex, handleFinish]);
   var handleResolve = (0, _react.useCallback)(function () {
     playSound('score');
     emitEvent({
@@ -135,9 +136,7 @@ var CurrentFramePuzzle = function CurrentFramePuzzle(_ref) {
   }, [emitEvent, puzzleId, playSound, info.resolve.rewards]);
   (0, _react.useEffect)(function () {
     if (loadPuzzleStatus) {
-      setTimeout(function () {
-        onComplete([]);
-      }, 2000);
+      onComplete([], true, true);
     }
   }, [loadPuzzleStatus, onComplete]);
   return /*#__PURE__*/_react.default.createElement(_imageClickWrapperComponent.default, _extends({

package/dist/components/image-click-wrapper-component/components/ImageClickWrapperComponent.js

@@ -128,16 +128,16 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
       shape: 'poly'
     }, area);
   });
-  var handleFinish = (0, _react.useCallback)(function (rewards) {
+  var handleFinish = (0, _react.useCallback)(function (rewards, success) {
     if (emitFinish) {
-      emitFinish(rewards, feedbackData.success);
+      emitFinish(rewards, success);
     } else {
       emitEvent({
         type: 'addPoints',
         payload: rewards
       });
     }
-  }, [emitEvent, emitFinish, feedbackData.success]);
+  }, [emitEvent, emitFinish]);
   (0, _react.useEffect)(function () {
     if (completed) {
       disableExit(true);
@@ -147,18 +147,24 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
     setCompleted(defaultCompleted);
   }, [defaultCompleted]);
   (0, _react.useEffect)(function () {
-    if (areas.length === clickedZones.length && !completed || hasClickOnce && clickedZones.length > 0) {
+    if ((areas.length === clickedZones.length || hasClickOnce && clickedZones.length > 0) && !completed) {
       var _specificFeedbacks$co;
 
       setCompleted(true);
+      var lastClicked = clickedZones[clickedZones.length - 1];
+      var lastSpecific = specificFeedbacks.correctFeedbacks.find(function (feed) {
+        return feed.id === lastClicked.id;
+      });
 
-      if (!((_specificFeedbacks$co = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co !== void 0 && _specificFeedbacks$co.length)) {
+      if (!(specificFeedbacks !== null && specificFeedbacks !== void 0 && (_specificFeedbacks$co = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co !== void 0 && _specificFeedbacks$co.length) || specificFeedbacks !== null && specificFeedbacks !== void 0 && specificFeedbacks.correctFeedbacks.some(function (feed) {
+        return !feed.desc;
+      }) || hasClickOnce) {
         setFeedbackData(function (oldState) {
           return _objectSpread(_objectSpread({}, oldState), {}, {
             show: true,
             success: true,
-            text: info.solution.right.desc,
-            rewards: info.solution.right.rewards
+            text: lastSpecific ? lastSpecific.desc : info.solution.right.desc,
+            rewards: lastSpecific ? lastSpecific.rewards : info.solution.right.rewards
           });
         });
       }
@@ -188,10 +194,6 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
           desc = _solution$wrong.desc;
       var feedback = desc;
       var rewards = wrongRewards;
-      emitEvent({
-        type: 'hidePuzzleButtons',
-        payload: true
-      });
       var specific = (_specificFeedbacks$wr = specificFeedbacks.wrongFeedbacks) === null || _specificFeedbacks$wr === void 0 ? void 0 : _specificFeedbacks$wr.find(function (feed) {
         return feed.id === area.id;
       });
@@ -206,7 +208,14 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
       }
 
       if (hasClickOrder) {
+        var _info$orderFeedback;
+
         setClickedZones([]);
+
+        if (info !== null && info !== void 0 && (_info$orderFeedback = info.orderFeedback) !== null && _info$orderFeedback !== void 0 && _info$orderFeedback.desc) {
+          feedback = info.orderFeedback.desc;
+          rewards = info.orderFeedback.rewards;
+        }
       }
 
       setFeedbackData(function (oldState) {
@@ -221,8 +230,8 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
     }
   };
 
-  var handleOnClose = function handleOnClose() {
-    handleFinish(feedbackData.rewards);
+  var handleOnClose = (0, _react.useCallback)(function () {
+    handleFinish(feedbackData.rewards, feedbackData.success);
     playSound('click-ui');
     setFeedbackData(function (oldState) {
       return _objectSpread(_objectSpread({}, oldState), {}, {
@@ -232,7 +241,7 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
         rewards: []
       });
     });
-  };
+  }, [feedbackData.rewards, feedbackData.success, handleFinish, playSound]);
 
   var handleCorrectAreaClick = function handleCorrectAreaClick(area) {
     if (!clickedZones.some(function (zone) {
@@ -241,11 +250,12 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
       playSound('click-ui');
       var feedback = solution.right.desc;
       var rewards = solution.right.rewards;
+      var updatedZones = [].concat(_toConsumableArray(clickedZones), [area]);
 
       if (hasClickOrder && area.index === clickedZones.length || !hasClickOrder) {
         var _specificFeedbacks$co2;
 
-        if ((_specificFeedbacks$co2 = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co2 !== void 0 && _specificFeedbacks$co2.length) {
+        if (specificFeedbacks !== null && specificFeedbacks !== void 0 && (_specificFeedbacks$co2 = specificFeedbacks.correctFeedbacks) !== null && _specificFeedbacks$co2 !== void 0 && _specificFeedbacks$co2.length) {
           var _specificFeedbacks$co3;
 
           var specific = (_specificFeedbacks$co3 = specificFeedbacks.correctFeedbacks) === null || _specificFeedbacks$co3 === void 0 ? void 0 : _specificFeedbacks$co3.find(function (feed) {
@@ -257,17 +267,21 @@ var ImageClickWrapperComponent = function ImageClickWrapperComponent(props) {
             rewards = specific.rewards;
           }
 
-          setFeedbackData(function (oldState) {
-            return _objectSpread(_objectSpread({}, oldState), {}, {
-              show: true,
-              success: true,
-              text: feedback,
-              rewards: rewards
+          if (!feedback && areas.length > updatedZones.length && !hasClickOnce) {
+            handleFinish(rewards, true);
+          } else if (feedback && !hasClickOnce) {
+            setFeedbackData(function (oldState) {
+              return _objectSpread(_objectSpread({}, oldState), {}, {
+                show: true,
+                success: true,
+                text: feedback,
+                rewards: rewards
+              });
             });
-          });
+          }
         }
 
-        setClickedZones([].concat(_toConsumableArray(clickedZones), [area]));
+        setClickedZones(updatedZones);
       } else {
         handleIncorrectAreaClick(area);
       }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@gamelearn/arcade-components",
   "license": "Gamelearn",
-  "version": "0.22.9",
+  "version": "0.22.11",
   "main": "dist/index.js",
   "files": [
     "dist",