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

fix: mistake graph on scroll

Browse Source
This commit is contained in:
skeris 2023-12-12 03:07:01 +03:00
parent 6482598841
commit e2adbbb25e
1 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -348,7 +348,6 @@ function CsComponent({
const readyLO = (e) => { const readyLO = (e) => {
console.log('REAdy')
if (e.cy.data('firstNode') === 'nonroot') { if (e.cy.data('firstNode') === 'nonroot') {
e.cy.data('firstNode', 'root') e.cy.data('firstNode', 'root')
e.cy.nodes().sort((a, b) => (a.data('root') ? 1 : -1)).layout(lyopts).run() e.cy.nodes().sort((a, b) => (a.data('root') ? 1 : -1)).layout(lyopts).run()
@ -433,7 +432,6 @@ function CsComponent({
task.task.forEach(n => { task.task.forEach(n => {
const width = n.data('subtreeWidth') const width = n.data('subtreeWidth')
console.log('ORORORORO', n.data(), yoffset, width, oldPos, task.parent.data('subtreeWidth'))
n.data('oldPos', { x: 250 * n.data('layer'), y: yoffset + width / 2 }) n.data('oldPos', { x: 250 * n.data('layer'), y: yoffset + width / 2 })
yoffset += width yoffset += width
queue.push({ task: n.cy().edges(`[source="${n.id()}"]`).targets(), parent: n }) queue.push({ task: n.cy().edges(`[source="${n.id()}"]`).targets(), parent: n })
@ -462,7 +460,6 @@ function CsComponent({
} }
useEffect(() => { useEffect(() => {
console.log('KEKEKE')
document.querySelector("#root")?.addEventListener("mouseup", cleardragQuestionContentId); document.querySelector("#root")?.addEventListener("mouseup", cleardragQuestionContentId);
const cy = cyRef.current; const cy = cyRef.current;
const eles = cy?.add(storeToNodes(questions.filter((question: AnyTypedQuizQuestion) => (question.type !== "result" && question.type !== null)))) const eles = cy?.add(storeToNodes(questions.filter((question: AnyTypedQuizQuestion) => (question.type !== "result" && question.type !== null))))
@ -510,7 +507,6 @@ function CsComponent({
if (!container) { if (!container) {
return; return;
} }
console.log('POP')
container.style.overflow = "hidden"; container.style.overflow = "hidden";
@ -540,7 +536,6 @@ function CsComponent({
const bb = n.boundingBox() const bb = n.boundingBox()
return bb.x2 > ext.x1 && bb.x1 < ext.x2 && bb.y2 > ext.y1 && bb.y1 < ext.y2 return bb.x2 > ext.x1 && bb.x1 < ext.x2 && bb.y2 > ext.y1 && bb.y1 < ext.y2
}) })
console.log('POPE')
nodesInView nodesInView
.toArray() .toArray()
@ -553,7 +548,6 @@ function CsComponent({
modifiers: [{ name: "flip", options: { boundary: node } }], modifiers: [{ name: "flip", options: { boundary: node } }],
}, },
content: ([item]) => { content: ([item]) => {
console.log('POPPER', item.id())
const itemId = item.id(); const itemId = item.id();
const itemElement = layoutsContainer.current?.querySelector( const itemElement = layoutsContainer.current?.querySelector(
`.popper-layout[data-id='${itemId}']` `.popper-layout[data-id='${itemId}']`
@ -583,7 +577,6 @@ function CsComponent({
modifiers: [{ name: "flip", options: { boundary: node } }], modifiers: [{ name: "flip", options: { boundary: node } }],
}, },
content: ([item]) => { content: ([item]) => {
console.log('POPPER+', item.id())
const itemId = item.id(); const itemId = item.id();
const itemElement = plusesContainer.current?.querySelector( const itemElement = plusesContainer.current?.querySelector(
`.popper-plus[data-id='${itemId}']` `.popper-plus[data-id='${itemId}']`
@ -612,7 +605,6 @@ function CsComponent({
modifiers: [{ name: "flip", options: { boundary: node } }], modifiers: [{ name: "flip", options: { boundary: node } }],
}, },
content: ([item]) => { content: ([item]) => {
console.log('POPPERx', item.id())
const itemId = item.id(); const itemId = item.id();
const itemElement = crossesContainer.current?.querySelector( const itemElement = crossesContainer.current?.querySelector(
`.popper-cross[data-id='${itemId}']` `.popper-cross[data-id='${itemId}']`
@ -643,11 +635,7 @@ function CsComponent({
modifiers: [{ name: "flip", options: { boundary: node } }], modifiers: [{ name: "flip", options: { boundary: node } }],
}, },
content: ([item]) => { content: ([item]) => {
console.log('POPPERg', item.id())
const itemId = item.id(); const itemId = item.id();
if (item.cy().edges(`[target="${itemId}"]`).sources().length === 0) {
return;
}
const itemElement = gearsContainer.current?.querySelector( const itemElement = gearsContainer.current?.querySelector(
`.popper-gear[data-id='${itemId}']` `.popper-gear[data-id='${itemId}']`
@ -670,7 +658,6 @@ function CsComponent({
}); });
const update = async () => { const update = async () => {
console.log('POPPERi=u', item.id())
await plusesPopper.update(); await plusesPopper.update();
await crossesPopper.update(); await crossesPopper.update();
await gearsPopper.update(); await gearsPopper.update();
@ -696,6 +683,18 @@ function CsComponent({
{ name: "offset", options: { offset: [0, -130 * zoom] } }, { name: "offset", options: { offset: [0, -130 * zoom] } },
], ],
}); });
plusesPopper.setOptions({
modifiers: [
{ name: "flip", options: { boundary: node } },
{ name: "offset", options: { offset: [0, 0 * zoom] } },
],
});
gearsPopper.setOptions({
modifiers: [
{ name: "flip", options: { boundary: node } },
{ name: "offset", options: { offset: [0, 0] } },
],
});
layoutsContainer.current layoutsContainer.current
?.querySelectorAll("#popper-layouts > .popper-layout") ?.querySelectorAll("#popper-layouts > .popper-layout")
@ -785,7 +784,7 @@ let pressed = false
variant="text" variant="text"
onClick={() => { onClick={() => {
//код сюда cyRef.current?.fit()
}} }}
> >