// Renderer file for the Staff Appointment demo

blueGrad = Gradient(Point(0,0), Color(200,210,230),
	Point(100,0), Color(100,120,150), false, GradientUnits.PERCENT);

redGrad = Gradient(Point(0,0), Color(230,200,210),
	Point(100,0), Color(150,100,120), false, GradientUnits.PERCENT);

gray = Color(100,100,100);
font12 = Font('dialog', FontStyle.BOLD_ITALIC, 12);
font10 = Font('dialog', FontStyle.PLAIN, 10);

// First pass for the chart frames, interval lines and annotations. They
// can be in any order.

Pass({
  content: List({ 
    id: 'Annotation',
    content: [

  // Chart Titles

    Text({
	text: '@chartTitle',
	alignment: Alignment.BASELINE_LEFT,
	offset: Point(-40, -6),
	fill: Color(80,90,130),
	font: font12,
    }),

  // Staff names

    Text({
	text: '@resourceName',
	alignment: Alignment.BASELINE_RIGHT,
	offset: Point(-4, 0),
	fill: gray,
	font: font10,
    }),

  // Hours

    Text({
	text: '@intervalLabel',
	alignment: Alignment.NORTH,
	offset: Point(0, 2),
	fill: gray,
	font: font10,
    }),

  // Frames

    Shape({
	shape: '@chartFrame',
	position: ORIGIN,
	outline: Color(140,140,140),
	fill: Color(245,245,245),
    }),

  // Hour lines

    Shape({
	shape: '@intervalLines',
	position: ORIGIN,
	outline: Color(210,210,210),
	fill: null,
    }),

  ]})  // List
})  // Pass


// Second pass for the appointments. resourceRectangle is a property
// of ResourceElement.

Pass({

  content: Shape({
	id: 'Appointment',
	shape: '@resourceRectangle',
	fill: {
	    selector: '@selected',
	    'false': blueGrad,
	    'true':  redGrad,
	},
    }),

})  // Pass