@cake-fxd/rn-case/lib/ChunkWordCase/index.js

ReactNative Case

"use strict";var _interopRequireWildcard=require("@babel/runtime/helpers/interopRequireWildcard");var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports["default"]=void 0;var _extends2=_interopRequireDefault(require("@babel/runtime/helpers/extends"));var _slicedToArray2=_interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));var _lib=require("@cake-fxd/rn-elements/lib");var _BounceOption=_interopRequireDefault(require("@cake-fxd/rn-elements/lib/BounceOption"));var _react=_interopRequireWildcard(require("react"));var _reactNative=require("react-native");var _withCaseBackground=_interopRequireDefault(require("../CaseBackground/withCaseBackground"));var _CaseGather=require("../CaseGather");var _useLeaveAnimate2=_interopRequireDefault(require("../hooks/useLeaveAnimate"));var _px2dp=_interopRequireDefault(require("../util/px2dp"));var _styles=_interopRequireDefault(require("./styles"));var styles=(0,_styles["default"])();var lottieConfig={source:require("../../assets/lottie/sqaure.json"),style:{height:(0,_px2dp["default"])(340),position:'absolute',zIndex:1}};var audioPlayer=new _lib.AudioPlayer();var ChunkWordCase=function ChunkWordCase(props){var _a;var caseContext=(0,_react.useContext)(_CaseGather.CaseContext);var _useLeaveAnimate=(0,_useLeaveAnimate2["default"])(props.onComplete),getLaveAnimateStyle=_useLeaveAnimate.getLaveAnimateStyle;var allOptions=(0,_react.useMemo)(function(){return props.correctOptions.concat(props.interfaceOptions);},[props.correctOptions,props.interfaceOptions]);var audioRef=(0,_react.useRef)(null);var _useState=(0,_react.useState)(false),_useState2=(0,_slicedToArray2["default"])(_useState,2),showSentences=_useState2[0],toggleSentenceShow=_useState2[1];var chunkIndex=(0,_react.useRef)(0).current;var audios=(0,_react.useRef)(getChunkAudios()).current;(0,_react.useEffect)(function(){chunkAudioPlay();},[]);function handleDrop(){chunkAudioPlay();}function getChunkAudios(){return props.correctOptions.map(function(item){return item.audio;});}function chunkAudioPlay(){var nextAudio=audios[chunkIndex++];if(nextAudio){audioPlayer.play(nextAudio);}}function onComplete(){var _a,_b;toggleSentenceShow(true);(_a=props.onSelect)===null||_a===void 0?void 0:_a.call(props);if(props.audio){(_b=audioRef.current)===null||_b===void 0?void 0:_b.play();}if(props.translateAudio&&props.translateAutoPlay){audioPlayer.play(props.translateAudio);}}return _react["default"].createElement(_reactNative.View,{style:styles.container},_react["default"].createElement(_reactNative.Animated.View,{style:(0,_extends2["default"])((0,_extends2["default"])({},getLaveAnimateStyle()),{alignItems:'center'})},_react["default"].createElement(_lib.HotSpot,(0,_extends2["default"])({},props,{onComplete:onComplete,source:props.source,hideWhenComplete:true,onDrop:handleDrop,fillChunkConfig:{style:styles.fillStyle,waitWrapperStyle:styles.waitWrapperStyle,placeWrapperStyle:styles.placeWrapperStyle,placeTextStyle:styles.placeTextStyle},renderChunkComponent:function renderChunkComponent(value,bounce){return _react["default"].createElement(_BounceOption["default"],{lottie:lottieConfig,correct:true},_react["default"].createElement(_lib.TextButton,{text:value,correct:true,style:{width:bounce.width,height:bounce.height}}));},dragWapperStyle:{flexWrap:'wrap',maxWidth:(0,_px2dp["default"])(560)},itemStyle:{marginHorizontal:allOptions.length>2?(0,_px2dp["default"])(10):(0,_px2dp["default"])(45),marginBottom:(0,_px2dp["default"])(20)},dragComponent:function dragComponent(_ref){var chunk=_ref.chunk;return _react["default"].createElement(_lib.TextButton,{text:chunk.value});}}),_react["default"].createElement(_lib.AudioSpeaker,{url:props.audio,autoPlay:props.autoPlay,ref:audioRef,style:{position:'absolute',right:10,top:10}}),props.type==='text'&&props.text?_react["default"].createElement(_lib.FontText,{text:props.text,style:{marginBottom:(0,_px2dp["default"])(40)}}):null,showSentences&&_react["default"].createElement(_react["default"].Fragment,null,_react["default"].createElement(_lib.FadeAnimate,{visible:true},_react["default"].createElement(_lib.TextButton,{text:(_a=props.sentence)!==null&&_a!==void 0?_a:'',correct:true,style:{width:(0,_px2dp["default"])(562)},textStyle:{lineHeight:(0,_px2dp["default"])(50),fontSize:(0,_px2dp["default"])(40)}}),props.translate?_react["default"].createElement(_lib.FontText,{text:props.translate,style:styles.translate}):null))),props.isSelected&&props.dialogue&&_react["default"].createElement(_lib.Dialogue,(0,_extends2["default"])({},props.dialogue,{style:{position:'absolute',top:(0,_px2dp["default"])(500)}}))));};var _default=(0,_withCaseBackground["default"])(ChunkWordCase);exports["default"]=_default;