SQuiz/frontPanel
3
0
Fork 0
Code Issues 18 Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Merge branch 'backend-integration' of penahub.gitlab.yandexcloud.net:frontend/squiz into backend-integration

Browse Source
This commit is contained in:
Nastya 2023-12-11 19:12:24 +03:00
commit b54711e3ac
2 changed files with 49 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
src/pages/Questions/BranchingMap/CsComponent.tsx
View File

@ -309,6 +309,7 @@ function CsComponent ({
const readyLO = (e) => {
console.log('REAdy')
if (e.cy.data('firstNode') === 'nonroot') {
e.cy.data('firstNode', 'root')
e.cy.nodes().sort((a, b) => (a.data('root') ? 1 : -1)).layout(lyopts).run()
@ -416,12 +417,13 @@ function CsComponent ({
animate: false, // whether to transition the node positions
animationDuration: 500, // duration of animation in ms if enabled
animationEasing: undefined, // easing of animation if enabled
animateFilter: function (node, i) { return true; }, // a function that determines whether the node should be animated. All nodes animated by default on animate enabled. Non-animated nodes are positioned immediately when the layout starts
animateFilter: function (node, i) { return false; }, // a function that determines whether the node should be animated. All nodes animated by default on animate enabled. Non-animated nodes are positioned immediately when the layout starts
ready: readyLO, // callback on layoutready
transform: function (node, position) { return position; } // transform a given node position. Useful for changing flow direction in discrete layouts
}
useEffect(() => {
console.log('KEKEKE')
document.querySelector("#root")?.addEventListener("mouseup", cleardragQuestionContentId);
const cy = cyRef.current;
const eles = cy?.add(storeToNodes(questions.filter((question:AnyTypedQuizQuestion) => (question.type !== "result" && question.type !== null))))
@ -469,6 +471,7 @@ function CsComponent ({
if (!container) {
return;
}
console.log('POP')
container.style.overflow = "hidden";
@ -498,6 +501,7 @@ function CsComponent ({
const bb = n.boundingBox()
return bb.x2 > ext.x1 && bb.x1 < ext.x2 && bb.y2 > ext.y1 && bb.y1 < ext.y2
})
console.log('POPE')
nodesInView
.toArray()
@ -510,6 +514,7 @@ function CsComponent ({
modifiers: [{ name: "flip", options: { boundary: node } }],
},
content: ([item]) => {
console.log('POPPER', item.id())
const itemId = item.id();
const itemElement = layoutsContainer.current?.querySelector(
`.popper-layout[data-id='${itemId}']`
@ -539,6 +544,7 @@ function CsComponent ({
modifiers: [{ name: "flip", options: { boundary: node } }],
},
content: ([item]) => {
console.log('POPPER+', item.id())
const itemId = item.id();
const itemElement = plusesContainer.current?.querySelector(
`.popper-plus[data-id='${itemId}']`
@ -567,6 +573,7 @@ function CsComponent ({
modifiers: [{ name: "flip", options: { boundary: node } }],
},
content: ([item]) => {
console.log('POPPERx', item.id())
const itemId = item.id();
const itemElement = crossesContainer.current?.querySelector(
`.popper-cross[data-id='${itemId}']`
@ -597,6 +604,7 @@ function CsComponent ({
modifiers: [{ name: "flip", options: { boundary: node } }],
},
content: ([item]) => {
console.log('POPPERg', item.id())
const itemId = item.id();
if (item.cy().edges(`[target="${itemId}"]`).sources().length === 0) {
return;
@ -623,6 +631,7 @@ function CsComponent ({
});
const update = async () => {
console.log('POPPERi=u', item.id())
await plusesPopper.update();
await crossesPopper.update();
await gearsPopper.update();
@ -630,9 +639,10 @@ function CsComponent ({
};
const onZoom = (event: AbstractEventObject) => {
console.log('ZOOOOM')
const zoom = event.cy.zoom();
update();
//update();
crossesPopper.setOptions({
modifiers: [
@ -685,8 +695,41 @@ function CsComponent ({
});
};
node?.on("position", update);
cy?.on("pan zoom resize render", onZoom);
//node?.on("position", update);
let pressed = false
let hide = false
cy?.on('mousedown',() => {pressed = true})
cy?.on('mouseup',() => {
pressed = false
hide = false
const gc = gearsContainer.current
if (gc) gc.style.display = 'block'
const pc = plusesContainer.current
const xc = crossesContainer.current
const lc = layoutsContainer.current
if (pc) pc.style.display = 'block'
if (xc) xc.style.display = 'block'
if (lc) lc.style.display = 'block'
update()
})
cy?.on('mousemove',() => {
if (pressed && !hide) {
hide = true
const gc = gearsContainer.current
if (gc) gc.style.display = 'none'
const pc = plusesContainer.current
const xc = crossesContainer.current
const lc = layoutsContainer.current
if (pc) pc.style.display = 'none'
if (xc) xc.style.display = 'none'
if (lc) lc.style.display = 'block'
}
});
cy?.on("zoom render", onZoom);
});
};

4
src/pages/Questions/QuestionsPage.tsx
View File

@ -23,7 +23,7 @@ import { updateOpenBranchingPanel, updateEditSomeQuestion } from "@root/question
export default function QuestionsPage() {
const theme = useTheme();
const { openedModalSettingsId, openBranchingPanel } = useQuestionsStore();
const isMobile = useMediaQuery(theme.breakpoints.down(660));
const isMobile = false//useMediaQuery(theme.breakpoints.down(660));
const quiz = useCurrentQuiz();
useLayoutEffect(() => {
updateOpenBranchingPanel(false)
@ -115,4 +115,4 @@ export default function QuestionsPage() {
{openedModalSettingsId !== null && <BranchingQuestions/>}
</>
);
}
}