Browse Source

graf: hrany vedoucí z labelů jsou skryté - nody se tak při simulaci mohou dobře umístit

mj-deploy
Vašek Šraier 4 years ago
parent
commit
7aa0744aca
  1. 9
      frontend/src/Editor.svelte
  2. 3
      frontend/src/Graph.svelte
  3. 3
      frontend/src/GraphEdge.svelte
  4. 13
      tasks.json

9
frontend/src/Editor.svelte

@ -16,6 +16,7 @@
let currentTask: TaskDescriptor | null = null; let currentTask: TaskDescriptor | null = null;
let nodeDraggingEnabled: boolean = false; let nodeDraggingEnabled: boolean = false;
let angle: number; let angle: number;
let showHiddenEdges: boolean = false;
const { open } = getContext("simple-modal"); const { open } = getContext("simple-modal");
function clickTask(e: CustomEvent<TaskDescriptor>) { function clickTask(e: CustomEvent<TaskDescriptor>) {
@ -203,7 +204,8 @@
on:preSelectTask={startHovering} on:preSelectTask={startHovering}
bind:this={graph} bind:this={graph}
{nodeDraggingEnabled} {nodeDraggingEnabled}
on:openTask={openTaskDetailEditorButton} /> on:openTask={openTaskDetailEditorButton}
{showHiddenEdges} />
</div> </div>
</div> </div>
<div class="right"> <div class="right">
@ -238,6 +240,11 @@
vrcholů vrcholů
</label> </label>
</div> </div>
<div>
<label>
<input type="checkbox" bind:checked={showHiddenEdges} /> Zobrazit skryté hrany
</label>
</div>
{#if clicked.length > 0 && getTask(clicked[clicked.length - 1]).type == "label"} {#if clicked.length > 0 && getTask(clicked[clicked.length - 1]).type == "label"}
<div> <div>
Úhel rotace: Úhel rotace:

3
frontend/src/Graph.svelte

@ -13,6 +13,7 @@
export let tasks: TasksFile; export let tasks: TasksFile;
export let repulsionForce: number = -1000; export let repulsionForce: number = -1000;
export let nodeDraggingEnabled: boolean = false; export let nodeDraggingEnabled: boolean = false;
export let showHiddenEdges: boolean = false;
let hoveredTask: null | string = null; let hoveredTask: null | string = null;
@ -135,7 +136,7 @@
<g> <g>
<g transform="translate({clientWidth/2}, {clientHeight/2})"> <g transform="translate({clientWidth/2}, {clientHeight/2})">
{#each edges as edge} {#each edges as edge}
<GraphEdge {edge} /> <GraphEdge {edge} showLabelEdge={showHiddenEdges}/>
{/each} {/each}
{#each nodes as task} {#each nodes as task}
<GraphNode <GraphNode

3
frontend/src/GraphEdge.svelte

@ -3,6 +3,7 @@
import type { TaskId } from "./graph-types"; import type { TaskId } from "./graph-types";
export let edge: SimulationLinkDatum<TaskId>; export let edge: SimulationLinkDatum<TaskId>;
export let showLabelEdge: boolean = false;
$: x1 = edge?.source?.x ?? 0; $: x1 = edge?.source?.x ?? 0;
$: y1 = edge?.source?.y ?? 0; $: y1 = edge?.source?.y ?? 0;
@ -12,4 +13,6 @@
$: dy = y1 - y2 $: dy = y1 - y2
</script> </script>
{#if showLabelEdge || (edge?.target?.task?.type ?? null) != "label"}
<path d="m {x2} {y2+0} c 0 0 {dx} {dy-40} {dx} {dy-20}" style="fill:none; stroke: #aaa; stroke-width: 3px" /> <path d="m {x2} {y2+0} c 0 0 {dx} {dy-40} {dx} {dy-20}" style="fill:none; stroke: #aaa; stroke-width: 3px" />
{/if}

13
tasks.json

@ -5,7 +5,8 @@
"type": "open-data", "type": "open-data",
"comment": "Kevin a magnety - triviální, lineární průchod pole", "comment": "Kevin a magnety - triviální, lineární průchod pole",
"requires": [ "requires": [
"jak-resit-ulohy" "jak-resit-ulohy",
"label-1d-pole"
] ]
}, },
{ {
@ -95,7 +96,8 @@
"type": "open-data", "type": "open-data",
"comment": "Hra Othello - link na 26-Z1-2, procházení 2D pole po různých směrech", "comment": "Hra Othello - link na 26-Z1-2, procházení 2D pole po různých směrech",
"requires": [ "requires": [
"26-Z1-1" "26-Z1-1",
"label-2d-pole"
] ]
}, },
{ {
@ -117,7 +119,8 @@
"type": "open-data", "type": "open-data",
"comment": "Kevinova želva — triviální, průchod po 2D souřadnicích", "comment": "Kevinova želva — triviální, průchod po 2D souřadnicích",
"requires": [ "requires": [
"jak-resit-ulohy" "jak-resit-ulohy",
"label-zelvy"
] ]
}, },
{ {
@ -247,7 +250,9 @@
{ {
"id": "start", "id": "start",
"type": "text", "type": "text",
"requires": [], "requires": [
"label-uvod"
],
"comment": "úvodní kecy o tom, jak to celé funguje" "comment": "úvodní kecy o tom, jak to celé funguje"
} }
], ],