picture

Hello, newbie here

Doing in html5 canvas, so JavaScript (was not sure where to post, but here I go...)

Above is a link to picture that I need to do. It is clock-like.
I will have to draw a circle, and two lines, from centre to according points on circle.
That is not a problem, the thing I can not do is
to fill upper and lower parts of circle that those two lines divide,
so upper part of a circle should be e.g. red, and lower blue.
(Plus, it would have to bi gradient, to look more appealing )

How would you recommend I go about it?
As newbie, example would be much appreciated.

Thank you.