Currently, if you have multiple elements overlapping same space, then it seems arrow/pencil takes precedence over other elements like rectange. This happens only when you refresh and come back.
The logic for bringing any element back/front, is simple - the order in which they were created , we need to change the order of those elements. For suppose there are 10 elements, but only at position:6(circle) and position:7(rectangle) ones are overlapping, and we want rectangle at position:7 to be in front of circle (position:6), what we need to do is , change the order in two.children since the two's scene is one big group containing all the elements which we create on board.
I'll create top-level column for component in DB from my side. It would be of integer type with name position. Default would be 0. So you can modify GQL query (for fetching components) as well as local state for craftbase where it should store position and send position in mutations.
More over we can give proper UX to it.
- Create a menu which can open anywhere on right click on board/canvas whenever user and wherever user wants
- This should give option with collaps menu -
Reorder (1st nested level) -> Bring forward (2nd nested level), Bring backward (2nd nested level), Bring to Front (2nd nested level), Send backwards (2nd nested level)
- "Bring forward" should reorder the component's order which was selected, to move front only ahead of the elements only which it's overlapping with. This should also change element/component's position property based on total elements in board count
- "Bring to front" should reorder the component's order which was selected, to move at the first index of the two's children, top at the stack. This should also change element/component's position property based on total elements in board count
- "Send backwards" should send component way back , down the last pecking order in two children list. This should also change element/component's position property based on total elements in board count.
Local state should monitor and store information like
- There should be always constant calculation on how many elements are there in the board (count). i.e. something like
total_elements_in_board_count
- Upon any addition of the element on board, we should give it the position number -
total_elements_in_board_count + 1
- Upon deletion of any element in board, we should decrease
total_elements_in_board_count.
Better approach on saving elements in order (for localstorage):
In localstorage, I was thinking if we save elements in order they were created this would mean that top most one , would be the one which was created at the first time user created on board, meaning oldest .
Currently, if you have multiple elements overlapping same space, then it seems arrow/pencil takes precedence over other elements like rectange. This happens only when you refresh and come back.
The logic for bringing any element back/front, is simple - the order in which they were created , we need to change the order of those elements. For suppose there are 10 elements, but only at position:6(circle) and position:7(rectangle) ones are overlapping, and we want rectangle at position:7 to be in front of circle (position:6), what we need to do is , change the order in two.children since the two's scene is one big group containing all the elements which we create on board.
I'll create top-level column for component in DB from my side. It would be of
integertype with nameposition. Default would be 0. So you can modify GQL query (for fetching components) as well as local state for craftbase where it should storepositionand sendpositionin mutations.More over we can give proper UX to it.
Reorder (1st nested level) -> Bring forward (2nd nested level), Bring backward (2nd nested level), Bring to Front (2nd nested level), Send backwards (2nd nested level)Local state should monitor and store information like
total_elements_in_board_counttotal_elements_in_board_count + 1total_elements_in_board_count.Better approach on saving elements in order (for localstorage):
In localstorage, I was thinking if we save elements in order they were created this would mean that top most one , would be the one which was created at the first time user created on board, meaning oldest .