Merge branch 'prod' into test

aukus-devs · Dec 15, 2024 · 124b91b · 124b91b
2 parents a63651d + 12007df
commit 124b91b
Show file tree

Hide file tree

Showing 6 changed files with 193 additions and 211 deletions.
diff --git a/src/pages/map/components/MapComponent.tsx b/src/pages/map/components/MapComponent.tsx
@@ -563,7 +563,6 @@ export default function MapComponent() {
                 top: '-130px',
                 width: '300px',
                 height: '500px',
-                zIndex: 20,
                 backgroundImage: `url(${TgaImage})`,
                 backgroundRepeat: 'no-repeat',
                 // backgroundPosition: 'center',

diff --git a/src/pages/map/components/action/DiceModal.tsx b/src/pages/map/components/action/DiceModal.tsx
@@ -72,7 +72,7 @@ export default function DiceModal({
   const [diceColor, setDiceColor] = useState<string>(getRandomHexColor(player))
 
   const [showGoogleIframe, setShowGoogleIframe] = useState(false)
-  const [showRandomOrgIframe, setShowRandomOrgIframe] = useState(false)
+  const [showRollIframe, setShowRollIframe] = useState(false)
 
   const [customRoll, setCustomRoll] = useState<number | null>(null)
 
@@ -109,7 +109,7 @@ export default function DiceModal({
       setDiceRoll(null)
       setDiceStatus('idle')
       setShowGoogleIframe(false)
-      setShowRandomOrgIframe(false)
+      setShowRollIframe(false)
       setCustomRoll(null)
       if (diceBox) {
         diceBox.clear()
@@ -181,8 +181,8 @@ export default function DiceModal({
     setDiceStatus('done')
   }
 
-  const handleRandomOrgThrow = () => {
-    setShowRandomOrgIframe(true)
+  const handleRollADieThrow = () => {
+    setShowRollIframe(true)
     setDiceStatus('done')
   }
 
@@ -255,7 +255,7 @@ export default function DiceModal({
           paddingBottom: '30px',
         }}
       >
-        {!showGoogleIframe && !showRandomOrgIframe && (
+        {!showGoogleIframe && !showRollIframe && (
           <>
             <Box
               border={`2px solid ${Color.greyLight}`}
@@ -313,11 +313,11 @@ export default function DiceModal({
             ></iframe>
           </Box>
         )}
-        {showRandomOrgIframe && (
+        {showRollIframe && (
           <Box>
             <iframe
-              src={`https://www.random.org/dice/?num=${diceAmount}`}
-              style={{ width: '740px', height: '560px' }}
+              src={`https://rolladie.net/roll-${diceAmount}-dice`}
+              style={{ width: '640px', height: '480px' }}
             ></iframe>
           </Box>
         )}
@@ -345,34 +345,33 @@ export default function DiceModal({
             </Box>
           )}
           <Box width="100%">
-            {diceStatus === 'done' &&
-              (showGoogleIframe || showRandomOrgIframe) && (
-                <TextField
-                  fullWidth
-                  placeholder="Суммарный результат броска"
-                  sx={{ height: '44px', marginBottom: '20px' }}
-                  value={customRoll ?? ''}
-                  onChange={(e) => {
-                    const value = parseInt(e.target.value)
-                    if (value >= 1 && value <= 100) {
-                      setCustomRoll(value)
-                    } else {
-                      setCustomRoll(null)
-                    }
-                  }}
-                  InputProps={{
-                    style: {
-                      paddingTop: '10px',
-                      paddingLeft: '15px',
-                      paddingRight: '15px',
-                      paddingBottom: '10px',
-                      lineHeight: '1.2',
-                      fontSize: '16px',
-                      fontWeight: 500,
-                    },
-                  }}
-                />
-              )}
+            {diceStatus === 'done' && (showGoogleIframe || showRollIframe) && (
+              <TextField
+                fullWidth
+                placeholder="Суммарный результат броска"
+                sx={{ height: '44px', marginBottom: '20px' }}
+                value={customRoll ?? ''}
+                onChange={(e) => {
+                  const value = parseInt(e.target.value)
+                  if (value >= 1 && value <= 100) {
+                    setCustomRoll(value)
+                  } else {
+                    setCustomRoll(null)
+                  }
+                }}
+                InputProps={{
+                  style: {
+                    paddingTop: '10px',
+                    paddingLeft: '15px',
+                    paddingRight: '15px',
+                    paddingBottom: '10px',
+                    lineHeight: '1.2',
+                    fontSize: '16px',
+                    fontWeight: 500,
+                  },
+                }}
+              />
+            )}
             {diceStatus === 'done' && (
               <Button
                 fullWidth
@@ -388,9 +387,15 @@ export default function DiceModal({
 
           {diceStatus === 'idle' && (
             <Box marginTop="20px" display="flex">
-              <Button style={{ width: '100%' }} onClick={handleGoogleThrow}>
+              <Button
+                style={{ marginRight: '20px', width: '100%' }}
+                onClick={handleGoogleThrow}
+              >
                 Бросить через google.com
               </Button>
+              <Button style={{ width: '100%' }} onClick={handleRollADieThrow}>
+                Бросить через rolladie.net
+              </Button>
             </Box>
           )}
         </Box>

diff --git a/src/pages/map/components/player/JumpingIcon.tsx b/src/pages/map/components/player/JumpingIcon.tsx
@@ -0,0 +1,48 @@
+import { useEffect } from 'react'
+import { animated, useSpring } from '@react-spring/web'
+
+type Props = {
+  image: string
+  isJumping?: boolean
+  scale?: number
+}
+
+export default function JumpingIcon({ image, isJumping, scale }: Props) {
+  const [styles, api] = useSpring(() => ({
+    x: 0,
+    y: 0,
+    scale: 1.0,
+    config: { duration: 1000 },
+  }))
+
+  const scaleValue = scale || 1.0
+
+  useEffect(() => {
+    if (isJumping) {
+      api.start({
+        loop: true,
+        from: { x: 0, y: 0, scale: 1.0 },
+        to: [
+          { x: 0, y: -10, scale: 0.8 },
+          { x: 0, y: 0, scale: 1.0 },
+        ],
+        config: { duration: 500 },
+      })
+    } else {
+      api.stop()
+    }
+  }, [isJumping])
+
+  return (
+    <animated.img
+      src={image}
+      style={{
+        ...styles,
+        width: `${40 * scaleValue}px`,
+        verticalAlign: 'middle',
+        filter: 'drop-shadow(0px -1px 15px rgba(0,0,0,1.0))',
+        zIndex: 20,
+      }}
+    />
+  )
+}