From 25c18d7d84a1dbd459012272258fad555fca5595 Mon Sep 17 00:00:00 2001 From: Nastya Date: Thu, 4 Jan 2024 22:45:37 +0300 Subject: [PATCH 1/2] =?UTF-8?q?=D0=BD=D0=B0=D0=B2=D0=B5=D1=88=D0=B8=D0=B2?= =?UTF-8?q?=D0=B0=D0=BD=D0=B8=D0=B5=20=D1=81=D0=BB=D1=83=D1=88=D0=B0=D1=82?= =?UTF-8?q?=D0=B5=D0=BB=D0=B5=D0=B9=20=D1=82=D0=B0=D1=87=20=D0=BD=D0=B0=20?= =?UTF-8?q?=D0=B3=D1=80=D0=B0=D1=84=D0=B8=D0=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Questions/BranchingMap/hooks/usePopper.ts | 14 ++++++++++++++ 1 file changed, 14 insertions(+) diff --git a/src/pages/Questions/BranchingMap/hooks/usePopper.ts b/src/pages/Questions/BranchingMap/hooks/usePopper.ts index 4f69a6ee..cd9fa3e4 100644 --- a/src/pages/Questions/BranchingMap/hooks/usePopper.ts +++ b/src/pages/Questions/BranchingMap/hooks/usePopper.ts @@ -135,6 +135,11 @@ export const usePopper = ({ setModalQuestionParentContentId(item.id()); setOpenedModalQuestions(true); }); + layoutElement.addEventListener("ontouchend", () => { + //Узнаём грани, идущие от этой ноды + setModalQuestionParentContentId(item.id()); + setOpenedModalQuestions(true); + }); layoutsContainer.current?.appendChild(layoutElement); return layoutElement; @@ -162,6 +167,9 @@ export const usePopper = ({ plusElement.addEventListener("mouseup", () => { setStartCreate(node.id()); }); + plusElement.addEventListener("ontouchend", () => { + setStartCreate(node.id()); + }); plusesContainer.current?.appendChild(plusElement); @@ -191,6 +199,9 @@ export const usePopper = ({ crossElement.addEventListener("mouseup", () => { setStartRemove(node.id()); }); + crossElement.addEventListener("ontouchend", () => { + setStartRemove(node.id()); + }); return crossElement; }, @@ -225,6 +236,9 @@ export const usePopper = ({ gearElement.addEventListener("mouseup", () => { updateOpenedModalSettingsId(item.id()); }); + gearElement.addEventListener("ontouchend", () => { + updateOpenedModalSettingsId(item.id()); + }); console.log("собираюсь анализировать папашу"); console.log("Тип папаши ", parentQuestion.type); From 4f45f3d4e2a0199f39c3f064cbae03dbe15af40b Mon Sep 17 00:00:00 2001 From: Nastya Date: Fri, 5 Jan 2024 00:42:05 +0300 Subject: [PATCH 2/2] 200~touchstart --- .../Questions/BranchingMap/hooks/usePopper.ts | 8 +- src/pages/ResultPage/cards/ResultCard.tsx | 4 +- src/pages/startPage/StartPageSettings.tsx | 2 +- src/ui_kit/MediaSelectionAndDisplay.tsx | 89 ++++++++++++++----- 4 files changed, 75 insertions(+), 28 deletions(-) diff --git a/src/pages/Questions/BranchingMap/hooks/usePopper.ts b/src/pages/Questions/BranchingMap/hooks/usePopper.ts index cd9fa3e4..5e6a4bc6 100644 --- a/src/pages/Questions/BranchingMap/hooks/usePopper.ts +++ b/src/pages/Questions/BranchingMap/hooks/usePopper.ts @@ -135,7 +135,7 @@ export const usePopper = ({ setModalQuestionParentContentId(item.id()); setOpenedModalQuestions(true); }); - layoutElement.addEventListener("ontouchend", () => { + layoutElement.addEventListener("touchstart", () => { //Узнаём грани, идущие от этой ноды setModalQuestionParentContentId(item.id()); setOpenedModalQuestions(true); @@ -167,7 +167,7 @@ export const usePopper = ({ plusElement.addEventListener("mouseup", () => { setStartCreate(node.id()); }); - plusElement.addEventListener("ontouchend", () => { + plusElement.addEventListener("touchstart", () => { setStartCreate(node.id()); }); @@ -199,7 +199,7 @@ export const usePopper = ({ crossElement.addEventListener("mouseup", () => { setStartRemove(node.id()); }); - crossElement.addEventListener("ontouchend", () => { + crossElement.addEventListener("touchstart", () => { setStartRemove(node.id()); }); @@ -236,7 +236,7 @@ export const usePopper = ({ gearElement.addEventListener("mouseup", () => { updateOpenedModalSettingsId(item.id()); }); - gearElement.addEventListener("ontouchend", () => { + gearElement.addEventListener("touchstart", () => { updateOpenedModalSettingsId(item.id()); }); diff --git a/src/pages/ResultPage/cards/ResultCard.tsx b/src/pages/ResultPage/cards/ResultCard.tsx index 17db9c9f..fd7d3a3a 100644 --- a/src/pages/ResultPage/cards/ResultCard.tsx +++ b/src/pages/ResultPage/cards/ResultCard.tsx @@ -360,7 +360,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => { border: "1px solid #9A9AAF", background: " #F2F3F7", color: "#9A9AAF", - mb: "30px", + my: "30px", }} > Кнопка + @@ -368,7 +368,7 @@ export const ResultCard = ({ resultContract, resultData }: Props) => { ) : ( diff --git a/src/pages/startPage/StartPageSettings.tsx b/src/pages/startPage/StartPageSettings.tsx index 7c962837..625ec00e 100755 --- a/src/pages/startPage/StartPageSettings.tsx +++ b/src/pages/startPage/StartPageSettings.tsx @@ -6,13 +6,13 @@ import ArrowLeft from "@icons/ArrowLeftSP"; import LayoutCenteredIcon from "@icons/LayoutCenteredIcon"; import LayoutExpandedIcon from "@icons/LayoutExpandedIcon"; import LayoutStandartIcon from "@icons/LayoutStandartIcon"; -import UploadIcon from "../../assets/icons/UploadIcon"; import MobilePhoneIcon from "@icons/MobilePhoneIcon"; import { QuizStartpageType } from "@model/quizSettings"; import InfoIcon from "@icons/InfoIcon"; import UploadBox from "@ui_kit/UploadBox"; +import UploadIcon from "../../assets/icons/UploadIcon"; import { Box, diff --git a/src/ui_kit/MediaSelectionAndDisplay.tsx b/src/ui_kit/MediaSelectionAndDisplay.tsx index 4f58f778..ee8d39db 100644 --- a/src/ui_kit/MediaSelectionAndDisplay.tsx +++ b/src/ui_kit/MediaSelectionAndDisplay.tsx @@ -1,5 +1,5 @@ import { FC } from "react"; -import { Box, Button } from "@mui/material"; +import { Box, Button, ButtonBase, Tooltip, Typography, useTheme } from "@mui/material"; import CustomTextField from "./CustomTextField"; import { updateQuestion, uploadQuestionImage } from "@root/questions/actions"; import { CropModal, useCropModalState } from "@ui_kit/Modal/CropModal"; @@ -9,6 +9,9 @@ import { UploadImageModal } from "../pages/Questions/UploadImage/UploadImageModa import { useDisclosure } from "../utils/useDisclosure"; import { useCurrentQuiz } from "../stores/quizes/hooks"; import { AnyTypedQuizQuestion } from "@model/questionTypes/shared"; +import UploadBox from "@ui_kit/UploadBox"; +import UploadIcon from "@icons/UploadIcon"; +import InfoIcon from "@icons/InfoIcon"; interface Iprops { resultData: AnyTypedQuizQuestion; @@ -16,6 +19,7 @@ interface Iprops { export const MediaSelectionAndDisplay: FC = ({ resultData }) => { const quizQid = useCurrentQuiz()?.qid; + const theme = useTheme() const { isCropModalOpen, openCropModal, @@ -26,7 +30,7 @@ export const MediaSelectionAndDisplay: FC = ({ resultData }) => { } = useCropModalState(); const [isImageUploadOpen, openImageUploadModal, closeImageUploadModal] = useDisclosure(); - + console.log(resultData) async function handleImageUpload(file: File) { const url = await uploadQuestionImage( resultData.id, @@ -149,25 +153,68 @@ export const MediaSelectionAndDisplay: FC = ({ resultData }) => { )} {!resultData.content.useImage && ( - - - updateQuestion(resultData.id, (q) => { - q.content.video = e.target.value; - }) - } - /> - + <> + + + Добавить видео + + + + + + + + + { + const file = event.target.files?.[0]; + if (file) { + uploadQuestionImage( + resultData.id, + quizQid, + file, + (question, url) => { + question.content.video = url; + }, + ); + } + + }} + hidden + accept=".mp4" + multiple + type="file" + /> + } + sx={{ + height: "48px", + width: "48px", + }} + /> + + {resultData.content.video ? );