The premise for the layouting is using sane defaults. Ignoring the propositions of css and html for a while, imagine a whitespace significant template.
{{ template }}
root
hblock
text {:content="first"}
vblock
text {:content="second"}
text {:content="third"}
vblock
text {:content="fourth"}
text {:content="fifth"}
hblock
creates a container where children are positioned horizontally
vblock
creates a container where children are positioned vertically (root is a vblock
)
The default behavior is to:
- render the whole document in the window regardless if it fits.
- clip any excess content
- divide all space equally between children.
So for the document above, it would look like:
|-----------|----------|
| | second |
| first |----------|
| | third |
|-----------|----------|
| fourth |
|-----------|----------|
| fifth |
|-----------|----------|
It's horribly simple to compute the defaults, but the cool thing is, it should be easy to recompute by moving stuff around
def compute_style(node, width, height)
count = node.children.size
if node.is_a?(VBlock)
new_height = height / count
new_width = width
elsif node.is_a?(HBlock)
new_height = height
new_width = width / count
end
node.children.each do |child|
# check for user defined dimensions on the child
# and resize any siblings that come later.
if child.width || child.height
new_width += child.width if child.width <= new_width
new_width -= child.width if child.width > new_width
new_height += child.height if child.height <= new_height
new_height -= child.height if child.height > new_height
compute_style(child, child.width, child.height)
else
compute_style(child, new_width, new_height)
end
end
end