// JavaScript renderer file for the Project demo

projectRect = Rectangle(0.5, 0.5, 60, 24, 6, 6);
projectRectSel = Rectangle(-5.5, -3.5, 72, 30, 8, 8);
statusDot = Polygon([ 0,-2, 7,-2, 3.5,8, ]);


headerColor = Gradient(Point(0,6), Color(100,108,150),
	Point(0,20), Color(90,95,120), true, GradientUnits.USER);

textBlue = Color(100,100,130);
textDark = Color(70,75,100);

greenOutline = Color(160,180,160);
greenGrad = Gradient(Point(0,0), Color(160,180,160),
	Point(0,20), Color(255,252,250), false, GradientUnits.USER);

redOutline = Color(185,160,185),
redGrad = Gradient(Point(0,0), Color(185,160,185),
	Point(0,20), Color(255,252,250), false, GradientUnits.USER);

blueOutline = Color(165,175,190);
blueGrad = Gradient(Point(0,0), Color(165,175,190),
	Point(0,20), Color(255,252,250), false, GradientUnits.USER);

statusGreen = Color(20,170,20);
statusRed = Color(255,69,0);


Pass({
  content:

    Class({
	content: {

	  // Headers

	  'null': List({
	      id:'Header',
	      content: [

	    Shape({
		shape: Rectangle(-10, 0, 520, 20, 4, 4),
		fill: headerColor,
	    }),

	    Text({
		text: '@priority',
		offset: Point(0, 10),
		alignment: Alignment.WEST,
		font: Font('Dialog', FontStyle.BOLD_ITALIC, 12),
		fill: java.awt.Color.white,
	    }),
	  ] }),  // null


	  // Jobs

	  'project.Job': List({
	      id:'Job',
	      content: [

	    Shape({
	        id: 'project',
		shape: {
		    selector: '@selected',
		    'false': projectRect,
		    'true': projectRectSel,
		},
		fill: {
		    selector: '@jobType',
		    converter: 'project.Job$JobTypeConverter',
		    INSTALLATION: greenGrad,
		    OVERHAUL: redGrad,
		    REPAIR: blueGrad,
		},
		outline: {
		    selector: '@jobType',
		    converter: 'project.Job$JobTypeConverter',
		    INSTALLATION: greenOutline,
		    OVERHAUL: redOutline,
		    REPAIR: blueOutline,
	 	},
	    }),

	    Shape({
		shape: statusDot,
		position: BoundsPosition('project', Alignment.NORTH_EAST),
		offset: Point(-10,4),
		fill: {
		    selector: '@status',
		    converter: 'project.Job$StatusConverter',
		    WAITING: statusRed,
		    READY: statusGreen,
		},
	    }),

	    Text({
		text: '@jobID',
		offset: Point(30, 13),
		alignment: Alignment.CENTER,
		font: {
		    selector: '@selected',
		    'false': Font('Dialog', FontStyle.BOLD, 12),
		    'true':  Font('Dialog', FontStyle.BOLD, 12),
		},
		fill: {
		    selector: '@selected',
		    'false': textBlue,
		    'true': textDark,
		},
	    }),

	  ] }) // project.Job

	}  // Class.content
    }),  // Class

})  // Pass