2f:T652,30:T5b1,function TimedEventGraphComponent() { const tegRef = useRef(timedEventGraph); const [currentMode, setCurrentMode] = useState(tegRef.current.mode); const [currentTool, setCurrentTool] = useState("cursor"); //default tool const handleModeChange = (newMode) => { tegRef.current.mode = newMode; setCurrentMode(newMode); tegRef.current.update(); }; const addNewMode = (newMode) => { tegRef.current.addMode(newMode); tegRef.current.update(); }; const deleteMode = (modeName) => { if (currentMode === modeName) { setCurrentMode(Object.keys(tegRef.current.arcs)[0]); tegRef.current.mode = Object.keys(tegRef.current.arcs)[0]; } tegRef.current.removeMode(modeName); tegRef.current.update(); }; const handleModeAdd = (modeName) => { tegRef.current.addMode(modeName); tegRef.current.update(); }; const handleModeRemove = (modeName) => { tegRef.current.removeMode(modeName); tegRef.current.update(); }; return jsx`

<${Toolbar} onModeAdd={handleModeAdd} onModeRemove={handleModeRemove} onModeChange=${handleModeChange} tegRef=${tegRef} addNewMode=${addNewMode} deleteMode=${deleteMode} currentMode=${currentMode} setCurrentTool=${setCurrentTool} currentTool={currentTool} /> <${canvasRef} tegRef=${tegRef} currentMode=${currentMode} currentTool=${currentTool}/>

`; }31:T2b19,function canvasRef({ tegRef, currentTool }) { const canvasRef = useRef(); const [showInput, setShowInput] = useState(false); const [newName, setNewName] = useState(""); const [inputPosition, setInputPosition] = useState({ x: 0, y: 0 }); const [selectedElement, setSelectedElement] = useState(null); const [blurTimeout, setBlurTimeout] = useState(null); const [singleClickTimeout, setSingleClickTimeout] = useState(null); const clearBlurTimeout = () => { if (blurTimeout) { clearTimeout(blurTimeout); setBlurTimeout(null); } }; const handleNameChange = (event) => { setNewName(event.target.value); }; const handleElementUpdate = (event) => { event.preventDefault(); if (selectedElement) { selectedElement.elementData.id = selectedElement.id; console.log( "selectedElement.elementData.holdingTime = selectedElement.holdingTime", selectedElement.elementData.holdingTime, selectedElement.holdingTime ); selectedElement.elementData.holdingTime[tegRef.current.mode] = selectedElement.holdingTime; tegRef.current.update(); //if (updatedElement) { setSelectedElement(null); //} } }; const handleElementNameChange = (event) => { setSelectedElement({ ...selectedElement, id: event.target.value }); }; const handleElementHoldingTimeChange = (event) => { setSelectedElement({ ...selectedElement, holdingTime: parseFloat(event.target.value) }); }; const handlePlaceNameSubmit = (event) => { event.preventDefault(); if (newName) { // Create a new place and add it to the timedEventGraph switch (currentTool) { case "place": tegRef.current.addPlace( new Place(newName, 0, inputPosition.x, inputPosition.y) ); break; case "transition": tegRef.current.addTransition( new Transition(newName, 0, inputPosition.x, inputPosition.y) ); break; case "connect": // Connect two elements and add the arc to the timedEventGraph break; default: // Handle other cases or do nothing break; } tegRef.current.update(); setNewName(""); setShowInput(false); } }; const handleCancelInput = () => { setNewName(""); setShowInput(false); }; const handleKeyDown = (event) => { if (event.key === "Escape") { handleCancelInput(); } }; const handleElementUpdateBlur = () => { setBlurTimeout(setTimeout(() => setSelectedElement(null), 100)); }; const handleElementUpdateKeyDown = (event) => { if (event.key === "Escape") { setSelectedElement(null); } }; useEffect(() => { if (canvasRef.current) { function tools(ref) { //let startNode; const svgPoint = ref.svg.node().createSVGPoint(); let arrow; if (currentTool === "connect") { ref.simulation.stop(); ref.animate = false; } function dragstarted(event, d) { if (currentTool === "connect") { ref.simulation.stop(); //startNode = d; arrow = ref.svg .append("line") .attr("stroke", "black") .attr("stroke-width", 2) .attr("marker-end", "url(#arrowend)"); } else { if (!event.active) { ref.tickCount = 0; ref.simulation.alphaTarget(0.3).restart(); } d.fx = d.x; d.fy = d.y; } } function dragged(event, d) { //console.log(arrow, currentTool === "connect", "dragged"); if (currentTool === "connect" && arrow) { var x = event.x; var y = event.y; // Remove highlight class from all elements d3.selectAll("g").classed("highlight", false); let endNode = d3 .selectAll("g") // selecting both circles (places) and rectangles (transitions) .filter((node) => node !== d) .filter(function (node) { const bbox = this.getBBox(); var res = x >= bbox.x + node.x && x <= bbox.x + node.x + bbox.width && y >= bbox.y + node.y && y <= bbox.y + node.y + bbox.height; return res; }); endNode.classed("highlight", true); console.log("hightlight added"); arrow .attr("x1", d.x) .attr("y1", d.y) .attr("x2", event.x) .attr("y2", event.y); } else { ref.tickCount = 0; d.fx = event.x; d.fy = event.y; } } function dragended(event, d) { if (currentTool === "connect" && arrow) { var x = event.x; var y = event.y; // Remove highlight class from all elements d3.selectAll("g").classed("highlight", false); let endNode2 = d3 .selectAll("g") // selecting both circles (places) and rectangles (transitions) .filter((node) => node !== d) .each(function (node) { // console.log("for all nides", node, this); }) .filter(function (node) { const bbox = this.getBBox(); var res = x >= bbox.x + node.x && x <= bbox.x + node.x + bbox.width && y >= bbox.y + node.y && y <= bbox.y + node.y + bbox.height; // console.log(res, node, bbox, "WHAt???", event, x, y); return res; }); arrow.remove(); if (endNode2.node()) { var endNode = endNode2.datum(); if (d !== endNode) { //what && d.type !== endNode.type tegRef.current.addArc(new Arc(d, endNode)); tegRef.current.update(); } } else { console.log("NO ENDNODE found!!!", endNode2); } //console.log("CONNECT", d, endNode); arrow = null; } else { ref.tickCount = 0; if (!event.active) ref.simulation.alphaTarget(0); d.fx = null; d.fy = null; } } ref.svg.on("click", (event) => onClick(event, tegRef.current)); ref.svg.on("dblclick", (event) => onDoubleClick(event)); return { dragstarted, dragged, dragended }; } //Thanks to d3 we have to recreate the whole graph because it's so hard to unset drag operators :/ drawTimedEventGraph(tegRef.current, canvasRef.current, tools); } }, [tegRef.current, currentTool]); const onDoubleClick = (event) => { // Clear the single click timeout to prevent it from executing if (singleClickTimeout) { clearTimeout(singleClickTimeout); setSingleClickTimeout(null); } // Handle double-click event logic here console.log("Double-click detected", currentTool); switch (currentTool) { case "cursor": //console.log(event.target.__data__, tegRef, "AYY"); break; case "transition": break; case "place": break; case "connect": // Connect two elements and add the arc to the timedEventGraph break; default: // Handle other cases or do nothing break; } }; const onClick = (event, tegRef) => { // If there's already a single click timeout set, clear it if (singleClickTimeout) { clearTimeout(singleClickTimeout); setSingleClickTimeout(null); } const [x, y] = d3.pointer(event); let elementData; switch (currentTool) { case "delete": elementData = event.target.__data__; tegRef.removeElement(elementData); tegRef.update(); case "edit": // Set a new single click timeout // setSingleClickTimeout( // setTimeout(() => { elementData = event.target.__data__; if (elementData) { setInputPosition({ x, y }); if (elementData instanceof Place || elementData instanceof Transition) setSelectedElement({ elementData, x, y, id: elementData.id, holdingTime: elementData.holdingTime }); } else { console.log("nothing to edit"); } // }, 300) // ); break; case "transition": case "place": setInputPosition({ x, y }); setShowInput(true); break; case "connect": // Connect two elements and add the arc to the timedEventGraph break; case "cursor": tegRef.fireTransition(event.target.__data__); highlightTransition(event.target); break; default: // Handle other cases or do nothing break; } }; function highlightTransition(transitionElement) { d3.select(transitionElement).classed("highlight-transition", true); setTimeout(() => { d3.select(transitionElement).classed("highlight-transition", false); }, 100); // 1000ms or 1 second highlight duration } console.log("selectedelement", selectedElement); return jsx`

${ showInput && jsx` ` } ${ selectedElement && jsx` ` }

`; }32:Td86,function Toolbar({ onModeChange, tegRef, addNewMode, deleteMode, currentMode, setCurrentTool, currentTool }) { const toolbarRef = useRef(); //const [currentTool, setCurrentTool] = useState(null); useEffect(() => { initDragging(); }, []); const selectTool = (tool) => { setCurrentTool(tool); //console.log("I have selected current Tool... " + tool); // Emit a custom event to notify the Canvas about the tool change }; const toggleVisibility = () => { toolbarRef.current.classList.toggle("hidden"); }; const initDragging = () => { let isDragging = false; let offsetX = 0; let offsetY = 0; const onMouseDown = (event) => { isDragging = true; offsetX = event.clientX - toolbarRef.current.offsetLeft; offsetY = event.clientY - toolbarRef.current.offsetTop; }; const onMouseMove = (event) => { if (!isDragging) return; toolbarRef.current.style.left = `${event.clientX - offsetX}px`; toolbarRef.current.style.top = `${event.clientY - offsetY}px`; }; const onMouseUp = () => { isDragging = false; }; toolbarRef.current.addEventListener("mousedown", onMouseDown); document.addEventListener("mousemove", onMouseMove); document.addEventListener("mouseup", onMouseUp); }; const [showNewModeInput, setShowNewModeInput] = useState(false); const [newModeName, setNewModeName] = useState(""); var modes = Object.keys(tegRef.current.arcs); // let currentMode = tegRef.current.mode; const handleChange = (event) => { if (event.target.value === "new") { setShowNewModeInput(true); } else { onModeChange(event.target.value); } }; const handleNewModeChange = (event) => { setNewModeName(event.target.value); }; const handleNewModeSubmit = (event) => { event.preventDefault(); if (newModeName) { addNewMode(newModeName); onModeChange(newModeName); setShowNewModeInput(false); setNewModeName(""); } }; const handleDeleteMode = () => { deleteMode(currentMode); }; const tools = [ { id: "cursor", label: "🖱️" }, { id: "place", label: "⚪" }, { id: "transition", label: "▭" }, { id: "connect", label: "🔗" }, { id: "edit", label: "✏️" }, { id: "delete", label: "🗑️" } ]; return jsx` `; }33:T422,timedEventGraph = { const timedEventGraph = new TimedEventGraph(); timedEventGraph._inner = { Arc, Place, Transition }; createTEG( parseGDMatrix(`[0,12]=(g1.d0) [0,23]=(g1.d6) [1,0]=(g0.d1) [2,1]=(g0.d10) [5,2]=(g0.d3) [11,23]=(g1.d0) [12,0]=(g0.d0) [12,5]=(g0.d8) [13,12]=(g0.d1) [14,13]=(g0.d10) [14,15]=(g0.d5) [15,18]=(g0.d3) [16,15]=(g0.d20) [16,17]=(g0.d7) [17,5]=(g0.d0) [17,14]=(g0.d6) [18,13]=(g0.d2) [23,16]=(g0.d8)`), timedEventGraph ); console.log("its time", timedEventGraph.places[0].tokens); /* const place1 = new Place("P1", {a:5}); const place2 = new Place("P2", {a:0}); const transition1 = new Transition("T1", {a:0}); const input = new Transition("T0", {a:0}); timedEventGraph.addPlace(place1); timedEventGraph.addPlace(place2); timedEventGraph.addTransition(transition1); timedEventGraph.addTransition(input); timedEventGraph.addArc(new Arc(place1, transition1)); timedEventGraph.addArc(new Arc(transition1, place2)); timedEventGraph.addArc(new Arc(input, place1));*/ return timedEventGraph; }34:T54b,/** * Creates a TimedEventGraph from a parsed matrix. * @param {Object.>} matrix - The parsed data object with nested numeric keys. * @param {TimedEventGraph} teg - The TimedEventGraph to populate. */ function createTEG(matrix, teg) { // Keep track of created transitions and places const transitions = {}; const places = {}; // Iterate over all elements in the matrix for (const [t1, targets] of Object.entries(matrix)) { for (const [t2, gd] of Object.entries(targets)) { // Create transitions if they don't exist if (!transitions[t1]) { transitions[t1] = new Transition(`T${t1}`, { a: 0 }); teg.addTransition(transitions[t1]); } if (!transitions[t2]) { transitions[t2] = new Transition(`T${t2}`, { a: 0 }); teg.addTransition(transitions[t2]); } // Create the intermediate place const placeID = `P${t1}-${t2}`; if (!places[placeID]) { console.log("gd", gd); places[placeID] = new Place(placeID, { a: gd.d }, gd.g); console.log(places[placeID]); teg.addPlace(places[placeID]); } // Add arcs from T2 to Place and from Place to T1 teg.addArc(new Arc(transitions[t2], places[placeID])); teg.addArc(new Arc(places[placeID], transitions[t1])); } } }35:T1292,TimedEventGraph = { class TimedEventGraph { constructor() { /** @type {Place[]} */ this.places = []; /** @type {Transition[]} */ this.transitions = []; /** @type {Object} */ this.arcs = { a: [] }; /** @type {Function} */ this.updateCallback = null; /** @type {string} */ this.mode = "a"; } setUpdateCallback(callback) { this.updateCallback = callback; } fireTransition(transition) { // Find all input and output places for the given transition const inputPlaces = this.arcs[this.mode] .filter((arc) => arc.target === transition) .map((arc) => arc.source); const outputPlaces = this.arcs[this.mode] .filter((arc) => arc.source === transition) .map((arc) => arc.target); // Check if the transition is enabled (i.e., if all input places have at least one token) const isEnabled = inputPlaces.every((place) => place.tokens > 0); if (isEnabled) { // Subtract a token from each input place and add a token to each output place inputPlaces.forEach((place) => place.tokens--); outputPlaces.forEach((place) => place.tokens++); // Update the visualization to reflect the new token counts this.update(); } else { console.log(`Transition ${transition.id} is not enabled.`); } } fromId(id) { // Search for a matching Place or Transition object with mode-dependent holding time const element = this.places.find((p) => p.id === id) || this.transitions.find((t) => t.id === id); if (element) { return { ...element, holdingTime: element.holdingTime[this.mode] }; } // Search for a matching Arc object const arc = this.arcs.find((t) => t.id === id); if (arc) { return arc; } // Return null if no matching object is found return null; } addPlace(place, position) { if (position) { this.places.x = position.x; this.places.y = position.y; } this.places.push(place); this.update(); } addMode(newMode) { if (!this.arcs[newMode]) { this.arcs[newMode] = []; // Add newMode to all places and transitions for (let place of this.places) { place.holdingTime[newMode] = place.holdingTime[this.mode]; } for (let transition of this.transitions) { transition.holdingTime[newMode] = transition.holdingTime[this.mode]; } this.update(); } else { console.log(`Mode "${newMode}" already exists.`); } } removeMode(modeName) { if (this.arcs[modeName]) { delete this.arcs[modeName]; // Remove modeName from all places and transitions for (let place of this.places) { delete place.holdingTime[modeName]; } for (let transition of this.transitions) { delete transition.holdingTime[modeName]; } this.update(); } else { console.log(`Mode "${modeName}" does not exist.`); } } addTransition(transition) { this.transitions.push(transition); this.update(); } addArc(arc) { this.arcs[this.mode].push(arc); this.update(); } /** * Remove a place from the graph * @param {Place} place - The place to remove */ removePlace(place) { this.places = this.places.filter((p) => p !== place); this.update(); } /** * Remove a transition from the graph * @param {Transition} transition - The transition to remove */ removeTransition(transition) { this.transitions = this.transitions.filter((t) => t !== transition); this.update(); } /** * Remove an arc from the graph * @param {Arc} arc - The arc to remove */ removeArc(arc) { this.arcs[this.mode] = this.arcs[this.mode].filter((a) => a !== arc); this.update(); } /** * Remove an element from the graph * @param {Arc|Transition|Place} elementData - The element to remove */ removeElement(elementData) { if (elementData instanceof Place) { this.removePlace(elementData); } else if (elementData instanceof Transition) { this.removeTransition(elementData); } else if (elementData instanceof Arc) { this.removeArc(elementData); } else { console.log( "Invalid element data. Expected an instance of Arc, Transition, or Place." ); } } update() { if (this.updateCallback) { this.updateCallback(); } } } // Create the timed event graph return TimedEventGraph; }36:T1d7d,function drawTimedEventGraph(timedEventGraph, containerSelector, tools) { //const width = 800; const height = 600; const nodeRadius = 20; const container = d3.select(containerSelector); // Check if an SVG container already exists let svg2 = container.select("svg"); // Create or select the SVG if (svg2.empty()) { svg2 = container.append("svg").attr("width", width).attr("height", height); } // Create or select the 'g' element let svg = svg2.select("g"); if (svg.empty()) { svg = svg2.append("g"); } else { // If an SVG container exists, clear its contents svg.selectAll("*").remove(); } svg2.call( d3 .zoom() .scaleExtent([0.1, 4]) .filter(function (event) { // Allow panning (dragging) and zooming only when the Ctrl key is pressed return ( ["wheel", "mousedown", "mousemove", "mouseup"].indexOf(event.type) >= 0 && event.ctrlKey ); }) .on("zoom", zoomed) ); // svg2.call(fullscreen); function zoomed(event) { // Apply the transform to the 'g' element svg.attr("transform", event.transform); } // console.log("svg what is this??", svg); let nodes = [...timedEventGraph.places, ...timedEventGraph.transitions]; let links = timedEventGraph.arcs[timedEventGraph.mode]; let tickCount2 = 0; const maxTicks = 200; let simulation = d3 .forceSimulation(nodes) .force("charge", d3.forceManyBody().strength(-200)) .force("center", d3.forceCenter(width / 2, height / 2)) .force("link", d3.forceLink(links).distance(100).strength(0.3)) .force("collide", d3.forceCollide(nodeRadius * 3)); var changeable = { simulation, tickCount: tickCount2, svg: svg2, animate: true }; simulation.restart(); let toolf = tools(changeable); var link = applyLink(svg.selectAll(".link")); let place = applyPlace(svg.selectAll(".place")); function applyLink(link) { // console.log("links", links); return link .data(links) .join("line") .attr("class", "link") .attr("marker-end", "url(#arrowhead)"); } function applyPlace(place) { return place .data(timedEventGraph.places) .join("g") .attr("class", "place") .call( d3 .drag() .on("start", toolf.dragstarted) .on("drag", toolf.dragged) .on("end", toolf.dragended) ); } function applyTransition(transition) { return transition .data(timedEventGraph.transitions) .join("g") .attr("class", "transition-container") .call( d3 .drag() .on("start", toolf.dragstarted) .on("drag", toolf.dragged) .on("end", toolf.dragended) ); } place .append("circle") .attr("class", "outer-circle") .attr("r", nodeRadius * 1.3) .style("display", (d) => d.holdingTime[timedEventGraph.mode] ? "block" : "none" ); place .append("circle") .attr("class", "inner-circle") .attr("r", nodeRadius) .style("display", (d) => "block"); place .append("text") .attr("class", "label") .text((d) => d.id) .attr("text-anchor", "middle") .attr("dy", 1.8 * nodeRadius + 10); // Adjust this value to position the label below the place element let transitionheight = nodeRadius * 4; // Create transition elements let transition = applyTransition(svg.selectAll(".transition")); transition .append("text") .attr("class", "label") .text((d) => d.id) .attr("text-anchor", "middle") .attr("dy", +0.6 * transitionheight + 10); const marker = svg .append("defs") .append("marker") .attr("id", "arrowhead") .attr("viewBox", "0 -5 10 10") .attr("refX", nodeRadius * 1.3 + 5) // adjust the position of the arrowhead along the line .attr("refY", 0) .attr("markerWidth", 6) .attr("markerHeight", 6) .attr("orient", "auto") .append("path") .attr("d", "M0,-5L10,0L0,5") .attr("class", "arrowhead"); // let label = applyLabel(svg.selectAll(".label")); // console.log("before setUpdateCallback", timedEventGraph); timedEventGraph.setUpdateCallback(updateVisualization); updateVisualization(); function updateVisualization() { // Update nodes and links data nodes = [...timedEventGraph.places, ...timedEventGraph.transitions]; links = timedEventGraph.arcs[timedEventGraph.mode]; // Update the simulation's nodes and links changeable.simulation.nodes(nodes); changeable.simulation.force("link").links(links); changeable.simulation.restart(); if (changeable.animate) { // Restart the simulation changeable.tickCount = 0; } else { changeable.tickCount = maxTicks - 2; //it needs to animate at least a bit } // Update the visualization elements link = applyLink(link); place = applyPlace(place); place .selectAll(".outer-circle") .data((d) => [d]) .join("circle") .attr("class", "outer-circle") .attr("r", nodeRadius * 1.3) .style("display", (d) => d.holdingTime[timedEventGraph.mode] ? "block" : "none" ); place .selectAll(".inner-circle") .data((d) => [d]) .join("circle") .attr("class", "inner-circle") .attr("r", nodeRadius) .style("display", (d) => "block"); // Draw tokens as dots inside the inner circle // console.log("does this get executed"); place .selectAll(".token-dot") .data((d) => (d.tokens < 6 ? Array(d.tokens).fill(d) : [])) .join("circle") .attr("class", "token-dot") .attr("r", 3) .attr( "cx", (d, i) => nodeRadius * 0.5 * Math.cos((i * 2 * Math.PI) / d.tokens) ) .attr( "cy", (d, i) => nodeRadius * 0.5 * Math.sin((i * 2 * Math.PI) / d.tokens) ) .style("display", (d) => "block"); // Display the numeric value for 6 or more tokens in the center place .selectAll(".token-count") .data((d) => [d]) .join("text") .attr("class", "token-count") .attr("text-anchor", "middle") .attr("dy", ".3em") .text((d) => (d.tokens >= 6 ? d.tokens : "")) .style("display", (d) => (d.tokens >= 6 ? "block" : "none")); // Update transition elements transition = applyTransition(transition); transition .selectAll("rect") .data((d) => [d]) .join("rect") .attr("class", (d) => d.holdingTime[timedEventGraph.mode] ? "transition" : "transition-filled" ) .attr("width", nodeRadius) .attr("height", transitionheight) .attr("rx", 3) .attr("ry", 3) .attr("x", -nodeRadius / 2) .attr("y", -transitionheight / 2); place .selectAll(".label") .data((d) => [d]) .text((d) => d.id); transition .selectAll(".label") .data((d) => [d]) .text((d) => d.id); // label = applyLabel(label); } function ticked() { if (changeable.tickCount >= maxTicks) { changeable.simulation.stop(); } else { changeable.tickCount++; } link .attr("x1", (d) => d.source.x) .attr("y1", (d) => d.source.y) .attr("x2", (d) => d.target.x) .attr("y2", (d) => d.target.y); place.attr("transform", (d) => `translate(${d.x}, ${d.y})`); transition.attr("transform", (d) => `translate(${d.x}, ${d.y})`); // label.attr("x", (d) => d.x).attr("y", (d) => d.y - transitionheight); } changeable.simulation.on("tick", ticked); }37:[] 2d:{"title":"Timed Event Graphs","cells":[{"id":0,"value":"# Timed Event Graphs\nUsing react","pinned":false,"hidden":false,"mode":"md"},{"id":565,"value":"$2f","pinned":false,"hidden":false,"mode":"md"},{"id":13,"value":"\n","pinned":false,"hidden":false,"mode":"md"},{"id":214,"value":"import {\n render,\n jsx,\n useState,\n useEffect,\n useRef\n} from \"@kreijstal/preact-compatibility\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":498,"value":"$30","pinned":false,"hidden":false,"mode":"ojs"},{"id":504,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":501,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":226,"value":"fullscreen = htl.html``","pinned":false,"hidden":false,"mode":"ojs"},{"id":725,"value":"render((_) => jsx`<${TimedEventGraphComponent} />`)","pinned":true,"hidden":false,"mode":"ojs"},{"id":52,"value":"/*{\n // Draw the timed event graph using D3.js\n let div = html`

`;\n drawTimedEventGraph(timedEventGraph, div);\n return div;\n}*/","pinned":true,"hidden":false,"mode":"ojs"},{"id":555,"value":"//timedEventGraph.fireTransition(timedEventGraph.transitions[1])","pinned":true,"hidden":false,"mode":"ojs"},{"id":58,"value":"{\n //debugger;\n // timedEventGraph.addPlace(new timedEventGraph._inner.Place(\"p3\", 1));\n var t0 = timedEventGraph.fromId(\"T1\");\n timedEventGraph.fireTransition(t0);\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":413,"value":"class Place {\n /**\n * Creates a Place instance\n * @param {string} id - ID of the Place\n * @param {Object} holdingTime - Holding time per mode\n * @param {number} [x] - X coordinate\n * @param {number} [y] - Y coordinate\n */\n constructor(id, holdingTime = {}, tokens = 0, x = undefined, y = undefined) {\n this.id = id;\n this.holdingTime = holdingTime;\n this.tokens = tokens;\n this.x = x;\n this.y = y;\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":416,"value":"class Transition {\n /**\n * Creates a Transition instance\n * @param {string} id - ID of the Transition\n * @param {Object} holdingTime - Holding time per mode\n * @param {number} [x] - X coordinate\n * @param {number} [y] - Y coordinate\n */\n constructor(id, holdingTime = {}, x = undefined, y = undefined) {\n this.id = id;\n this.holdingTime = holdingTime;\n this.x = x;\n this.y = y;\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":427,"value":"class Arc {\n constructor(source, target) {\n this.source = source;\n this.target = target;\n }\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":681,"value":"timedEventGraph","pinned":true,"hidden":false,"mode":"ojs"},{"id":640,"value":"parseGDMatrix(`[0,12]=(g1.d0)\n[0,23]=(g1.d6)`)","pinned":true,"hidden":false,"mode":"ojs"},{"id":609,"value":"$33","pinned":true,"hidden":false,"mode":"ojs"},{"id":635,"value":"/**\n * Parses the file content and returns a data object.\n * @param {string} fileContent - The content of the file to parse.\n * @returns {Object.>} - The parsed data object with nested numeric keys.\n */\nfunction parseGDMatrix(fileContent) {\n const rows = fileContent.trim().split(\"\\n\");\n const data = {};\n\n for (let i = 0; i < rows.length; i++) {\n const row = rows[i];\n const [coord, value] = row.split(\"=\");\n const [r, c] = coord\n .replace(/[\\[\\]]/g, \"\")\n .split(\",\")\n .map((x) => parseInt(x));\n\n // Split the value string at 'd' and 'g', and convert the parts to number.\n const g = parseInt(value.match(/g(\\d+)/)[1]);\n const d = parseInt(value.match(/d(\\d+)/)[1]);\n\n if (!(r in data)) {\n data[r] = {};\n }\n\n data[r][c] = { g: g, d: d };\n }\n\n return data;\n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":633,"value":"$34","pinned":true,"hidden":false,"mode":"ojs"},{"id":4,"value":"$35","pinned":false,"hidden":false,"mode":"ojs"},{"id":356,"value":"tools=function(ref){\n function dragstarted(event, d) {\n if (!event.active) {\n ref.tickCount = 0;\n ref.simulation.alphaTarget(0.3).restart();\n }\n d.fx = d.x;\n d.fy = d.y;\n }\n\n function dragged(event, d) {\n ref.tickCount = 0;\n d.fx = event.x;\n d.fy = event.y;\n }\n\n function dragended(event, d) {\n ref.tickCount = 0;\n if (!event.active) ref.simulation.alphaTarget(0);\n d.fx = null;\n d.fy = null;\n }\n return {dragstarted,dragged,dragended}\n \n}","pinned":true,"hidden":false,"mode":"ojs"},{"id":49,"value":"$36","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W37","stdlib":"1","titling":"auto"}