encoder.html 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114
  1. <html class="reftest-wait">
  2. <head>
  3. <title>Image reftest wrapper</title>
  4. <link rel="stylesheet" href="ImageDocument.css">
  5. <style type="text/css">
  6. #image_from_encoder { background-color: rgb(10, 100, 250); }
  7. </style>
  8. <script>
  9. // Parse out the URL command line params
  10. // Valid options are:
  11. // - img=<reference image to use>
  12. // - mime=<mime type>
  13. // - options=<canvas toDataURL encoder options>
  14. // Example:
  15. // encoder.html?img=escape(reference_image.png)
  16. // &mime=escape(image/ico)
  17. // &options=escape(-moz-parse-options:bpp=24;format=png)
  18. var getVars = {};
  19. function buildValue(sValue)
  20. {
  21. if (/^\s*$/.test(sValue)) {
  22. return null;
  23. }
  24. if (/^(true|false)$/i.test(sValue)) {
  25. return sValue.toLowerCase() === "true";
  26. }
  27. if (isFinite(sValue)) {
  28. return parseFloat(sValue);
  29. }
  30. if (isFinite(Date.parse(sValue))) {
  31. return new Date(sValue);
  32. }
  33. return sValue;
  34. }
  35. if (window.location.search.length > 1) {
  36. var couple, couples = window.location.search.substr(1).split("&");
  37. for (var couplId = 0; couplId < couples.length; couplId++) {
  38. couple = couples[couplId].split("=");
  39. getVars[unescape(couple[0])] = couple.length > 1 ?
  40. buildValue(unescape(couple[1])) : null;
  41. }
  42. }
  43. // Create the image that we will load the reference image to
  44. var img = new Image();
  45. // Create the canvas that we will draw the image img onto and
  46. // eventually call toDataURL to invoke the encoder on
  47. var canvas = document.createElement("canvas");
  48. // Starts the test by loading the reference image
  49. function runTest()
  50. {
  51. // Load the reference image to start the test
  52. img.onload = onReferenceImageLoad;
  53. img.onerror = onReferenceImageLoad;
  54. img.src = getVars.img;
  55. }
  56. // Once the encoded image from the canvas is loaded we can
  57. // let the reftest compare
  58. function onEncodedImageLoad()
  59. {
  60. document.documentElement.removeAttribute("class");
  61. }
  62. // Once the image loads async, we then draw the image onto the canvas,
  63. // and call canvas.toDataURL to invoke the encoder, and then set a new
  64. // image to the encoded data URL
  65. function onReferenceImageLoad()
  66. {
  67. // mimeType will hold the mime type of which encoder to invoke
  68. var mimeType = getVars.mime;
  69. // parseOptions will hold the encoder options to use
  70. var parseOptions = getVars.options;
  71. // Obtain the canvas and draw the reference image
  72. canvas.width = img.width;
  73. canvas.height = img.height;
  74. var ctx = canvas.getContext('2d')
  75. ctx.drawImage(img, 0, 0);
  76. // Obtain the data URL with parsing options if specified
  77. var dataURL;
  78. if (parseOptions)
  79. dataURL = canvas.toDataURL(mimeType, parseOptions);
  80. else
  81. dataURL = canvas.toDataURL(mimeType);
  82. // Setup async image loaded events
  83. var image_from_encoder = document.getElementById('image_from_encoder');
  84. image_from_encoder.onload = onEncodedImageLoad;
  85. image_from_encoder.onerror = onEncodedImageLoad;
  86. // Only set the image if we have the correct mime type
  87. // because we want to fail the ref test if toDataURL fell
  88. // back to image/png
  89. if (dataURL.substring(0, mimeType.length+5) == "data:" + mimeType) {
  90. // Set the image to the BMP data URL
  91. image_from_encoder.src = dataURL;
  92. } else {
  93. // Blank image so that we won't have to timeout the reftest
  94. image_from_encoder.src = "data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw%3D%3D";
  95. }
  96. };
  97. </script>
  98. </head>
  99. <body onload="runTest()">
  100. <img id="image_from_encoder">
  101. </body>
  102. </html>