module('apps.VisualizationExamples').requires('apps.ProtoVisInterface').toRun(function() {

ProtoVisDrawing.subclass('StackedChartsDiagram', {
	initialize: function($super, parent) {
		$super(parent);
		this.padding = new Rectangle(0, 0, 0, 0);
		this.bgColor = null;
		this.xScale = { type: pv.Scale.linear, minVal: 0, maxVal: 100, isFixed: true, format: Functions.K, ticks: 10 };
		this.yScale = { type: pv.Scale.linear, minVal: 0, maxVal: 100, isFixed: true, format: Functions.K, ticks: 10 };
	},

	draw: function(w, h) {
		w = w - this.padding.left() - this.padding.right(); 
		h = h - this.padding.top() - this.padding.bottom(); 

		// type: eg. pv.Scale.linear
		// minVal/maxVal: fixed value
		var x, y,
			self = this;
		if (this.xScale.isFixed)
			x = this.xScale.type(this.xScale.minVal, this.xScale.maxVal).range(0, w);
		else
			x = function() {
				return self.xScale.type(self.xScale.minVal(), self.xScale.maxVal()).range(0, w);
			};
		if (this.yScale.isFixed)
			y = this.yScale.type(this.yScale.minVal, this.yScale.maxVal).range(0, h);
		else
			y = function() {
				return self.yScale.type(self.yScale.minVal(), self.yScale.maxVal()).range(0, h);
			};

		this.drawingObjects['vis'] = (this.drawingObjects['vis'] || new pv.Panel())
			.width(w)
			.height(h)
			.top(this.padding.top())
			.bottom(this.padding.bottom())
			.left(this.padding.left())
			.right(this.padding.right())
			.fillStyle(this.bgColor);

		this.drawingObjects['graphPanel'] =  (this.drawingObjects['graphPanel'] || this.drawingObjects['vis'].add(pv.Panel))
			.top(0)
			.height(h);

		this.drawingObjects['xRule'] = (this.drawingObjects['xRule'] || this.drawingObjects['graphPanel'].add(pv.Rule))
			.bottom(-5)
			.height(5);
		if (this.xScale.isFixed) {
			this.drawingObjects['xRule']
				.data(x.ticks(this.xScale.ticks))
				.left(x);
		} else {
			this.drawingObjects['xRule']
				.def('xScale', x)
				.data(function() { return this.xScale().ticks(self.xScale.ticks); })
				.left(function(v) { return this.xScale()(v); });
		}

		this.drawingObjects['xRuleLabel'] = (this.drawingObjects['xRuleLabel'] || this.drawingObjects['xRule'].anchor('bottom').add(pv.Label))
			.text(this.xScale.format);

		this.drawingObjects['yRule'] = (this.drawingObjects['yRule'] || this.drawingObjects['graphPanel'].add(pv.Rule))
			.data(y.ticks(this.yScale.ticks))
			.bottom(y)
			.strokeStyle(function(d) { return (d ? "rgba(128,128,128,.2)" : "#000"); });

		this.drawingObjects['yRuleLabel'] = (this.drawingObjects['yRuleLabel'] || this.drawingObjects['yRule'].anchor('left').add(pv.Label))
			.text(this.yScale.format);

/*
		this.drawingObjects['graph'] = (this.drawingObjects['graph'] || this.drawingObjects['graphPanel'].add(pv.Layout.Stack))
			.layers(function() {
			})
			.x()
			.y();
		this.drawingObjects['graph'].layer.add(pv.Area);
*/

		return this.drawingObjects['vis'];
	},

	setPadding: function(rect) {
		this.padding = rect;
	},

	setFill: function(color) {
		this.bgColor = color;
	},

	setXFixedScale: function(type, minX, maxX) {
		this.setFixedScale(this.xScale, type, minX, maxX);
	},

	setYFixedScale: function(type, minY, maxY) {
		this.setFixedScale(this.yScale, type, minY, maxY);
	},

	setFixedScale: function(scale, type, min, max) {
		scale.isFixed = true;
		switch (type) {
		case ProtoVisDrawing.LOG:
			scale.type = pv.Scale.log;
			break;
		case ProtoVisDrawing.LINEAR:
		default:
			scale.type = pv.Scale.linear;
			break;
		}
		if (min) scale.minVal = min;
		if (max) scale.maxVal = max;
	},

	setDynamicXScale: function(type, min, max) {
		this.setDynamicScale(this.xScale, type, min, max);
	},

	setDynamicScale: function(scale, type, min, max) {
		scale.isFixed = false;
		switch (type) {
		case ProtoVisDrawing.LOG:
			scale.type = pv.Scale.log;
			break;
		case ProtoVisDrawing.LINEAR:
		default:
			scale.type = pv.Scale.linear;
			break;
		}
		if (min) scale.minVal = min;
		if (max) scale.maxVal = max;
	},

	setXTicks: function(ticks) {
		this.xScale.ticks = ticks;
	},

	setYTicks: function(ticks) {
		this.yScale.ticks = ticks;
	},

	setXFormat: function(format) {
		this.xScale.format = format;
	},

	setYFormat: function(format) {
		this.yScale.format = format;
	},
});

}) // end of module