Merge branch 'feat/service/select_chain_response' into 'main'

Feat/service/select chain response

See merge request !64

src/api/cards.ts

@@ -16,6 +16,22 @@ export interface CardMeta {
     name?: string;
     types?: string;
     desc?: string;
+    str1?: string;
+    str2?: string;
+    str3?: string;
+    str4?: string;
+    str5?: string;
+    str6?: string;
+    str7?: string;
+    str8?: string;
+    str9?: string;
+    str10?: string;
+    str11?: string;
+    str12?: string;
+    str13?: string;
+    str14?: string;
+    str15?: string;
+    str16?: string;
   };
 }
 
@@ -31,3 +47,59 @@ export async function fetchCard(id: number): Promise<CardMeta> {
 
   return res.data;
 }
+
+export function getCardStr(meta: CardMeta, idx: number): string | undefined {
+  switch (idx) {
+    case 0: {
+      return meta.text.str1;
+    }
+    case 1: {
+      return meta.text.str2;
+    }
+    case 2: {
+      return meta.text.str3;
+    }
+    case 3: {
+      return meta.text.str4;
+    }
+    case 4: {
+      return meta.text.str5;
+    }
+    case 5: {
+      return meta.text.str6;
+    }
+    case 6: {
+      return meta.text.str7;
+    }
+    case 7: {
+      return meta.text.str8;
+    }
+    case 8: {
+      return meta.text.str9;
+    }
+    case 9: {
+      return meta.text.str10;
+    }
+    case 10: {
+      return meta.text.str11;
+    }
+    case 11: {
+      return meta.text.str12;
+    }
+    case 12: {
+      return meta.text.str13;
+    }
+    case 13: {
+      return meta.text.str14;
+    }
+    case 14: {
+      return meta.text.str15;
+    }
+    case 15: {
+      return meta.text.str16;
+    }
+    default: {
+      return undefined;
+    }
+  }
+}

src/reducers/duel/mod.ts

@@ -27,6 +27,7 @@ import {
   setCardListModalInfoImpl,
   setCheckCardModalIsOpenImpl,
   setCheckCardModalMinMaxImpl,
+  setCheckCardModalOnSubmitImpl,
   resetCheckCardModalImpl,
   checkCardModalCase,
 } from "./modalSlice";
@@ -123,6 +124,7 @@ const duelSlice = createSlice({
     setCardListModalInfo: setCardListModalInfoImpl,
     setCheckCardModalIsOpen: setCheckCardModalIsOpenImpl,
     setCheckCardModalMinMax: setCheckCardModalMinMaxImpl,
+    setCheckCardModalOnSubmit: setCheckCardModalOnSubmitImpl,
     resetCheckCardModal: resetCheckCardModalImpl,
   },
   extraReducers(builder) {
@@ -159,6 +161,7 @@ export const {
   setCardListModalInfo,
   setCheckCardModalIsOpen,
   setCheckCardModalMinMax,
+  setCheckCardModalOnSubmit,
   resetCheckCardModal,
 } = duelSlice.actions;
 export const selectDuelHsStart = (state: RootState) => {

src/reducers/duel/modalSlice.ts

@@ -4,7 +4,7 @@ import {
   createAsyncThunk,
   ActionReducerMapBuilder,
 } from "@reduxjs/toolkit";
-import { fetchCard } from "../../api/cards";
+import { fetchCard, getCardStr } from "../../api/cards";
 import { RootState } from "../../store";
 import { DuelState } from "./mod";
 import { judgeSelf } from "./util";
@@ -30,6 +30,7 @@ export interface ModalState {
   // 卡牌选择弹窗
   checkCardModal: {
     isOpen: boolean;
+    onSubmit?: string;
     selectMin?: number;
     selectMax?: number;
     tags: {
@@ -38,6 +39,7 @@ export interface ModalState {
         code: number;
         name?: string;
         desc?: string;
+        effectDesc?: string;
         response: number;
       }[];
     }[];
@@ -115,15 +117,26 @@ export const setCheckCardModalMinMaxImpl: CaseReducer<
   state.modalState.checkCardModal.selectMax = action.payload.max;
 };
 
+// 更新卡牌选择弹窗的提交回调
+export const setCheckCardModalOnSubmitImpl: CaseReducer<
+  DuelState,
+  PayloadAction<string>
+> = (state, action) => {
+  state.modalState.checkCardModal.onSubmit = action.payload;
+};
+
 // 增加卡牌选择选项
 export const fetchCheckCardMeta = createAsyncThunk(
   "duel/fetchCheckCardMeta",
   async (param: {
     controler: number;
     tagName: string;
-    option: { code: number; response: number };
+    option: { code: number; response: number; effectDescCode?: number };
   }) => {
     const meta = await fetchCard(param.option.code);
+    const effectDesc = param.option.effectDescCode
+      ? getCardStr(meta, param.option.effectDescCode & 0xf)
+      : undefined;
     const response = {
       controler: param.controler,
       tagName: param.tagName,
@@ -131,6 +144,7 @@ export const fetchCheckCardMeta = createAsyncThunk(
         code: meta.id,
         name: meta.text.name,
         desc: meta.text.desc,
+        effectDesc,
       },
     };
 
@@ -159,7 +173,7 @@ export const checkCardModalCase = (
     }
 
     state.modalState.checkCardModal.tags.push({
-      tagName,
+      tagName: combinedTagName,
       options: [{ code, response }],
     });
   });
@@ -178,6 +192,7 @@ export const checkCardModalCase = (
           if (option.code == meta.code) {
             option.name = meta.name;
             option.desc = meta.desc;
+            option.effectDesc = meta.effectDesc;
           }
         }
       }
@@ -216,3 +231,5 @@ export const selectCheckCardModalMinMax = (state: RootState) => {
 };
 export const selectCheckCardModalTags = (state: RootState) =>
   state.duel.modalState.checkCardModal.tags;
+export const selectCheckCardModalOnSubmit = (state: RootState) =>
+  state.duel.modalState.checkCardModal.onSubmit;

src/service/duel/selectCard.ts

@@ -3,6 +3,7 @@ import { AppDispatch } from "../../store";
 import {
   setCheckCardModalIsOpen,
   setCheckCardModalMinMax,
+  setCheckCardModalOnSubmit,
 } from "../../reducers/duel/mod";
 import { fetchCheckCardMeta } from "../../reducers/duel/modalSlice";
 import MsgSelectCard = ygopro.StocGameMessage.MsgSelectCard;
@@ -16,6 +17,7 @@ export default (selectCard: MsgSelectCard, dispatch: AppDispatch) => {
   const cards = selectCard.cards;
 
   dispatch(setCheckCardModalMinMax({ min, max }));
+  dispatch(setCheckCardModalOnSubmit("sendSelectCardResponse"));
 
   for (const card of cards) {
     const tagName = CardZoneToChinese(card.location.location);

src/service/duel/selectChain.ts

 import { ygopro } from "../../api/ocgcore/idl/ocgcore";
+import { sendSelectChainResponse } from "../../api/ocgcore/ocgHelper";
+import {
+  setCheckCardModalIsOpen,
+  setCheckCardModalMinMax,
+  setCheckCardModalOnSubmit,
+} from "../../reducers/duel/mod";
+import { fetchCheckCardMeta } from "../../reducers/duel/modalSlice";
 import { AppDispatch } from "../../store";
+import { CardZoneToChinese } from "./util";
 import MsgSelectChain = ygopro.StocGameMessage.MsgSelectChain;
 
 export default (selectChain: MsgSelectChain, dispatch: AppDispatch) => {
-  console.log(selectChain);
+  const player = selectChain.player;
+  const spCount = selectChain.special_count;
+  const forced = selectChain.forced;
+  const hint0 = selectChain.hint0;
+  const hint1 = selectChain.hint1;
+  const chains = selectChain.chains;
+
+  let handle_flag = 0;
+  if (!forced) {
+    // 无强制发动的卡
+    if (spCount == 0) {
+      // 无关键卡
+      if (chains.length == 0) {
+        // 直接回答
+        handle_flag = 0;
+      } else {
+        // 处理多张
+        handle_flag = 2;
+      }
+    } else {
+      // 有关键卡
+      if (chains.length == 0) {
+        // 根本没卡，直接回答
+        handle_flag = 0;
+      } else {
+        // 处理多张
+        handle_flag = 2;
+      }
+    }
+  } else {
+    // 有强制发动的卡
+    if (chains.length == 1) {
+      // 只有一个强制发动的连锁项，直接回应
+      handle_flag = 4;
+    } else {
+      // 处理强制发动的卡
+      handle_flag = 3;
+    }
+  }
+
+  switch (handle_flag) {
+    case 0: {
+      // 直接回答
+      sendSelectChainResponse(-1);
+
+      break;
+    }
+    case 2: // 处理多张
+    case 3: {
+      // 处理强制发动的卡
+      // TODO：非强制发动的场景需要支持取消
+      dispatch(setCheckCardModalMinMax({ min: 1, max: 1 }));
+      dispatch(setCheckCardModalOnSubmit("sendSelectChainResponse"));
+
+      for (const chain of chains) {
+        const tagName = CardZoneToChinese(chain.location.location);
+        dispatch(
+          fetchCheckCardMeta({
+            controler: chain.location.controler,
+            tagName,
+            option: {
+              code: chain.code,
+              response: chain.response,
+              effectDescCode: chain.effect_description,
+            },
+          })
+        );
+      }
+
+      dispatch(setCheckCardModalIsOpen(true));
+
+      break;
+    }
+    case 4: {
+      // 有一张强制发动的卡，直接回应
+      sendSelectChainResponse(chains[0].response);
+
+      break;
+    }
+    default: {
+      console.log(`Unhandled flag: ${handle_flag}`);
+    }
+  }
 };

src/ui/Duel/cemetery.tsx

@@ -70,9 +70,13 @@ const CCemetery = (props: {
     <box
       name="cemetery"
       ref={boxRef}
-      width={shape.width}
-      height={shape.height}
-      depth={depth * props.state.length}
+      scaling={
+        new BABYLON.Vector3(
+          shape.width,
+          shape.height,
+          depth * props.state.length
+        )
+      }
       position={props.position}
       rotation={props.rotation}
     >

src/ui/Duel/checkCardModal.tsx

@@ -4,21 +4,26 @@ import { store } from "../../store";
 import {
   selectCheckCardModalIsOpen,
   selectCheckCardModalMinMax,
+  selectCheckCardModalOnSubmit,
   selectCheckCardModalTags,
 } from "../../reducers/duel/modalSlice";
 import {
   resetCheckCardModal,
   setCheckCardModalIsOpen,
 } from "../../reducers/duel/mod";
-import { Modal, Button, Row, Col } from "antd";
+import { Modal, Button, Row, Col, Popover } from "antd";
 import { CheckCard } from "@ant-design/pro-components";
-import { sendSelectCardResponse } from "../../api/ocgcore/ocgHelper";
+import {
+  sendSelectCardResponse,
+  sendSelectChainResponse,
+} from "../../api/ocgcore/ocgHelper";
 
 const CheckCardModal = () => {
   const dispatch = store.dispatch;
   const isOpen = useAppSelector(selectCheckCardModalIsOpen);
   const { min, max } = useAppSelector(selectCheckCardModalMinMax);
   const tabs = useAppSelector(selectCheckCardModalTags);
+  const onSubmit = useAppSelector(selectCheckCardModalOnSubmit);
   const [response, setResponse] = useState<number[]>([]);
   const defaultValue: number[] = [];
 
@@ -31,12 +36,25 @@ const CheckCardModal = () => {
         <Button
           disabled={response.length < min || response.length > max}
           onClick={() => {
-            sendSelectCardResponse(response);
+            switch (onSubmit) {
+              case "sendSelectChainResponse": {
+                sendSelectChainResponse(response[0]);
+
+                break;
+              }
+              case "sendSelectCardResponse": {
+                sendSelectCardResponse(response);
+
+                break;
+              }
+              default: {
+              }
+            }
             dispatch(setCheckCardModalIsOpen(false));
             dispatch(resetCheckCardModal());
           }}
         >
-          summit
+          submit
         </Button>
       }
       width={800}
@@ -51,25 +69,34 @@ const CheckCardModal = () => {
           setResponse(value);
         }}
       >
-        {tabs.map((tab) => {
+        {tabs.map((tab, idx) => {
           return (
-            <Row>
-              {tab.options.map((option) => {
+            <Row key={idx}>
+              {tab.options.map((option, idx) => {
                 return (
-                  <Col span={4}>
-                    <CheckCard
-                      title={option.name}
-                      description={option.desc}
-                      style={{ width: 120 }}
-                      cover={
-                        <img
-                          alt={option.code.toString()}
-                          src={`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/${option.code}.jpg`}
-                          style={{ width: 100 }}
-                        />
+                  <Col span={4} key={idx}>
+                    <Popover
+                      content={
+                        <div>
+                          <p>{option.name}</p>
+                          <p>{option.effectDesc}</p>
+                        </div>
                       }
-                      value={option.response}
-                    />
+                    >
+                      <CheckCard
+                        title={option.name}
+                        description={option.desc}
+                        style={{ width: 120 }}
+                        cover={
+                          <img
+                            alt={option.code.toString()}
+                            src={`https://cdn02.moecube.com:444/images/ygopro-images-zh-CN/${option.code}.jpg`}
+                            style={{ width: 100 }}
+                          />
+                        }
+                        value={option.response}
+                      />
+                    </Popover>
                   </Col>
                 );
               })}