Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Fusion based Menu implementation for Neos CMS
prototype(Some.Package:MainMenuItems) < prototype(Neos.Fusion:Component) {
renderer = Neos.Fusion:RawCollection {
collection = ${q(site).children('[instanceof Neos.Neos:Document]').get()}
@context.rootline = ${q(documentNode).parents('[instanceof Neos.Neos:Document]').get()}
itemName = 'node'
itemRenderer = Some.Package:Component.Organism.Menu.Item {
title = ${q(node).property('title')}
href = Neos.Neos:NodeUri {
node = ${node}
}
state = Neos.Fusion:Case {
current {
condition = ${node == documentNode}
renderer = 'current'
}
absent {
condition = ${node == null}
renderer = 'absent'
}
active {
condition = ${Array.indexOf(rootline, node) != -1}
renderer = 'active'
}
normal {
condition = ${true}
renderer = 'normal'
}
}
}
}
}
prototype(Some.Package:Component.Organism.Menu.Item) < prototype(Neos.Fusion:RawArray) {
title = ''
href = ''
# one of "current", "absent", "active" or "normal"
state = ''
}
prototype(Some.Package:Component.Organism.Menu) < prototype(Neos.Fusion:Component) {
items = Neos.Fusion:RawArray
renderer = afx`
<nav>
<ul>
<Neos.Fusion:Collection collection={props.items} itemName="item" iteratorName="iterator" @children="itemRenderer">
<li class={item.state}>
<Neos.Fusion:Tag
tagName={item.state == 'current' ? 'span' : 'a'}
attributes.href={item.href ? item.href : false}
>
{item.title}
</Neos.Fusion:Tag>
</li>
</Neos.Fusion:Collection>
</ul>
</nav>
</div>
`
}
@bwaidelich

This comment has been minimized.

Copy link
Owner Author

commented Jan 4, 2019

Usage:

root = Some.Package:Component.Organism.Menu {
    items = Some.Package:MainMenuItems
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.