BranchesTags

Repository files navigation

MindMup MapJs

MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.

This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.

This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.

Using MAPJS standalone

To run the dev server, execute:

npm run start

Then open http://localhost:9000/ to view the example map.

Using MAPJS in your projects

MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.

Testing

To run the unit tests, execute

`npm test`

To debug and try things out visually, grab the dependencies using:

`npm run pretest`

Dependencies

This library depends on the following projects:

Keyboard Shortcuts

You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node. You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.

Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon

About

JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.

mapjs-argview.netlify.app/

Topics

argument-mappingargument-mapsargumentationmindmapmindmup

Resources

Readme
License
Activity

Stars

0 stars

Watchers

1 watching

Forks

1 fork
Report repository

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all 
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix");
}
} catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms");
}
} catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links");
}
} catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); }
})();
(function(){
try {
var __m = "youtube.com";
var __re = new RegExp('^' + "youtube\\.com" + '

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default");
}
} catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers");
}
} catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); }
})();
(function(){
try {
var __m = "*";
var __re = new RegExp('^' + ".*" + '

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages

, 'i');
if (__m === '*' || __re.test(location.href)) {
injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode");
}
} catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); }
})();
})();

Skip to content
BranchesTags
Repository files navigation
MindMup MapJs
MindMup is a zero-friction mind map canvas. Our aim is to create the most productive mind mapping environment out there, removing all the distractions and providing powerful editing shortcuts.
This project is the JavaScript visualisation portion of MindMup. It provides a canvas for users to create and edit
mind maps in a browser. You can see an example of this live at mindmup.com, or play with the library directly in the browser using test/index.html from this project.
This project is relatively stand alone and you can use it to create a nice mind map visualisation separate from the MindMup Server.
Using MAPJS standalone
To run the dev server, execute:
npm run start
Then open http://localhost:9000/ to view the example map.
Using MAPJS in your projects
MapJS 2 works well with WebPack. Check out the MAPJS Webpack Example project.
Testing
To run the unit tests, execute
`npm test`

To debug and try things out visually, grab the dependencies using:
`npm run pretest`

Dependencies
This library depends on the following projects:
Keyboard Shortcuts
You can only select one node at a time, selected nodes have a drop shadow. When you add nodes they are added relative to the selected node.
You can activate multiple nodes at once, these are highlighted with a dotted line. When you delete or toggle nodes, you affect all the active nodes.
Key CombinationEffect
spacef2Edit node text
delbackspaceRemove active nodes
returnAdd node below
shift+returnAdd node above
shift+tabAdd node left
tabinsertAdd node right
ctrl+clickSelect clicked node
shift+clickActivate clicked node
alt+clickAdd link to clicked node
downSelect node below
upSelect node above
leftSelect node left
rightSelect node right
shift+downActivate node below
shift+upActivate node above
shift+leftActivate node left
shift+rightActivate node right
meta+downctrl+downMove active nodes below
meta+upctrl+upMove active nodes above
meta+rightctrl+rightMove active nodes right
meta+leftctrl+leftMove active nodes left
c meta+x ctrl+xCut
p meta+v ctrl+vPaste
y meta+c ctrl+cCopy
ctrl+shift+v meta+shift+vPaste Style (custom colours)
f/Toggle collapse / reveal
umeta+zctrl+zUndo
rmeta+shift+zctrl+shift+zmeta+yctrl+yRedo
meta+plus ctrl+plus zZoom in
meta+minus ctrl+minus shift+zZoom out
Esc 0 meta+0 ctrl+0Reset view / zoom
[Activate children
{Activate node and children
=Activate sibling nodes
.Deactivate all but selected node
aAdd / Open attachment
iEdit icon
About
JavaScript Mind Map visualisation and management library using SVG. Developed for MindMup, with additional bugfixes.
mapjs-argview.netlify.app/
Topics
argument-mappingargument-mapsargumentationmindmapmindmup
Resources
Readme
License
Activity
Stars
0 stars
Watchers
1 watching
Forks
1 fork
Report repository
Releases
Packages
Contributors
Languages