How to visualize the current knowledge base

Every Pharo snippet is populated with a thisSnippet variable. Through that, we can just get access to the entire database and the registered pages.

pages := thisSnippet database pages

All pages are connected to one another. Let's visualize that graph:

m := GtMondrian new.
m nodes
	stencil: [ :each | 
		BlElement new
			background: Color black;
			size: 5 @ 5;
			when: BlClickEvent
				do: [ :e | e currentTarget phlow spawnTool: each asPhlowTool ] ];
	with: pages.
m edges
	stencil: [ BlLineElement new
			border: Color veryVeryLightGray;
			zIndex: -1 ];
	connectToAll: [ :page | page allOutgoingTextualLinks collectAsSet: #target ].
m layout force nbIterations: 30.
m asElement

Ah, that graph is a little too crowded because Glamorous Toolkit Book is linked to all pages in the database. So, let's take that page out.

pages := thisSnippet database pages 
	reject: [:each | 
		each title = 'Glamorous Toolkit Book']

That's better, but still not particularly valuable. That's because the visualization is generic. Value is always specific. So, in trueMoldable Development fashion, let's enhance our visualization with a contextual mapping. For example, highlighting where Lepiter is found in titles.

m := GtMondrian new.
m nodes
	stencil: [ :each | 
		BlElement new
			background: ((each title includesSubstring: 'Lepiter')
					ifTrue: [ Color red ]
					ifFalse: [ Color black ]);
			size: 5 @ 5;
			when: BlClickEvent
				do: [ :e | 
					e consumed: true.
					e currentTarget phlow spawnTool: each asPhlowTool ] ];
	with: pages.
m edges
	stencil: [ BlLineElement new
			border: Color veryVeryLightGray;
			zIndex: -1 ];
	connectToAll: [ :page | page allOutgoingTextualLinks collectAsSet: #target ].
m layout force nbIterations: 50.
m

Now, go and click on one of the nodes. What happens?