new "leaf" convention for terminal branches

This commit is contained in:
TreetopFlyer 2021-05-24 11:35:06 -04:00
parent 5784db65d9
commit 0c5a1142d3
2 changed files with 75 additions and 41 deletions

View File

@ -117,7 +117,6 @@ let PivotForm = props =>
let Section = props => let Section = props =>
{ {
let styles = css` let styles = css`
border-top:1px solid #aaa;
.Heading .Heading
{ {
padding:6px 0 6px 0; padding:6px 0 6px 0;
@ -145,7 +144,19 @@ let Section = props =>
} }
.Body .Body
{ {
margin:10px 0 10px 0; position:relative;
padding:10px 0 20px 30px;
&::before
{
content: " ";
display:block;
position:absolute;
top:-8px;
left:8px;
width:3px;
height:100%;
background:black;
}
} }
`; `;
@ -165,20 +176,37 @@ let Modifier = props =>
{ {
let refNode = N.Step(props.modifier, "ModifyAt")[0]; let refNode = N.Step(props.modifier, "ModifyAt")[0];
let handlerClick = () => let handleDelete = () =>
{ {
Pivot.Unmodify(props.modifier); Pivot.Unmodify(props.modifier);
Render(); Render();
}; };
let displayFields = [];
N.Walk(node=>{
displayFields.push(html`<input type='number'/>`)
}, Pivot.Schema, "sum");
return html` return html`
<div> <div>
<div>${refNode.Meta.Label}</div> <div>${refNode.Meta.Label}</div>
<button onClick=${handlerClick}>delete</button> <button onClick=${handleDelete}>Delete</button>
</div> </div>
`; `;
} }
let PivotBranch = ({node, widths}) =>
{
let sumCells = node.Meta.Row.map(column=>h("td", null, column));
return html`
<tr>
<td></td>
${sumCells}
</tr>
`;
};
let PivotRoot = ({pivot, children}) => let PivotRoot = ({pivot, children}) =>
{ {
@ -194,7 +222,7 @@ let PivotRoot = ({pivot, children}) =>
font-size:24px; font-size:24px;
`; `;
let modifiers = N.Step(pivot, "Modifier") || []; let modifiers = N.Step(pivot, "ModifyUp", false) || [];
let handleDelete = ()=> let handleDelete = ()=>
{ {

View File

@ -236,7 +236,6 @@ var Pivot =
{ {
iterator = inLastBranch => iterator = inLastBranch =>
{ {
N.Connect(inRoot, inLastBranch, "Terminal");
inLastBranch.Meta.Leaves.forEach( inLeaf => inLastBranch.Meta.Leaves.forEach( inLeaf =>
{ {
// collect modifiers effecting leaves // collect modifiers effecting leaves
@ -267,7 +266,7 @@ var Pivot =
} }
// lastly connect the leaf to the branch // lastly connect the leaf to the branch
N.Connect(inLastBranch, inLeaf, "Hierarchy"); N.Connect(inLastBranch, inLeaf, "Leaf");
}); });
delete inLastBranch.Meta.Leaves; delete inLastBranch.Meta.Leaves;
} }
@ -296,7 +295,7 @@ var Pivot =
Delete(inRoot) Delete(inRoot)
{ {
// disconnect modifiers // disconnect modifiers
let check = N.Step(inRoot, "Modifier"); let check = N.Step(inRoot, "ModifyUp", false);
if(check) if(check)
{ {
while(check.length>0) while(check.length>0)
@ -306,8 +305,8 @@ var Pivot =
} }
// disconnect terminal branches // disconnect terminal branches
N.Walk(()=>{}, inRoot, "Terminal", inNode=>{ N.Walk(()=>{}, inRoot, "Hierarchy", inNode=>{
N.Disconnect(inNode, null, "Hierarchy"); N.Disconnect(inNode, null, "Leaf");
}); });
// disconnect from app // disconnect from app
@ -317,41 +316,37 @@ var Pivot =
{ {
let modified = N.Create({Label:"Modifier"}); let modified = N.Create({Label:"Modifier"});
// add the modifier to the appropriate root
N.ID.Walk++;
if(N.Step(inNode, "Hierarchy").length)
{
N.Walk(()=>{}, inNode, "Hierarchy", false, (inRoot)=>
{
N.Connect(inRoot, modified, "Modifier");
});
}
else
{
N.Connect(Pivot.Root, modified, "Modifier");
}
// traverse // traverse
let leaves = []; let gatherUp = n => N.Connect(modified, n, "ModifyUp");
let gatherUp = n => N.Connect(modified, n, "ModifyUp"); let gatherDown = n => N.Connect(modified, n, "ModifyDown");
let gatherDown = n => let gatherOut = n => N.Connect(modified, n, "ModifyOut");
{
N.Connect(modified, n, "ModifyDown");
N.Step(n, "Hierarchy").length == 0 ? leaves.push(n) : null;
};
let gatherOut = n => {
N.Connect(modified, n, "ModifyOut");
};
N.ID.Walk++; N.ID.Walk++;
inNode.ID.Walk = N.ID.Walk; inNode.ID.Walk = N.ID.Walk;
// at
N.Connect(modified, inNode, "ModifyAt"); N.Connect(modified, inNode, "ModifyAt");
// up
N.Walk(gatherUp, inNode, "Hierarchy", false); N.Walk(gatherUp, inNode, "Hierarchy", false);
N.Walk(gatherDown, inNode, "Hierarchy");
leaves.forEach(leaf=>N.Walk(gatherOut, leaf, "Hierarchy", false)); // down 1
N.Walk(gatherDown, inNode, "Hierarchy", true, terminal=>
{
// down 2
// for each terminal node, step down into its leaves and gather down
N.Walk(gatherDown, terminal, "Leaf", true, leaf=>
{
// out 1
// walk back up on the leaf connections on other trees
N.Walk(gatherOut, leaf, "Leaf", false, terminal=>
{
// out 2
// and continueup the hierarchy
N.Walk(gatherOut, terminal, "Hierarchy", false);
});
});
});
return modified; return modified;
}, },
@ -460,17 +455,28 @@ let ElNode = ({node, depth}) =>
} }
}, "Unmodify"); }, "Unmodify");
let children = N.Step(node, "Hierarchy");
let childrenDisplay = {};
if(children.length)
{
childrenDisplay = h("div", {className:"Nodes"}, N.Step(node, "Hierarchy").map(child=>h(ElNode, {node:child, depth:depth+1})) );
}
else
{
childrenDisplay = h("div", {className:"Nodes Leaf"}, N.Step(node, "Leaf").map(child=>h(ElNode, {node:child, depth:depth+1})) );
}
return h("div", {className:"Node"}, [ return h("div", {className:"Node"}, [
h("div", {className:cx(nodeBase, "Upper")}, [ h("div", {className:cx(nodeBase, "Upper")}, [
h("div", {className:label}, [ h("div", {className:label}, [
h("span", {className:"Icon Expand"}, "+"), h("span", {className:"Icon Expand"}),
h("span", {className:"Name"}, (node.Meta.Label || "a node")+" "+node.ID.Walk), h("span", {className:"Name"}, (node.Meta.Label || "a node")+" "+node.ID.Walk),
h("span", {className: icon}), h("span", {className: icon}),
N.Step(node, "ModifyAt") ? buttonUnmodify : buttonModify N.Step(node, "ModifyAt") ? buttonUnmodify : buttonModify
] ), ] ),
h("div", {className:"Table"}, (node.Meta.Row || []).map( cell => h("div", {className:"Cell"}, cell)) ) h("div", {className:"Table"}, (node.Meta.Row || []).map( cell => h("div", {className:"Cell"}, cell)) )
]), ]),
h("div", {className:"Nodes"}, N.Step(node, "Hierarchy").map(child=>h(ElNode, {node:child, depth:depth+1})) ) childrenDisplay
]); ]);
}; };