summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
Diffstat
-rw-r--r--app/components/graph/graph.tsx61
-rw-r--r--app/components/tweaks/tweaks.tsx7
-rw-r--r--app/screens/graph/graph-screen.tsx16
-rw-r--r--web-build/asset-manifest.json14
-rw-r--r--web-build/index.html2
5 files changed, 58 insertions, 42 deletions
diff --git a/app/components/graph/graph.tsx b/app/components/graph/graph.tsx
index ff41ea9..7db642e 100644
--- a/app/components/graph/graph.tsx
+++ b/app/components/graph/graph.tsx
@@ -82,44 +82,45 @@ export const Graph = observer(function Graph(props: GraphProps): JSX.Element {
})
// For the expandable version of the graph
- const rootId = 0
+
+
const nodesById = useMemo(() => {
- const nodesById = Object.fromEntries(gData.nodes.map((node) => [node.id, node]))
+ const nodesById = Object.fromEntries(gData.nodes.map((node) => [node.index, node]))
+ console.log(nodesById);
// link parent/children
gData.nodes.forEach((node) => {
- node.collapsed = node.id !== rootId
+ (((typeof physics.rootId) === "number") ? node.collapsed = node.index !== physics.rootId
+ : node.collapsed = node.id !== physics.rootId)
node.childLinks = []
- node.parentLink = []
})
- gData.links.forEach((link) => nodesById[link.source].childLinks.push(link))
+ gData.links.forEach((link) => nodesById[link.sourceIndex].childLinks.push(link));
+ return nodesById;
+ }, [gData]);
+ const getPrunedTree = useCallback(() => {
+ const visibleNodes = [];
+ const visibleLinks = [];
+ (function traverseTree(node = nodesById[physics.rootId]) {
+ visibleNodes.push(node);
+ if (node.collapsed) return
+ visibleLinks.push(...node.childLinks)
+ node.childLinks
+ .map(link => ((typeof link.targetIndex) === "object") ? link.targetIndex : nodesById[link.targetIndex]) // get child node
+ .forEach(traverseTree);
+ })();
- return nodesById
- }, [gData])
+ return { nodes: visibleNodes, links: visibleLinks }
+ }, [nodesById])
- /* const getPrunedTree = useCallback(() => {
-* const visibleNodes = [];
-* const visibleLinks = [];
-* (function traverseTree(node = nodesById[rootId]) {
-* visibleNodes.push(node);
-* if (node.collapsed) return
-* visibleLinks.push(...node.childLinks)
-* node.childLinks
-* .map((link) => (typeof link.target === "object" ? link.target : nodesById[link.target])) // get child node
-* .forEach(traverseTree)
-* })()
+ const [prunedTree, setPrunedTree] = useState(getPrunedTree())
-* return { nodes: visibleNodes, links: visibleLinks }
-* }, [nodesById])
+ const handleNodeClick = useCallback((node) => {
+ node.collapsed = !node.collapsed // toggle collapse state
+ setPrunedTree(getPrunedTree())
+ }, []);
-* const [prunedTree, setPrunedTree] = useState(getPrunedTree())
-
-* const handleNodeClick = useCallback((node) => {
-* node.collapsed = !node.collapsed // toggle collapse state
-* setPrunedTree(getPrunedTree())
-* }, []);
- */
+ //highlighting
const [highlightNodes, setHighlightNodes] = useState(new Set());
const [highlightLinks, setHighlightLinks] = useState(new Set());
const [hoverNode, setHoverNode] = useState(null);
@@ -184,8 +185,8 @@ onLinkHover={handleLinkHover}
<ForceGraph2D
ref={fgRef}
autoPauseRedraw={false}
- graphData={gData}
- //graphData={physics.collapse ? prunedTree : gData}
+ //graphData={gData}
+ graphData={physics.collapse ? prunedTree : gData}
nodeAutoColorBy={physics.colorful ? "id" : undefined}
nodeColor={
!physics.colorful ? (
@@ -215,7 +216,7 @@ onLinkHover={handleLinkHover}
// !node.childLinks.length ? "green" : node.collapsed ? "red" : "yellow"
}
linkDirectionalParticles={physics.particles}
- //onNodeClick={!physics.collapse ? null : handleNodeClick}
+ onNodeClick={!physics.collapse ? undefined : handleNodeClick}
nodeLabel={(node) => node.title}
//nodeVal ={(node)=> node.childLinks.length * 0.5 + 1}
//d3VelocityDecay={visco}
diff --git a/app/components/tweaks/tweaks.tsx b/app/components/tweaks/tweaks.tsx
index d2b5bd1..49754d0 100644
--- a/app/components/tweaks/tweaks.tsx
+++ b/app/components/tweaks/tweaks.tsx
@@ -181,6 +181,13 @@ export const Tweaks = observer(function Tweaks(props: TweaksProps): JSX.Element
value={physics.collapse}
onValueChange={() => { setPhysics({ ...physics, collapse: !physics.collapse }) }}
/>
+ <Text preset="fieldLabel" text={"Change starting point: " + physics.rootId} />
+ <Slider style={{ height: 40, width: "90%" }}
+ minimumValue={0}
+ maximumValue={600}
+ onValueChange={(value) => { setPhysics({ ...physics, rootId: value }) }}
+ value={physics.rootId}
+ step={1} />
<Text preset="fieldLabel" text="3D" />
<Switch style={{ width: "5", height: 20, marginVertical: 10 }}
value={physics.threedim}
diff --git a/app/screens/graph/graph-screen.tsx b/app/screens/graph/graph-screen.tsx
index ebca953..b4ec1d9 100644
--- a/app/screens/graph/graph-screen.tsx
+++ b/app/screens/graph/graph-screen.tsx
@@ -56,6 +56,7 @@ export const GraphScreen = observer(function GraphScreen() {
hover: true,
colorful: true,
galaxy: true,
+ rootId: 0,
}
const getData = async () => {
@@ -101,7 +102,7 @@ export const GraphScreen = observer(function GraphScreen() {
// Get previous settings and the data from the org-roam-server
const sanitizeGraph = (data, nodeIds: string[]) => {
const cleanLinks = [];
- data.links.forEach((link) => {
+ data.links.forEach((link, j) => {
let target;
let source;
for (let i = 0; i < nodeIds.length; i++) {
@@ -114,7 +115,7 @@ export const GraphScreen = observer(function GraphScreen() {
//a.neighbors.push(a);
a.links.push(link);
target = [a, i];
- cleanLinks.push(link);
+ link.target===link.source ? null : cleanLinks.push(link);
} else if (link.source === nodeIds[i]) {
//let a = data.nodes[i];
//!a.neighbors && (a.neighbors = []);
@@ -122,10 +123,12 @@ export const GraphScreen = observer(function GraphScreen() {
a.links.push(link);
source = [a, i];
};
- };
+ };
if (target && source) {
data.nodes[target[1]].neighbors.push(source[0]);
data.nodes[source[1]].neighbors.push(target[0]);
+ link.sourceIndex=source[1];
+ link.targetIndex=target[1];
}
});
console.log(cleanLinks);
@@ -135,8 +138,13 @@ export const GraphScreen = observer(function GraphScreen() {
const getNodesById = (data) => {
let temp = [];
- data.nodes.forEach(node => temp.push(node.id));
+ data.nodes.forEach((node, i) => {
+ temp.push(node.id);
+ node.index=i;
+ }
+ );
setNodeIds(temp);
+
return temp;
};
diff --git a/web-build/asset-manifest.json b/web-build/asset-manifest.json
index 860f8d6..c747047 100644
--- a/web-build/asset-manifest.json
+++ b/web-build/asset-manifest.json
@@ -1,11 +1,11 @@
{
"files": {
- "app.js": "/static/js/app.1d85930b.chunk.js",
- "app.js.map": "/static/js/app.1d85930b.chunk.js.map",
+ "app.js": "/static/js/app.e8143965.chunk.js",
+ "app.js.map": "/static/js/app.e8143965.chunk.js.map",
"runtime~app.js": "/static/js/runtime~app.2e9f1821.js",
"runtime~app.js.map": "/static/js/runtime~app.2e9f1821.js.map",
- "static/js/2.768b2925.chunk.js": "/static/js/2.768b2925.chunk.js",
- "static/js/2.768b2925.chunk.js.map": "/static/js/2.768b2925.chunk.js.map",
+ "static/js/2.88717ad6.chunk.js": "/static/js/2.88717ad6.chunk.js",
+ "static/js/2.88717ad6.chunk.js.map": "/static/js/2.88717ad6.chunk.js.map",
"fonts/MaterialCommunityIcons.ttf": "/./fonts/MaterialCommunityIcons.ttf",
"favicon-16.png": "/favicon-16.png",
"favicon-32.png": "/favicon-32.png",
@@ -13,7 +13,7 @@
"index.html": "/index.html",
"manifest.json": "/manifest.json",
"serve.json": "/serve.json",
- "static/js/2.768b2925.chunk.js.LICENSE.txt": "/static/js/2.768b2925.chunk.js.LICENSE.txt",
+ "static/js/2.88717ad6.chunk.js.LICENSE.txt": "/static/js/2.88717ad6.chunk.js.LICENSE.txt",
"static/media/bezier.cjs": "/static/media/bezier.799a5c8c.cjs",
"static/media/bg.png": "/static/media/bg.27c56310.png",
"static/media/bowser.png": "/static/media/bowser.4ba9aedf.png",
@@ -21,7 +21,7 @@
},
"entrypoints": [
"static/js/runtime~app.2e9f1821.js",
- "static/js/2.768b2925.chunk.js",
- "static/js/app.1d85930b.chunk.js"
+ "static/js/2.88717ad6.chunk.js",
+ "static/js/app.e8143965.chunk.js"
]
} \ No newline at end of file
diff --git a/web-build/index.html b/web-build/index.html
index a67877c..d1b0b30 100644
--- a/web-build/index.html
+++ b/web-build/index.html
@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta httpequiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1.00001,viewport-fit=cover"/><title>OrgRoamForceGraphReact</title><style>#root,body,html{width:100%;-webkit-overflow-scrolling:touch;margin:0;padding:0;min-height:100%}#root{flex-shrink:0;flex-basis:auto;flex-grow:1;display:flex;flex:1}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;height:calc(100% + env(safe-area-inset-top))}body{display:flex;overflow-y:auto;overscroll-behavior-y:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-ms-overflow-style:scrollbar}</style><link rel="manifest" href="/manifest.json"><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16.png"><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png"><link rel="shortcut icon" href="/favicon.ico"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-touch-fullscreen" content="yes"><meta name="apple-mobile-web-app-title" content="OrgRoamForceGraphReact"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link rel="apple-touch-icon" sizes="180x180" href="/pwa/apple-touch-icon/apple-touch-icon-180.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-640x1136.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1242x2688.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-828x1792.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1125x2436.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1242x2208.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-750x1334.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-2048x2732.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1668x2388.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1668x2224.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1536x2048.png"></head><body><noscript><form action="" style="background-color:#fff;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999"><div style="font-size:18px;font-family:Helvetica,sans-serif;line-height:24px;margin:10%;width:80%"><p>Oh no! It looks like JavaScript is not enabled in your browser.</p><p style="margin:20px 0"><button type="submit" style="background-color:#4630eb;border-radius:100px;border:none;box-shadow:none;color:#fff;cursor:pointer;font-weight:700;line-height:20px;padding:6px 16px">Reload</button></p></div></form></noscript><div id="root"></div><script src="/static/js/runtime~app.2e9f1821.js"></script><script src="/static/js/2.768b2925.chunk.js"></script><script src="/static/js/app.1d85930b.chunk.js"></script></body></html> \ No newline at end of file
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><meta httpequiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1.00001,viewport-fit=cover"/><title>OrgRoamForceGraphReact</title><style>#root,body,html{width:100%;-webkit-overflow-scrolling:touch;margin:0;padding:0;min-height:100%}#root{flex-shrink:0;flex-basis:auto;flex-grow:1;display:flex;flex:1}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;height:calc(100% + env(safe-area-inset-top))}body{display:flex;overflow-y:auto;overscroll-behavior-y:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-ms-overflow-style:scrollbar}</style><link rel="manifest" href="/manifest.json"><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16.png"><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32.png"><link rel="shortcut icon" href="/favicon.ico"><meta name="mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-touch-fullscreen" content="yes"><meta name="apple-mobile-web-app-title" content="OrgRoamForceGraphReact"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><link rel="apple-touch-icon" sizes="180x180" href="/pwa/apple-touch-icon/apple-touch-icon-180.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 320px) and (device-height: 568px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-640x1136.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1242x2688.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-828x1792.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1125x2436.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 414px) and (device-height: 736px) and (-webkit-device-pixel-ratio: 3) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1242x2208.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 375px) and (device-height: 667px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-750x1334.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 1024px) and (device-height: 1366px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-2048x2732.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 834px) and (device-height: 1194px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1668x2388.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 834px) and (device-height: 1112px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1668x2224.png"><link rel="apple-touch-startup-image" media="screen and (device-width: 768px) and (device-height: 1024px) and (-webkit-device-pixel-ratio: 2) and (orientation: portrait)" href="/pwa/apple-touch-startup-image/apple-touch-startup-image-1536x2048.png"></head><body><noscript><form action="" style="background-color:#fff;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999"><div style="font-size:18px;font-family:Helvetica,sans-serif;line-height:24px;margin:10%;width:80%"><p>Oh no! It looks like JavaScript is not enabled in your browser.</p><p style="margin:20px 0"><button type="submit" style="background-color:#4630eb;border-radius:100px;border:none;box-shadow:none;color:#fff;cursor:pointer;font-weight:700;line-height:20px;padding:6px 16px">Reload</button></p></div></form></noscript><div id="root"></div><script src="/static/js/runtime~app.2e9f1821.js"></script><script src="/static/js/2.88717ad6.chunk.js"></script><script src="/static/js/app.e8143965.chunk.js"></script></body></html> \ No newline at end of file
generated by cgit v1.2.3 (git 2.46.2) at 2024-12-25 04:22:20 +0000