Attachment 127379 Details for Bug 78814 – Example file

Example file

FilterLeak.html (text/html), 8.24 KB, created by Michael O'Rourke on 2012-02-16 07:50:43 PST

(hide)

Description:

Filename:

MIME Type:

Creator: Michael O'Rourke

Created: 2012-02-16 07:50:43 PST

Size: 8.24 KB

patch

obsolete

>ï»¿<!doctype html>
><html>
><head>
><meta http-equiv="content-type" content="text/html; charset=UTF-8">
><meta http-equiv="X-UA-Compatible" content="IE=9">
><title>Untitled-1</title>
><script type="text/javascript" language="JavaScript">
>jsonObject = {
>"filters":[
>   {"name":"colormatrix", "values":"0.65 0 0 0 0 0 0.65 0 0 0 0 0 0.65 0 0 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.3005 0 0 0 -0.3005 0 1.3005 0 0 -0.3005 0 0 1.3005 0 -0.3005 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.2509 0 0 0 -0.2509 0 1.2509 0 0 -0.2509 0 0 1.2509 0 -0.2509 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.2014 0 0 0 -0.2014 0 1.2014 0 0 -0.2014 0 0 1.2014 0 -0.2014 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.1518 0 0 0 -0.1518 0 1.1518 0 0 -0.1518 0 0 1.1518 0 -0.1518 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.1023 0 0 0 -0.1023 0 1.1023 0 0 -0.1023 0 0 1.1023 0 -0.1023 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.0527 0 0 0 -0.0527 0 1.0527 0 0 -0.0527 0 0 1.0527 0 -0.0527 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"1.0032 0 0 0 -0.0032 0 1.0032 0 0 -0.0032 0 0 1.0032 0 -0.0032 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.9536 0 0 0 0.0464 0 0.9536 0 0 0.0464 0 0 0.9536 0 0.0464 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.9041 0 0 0 0.0959 0 0.9041 0 0 0.0959 0 0 0.9041 0 0.0959 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.8545 0 0 0 0.1455 0 0.8545 0 0 0.1455 0 0 0.8545 0 0.1455 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.805 0 0 0 0.195 0 0.805 0 0 0.195 0 0 0.805 0 0.195 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.7555 0 0 0 0.2445 0 0.7555 0 0 0.2445 0 0 0.7555 0 0.2445 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.7059 0 0 0 0.2941 0 0.7059 0 0 0.2941 0 0 0.7059 0 0.2941 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.6564 0 0 0 0.3436 0 0.6564 0 0 0.3436 0 0 0.6564 0 0.3436 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.6068 0 0 0 0.3932 0 0.6068 0 0 0.3932 0 0 0.6068 0 0.3932 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.5573 0 0 0 0.4427 0 0.5573 0 0 0.4427 0 0 0.5573 0 0.4427 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.5077 0 0 0 0.4923 0 0.5077 0 0 0.4923 0 0 0.5077 0 0.4923 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.4582 0 0 0 0.5418 0 0.4582 0 0 0.5418 0 0 0.4582 0 0.5418 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.4086 0 0 0 0.5914 0 0.4086 0 0 0.5914 0 0 0.4086 0 0.5914 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.3591 0 0 0 0.6409 0 0.3591 0 0 0.6409 0 0 0.3591 0 0.6409 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.3095 0 0 0 0.6905 0 0.3095 0 0 0.6905 0 0 0.3095 0 0.6905 0 0 0 1 0"},
>   {"name":"colormatrix", "values":"0.26 0 0 0 0.74 0 0.26 0 0 0.74 0 0 0.26 0 0.74 0 0 0 1 0"}
>]
>}</script>
></head>
><body style="overflow:hidden;margin:0;">
><script type="text/javascript" language="JavaScript"> 
>
>var svgns = 'http://www.w3.org/2000/svg';
>var interval = 41;
>var frame = 0;
>var uuid = 0;
>var colortable1 = "";
>var colortable2 = "";
>
>        // for Gamma correction
>        getColorTable1 = function () {
>            if (!colortable1.length) {
>                for (var index = 0; index < 256; index += 1) {
>                    if (index != 0)
>                        colortable1 += " ";
>                    var value = Math.pow((index / 255.), 1. / 2.2);
>                    colortable1 += value.toString();
>                }
>            }
>        }
>        // for Gamma correction
>        getColorTable2 = function () {
>            if (!colortable2.length) {
>                for (var index = 0; index < 256; index += 1) {
>                    if (index != 0)
>                        colortable2 += " ";
>                    var value = Math.pow((index / 255.), 2.2);
>                    colortable2 += value.toString();
>                }
>            }
>        }
>
>        createFilter = function(f) {
>            var filterDefinitionName = "filter_" + uuid++;
>            var filterSourceName = "url(#" + filterDefinitionName + ")"
>            var filter = document.createElementNS(svgns, 'filter');
>            if (!("filterUnits" in filter)) //  this browser doesn't support filters.
>                return;
>            filter.id = filterDefinitionName;
>
>                switch (f.name) {
>                    case "colormatrix":
>                        {
>                            // feComponentTransfer
>
>                            // Gamma correction
>                            getColorTable1();
>
>                            var componentXfr1 = document.createElementNS(svgns, 'feComponentTransfer');
>                            var fr1 = document.createElementNS(svgns, 'feFuncR');
>                            fr1.setAttribute("type", "discrete");
>                            fr1.setAttribute("tableValues", colortable1);
>                            componentXfr1.appendChild(fr1);
>                            var fg1 = document.createElementNS(svgns, 'feFuncG');
>                            fg1.setAttribute("type", "discrete");
>                            fg1.setAttribute("tableValues", colortable1);
>                            componentXfr1.appendChild(fg1);
>                            var fb1 = document.createElementNS(svgns, 'feFuncB');
>                            fb1.setAttribute("type", "discrete");
>                            fb1.setAttribute("tableValues", colortable1);
>                            componentXfr1.appendChild(fb1);
>                            var fa1 = document.createElementNS(svgns, 'feFuncA');
>                            fa1.setAttribute("type", "discrete");
>                            fa1.setAttribute("tableValues", colortable1);
>                            componentXfr1.appendChild(fa1);
>                            componentXfr1.in1.baseVal = "SourceGraphic";
>                            componentXfr1.setAttribute("result", "componentXfr1");
>                            filter.appendChild(componentXfr1);
>
>                            // feColorMatrix
>                            var fcm = document.createElementNS(svgns, 'feColorMatrix');
>                            fcm.in1.baseVal = "componentXfr1";
>                            fcm.setAttribute("result", "colormaMatrix1");
>                            fcm.type.baseVal = 1; // matrix
>                            fcm.setAttribute("values", f.values);
>
>                            filter.appendChild(fcm);
>
>                            // feComponentTransfer
>
>                            // Gamma correction
>                            getColorTable2();
>
>                            var componentXfr2 = document.createElementNS(svgns, 'feComponentTransfer');
>                            componentXfr2.in1.baseVal = "colormaMatrix1";
>                            var fr2 = document.createElementNS(svgns, 'feFuncR');
>                            fr2.setAttribute("type", "discrete");
>                            fr2.setAttribute("tableValues", colortable2);
>                            componentXfr2.appendChild(fr2);
>                            var fg2 = document.createElementNS(svgns, 'feFuncG');
>                            fg2.setAttribute("type", "discrete");
>                            fg2.setAttribute("tableValues", colortable2);
>                            componentXfr2.appendChild(fg2);
>                            var fb2 = document.createElementNS(svgns, 'feFuncB');
>                            fb2.setAttribute("type", "discrete");
>                            fb2.setAttribute("tableValues", colortable2);
>                            componentXfr2.appendChild(fb2);
>                            var fa2 = document.createElementNS(svgns, 'feFuncA');
>                            fa2.setAttribute("type", "discrete");
>                            fa2.setAttribute("tableValues", colortable2);
>                            componentXfr2.appendChild(fa2);
>                            filter.appendChild(componentXfr2);
>                            break;
>                        }
>                }
>        }
>
>       function timerHandler() {
>            if (frame >= jsonObject["filters"].length)
>                frame = 0;
>            createFilter(jsonObject["filters"][frame++]);
>            setTimeout(timerHandler, interval);
>       }
>
>var timer = setTimeout(timerHandler, interval)
>
></script>
></body>
></html>

ï»¿<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=9">
<title>Untitled-1</title>
<script type="text/javascript" language="JavaScript">
jsonObject = {
"filters":[
   {"name":"colormatrix", "values":"0.65 0 0 0 0 0 0.65 0 0 0 0 0 0.65 0 0 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.3005 0 0 0 -0.3005 0 1.3005 0 0 -0.3005 0 0 1.3005 0 -0.3005 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.2509 0 0 0 -0.2509 0 1.2509 0 0 -0.2509 0 0 1.2509 0 -0.2509 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.2014 0 0 0 -0.2014 0 1.2014 0 0 -0.2014 0 0 1.2014 0 -0.2014 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.1518 0 0 0 -0.1518 0 1.1518 0 0 -0.1518 0 0 1.1518 0 -0.1518 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.1023 0 0 0 -0.1023 0 1.1023 0 0 -0.1023 0 0 1.1023 0 -0.1023 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.0527 0 0 0 -0.0527 0 1.0527 0 0 -0.0527 0 0 1.0527 0 -0.0527 0 0 0 1 0"},
   {"name":"colormatrix", "values":"1.0032 0 0 0 -0.0032 0 1.0032 0 0 -0.0032 0 0 1.0032 0 -0.0032 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.9536 0 0 0 0.0464 0 0.9536 0 0 0.0464 0 0 0.9536 0 0.0464 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.9041 0 0 0 0.0959 0 0.9041 0 0 0.0959 0 0 0.9041 0 0.0959 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.8545 0 0 0 0.1455 0 0.8545 0 0 0.1455 0 0 0.8545 0 0.1455 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.805 0 0 0 0.195 0 0.805 0 0 0.195 0 0 0.805 0 0.195 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.7555 0 0 0 0.2445 0 0.7555 0 0 0.2445 0 0 0.7555 0 0.2445 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.7059 0 0 0 0.2941 0 0.7059 0 0 0.2941 0 0 0.7059 0 0.2941 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.6564 0 0 0 0.3436 0 0.6564 0 0 0.3436 0 0 0.6564 0 0.3436 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.6068 0 0 0 0.3932 0 0.6068 0 0 0.3932 0 0 0.6068 0 0.3932 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.5573 0 0 0 0.4427 0 0.5573 0 0 0.4427 0 0 0.5573 0 0.4427 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.5077 0 0 0 0.4923 0 0.5077 0 0 0.4923 0 0 0.5077 0 0.4923 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.4582 0 0 0 0.5418 0 0.4582 0 0 0.5418 0 0 0.4582 0 0.5418 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.4086 0 0 0 0.5914 0 0.4086 0 0 0.5914 0 0 0.4086 0 0.5914 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.3591 0 0 0 0.6409 0 0.3591 0 0 0.6409 0 0 0.3591 0 0.6409 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.3095 0 0 0 0.6905 0 0.3095 0 0 0.6905 0 0 0.3095 0 0.6905 0 0 0 1 0"},
   {"name":"colormatrix", "values":"0.26 0 0 0 0.74 0 0.26 0 0 0.74 0 0 0.26 0 0.74 0 0 0 1 0"}
]
}</script>
</head>
<body style="overflow:hidden;margin:0;">
<script type="text/javascript" language="JavaScript"> 

var svgns = 'http://www.w3.org/2000/svg';
var interval = 41;
var frame = 0;
var uuid = 0;
var colortable1 = "";
var colortable2 = "";

        // for Gamma correction
        getColorTable1 = function () {
            if (!colortable1.length) {
                for (var index = 0; index < 256; index += 1) {
                    if (index != 0)
                        colortable1 += " ";
                    var value = Math.pow((index / 255.), 1. / 2.2);
                    colortable1 += value.toString();
                }
            }
        }
        // for Gamma correction
        getColorTable2 = function () {
            if (!colortable2.length) {
                for (var index = 0; index < 256; index += 1) {
                    if (index != 0)
                        colortable2 += " ";
                    var value = Math.pow((index / 255.), 2.2);
                    colortable2 += value.toString();
                }
            }
        }

        createFilter = function(f) {
            var filterDefinitionName = "filter_" + uuid++;
            var filterSourceName = "url(#" + filterDefinitionName + ")"
            var filter = document.createElementNS(svgns, 'filter');
            if (!("filterUnits" in filter)) //  this browser doesn't support filters.
                return;
            filter.id = filterDefinitionName;

                switch (f.name) {
                    case "colormatrix":
                        {
                            // feComponentTransfer

                            // Gamma correction
                            getColorTable1();

                            var componentXfr1 = document.createElementNS(svgns, 'feComponentTransfer');
                            var fr1 = document.createElementNS(svgns, 'feFuncR');
                            fr1.setAttribute("type", "discrete");
                            fr1.setAttribute("tableValues", colortable1);
                            componentXfr1.appendChild(fr1);
                            var fg1 = document.createElementNS(svgns, 'feFuncG');
                            fg1.setAttribute("type", "discrete");
                            fg1.setAttribute("tableValues", colortable1);
                            componentXfr1.appendChild(fg1);
                            var fb1 = document.createElementNS(svgns, 'feFuncB');
                            fb1.setAttribute("type", "discrete");
                            fb1.setAttribute("tableValues", colortable1);
                            componentXfr1.appendChild(fb1);
                            var fa1 = document.createElementNS(svgns, 'feFuncA');
                            fa1.setAttribute("type", "discrete");
                            fa1.setAttribute("tableValues", colortable1);
                            componentXfr1.appendChild(fa1);
                            componentXfr1.in1.baseVal = "SourceGraphic";
                            componentXfr1.setAttribute("result", "componentXfr1");
                            filter.appendChild(componentXfr1);

                            // feColorMatrix
                            var fcm = document.createElementNS(svgns, 'feColorMatrix');
                            fcm.in1.baseVal = "componentXfr1";
                            fcm.setAttribute("result", "colormaMatrix1");
                            fcm.type.baseVal = 1; // matrix
                            fcm.setAttribute("values", f.values);

                            filter.appendChild(fcm);

                            // feComponentTransfer

                            // Gamma correction
                            getColorTable2();

                            var componentXfr2 = document.createElementNS(svgns, 'feComponentTransfer');
                            componentXfr2.in1.baseVal = "colormaMatrix1";
                            var fr2 = document.createElementNS(svgns, 'feFuncR');
                            fr2.setAttribute("type", "discrete");
                            fr2.setAttribute("tableValues", colortable2);
                            componentXfr2.appendChild(fr2);
                            var fg2 = document.createElementNS(svgns, 'feFuncG');
                            fg2.setAttribute("type", "discrete");
                            fg2.setAttribute("tableValues", colortable2);
                            componentXfr2.appendChild(fg2);
                            var fb2 = document.createElementNS(svgns, 'feFuncB');
                            fb2.setAttribute("type", "discrete");
                            fb2.setAttribute("tableValues", colortable2);
                            componentXfr2.appendChild(fb2);
                            var fa2 = document.createElementNS(svgns, 'feFuncA');
                            fa2.setAttribute("type", "discrete");
                            fa2.setAttribute("tableValues", colortable2);
                            componentXfr2.appendChild(fa2);
                            filter.appendChild(componentXfr2);
                            break;
                        }
                }
        }

       function timerHandler() {
            if (frame >= jsonObject["filters"].length)
                frame = 0;
            createFilter(jsonObject["filters"][frame++]);
            setTimeout(timerHandler, interval);
       }

var timer = setTimeout(timerHandler, interval)

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

Actions: View

Attachments on bug 78814: 127379