Best Practice for Transitioning From Nested State to Nested State (see diagram)

Question

I am trying to wrap my mind around the best way to implement nested state transitions in a single threaded programming language (Actionscript). Say I have a structure like this

Answer 1

I'm just guessing here but you can store that tree in an actual tree in your code and then, when clicked you want to navigate you call a function that's called, say, findPath(fromNode, toNode) that function will find the path between the two nodes, one way to do that is with this pseudo code:

Define array1;
Define array2;

loop while flag is false {
    store fromNode's parent node in array1;
    store toNode's parent node in array2;

    loop through array1 {
        loop through array2 {
            if array1[i] == array2[j] {
             flag = true;
            }
        }
    }
}

path = array1 + reverse(array2);

And there is your path.

UPDATE:

Another solution would be to make each page have something like this pseudo code--I'm starting to really love pseudo code:

function checkChildren(targetNode) {
    loop through children {
        if children[i] == target {
            return path;
        }
        if children[i].checkChildren == target node {
            return path;
        }
    }
}

This is very very abstract, it has a lot more details to it and a lot of optimizations, here's what I have in mind:

• Pass the path going up the tree to the function so the path can be found directly instead of returning to the calling function.
• Pass the current calling child to the parents checkChildren so it won't bother checking that child to make checking faster.

I still think i haven't delivered my idea well so I'll try to explain it.

Say you're going from pic2 in the gallery to project3 in projects.

pic2 would check its children (if any), if it finds the target it goes there, otherwise it calls its parent (gallery)'s checkChildren passing itself to the parent won't bother checking it, and passing itself to the parent in an array so the parent knows what path has been taken.

The parent checks its children if any of them is the target, if it is it adds itself and the child to the path array and that's the path.

If it none of its direct children is the target then it calls each of its children's checkChildren passing adding itself to the array of the path so that if any of its children finds the target it adds itself and the child to the array and you have your path.

If none of the children find the target gallery calls its parent (home page)'s check children passing itself and the adding itself to the array of the path.

The homepage checks all its children except gallery using the same method.

Alternatively, you can choose not to pass the path as an array but instead just transition to the parent page if none of the children or the children's children match 'cause you're sure the target is not under this page.

I hope I made myself clear. I can write checkChildren for you if you want.