Flexbox layout without item re-rendering to new parent

This is the layout i'm trying to make:

I have a difficult flexbox layout that I'm trying to achieve, and I have a difficult restriction that one of the items is a Webgl player and cannot be conditionally rendered because that would restart the WebGl player. All of the items should be able to occupy item 1 position when clicked on. How would you code this flex layout knowing that item 2 can only change its order, not its parent.

I've tried making item 2 absolutely positioned though that is less than ideal.