Skip to content

Instantly share code, notes, and snippets.

@pketh
Created March 13, 2024 21:20
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save pketh/fecfb9644abdd663006933fc95173520 to your computer and use it in GitHub Desktop.
Save pketh/fecfb9644abdd663006933fc95173520 to your computer and use it in GitHub Desktop.
convert json canvas to kinopio space.js
// https://jsoncanvas.org
const convertFromCanvas = (space) => {
const yThreshold = 150
let newSpace = {}
try {
newSpace.name = `Canvas ${utils.journalSpaceName({})}`
newSpace.id = nanoid()
newSpace.background = consts.defaultSpaceBackground
newSpace.cards = []
newSpace.connections = []
newSpace.connectionTypes = []
const shouldNudgeCardsY = space.nodes.filter(node => node.y <= yThreshold)
space.nodes.forEach(node => {
// url
let shouldUpdateUrlPreview
if (node.url) {
shouldUpdateUrlPreview = true
}
// y
let y = node.y
if (shouldNudgeCardsY) {
y += yThreshold
}
// name
let name = node.text || node.url || node.label
if (node.file) {
name = `\`${node.file}\``
}
const newCard = {
id: node.id,
x: node.x,
y,
backgroundColor: node.canvasColor || node.color,
name,
shouldUpdateUrlPreview
}
newSpace.cards.push(newCard)
})
space.edges.forEach((edge, index) => {
const typeId = nanoid()
const newConnection = {
id: edge.id,
startCardId: edge.fromNode,
endCardId: edge.toNode,
controlPoint: `q00,00`, // straight line
directionIsVisible: Boolean(edge.fromEnd === 'arrow' || edge.toEnd === 'arrow'),
connectionTypeId: typeId,
labelIsVisible: Boolean(edge.label)
}
const newConnetionType = {
id: typeId,
color: edge.canvasColor || edge.color || newTypeColor(),
name: edge.label || `Connection Type ${index}`
}
newSpace.connections.push(newConnection)
newSpace.connectionTypes.push(newConnetionType)
})
return newSpace
} catch (error) {
console.error('🚒 convertFromCanvas', error)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment