This patch adds the following methods to CanvasRenderingContext2D:
- beginPath()
- moveTo(x, y)
- lineTo(x, y)
- closePath()
- stroke()
We also add the lineWidth property. :^)
Add an implementation of CanvasRenderingContext2DWrapper.strokeRect().
While implementing this I fixed fillRect() and the new strokeRect() to
honor the .scale() and .translate() values that had previously been plumbed.
Also enhance the canvas.html demo to utilize strokeRect(), scale(), and translate().
Scripts loaded in this way will block the parser until they finish
executing. This means that they see the DOM before the whole document
has been fully parsed. This is all normal, of course.
To make this work, I changed the way we notify DOM nodes about tree
insertion. The inserted_into() callbacks are now incrementally invoked
during parse, as each node is appended to its parent.
To accomodate inline scripts and inline style sheets, we now also have
a children_changed() callback which is invoked on any parent when it
has children added/removed.
I made some mistakes in the selector parsing code. It's now able to
parse selectors composed of multiple complex selectors, instead of just
one complex selector.
This currently returns a JS::Array of elements matching a selector.
The more correct behavior would be to return a static NodeList, but as
we don't have NodeLists right now, that'll be a task for the future.
Getting the innerHTML property will recurse through the subtree inside
the element and serialize it into a string as it goes.
Setting it will parse the set value as an HTML fragment. It will then
remove all current children of the element and replace them with all
the children inside the parsed fragment.
Setting element.innerHTML will currently force a complete rebuild of
the document's layout tree.
This is pretty neat! :^)
This momentarily handles the CSS property "position: absolute;" in
combination with the properties "top" and "left", so that elements can
be placed anywhere on the page independently from their parents.
Statically positioned elements ignore absolute positioned elements when
calculating their position as they don't take up space.
We now support rAF, driven by GUI::DisplayLink callbacks. It's a bit
strange how we keep registering new callbacks over and over.
That's something we can definitely optimize.
This allows you to update animations/whatever without doing it more
often than the browser can display.
This makes it possible to write shorter CSS. Instead of writing
.foo {
border-width: 3px;
border-style: solid;
border-color: blue;
}
it is now possible to write
.foo {
border: 3px solid blue;
}
while the order of values is irrelevant.
Currently only the basic values are supported. More values should be
added in the future.
Three more value specific parse functions were added:
parse_line_width, parse_color, and parse_line_style
Additionally a few test cases were added to borders.html.
This patch adds HTMLCanvasElement along with a LayoutCanvas object.
The DOM and layout parts are very similar to <img> elements.
The <canvas> element holds a Gfx::Bitmap which is sized according to
the "width" and "height" attributes on the element.
Calling .getContext("2d") on a <canvas> element gives you a context
object that draws into the underlying Gfx::Bitmap of the <canvas>.
The context weakly points to the <canvas> which allows it to outlive
the canvas element if needed.
This is really quite cool. :^)
This patch adds the EventTarget class and makes Node inherit from it.
You can register event listeners on an EventTarget, and when you call
dispatch_event() on it, the event listeners will get invoked.
An event listener is basically a wrapper around a JS::Function*.
This is pretty far from how DOM events should eventually work, but it's
a place to start and we'll build more on top of this. :^)
This patch introduces the Wrapper and Wrappable classes.
Node now inherits from Wrappable, and can be wrapped in a GC-allocated
Bindings::NodeWrapper object. The only property we expose right now is
the very simple nodeName property.
When a Document's JS::Interpreter is first instantiated, we add a
"document" property with a DocumentWrapper object to the global object.
This is pretty cool! :^)
This patch begins integrating LibJS into LibWeb. Document holds the
JS::Interpreter for now, and it is created on demand when you first
call Document::interpreter().
We also add a simple "alert()" function to the global object.
This patch adds "submit" inputs and default (text box) inputs, as well
as form elements that can be submitted.
Layout of input elements is implemented via a new LayoutWidget class
that allows you to put an arbitrary GWidget in the layout tree.
At the moment, the DOM node sets the initial size of the LayoutWidget,
and then the positioning is done by the normal layout algorithm.
We also now support submitting a <form method="GET">, which does a full
replacing load with a URL based on the form's action + a query string
built from the name/value of input elements within the submitted form.
This is pretty neat! :^)
The borders still look very wrong with any border-width other than 1,
but at least we can see that they have the right color, and end up in
mostly the right place :^)
This patch adds a[foo] and a[foo=bar] attribute selectors.
Note that an attribute selector is an optional part of a selector
component, and not a component on its own.
In order for this to work nicely, I made the line box classes use float
instead of int for its geometry information.
Justification works by distributing all of the whitespace on the line
(including the trailing whitespace before the line break) evenly across
the spaces in-between words.
We should probably use floating point (or maybe fixed point?) for all
the layout metrics stuff. But one thing at a time. :^)
This patch implements basic support for <a href="#foo"> fragment links.
To figure out where we actually want to scroll to, we have to do
something different based on the layout node's box type. So if it's a
regular LayoutBox we can just use the LayoutBox::position().
However, if it's an inline layout node, we use the position of the
first line box fragment in the containing block contributed by this
layout node or one of its descendants.
It's now possible to set a page background image via <body background>.
Also, HtmlView now officially handles rendering the body element's
background (color, image or both.) LayoutBox is responsible for all
other background rendering.
Note that it's not yet possible to use CSS background-image properties
directly, since we can't parse them yet. :^)
This is currently very aggressive. Whenever the Document's hovered node
changes, we invalidate all style and do a full relayout.
It does look cool though. So cool that I'm adding it to the default
stylesheet. :^)
This patch adds the CharacterData subclass of Node, which is now the
parent class of Text and a new Comment class.
A Comment node is one of these in HTML: <!--hello friends-->
Since these occur somewhat frequently on the web, we need to be able
to parse them.
This patch also adds a child rejection mechanism to the DOM tree.
Nodes can now override is_child_allowed(Node) and return false if they
don't want a particular Node to become a child of theirs. This is used
to prevent Document from taking on unwanted children.
The <br> element will produce a special LayoutBreak node in the layout
tree, which forces a break in the line layout whenever encountered.
This patch also makes LayoutBlock use the current line-height as the
minimum effective height for each line box. This ensures that having
multiple <br> elements in a row doesn't create 0-height line boxes.
Just in time for Serenity's 1st birthday, here is the <blink> element!
This patch adds a bunch of different mechanisms to enable partial
repaints of the layout tree (LayoutNode::set_needs_display()))
It also adds LayoutNode::is_visible(), which can be toggled to prevent
a LayoutNode from rendering anything (it still takes up space though.)
This patch adds basic support for external stylesheets. It currently
only works with file:// URLs.
We do a synchronous full relayout after loading a stylesheet, which is
definitely on the aggressive side, but it gives us something to work
on improving. :^)
This patch adds the 17 color names from CSS2.1, as well as support for
the "#rgb" shorthand where each component is a hex digit that gets
multiplied by 17.
