JSEdge/test.html at master · baseonmars/JSEdge · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
<!doctype html>
<html>

    <head>

        <title>Canvas Test</title>
    </head>

    <body>

        <canvas id="test" width="500" height="500">
        <p>well that sucks</p>
        </canvas>

        <script>

            var image = new Image();
            image.src = 'http://userserve-ak.last.fm/serve/252/3614801.jpg';

            var context = document.getElementById('test').getContext('2d');
            image.onload = function () {

                context.drawImage(image, 0,0);
                imageData = context.getImageData(0,0,image.width,image.height);

                // red, green, blue, and alpha

                getDelta = function(imageData, index) {
                    var data = imageData.data;
                    return data[index] - ((data[index-4] + data[index+4]) / 2);
                }

                red = [];
                blue = [];
                green = [];
                alpha = [];


                for (x = 4; x < (imageData.width - 4); x++) {

                    for (y = 4; y < (imageData.height - 4); y++) {

                        var index = 4 * (y * (imageData.width - 4)+ x);
                        red.push( getDelta(imageData, index) );
                        green.push( getDelta(imageData, index + 1) );
                        blue.push( getDelta(imageData, index + 2) );
                        alpha.push( getDelta(imageData, index + 3) );
                    }
                }

                factor = function (imageData, size) {

                    for(x = 0; x < (imageData.width - size); x += size) {

                        for (y = 0; y < (imageData.height - size) y += size) {

                            var index = (y * (imageData.width) + x);

                            var lineTotal = 0;
                            for (i = 0; i < size; i++) {
                                lineTotal +=


                        }
                    }


                }


            }


        </script>

    </body>

</html>