diff --git a/lib/components/QuizAnswerer.tsx b/lib/components/QuizAnswerer.tsx index 653f511..8ce5ef7 100644 --- a/lib/components/QuizAnswerer.tsx +++ b/lib/components/QuizAnswerer.tsx @@ -24,9 +24,6 @@ import "moment/dist/locale/ru"; moment.locale("ru"); const localeText = ruRU.components.MuiLocalizationProvider.defaultProps.localeText; -console.log(localeText); -console.log(moment); - type Props = { quizSettings?: QuizSettings; quizId: string; @@ -128,7 +125,6 @@ function QuizAnswererInner({ ); } - export default function QuizAnswerer(props: Props) { return ( @@ -142,6 +138,19 @@ export default function QuizAnswerer(props: Props) { preventDuplicate={true} style={{ backgroundColor: lightTheme.palette.brightPurple.main }} > + diff --git a/lib/components/ViewPublicationPage/Question.tsx b/lib/components/ViewPublicationPage/Question.tsx index 04ee9e0..0be947f 100644 --- a/lib/components/ViewPublicationPage/Question.tsx +++ b/lib/components/ViewPublicationPage/Question.tsx @@ -42,7 +42,7 @@ export const Question = ({ }: Props) => { const theme = useTheme(); const { settings, show_badge, quizId } = useQuizSettings(); - console.log(theme); + return ( { display: "flex", justifyContent: "center", }} + onClick={(event) => event.preventDefault()} > resultImage img": { width: "100%", borderRadius: "12px" }, }} + onClick={(event) => event.preventDefault()} > {backgroundBlock} @@ -204,6 +205,7 @@ const CenteredLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock }: Lay justifyContent: "center", "& > img": { width: "100%", borderRadius: "12px" }, }} + onClick={(event) => event.preventDefault()} > {backgroundBlock} diff --git a/lib/components/ViewPublicationPage/StartPageViewPublication/StartPageMobile.tsx b/lib/components/ViewPublicationPage/StartPageViewPublication/StartPageMobile.tsx index 34444c5..699aa44 100644 --- a/lib/components/ViewPublicationPage/StartPageViewPublication/StartPageMobile.tsx +++ b/lib/components/ViewPublicationPage/StartPageViewPublication/StartPageMobile.tsx @@ -73,6 +73,7 @@ const StandartMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock borderRadius: "12px", }, }} + onClick={(event) => event.preventDefault()} > {backgroundBlock} @@ -154,6 +155,7 @@ const ExpandedMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock minHeight: "100%", }, }} + onClick={(event) => event.preventDefault()} > {backgroundBlock} @@ -205,6 +207,7 @@ const CenteredMobileLayout = ({ quizHeaderBlock, quizMainBlock, backgroundBlock overflow: "hidden", "& > img": { width: "100%", borderRadius: "12px" }, }} + onClick={(event) => event.preventDefault()} > {backgroundBlock} diff --git a/lib/components/ViewPublicationPage/StartPageViewPublication/index.tsx b/lib/components/ViewPublicationPage/StartPageViewPublication/index.tsx index 916aa0d..c3ad205 100644 --- a/lib/components/ViewPublicationPage/StartPageViewPublication/index.tsx +++ b/lib/components/ViewPublicationPage/StartPageViewPublication/index.tsx @@ -105,6 +105,7 @@ export const StartPageViewPublication = () => { ? "center" : undefined, }} + onClick={(event) => event.preventDefault()} > {settings.cfg.startpage.logo && ( { color: settings.cfg.startpageType === "expanded" ? "white" : "black", }} + onClick={(event) => event.preventDefault()} > { + const root = document.getElementById("root"); + const overlay = document.getElementById("hideoverlay"); + + if (root !== null && overlay !== null && settings.cfg?.isUnSc) { + overlay.style.cssText = "pointerEvents = auto;"; + unscreen(overlay, root); + } + }, []); + useEffect( function setFaviconAndTitle() { if (!changeFaviconAndTitle) return; diff --git a/lib/components/ViewPublicationPage/questions/Date/DateRange.tsx b/lib/components/ViewPublicationPage/questions/Date/DateRange.tsx index a419a84..fdb7496 100644 --- a/lib/components/ViewPublicationPage/questions/Date/DateRange.tsx +++ b/lib/components/ViewPublicationPage/questions/Date/DateRange.tsx @@ -11,7 +11,7 @@ import { useRootContainerSize } from "@/contexts/RootContainerWidthContext"; type DateProps = { currentQuestion: QuizQuestionDate; }; -console.log(moment.locale()); + export default ({ currentQuestion }: DateProps) => { const theme = useTheme(); const isMobile = useRootContainerSize() < 690; diff --git a/lib/components/ViewPublicationPage/questions/Emoji/EmojiVariant.tsx b/lib/components/ViewPublicationPage/questions/Emoji/EmojiVariant.tsx index c152c37..2b4e869 100644 --- a/lib/components/ViewPublicationPage/questions/Emoji/EmojiVariant.tsx +++ b/lib/components/ViewPublicationPage/questions/Emoji/EmojiVariant.tsx @@ -187,25 +187,25 @@ export const EmojiVariant = ({ { return ( - + {currentQuestion.title} { marginTop: "20px", maxWidth: answer?.split("|")[0] ? "640px" : "600px", }} + onClick={(event) => event.preventDefault()} > {answer?.split("|")[0] ? ( - + ) : ( { /> )} {answer && currentQuestion.content.type === "picture" && ( - + )} {answer && currentQuestion.content.type === "video" && ( - setModalWarningType(null)}> + setModalWarningType(null)} + > (null); + const containerCanvasRef = useRef(null); + const onVariantClick = async (event: MouseEvent) => { event.preventDefault(); @@ -130,6 +133,23 @@ export const ImageVariant = ({ } }, []); + useEffect(() => { + if (canvasRef.current !== null) { + const canvas = canvasRef.current; + const ctx = canvas.getContext("2d"); + if (ctx !== null) { + const img = new Image(); + img.src = choiceImgUrl; + + img.onload = () => { + canvas.width = img.width; + canvas.height = img.height; + ctx.drawImage(img, 0, 0, canvas.width, canvas.height); + }; + } + } + }, []); + return ( {variant.extendedText && ( - + + // )} @@ -209,7 +240,6 @@ export const ImageVariant = ({ control={ isMulti ? ( } icon={} diff --git a/lib/components/ViewPublicationPage/questions/Page/index.tsx b/lib/components/ViewPublicationPage/questions/Page/index.tsx index 333ee41..619f6fc 100644 --- a/lib/components/ViewPublicationPage/questions/Page/index.tsx +++ b/lib/components/ViewPublicationPage/questions/Page/index.tsx @@ -21,7 +21,10 @@ export const Page = ({ currentQuestion }: PageProps) => { > {currentQuestion.title} - + {currentQuestion.content.text} { border: "1px solid #9A9AAF", overflow: "hidden", }} + onClick={(event) => event.preventDefault()} > { return currentQuestion.content.back; } }, [currentQuestion]); + let isCrutch23022025 = window.location.pathname === "/bf8cae3a-e150-479d-befa-7f264087b223"; return ( { display: "flex", width: "100%", marginTop: "20px", - flexDirection: isMobile ? "column-reverse" : undefined, + flexDirection: isCrutch23022025 ? "column" : isMobile ? "column-reverse" : undefined, alignItems: "center", }} > @@ -74,11 +75,12 @@ export const TextNormal = ({ currentQuestion, answer }: TextNormalProps) => { {choiceImgUrlQuestion && choiceImgUrlQuestion !== " " && choiceImgUrlQuestion !== null && ( event.preventDefault()} > {isHorizontal && currentQuestion.content.back && currentQuestion.content.back !== " " && ( - + event.preventDefault()} + > {!isHorizontal && currentQuestion.content.back && currentQuestion.content.back !== " " && ( - + event.preventDefault()} + > state); const ownAnswer = ownVariants[ownVariants.findIndex((v) => v.id === variant.id)]?.variant.answer || ""; - console.log(theme); + return largeCheck ? ( { const theme = useTheme(); const isMobile = useRootContainerSize() < 650; @@ -26,6 +55,8 @@ export const Variant = ({ currentQuestion }: VariantProps) => { const Group = currentQuestion.content.multi ? FormGroup : RadioGroup; + //let isCrutch23022025Question = isCrutch23022025 && crutchlist.hasOwnProperty(currentQuestion.id) + useEffect(() => { if (!ownVariant) { updateOwnVariant(currentQuestion.id, ""); @@ -55,6 +86,7 @@ export const Variant = ({ currentQuestion }: VariantProps) => { {currentQuestion.title} { {choiceImgUrlQuestion && choiceImgUrlQuestion !== " " && choiceImgUrlQuestion !== null && ( - + event.preventDefault()} + > { color: theme.palette.text.primary, textAlign: "center", }} + onClick={(event) => event.preventDefault()} > {answer ? ( choiceImgUrlAnswer ? ( diff --git a/lib/model/settingsData.ts b/lib/model/settingsData.ts index ca55e80..0b11d23 100644 --- a/lib/model/settingsData.ts +++ b/lib/model/settingsData.ts @@ -61,6 +61,7 @@ export type QuizSettings = { }; export interface QuizConfig { + isUnSc?: boolean; spec: undefined | true; type: QuizType; noStartPage: boolean; diff --git a/lib/model/widget/side.ts b/lib/model/widget/side.ts index 1fa531b..9b15060 100644 --- a/lib/model/widget/side.ts +++ b/lib/model/widget/side.ts @@ -6,6 +6,7 @@ export interface SideWidgetComponentProps { dialogDimensions?: { width: string; height: string }; fullScreen?: boolean; buttonFlash?: boolean; + buttonText?: string; /** * Показывать виджет через X секунд */ diff --git a/lib/ui_kit/unscreen.ts b/lib/ui_kit/unscreen.ts new file mode 100644 index 0000000..4b67e3b --- /dev/null +++ b/lib/ui_kit/unscreen.ts @@ -0,0 +1,79 @@ +function addOverlay(overlay: HTMLElement) { + // const overlay = document.getElementById('overlay'); + overlay.style.opacity = "1"; // Затемнено + overlay.style.pointerEvents = "auto"; // Включить клики +} +function removeOverlay(overlay: HTMLElement) { + overlay.style.opacity = "0"; // Вернуть в исходное состояние + overlay.style.pointerEvents = "none"; // Игнорировать клики +} +function addRemoveOverlayTimer(overlay: HTMLElement, time = 1000) { + addOverlay(overlay); + setTimeout(() => { + removeOverlay(overlay); + }, time); // 1 секунда затемнения +} + +// Флаги для отслеживания состояния +let isMouseInside = true; +let isWindowFocused = true; + +export default function unscreen(overlay: HTMLElement, root: HTMLElement) { + let focusTimeout: NodeJS.Timeout | undefined; + // Проверка состояния и выполнение нужного действия + function checkFocusAndMouse() { + if (!isWindowFocused || !isMouseInside) { + // ИЛИ + addOverlay(overlay); + } else if (isWindowFocused && isMouseInside) { + // И + removeOverlay(overlay); + } + } + + // Добавляем обработчики событий + window.addEventListener("blur", () => { + console.log("blur"); + isWindowFocused = false; + checkFocusAndMouse(); // Проверяем состояние + }); // Когда окно теряет фокус + + window.addEventListener("focus", () => { + console.log("focus"); + isWindowFocused = true; + checkFocusAndMouse(); // Проверяем состояние + }); // Когда окно получает фокус + + window.addEventListener("mouseleave", () => { + console.log("mouseleave"); + isMouseInside = false; + checkFocusAndMouse(); // Проверяем состояние + }); // Когда мышка покидает окно + + window.addEventListener("mouseenter", () => { + console.log("mouseenter"); + isMouseInside = true; + checkFocusAndMouse(); // Проверяем состояние + }); // Когда мышка возвращается в окно + + root.addEventListener("contextmenu", (event) => event.preventDefault()); + + window.addEventListener("keydown", function (event) { + event.preventDefault(); + if (event.key === "PrintScreen" || (event.ctrlKey && event.key === "p")) { + addRemoveOverlayTimer(overlay); + } + }); + + // Проверка для мобильных устройств + root.addEventListener("touchstart", function (event) { + // Пример: если есть более чем один жест + if (event.touches.length > 1) { + addRemoveOverlayTimer(overlay); + } + }); + + window.addEventListener("beforeprint", function () { + addRemoveOverlayTimer(overlay); + }); +} diff --git a/package.json b/package.json index 6c6600b..64dc7e1 100755 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@frontend/squzanswerer", - "version": "1.0.56", + "version": "1.0.57", "type": "module", "main": "./dist-package/index.js", "module": "./dist-package/index.js", diff --git a/src/widgets/side/QuizSideButton.tsx b/src/widgets/side/QuizSideButton.tsx index 8f195de..86e2609 100644 --- a/src/widgets/side/QuizSideButton.tsx +++ b/src/widgets/side/QuizSideButton.tsx @@ -19,6 +19,7 @@ export default function QuizSideButton({ buttonTextColor, dialogDimensions, fullScreen = false, + buttonText, buttonFlash = false, autoShowWidgetTime = 0, autoShowQuizTime = null, @@ -89,7 +90,10 @@ export default function QuizSideButton({ }, ]} /> - +