Triggering and listening to events to re render a page

There are patterns that have an influence on the layout of the page when they execute.

Examples:

• pat-inject: Direct influence Injects content into a page that is of different dimensions than the element that is replaced by it.
• pat-switch: Indirect Influence Might change the css applied to the page which in turn changes proportions of a dom element.
• pat-equaliser: Direct influence Resizes boxes in a line to make them all same height. This might push other content around.
• pat-autoscale: Direct influence ?
• pat-bumper ?
• pat-clone ?
• pat-collapsible: Direct influence Opens or closes a dom element which needs space and expands or collapses, moving other items around
• pat-depends ?
• pat-masonry
• pat-toggle
• pat-zoom ?

Usually we assume that a pattern influences another pattern when it is included within the other pattern's dom tree. In this case, the lower pattern would trigger a pat-update event on itself, which bubbles up, passes the upper pattern node and triggers a rerender there.

Problem 1: If both patterns live in parallel - dom wise - but have nonetheless a layout influence on each other (Like a sidebar opening and pushing the document content area aside), then the pat-update trigger will never pass the other pattern and therefore no rerender is triggered.

Problem 2: If patterns are listening to a node higher up in the hierarchy, triggering pat-update might be catched by themselves, which in turn triggers a rerender, that triggers another pat-update, which is catched by itself again - leading to an endless circle (currently happening in pat-equaliser)

Usually such problems are fixed if the user resizes the browser for so little as one single pixel. Then a resize event is thrown and all components on the page rebuild themselves. Problem - triggering resize in code is not doing exactly the same thing.

Lines of thought:

• Only the designer really knows the impact of his styling and pattern usage. Should we give the designer an option to define where to trigger the pat-update?

Example: data-pat-switch="trigger-update-on: .pat-masonry"

• Do we want some sort of central registry where patterns register and state what type of resize / redraw / update notifications they are interested in and they would send? And then have that registry sort the necessary updates out?