Source: stackblur.js

  1. /**
  2. * StackBlur - a fast almost Gaussian Blur For Canvas
  3. *
  4. * In case you find this class useful - especially in commercial projects -
  5. * I am not totally unhappy for a small donation to my PayPal account
  6. * mario@quasimondo.de
  7. *
  8. * Or support me on flattr:
  9. * {@link https://flattr.com/thing/72791/StackBlur-a-fast-almost-Gaussian-Blur-Effect-for-CanvasJavascript}
  10. * @module StackBlur
  11. * @version 0.5
  12. * @author Mario Klingemann
  13. * Contact: mario@quasimondo.com
  14. * Website: {@link http://www.quasimondo.com/StackBlurForCanvas/StackBlurDemo.html}
  15. * Twitter: @quasimondo
  16. *
  17. * @copyright (c) 2010 Mario Klingemann
  18. *
  19. * Permission is hereby granted, free of charge, to any person
  20. * obtaining a copy of this software and associated documentation
  21. * files (the "Software"), to deal in the Software without
  22. * restriction, including without limitation the rights to use,
  23. * copy, modify, merge, publish, distribute, sublicense, and/or sell
  24. * copies of the Software, and to permit persons to whom the
  25. * Software is furnished to do so, subject to the following
  26. * conditions:
  27. *
  28. * The above copyright notice and this permission notice shall be
  29. * included in all copies or substantial portions of the Software.
  30. *
  31. * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
  32. * EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
  33. * OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
  34. * NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
  35. * HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
  36. * WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
  37. * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
  38. * OTHER DEALINGS IN THE SOFTWARE.
  39. */
  41. const mulTable = [
  42.     512, 512, 456, 512, 328, 456, 335, 512, 405, 328, 271, 456, 388, 335, 292, 512,
  43.     454, 405, 364, 328, 298, 271, 496, 456, 420, 388, 360, 335, 312, 292, 273, 512,
  44.     482, 454, 428, 405, 383, 364, 345, 328, 312, 298, 284, 271, 259, 496, 475, 456,
  45.     437, 420, 404, 388, 374, 360, 347, 335, 323, 312, 302, 292, 282, 273, 265, 512,
  46.     497, 482, 468, 454, 441, 428, 417, 405, 394, 383, 373, 364, 354, 345, 337, 328,
  47.     320, 312, 305, 298, 291, 284, 278, 271, 265, 259, 507, 496, 485, 475, 465, 456,
  48.     446, 437, 428, 420, 412, 404, 396, 388, 381, 374, 367, 360, 354, 347, 341, 335,
  49.     329, 323, 318, 312, 307, 302, 297, 292, 287, 282, 278, 273, 269, 265, 261, 512,
  50.     505, 497, 489, 482, 475, 468, 461, 454, 447, 441, 435, 428, 422, 417, 411, 405,
  51.     399, 394, 389, 383, 378, 373, 368, 364, 359, 354, 350, 345, 341, 337, 332, 328,
  52.     324, 320, 316, 312, 309, 305, 301, 298, 294, 291, 287, 284, 281, 278, 274, 271,
  53.     268, 265, 262, 259, 257, 507, 501, 496, 491, 485, 480, 475, 470, 465, 460, 456,
  54.     451, 446, 442, 437, 433, 428, 424, 420, 416, 412, 408, 404, 400, 396, 392, 388,
  55.     385, 381, 377, 374, 370, 367, 363, 360, 357, 354, 350, 347, 344, 341, 338, 335,
  56.     332, 329, 326, 323, 320, 318, 315, 312, 310, 307, 304, 302, 299, 297, 294, 292,
  57.     289, 287, 285, 282, 280, 278, 275, 273, 271, 269, 267, 265, 263, 261, 259];
  59. const shgTable = [
  60.     9, 11, 12, 13, 13, 14, 14, 15, 15, 15, 15, 16, 16, 16, 16, 17,
  61.     17, 17, 17, 17, 17, 17, 18, 18, 18, 18, 18, 18, 18, 18, 18, 19,
  62.     19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 19, 20, 20, 20,
  63.     20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 20, 21,
  64.     21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 21,
  65.     21, 21, 21, 21, 21, 21, 21, 21, 21, 21, 22, 22, 22, 22, 22, 22,
  66.     22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22,
  67.     22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 22, 23,
  68.     23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23,
  69.     23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23,
  70.     23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23, 23,
  71.     23, 23, 23, 23, 23, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24,
  72.     24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24,
  73.     24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24,
  74.     24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24,
  75.     24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24, 24];
  77. /**
  78.  * @param {string|HTMLImageElement} img
  79.  * @param {string|HTMLCanvasElement} canvas
  80.  * @param {Float} radius
  81.  * @param {boolean} blurAlphaChannel
  82.  * @returns {undefined}
  83.  */
  84. function processImage (img, canvas, radius, blurAlphaChannel) {
  85.     if (typeof img === 'string') {
  86.         img = document.getElementById(img);
  87.     }
  88.     if (!img || !('naturalWidth' in img)) {
  89.         return;
  90.     }
  91.     const w = img.naturalWidth;
  92.     const h = img.naturalHeight;
  94.     if (typeof canvas === 'string') {
  95.         canvas = document.getElementById(canvas);
  96.     }
  97.     if (!canvas || !('getContext' in canvas)) {
  98.         return;
  99.     }
  101.     canvas.style.width = w + 'px';
  102.     canvas.style.height = h + 'px';
  103.     canvas.width = w;
  104.     canvas.height = h;
  106.     const context = canvas.getContext('2d');
  107.     context.clearRect(0, 0, w, h);
  108.     context.drawImage(img, 0, 0);
  110.     if (isNaN(radius) || radius < 1) { return; }
  112.     if (blurAlphaChannel) {
  113.         processCanvasRGBA(canvas, 0, 0, w, h, radius);
  114.     } else {
  115.         processCanvasRGB(canvas, 0, 0, w, h, radius);
  116.     }
  117. }
  119. /**
  120.  * @param {string|HTMLCanvasElement} canvas
  121.  * @param {Integer} topX
  122.  * @param {Integer} topY
  123.  * @param {Integer} width
  124.  * @param {Integer} height
  125.  * @throws {Error|TypeError}
  126.  * @returns {ImageData} See {@link https://html.spec.whatwg.org/multipage/canvas.html#imagedata}
  127.  */
  128. function getImageDataFromCanvas (canvas, topX, topY, width, height) {
  129.     if (typeof canvas === 'string') {
  130.         canvas = document.getElementById(canvas);
  131.     }
  132.     if (!canvas || typeof canvas !== 'object' || !('getContext' in canvas)) {
  133.         throw new TypeError('Expecting canvas with `getContext` method in processCanvasRGB(A) calls!');
  134.     }
  136.     const context = canvas.getContext('2d');
  138.     try {
  139.         return context.getImageData(topX, topY, width, height);
  140.     } catch (e) {
  141.         throw new Error('unable to access image data: ' + e);
  142.     }
  143. }
  145. /**
  146.  * @param {HTMLCanvasElement} canvas
  147.  * @param {Integer} topX
  148.  * @param {Integer} topY
  149.  * @param {Integer} width
  150.  * @param {Integer} height
  151.  * @param {Float} radius
  152.  * @returns {undefined}
  153.  */
  154. function processCanvasRGBA (canvas, topX, topY, width, height, radius) {
  155.     if (isNaN(radius) || radius < 1) { return; }
  156.     radius |= 0;
  158.     let imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
  160.     imageData = processImageDataRGBA(imageData, topX, topY, width, height, radius);
  162.     canvas.getContext('2d').putImageData(imageData, topX, topY);
  163. }
  165. /**
  166.  * @param {ImageData} imageData
  167.  * @param {Integer} topX
  168.  * @param {Integer} topY
  169.  * @param {Integer} width
  170.  * @param {Integer} height
  171.  * @param {Float} radius
  172.  * @returns {ImageData}
  173.  */
  174. function processImageDataRGBA (imageData, topX, topY, width, height, radius) {
  175.     const pixels = imageData.data;
  177.     let x, y, i, p, yp, yi, yw, rSum, gSum, bSum, aSum,
  178.         rOutSum, gOutSum, bOutSum, aOutSum,
  179.         rInSum, gInSum, bInSum, aInSum,
  180.         pr, pg, pb, pa, rbs;
  182.     const div = 2 * radius + 1;
  183.     // const w4 = width << 2;
  184.     const widthMinus1 = width - 1;
  185.     const heightMinus1 = height - 1;
  186.     const radiusPlus1 = radius + 1;
  187.     const sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
  189.     const stackStart = new BlurStack();
  190.     let stack = stackStart;
  191.     let stackEnd;
  192.     for (i = 1; i < div; i++) {
  193.         stack = stack.next = new BlurStack();
  194.         if (i === radiusPlus1) {
  195.             stackEnd = stack;
  196.         }
  197.     }
  198.     stack.next = stackStart;
  199.     let stackIn = null;
  200.     let stackOut = null;
  202.     yw = yi = 0;
  204.     const mulSum = mulTable[radius];
  205.     const shgSum = shgTable[radius];
  207.     for (y = 0; y < height; y++) {
  208.         rInSum = gInSum = bInSum = aInSum = rSum = gSum = bSum = aSum = 0;
  210.         rOutSum = radiusPlus1 * (pr = pixels[yi]);
  211.         gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
  212.         bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
  213.         aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
  215.         rSum += sumFactor * pr;
  216.         gSum += sumFactor * pg;
  217.         bSum += sumFactor * pb;
  218.         aSum += sumFactor * pa;
  220.         stack = stackStart;
  222.         for (i = 0; i < radiusPlus1; i++) {
  223.             stack.r = pr;
  224.             stack.g = pg;
  225.             stack.b = pb;
  226.             stack.a = pa;
  227.             stack = stack.next;
  228.         }
  230.         for (i = 1; i < radiusPlus1; i++) {
  231.             p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
  232.             rSum += (stack.r = (pr = pixels[p])) * (rbs = radiusPlus1 - i);
  233.             gSum += (stack.g = (pg = pixels[p + 1])) * rbs;
  234.             bSum += (stack.b = (pb = pixels[p + 2])) * rbs;
  235.             aSum += (stack.a = (pa = pixels[p + 3])) * rbs;
  237.             rInSum += pr;
  238.             gInSum += pg;
  239.             bInSum += pb;
  240.             aInSum += pa;
  242.             stack = stack.next;
  243.         }
  245.         stackIn = stackStart;
  246.         stackOut = stackEnd;
  247.         for (x = 0; x < width; x++) {
  248.             pixels[yi + 3] = pa = (aSum * mulSum) >> shgSum;
  249.             if (pa !== 0) {
  250.                 pa = 255 / pa;
  251.                 pixels[yi] = ((rSum * mulSum) >> shgSum) * pa;
  252.                 pixels[yi + 1] = ((gSum * mulSum) >> shgSum) * pa;
  253.                 pixels[yi + 2] = ((bSum * mulSum) >> shgSum) * pa;
  254.             } else {
  255.                 pixels[yi] = pixels[yi + 1] = pixels[yi + 2] = 0;
  256.             }
  258.             rSum -= rOutSum;
  259.             gSum -= gOutSum;
  260.             bSum -= bOutSum;
  261.             aSum -= aOutSum;
  263.             rOutSum -= stackIn.r;
  264.             gOutSum -= stackIn.g;
  265.             bOutSum -= stackIn.b;
  266.             aOutSum -= stackIn.a;
  268.             p = (yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1)) << 2;
  270.             rInSum += (stackIn.r = pixels[p]);
  271.             gInSum += (stackIn.g = pixels[p + 1]);
  272.             bInSum += (stackIn.b = pixels[p + 2]);
  273.             aInSum += (stackIn.a = pixels[p + 3]);
  275.             rSum += rInSum;
  276.             gSum += gInSum;
  277.             bSum += bInSum;
  278.             aSum += aInSum;
  280.             stackIn = stackIn.next;
  282.             rOutSum += (pr = stackOut.r);
  283.             gOutSum += (pg = stackOut.g);
  284.             bOutSum += (pb = stackOut.b);
  285.             aOutSum += (pa = stackOut.a);
  287.             rInSum -= pr;
  288.             gInSum -= pg;
  289.             bInSum -= pb;
  290.             aInSum -= pa;
  292.             stackOut = stackOut.next;
  294.             yi += 4;
  295.         }
  296.         yw += width;
  297.     }
  299.     for (x = 0; x < width; x++) {
  300.         gInSum = bInSum = aInSum = rInSum = gSum = bSum = aSum = rSum = 0;
  302.         yi = x << 2;
  303.         rOutSum = radiusPlus1 * (pr = pixels[yi]);
  304.         gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
  305.         bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
  306.         aOutSum = radiusPlus1 * (pa = pixels[yi + 3]);
  308.         rSum += sumFactor * pr;
  309.         gSum += sumFactor * pg;
  310.         bSum += sumFactor * pb;
  311.         aSum += sumFactor * pa;
  313.         stack = stackStart;
  315.         for (i = 0; i < radiusPlus1; i++) {
  316.             stack.r = pr;
  317.             stack.g = pg;
  318.             stack.b = pb;
  319.             stack.a = pa;
  320.             stack = stack.next;
  321.         }
  323.         yp = width;
  325.         for (i = 1; i <= radius; i++) {
  326.             yi = (yp + x) << 2;
  328.             rSum += (stack.r = (pr = pixels[yi])) * (rbs = radiusPlus1 - i);
  329.             gSum += (stack.g = (pg = pixels[yi + 1])) * rbs;
  330.             bSum += (stack.b = (pb = pixels[yi + 2])) * rbs;
  331.             aSum += (stack.a = (pa = pixels[yi + 3])) * rbs;
  333.             rInSum += pr;
  334.             gInSum += pg;
  335.             bInSum += pb;
  336.             aInSum += pa;
  338.             stack = stack.next;
  340.             if (i < heightMinus1) {
  341.                 yp += width;
  342.             }
  343.         }
  345.         yi = x;
  346.         stackIn = stackStart;
  347.         stackOut = stackEnd;
  348.         for (y = 0; y < height; y++) {
  349.             p = yi << 2;
  350.             pixels[p + 3] = pa = (aSum * mulSum) >> shgSum;
  351.             if (pa > 0) {
  352.                 pa = 255 / pa;
  353.                 pixels[p] = ((rSum * mulSum) >> shgSum) * pa;
  354.                 pixels[p + 1] = ((gSum * mulSum) >> shgSum) * pa;
  355.                 pixels[p + 2] = ((bSum * mulSum) >> shgSum) * pa;
  356.             } else {
  357.                 pixels[p] = pixels[p + 1] = pixels[p + 2] = 0;
  358.             }
  360.             rSum -= rOutSum;
  361.             gSum -= gOutSum;
  362.             bSum -= bOutSum;
  363.             aSum -= aOutSum;
  365.             rOutSum -= stackIn.r;
  366.             gOutSum -= stackIn.g;
  367.             bOutSum -= stackIn.b;
  368.             aOutSum -= stackIn.a;
  370.             p = (x + (((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width)) << 2;
  372.             rSum += (rInSum += (stackIn.r = pixels[p]));
  373.             gSum += (gInSum += (stackIn.g = pixels[p + 1]));
  374.             bSum += (bInSum += (stackIn.b = pixels[p + 2]));
  375.             aSum += (aInSum += (stackIn.a = pixels[p + 3]));
  377.             stackIn = stackIn.next;
  379.             rOutSum += (pr = stackOut.r);
  380.             gOutSum += (pg = stackOut.g);
  381.             bOutSum += (pb = stackOut.b);
  382.             aOutSum += (pa = stackOut.a);
  384.             rInSum -= pr;
  385.             gInSum -= pg;
  386.             bInSum -= pb;
  387.             aInSum -= pa;
  389.             stackOut = stackOut.next;
  391.             yi += width;
  392.         }
  393.     }
  394.     return imageData;
  395. }
  397. /**
  398.  * @param {HTMLCanvasElement} canvas
  399.  * @param {Integer} topX
  400.  * @param {Integer} topY
  401.  * @param {Integer} width
  402.  * @param {Integer} height
  403.  * @param {Float} radius
  404.  * @returns {undefined}
  405.  */
  406. function processCanvasRGB (canvas, topX, topY, width, height, radius) {
  407.     if (isNaN(radius) || radius < 1) { return; }
  408.     radius |= 0;
  410.     let imageData = getImageDataFromCanvas(canvas, topX, topY, width, height);
  411.     imageData = processImageDataRGB(imageData, topX, topY, width, height, radius);
  413.     canvas.getContext('2d').putImageData(imageData, topX, topY);
  414. }
  416. /**
  417.  * @param {ImageData} imageData
  418.  * @param {Integer} topX
  419.  * @param {Integer} topY
  420.  * @param {Integer} width
  421.  * @param {Integer} height
  422.  * @param {Float} radius
  423.  * @returns {ImageData}
  424.  */
  425. function processImageDataRGB (imageData, topX, topY, width, height, radius) {
  426.     const pixels = imageData.data;
  428.     let x, y, i, p, yp, yi, yw, rSum, gSum, bSum,
  429.         rOutSum, gOutSum, bOutSum,
  430.         rInSum, gInSum, bInSum,
  431.         pr, pg, pb, rbs;
  433.     const div = 2 * radius + 1;
  434.     // const w4 = width << 2;
  435.     const widthMinus1 = width - 1;
  436.     const heightMinus1 = height - 1;
  437.     const radiusPlus1 = radius + 1;
  438.     const sumFactor = radiusPlus1 * (radiusPlus1 + 1) / 2;
  440.     const stackStart = new BlurStack();
  441.     let stack = stackStart;
  442.     let stackEnd;
  443.     for (i = 1; i < div; i++) {
  444.         stack = stack.next = new BlurStack();
  445.         if (i === radiusPlus1) {
  446.             stackEnd = stack;
  447.         }
  448.     }
  449.     stack.next = stackStart;
  450.     let stackIn = null;
  451.     let stackOut = null;
  453.     yw = yi = 0;
  455.     const mulSum = mulTable[radius];
  456.     const shgSum = shgTable[radius];
  458.     for (y = 0; y < height; y++) {
  459.         rInSum = gInSum = bInSum = rSum = gSum = bSum = 0;
  461.         rOutSum = radiusPlus1 * (pr = pixels[yi]);
  462.         gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
  463.         bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
  465.         rSum += sumFactor * pr;
  466.         gSum += sumFactor * pg;
  467.         bSum += sumFactor * pb;
  469.         stack = stackStart;
  471.         for (i = 0; i < radiusPlus1; i++) {
  472.             stack.r = pr;
  473.             stack.g = pg;
  474.             stack.b = pb;
  475.             stack = stack.next;
  476.         }
  478.         for (i = 1; i < radiusPlus1; i++) {
  479.             p = yi + ((widthMinus1 < i ? widthMinus1 : i) << 2);
  480.             rSum += (stack.r = (pr = pixels[p])) * (rbs = radiusPlus1 - i);
  481.             gSum += (stack.g = (pg = pixels[p + 1])) * rbs;
  482.             bSum += (stack.b = (pb = pixels[p + 2])) * rbs;
  484.             rInSum += pr;
  485.             gInSum += pg;
  486.             bInSum += pb;
  488.             stack = stack.next;
  489.         }
  491.         stackIn = stackStart;
  492.         stackOut = stackEnd;
  493.         for (x = 0; x < width; x++) {
  494.             pixels[yi] = (rSum * mulSum) >> shgSum;
  495.             pixels[yi + 1] = (gSum * mulSum) >> shgSum;
  496.             pixels[yi + 2] = (bSum * mulSum) >> shgSum;
  498.             rSum -= rOutSum;
  499.             gSum -= gOutSum;
  500.             bSum -= bOutSum;
  502.             rOutSum -= stackIn.r;
  503.             gOutSum -= stackIn.g;
  504.             bOutSum -= stackIn.b;
  506.             p = (yw + ((p = x + radius + 1) < widthMinus1 ? p : widthMinus1)) << 2;
  508.             rInSum += (stackIn.r = pixels[p]);
  509.             gInSum += (stackIn.g = pixels[p + 1]);
  510.             bInSum += (stackIn.b = pixels[p + 2]);
  512.             rSum += rInSum;
  513.             gSum += gInSum;
  514.             bSum += bInSum;
  516.             stackIn = stackIn.next;
  518.             rOutSum += (pr = stackOut.r);
  519.             gOutSum += (pg = stackOut.g);
  520.             bOutSum += (pb = stackOut.b);
  522.             rInSum -= pr;
  523.             gInSum -= pg;
  524.             bInSum -= pb;
  526.             stackOut = stackOut.next;
  528.             yi += 4;
  529.         }
  530.         yw += width;
  531.     }
  533.     for (x = 0; x < width; x++) {
  534.         gInSum = bInSum = rInSum = gSum = bSum = rSum = 0;
  536.         yi = x << 2;
  537.         rOutSum = radiusPlus1 * (pr = pixels[yi]);
  538.         gOutSum = radiusPlus1 * (pg = pixels[yi + 1]);
  539.         bOutSum = radiusPlus1 * (pb = pixels[yi + 2]);
  541.         rSum += sumFactor * pr;
  542.         gSum += sumFactor * pg;
  543.         bSum += sumFactor * pb;
  545.         stack = stackStart;
  547.         for (i = 0; i < radiusPlus1; i++) {
  548.             stack.r = pr;
  549.             stack.g = pg;
  550.             stack.b = pb;
  551.             stack = stack.next;
  552.         }
  554.         yp = width;
  556.         for (i = 1; i <= radius; i++) {
  557.             yi = (yp + x) << 2;
  559.             rSum += (stack.r = (pr = pixels[yi])) * (rbs = radiusPlus1 - i);
  560.             gSum += (stack.g = (pg = pixels[yi + 1])) * rbs;
  561.             bSum += (stack.b = (pb = pixels[yi + 2])) * rbs;
  563.             rInSum += pr;
  564.             gInSum += pg;
  565.             bInSum += pb;
  567.             stack = stack.next;
  569.             if (i < heightMinus1) {
  570.                 yp += width;
  571.             }
  572.         }
  574.         yi = x;
  575.         stackIn = stackStart;
  576.         stackOut = stackEnd;
  577.         for (y = 0; y < height; y++) {
  578.             p = yi << 2;
  579.             pixels[p] = (rSum * mulSum) >> shgSum;
  580.             pixels[p + 1] = (gSum * mulSum) >> shgSum;
  581.             pixels[p + 2] = (bSum * mulSum) >> shgSum;
  583.             rSum -= rOutSum;
  584.             gSum -= gOutSum;
  585.             bSum -= bOutSum;
  587.             rOutSum -= stackIn.r;
  588.             gOutSum -= stackIn.g;
  589.             bOutSum -= stackIn.b;
  591.             p = (x + (((p = y + radiusPlus1) < heightMinus1 ? p : heightMinus1) * width)) << 2;
  593.             rSum += (rInSum += (stackIn.r = pixels[p]));
  594.             gSum += (gInSum += (stackIn.g = pixels[p + 1]));
  595.             bSum += (bInSum += (stackIn.b = pixels[p + 2]));
  597.             stackIn = stackIn.next;
  599.             rOutSum += (pr = stackOut.r);
  600.             gOutSum += (pg = stackOut.g);
  601.             bOutSum += (pb = stackOut.b);
  603.             rInSum -= pr;
  604.             gInSum -= pg;
  605.             bInSum -= pb;
  607.             stackOut = stackOut.next;
  609.             yi += width;
  610.         }
  611.     }
  613.     return imageData;
  614. }
  616. /**
  617.  *
  618.  */
  619. export class BlurStack {
  620.     constructor () {
  621.         this.r = 0;
  622.         this.g = 0;
  623.         this.b = 0;
  624.         this.a = 0;
  625.         this.next = null;
  626.     }
  627. }
  629. export {
  630.     /**
  631.     * @function module:StackBlur.image
  632.     * @see module:StackBlur~processImage
  633.     */
  634.     processImage as image,
  635.     /**
  636.     * @function module:StackBlur.canvasRGBA
  637.     * @see module:StackBlur~processCanvasRGBA
  638.     */
  639.     processCanvasRGBA as canvasRGBA,
  640.     /**
  641.     * @function module:StackBlur.canvasRGB
  642.     * @see module:StackBlur~processCanvasRGB
  643.     */
  644.     processCanvasRGB as canvasRGB,
  645.     /**
  646.     * @function module:StackBlur.imageDataRGBA
  647.     * @see module:StackBlur~processImageDataRGBA
  648.     */
  649.     processImageDataRGBA as imageDataRGBA,
  650.     /**
  651.     * @function module:StackBlur.imageDataRGB
  652.     * @see module:StackBlur~processImageDataRGB
  653.     */
  654.     processImageDataRGB as imageDataRGB
  655. };