<!DOCTYPE html>
<html>
<body>

<script src="../../resources/js-test.js"></script>
<canvas id="source"></canvas>

<script>

description("Tests for the imageSmoothingQuality attribute.");

if (window.internals)
  internals.settings.setCanvasUsesAcceleratedDrawing(false);

var source = document.getElementById("source");
source.width = 60;
source.height = 12;
var sourceContext = source.getContext("2d");
var sourceImage = sourceContext.createImageData(source.width, source.height);

function drawBlackDot(x, y) {
    var offset = y * 4 * source.width + x * 4;
    sourceImage.data[offset + 0] = 0; // R
    sourceImage.data[offset + 1] = 0; // G
    sourceImage.data[offset + 2] = 0; // B
    sourceImage.data[offset + 3] = 255; // Alpha
}

for (var x = 0; x < source.width; x++) {
    drawBlackDot(x, 1)
    drawBlackDot(x, 2);
}

sourceContext.putImageData(sourceImage, 0, 0);

function scaleTestResults(quality){
	var canvas = document.createElement("canvas");
	canvas.id = quality + "Canvas";
	document.body.appendChild(canvas);
	canvas.width = sourceImage.width / 4;
    canvas.height = sourceImage.height / 4;
    return scaleImageData(canvas, quality);
}

function scaleImageData(destinationCanvas, quality) {
    var context = destinationCanvas.getContext("2d");

    if (quality)
        context.imageSmoothingQuality = quality;

    context.drawImage(source, 0, 0, destinationCanvas.width, destinationCanvas.height);
    var data = context.getImageData(0, 0, 1, 1).data;
    context.clearRect(0, 0, destinationCanvas.width, destinationCanvas.height);
    return JSON.stringify(data);
}

function testInvalidInput(badInput){
	shouldNotThrow(badInput);
	shouldBe("highContext.imageSmoothingQuality", "'high'");
}

function sampleAlpha(data){
	return data[3];
}

debug("");

var lowData = scaleTestResults("low");
var lowContext = document.getElementById("lowCanvas").getContext('2d');
shouldBe("lowContext.imageSmoothingQuality", "'low'");

var mediumData = scaleTestResults("medium");
var mediumContext = document.getElementById("mediumCanvas").getContext('2d');
shouldBe("mediumContext.imageSmoothingQuality", "'medium'");

var highData = scaleTestResults("high");
var highContext = document.getElementById("highCanvas").getContext('2d');
shouldBe("highContext.imageSmoothingQuality", "'high'");

debug("");
shouldNotBe("lowData", "mediumData");
shouldNotBe("mediumData", "highData");
shouldNotBe("lowData", "highData");

debug("");
shouldBeGreaterThanOrEqual("sampleAlpha(lowData)", "sampleAlpha(mediumData)");
shouldBeGreaterThanOrEqual("sampleAlpha(mediumData)", "sampleAlpha(highData)");

debug("");
var defaultContext = sourceContext;
shouldBe("defaultContext.imageSmoothingQuality", "'low'");

debug("");
shouldBe("highContext.imageSmoothingEnabled = false; highContext.imageSmoothingQuality", "'high'");
shouldBe("highContext.imageSmoothingQuality = 'medium'; highContext.imageSmoothingQuality", "'medium'");

debug("");
evalAndLog("highContext.imageSmoothingEnabled = true; highContext.imageSmoothingQuality = 'high';");
var highCanvas = document.getElementById("highCanvas");
testInvalidInput("scaleImageData(highCanvas, '3223')");
testInvalidInput("scaleImageData(highCanvas, 'bad_input')");
testInvalidInput("scaleImageData(highCanvas, 'LOW')");
testInvalidInput("scaleImageData(highCanvas, 'Medium')");

debug("");
evalAndLog("highContext.save(); highContext.imageSmoothingQuality = 'medium';");
shouldBe("highContext.restore(); highContext.imageSmoothingQuality", "'high'");
shouldBe("scaleImageData(highCanvas, highCanvas.imageSmoothingQuality);", "highData");

debug("");

</script>
</body>
</html>
