z-index completely removed.

src/frontend/rountangleEditor/RountangleActions.ts

@@ -1,17 +1,13 @@
 import {PrimitiveValue} from "../../onion/types";
 
-interface CreateRountangle  {tag: 'createRountangle',  id: PrimitiveValue, /*name: string,*/ posX: number, posY: number, posZ: number, width: number, height: number}
+interface CreateRountangle  {tag: 'createRountangle',  id: PrimitiveValue, posX: number, posY: number, width: number, height: number}
 interface MoveRountangle    {tag: 'moveRountangle',    id: PrimitiveValue, newPosX: number, newPosY: number}
 interface ResizeRountangle  {tag: 'resizeRountangle',  id: PrimitiveValue, width: number, height: number}
-// interface RenameRountangle  {tag: 'renameRountangle',  id: PrimitiveValue, newName: string}
-interface ChangeRountangleZ {tag: 'changeRountangleZ', id: PrimitiveValue, newPosZ: number}
 interface DeleteRountangle  {tag: 'deleteRountangle',  id: PrimitiveValue}
 
 export type RountangleAction =
     Readonly<CreateRountangle>
     | Readonly<MoveRountangle>
     | Readonly<ResizeRountangle>
-    // | Readonly<RenameRountangle>
-    | Readonly<ChangeRountangleZ>
     | Readonly<DeleteRountangle>
 ;

src/frontend/rountangleEditor/RountangleComponent.tsx

@@ -23,10 +23,8 @@ export class RountangleComponent extends React.Component<RountangleProps, Rounta
     shouldComponentUpdate(nextProps: Readonly<RountangleProps>, nextState: Readonly<RountangleState>, nextContext: any): boolean {
         return this.props.posX       !== nextProps.posX
             || this.props.posY       !== nextProps.posY
-            || this.props.posZ       !== nextProps.posZ
             || this.props.width      !== nextProps.width
             || this.props.height     !== nextProps.height
-            // || this.props.name       !== nextProps.name
             || this.state.dragging   !== nextState.dragging
             || this.state.movementsX !== nextState.movementsX
             || this.state.movementsY !== nextState.movementsY

src/frontend/rountangleEditor/RountangleEditor.tsx

@@ -12,7 +12,6 @@ export interface Rountangle {
     // readonly name:   string;
     readonly posX:   number;
     readonly posY:   number;
-    readonly posZ:   number;
     readonly width:  number;
     readonly height: number;
 }
@@ -22,10 +21,8 @@ export function isRountangle(d3node: d3Types.d3Node<INodeState | IValueState>) {
     const nodeState = d3node.obj as unknown as INodeState;
     const outgoing = nodeState.getOutgoingEdges();
     if (!(outgoing.get('type')?.asTarget() === 'Rountangle')) return false;
-    // if (!(typeof outgoing.get('label')?.asTarget()   === "string")) return false;
     if (!(typeof outgoing.get('x')?.asTarget()       === "number")) return false;
     if (!(typeof outgoing.get('y')?.asTarget()       === "number")) return false;
-    if (!(typeof outgoing.get('z-index')?.asTarget() === "number")) return false;
     if (!(typeof outgoing.get('width')?.asTarget()   === "number")) return false;
     if (!(typeof outgoing.get('height')?.asTarget()  === "number")) return false;
 
@@ -44,36 +41,11 @@ export function graphStateToRountangle(d3node: d3Types.d3Node<INodeState | IValu
         // name: outgoing.get("label")!.asTarget() as string,
         posX: outgoing.get("x")!.asTarget() as number,
         posY: outgoing.get("y")!.asTarget() as number,
-        posZ: outgoing.get("z-index")!.asTarget() as number,
         width: outgoing.get("width")!.asTarget() as number,
         height: outgoing.get("height")!.asTarget() as number,
     }]
 }
 
-// export function getValueForLabelAsString(node:INodeState, label:string): string {
-//     const delta = node.getOutgoingEdges().get(label);
-//     if (delta) {
-//         const value = delta.target.getTarget();
-//         if (typeof value === "string") {
-//             return value;
-//         }
-//         else {
-//             throw new Error(`Outgoing edge "${label}" is not of type string. Type is: ${typeof value}`);
-//         }
-//     }
-//     else {
-//         throw new Error(`Node ID "${node.creation.id}" has no outgoing edge "${label}"`);
-//     }
-// }
-
-// export function getValueForLabelAsNumber(node:INodeState, label:string): number {
-//     const target = node.getOutgoingEdges().get(label)!.asTarget();
-//     if (typeof target === "number") {
-//         return target;
-//     }
-//     throw new Error(`Outgoing edge "${label}" is not of type number. Type is: ${typeof target}`);
-// }
-
 export interface RountangleEditorProps {
   graph: GraphType;
   graphState: GraphState;
@@ -149,10 +121,8 @@ export class RountangleEditor extends React.Component<RountangleEditorProps, Rou
                 deltas.push(createRountangleNodeDelta);
                 const edgeSpec: [string,PrimitiveValue][] = [
                     ["type","Rountangle"],
-                    // ["label",action.name],
                     ["x",action.posX],
                     ["y",action.posY],
-                    ["z-index",action.posZ],
                     ["width",action.width],
                     ["height",action.height],
                 ];
@@ -179,19 +149,6 @@ export class RountangleEditor extends React.Component<RountangleEditorProps, Rou
                     deltas.push(...this.createValueDeltas(nodeState, [["width",action.width],["height",action.height]]));
                 }
                 break;
-            // case 'renameRountangle':
-            //     nodeState = this.props.graphState.nodes.get(action.id);
-            //     if (nodeState !== undefined) {
-            //         deltas.push(...this.createValueDeltas(nodeState, [["label",action.newName]]));
-            //     }
-            //     break;
-            case 'changeRountangleZ':
-                // this.setState( (state,_) => ({
-                //     ...state,
-                //     [action.id]: {...state[action.id], posZ: action.newPosZ}
-                // }));
-                // TODO
-                break;
             default: assertNever(action);
         }
         if (deltas.length > 0) {
@@ -258,17 +215,13 @@ export class RountangleEditor extends React.Component<RountangleEditorProps, Rou
             const cursorPoint = this.clickToSVGPos(event.clientX, event.clientY);
 
             if (cursorPoint) {
-                // const newRountangleName = prompt('Name', 'New Rountangle');
-                // if (newRountangleName) {
                     this.dispatch({
                         tag: 'createRountangle',
                         id: this.props.generateUUID().value,
                         posX: cursorPoint.x,
                         posY: cursorPoint.y,
-                        posZ: 10,
                         width: 100,
                         height: 66,
-                        // name: newRountangleName,
                     });
                 // }
             }
@@ -332,7 +285,6 @@ export class RountangleEditor extends React.Component<RountangleEditorProps, Rou
                                 // name={rountangle.name}
                                 posX={rountangle.posX}
                                 posY={rountangle.posY}
-                                posZ={rountangle.posZ}
                                 width={rountangle.width}
                                 height={rountangle.height}
                                 zoom={this.state.zoom}