1
function RandomLCG(seed) {
2
    return function() {
3
        seed = (214013 * seed + 2531011) % 0x100000000;
4
        return seed * (1.0 / 4294967296.0);
5
    };
6
}
7
function Vec(x, y, z) { this.x = x; this.y = y; this.z = z; }
8
Vec.prototype = {
9
    add: function(b) {
10
        return new Vec(this.x + b.x, this.y + b.y, this.z + b.z);
11
    },
12
    sub: function(b) {
13
        return new Vec(this.x - b.x, this.y - b.y, this.z - b.z);
14
    },
15
    mul: function(b) {
16
        return new Vec(this.x * b, this.y * b, this.z * b);
17
    },
18
    mult: function(b) {
19
        return new Vec(this.x * b.x, this.y * b.y, this.z * b.z);
20
    },
21
    norm: function() {
22
        return this.mul(1.0 / Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z));
23
    },
24
    dot: function(b) {
25
        return this.x * b.x + this.y * b.y + this.z * b.z;
26
    },
27
    cross: function(b) {
28
        return new Vec(this.y * b.z - this.z * b.y, this.z * b.x - this.x * b.z, this.x * b.y - this.y * b.x);
29
    }
30
};
31
Vec.Zero = new Vec(0, 0, 0)
32
Vec.XAxis = new Vec(1, 0, 0)
33
Vec.YAxis = new Vec(0, 1, 0)
34
Vec.ZAxis = new Vec(0, 0, 1)
35
Refl = {DIFF: 0,SPEC: 1,REFR: 2};
36
function Ray(o, d) { this.o = o; this.d = d }
37
function Sphere(rad, p, e, c, refl) {
38
    this.rad = rad;
39
    this.p = p;
40
    this.e = e;
41
    this.c = c;
42
    this.refl = refl;
43
    this.sqRad = rad * rad;
44
    this.maxC = Math.max(Math.max(c.x, c.y), c.z);
45
    this.cc = c.mul(1.0 / this.maxC);
46
}
47
Sphere.prototype = {
48
    intersect: function(r) {
49
        // Solve t^2*d.d + 2*t*(o-p).d + (o-p).(o-p)-R^2 = 0
50
        var op = this.p.sub(r.o);
51
        var b = op.dot(r.d);
52
        var det = b * b - op.dot(op) + this.sqRad;
53
        var eps = 1e-4;
54
        if (det < 0)
55
            return 0;
56
        else {
57
            var dets = Math.sqrt(det)
58
            if (b - dets > eps)
59
                return b - dets;
60
            else if (b + dets > eps)
61
                return b + dets;
62
            else
63
                return 0;
64
        }
65
    }
66
};
67
// Scene: radius, position, emission, color, material
68
spheres = [
69
    new Sphere(1e5, new Vec(1e5 + 1, 40.8, 81.6), Vec.Zero, new Vec(.75, .25, .25), Refl.DIFF), //Left
70
    new Sphere(1e5, new Vec(-1e5 + 99, 40.8, 81.6), Vec.Zero, new Vec(.25, .25, .75), Refl.DIFF), //Rght
71
    new Sphere(1e5, new Vec(50, 40.8, 1e5), Vec.Zero, new Vec(.75, .75, .75), Refl.DIFF), //Back
72
    new Sphere(1e5, new Vec(50, 40.8, -1e5 + 170), Vec.Zero, Vec.Zero, Refl.DIFF), //Frnt
73
    new Sphere(1e5, new Vec(50, 1e5, 81.6), Vec.Zero, new Vec(.75, .75, .75), Refl.DIFF), //Botm
74
    new Sphere(1e5, new Vec(50, -1e5 + 81.6, 81.6), Vec.Zero, new Vec(.75, .75, .75), Refl.DIFF), //Top
75
    new Sphere(16.5, new Vec(27, 16.5, 47), Vec.Zero, new Vec(1, 1, 1).mul(.999), Refl.SPEC), //Mirr
76
    new Sphere(16.5, new Vec(73, 16.5, 78), Vec.Zero, new Vec(1, 1, 1).mul(.999), Refl.REFR), //Glas
77
    new Sphere(600, new Vec(50, 681.6 - .27, 81.6), new Vec(12, 12, 12), Vec.Zero, Refl.DIFF)  //Lite
78
];
79
var rand = RandomLCG(0)
80
function clamp(x) {
81
    if (x < 0)
82
        return 0;
83
    else if (x > 1)
84
        return 1;
85
    else
86
        return x;
87
}
88
function toInt(x) {
89
    return Math.pow(clamp(x), 1 / 2.2) * 255 + .5
90
}
91
function intersect(r) {
92
    var t = 1e20;
93
    var obj;
94
    for (var i in spheres) {
95
        var s = spheres[i];
96
        var d = s.intersect(r);
97
        if (d != 0 && d < t) {
98
            t = d;
99
            obj = s;
100
        }
101
    }
102
    return [obj, t];
103
}
104
function radiance(r, depth) {
105
    var ires = intersect(r);
106
    var obj = ires[0];
107
    var t = ires[1];   // distance to intersection
108
    if (obj == null) {
109
        return Vec.Zero;       // if miss, return black
110
    } else {
111
        var newDepth = depth + 1;
112
        var isMaxDepth = newDepth > 100;
113
        // Russian roulette for path termination
114
        var isUseRR = newDepth > 5;
115
        var isRR = isUseRR && rand() < obj.maxC;
116
        if (isMaxDepth || (isUseRR && !isRR))
117
            return obj.e;
118
        else {
119
            var f = (isUseRR && isRR) ? obj.cc : obj.c;
120
            var x = r.o.add(r.d.mul(t));
121
            var n = x.sub(obj.p).norm();
122
            var nl = n.dot(r.d) < 0 ? n : n.mul(-1);
123
            if (obj.refl == Refl.DIFF) // Ideal DIFFUSE reflection
124
            {
125
                var r1 = 2 * Math.PI * rand();
126
                var r2 = rand();
127
                var r2s = Math.sqrt(r2);
128
                var w = nl;
129
                var wo = Math.abs(w.x) > .1 ? new Vec(0, 1, 0) : new Vec(1, 0, 0);
130
                var u = wo.cross(w).norm();
131
                var v = w.cross(u);
132

133
                var d = (u.mul(Math.cos(r1) * r2s).add(v.mul(Math.sin(r1) * r2s)).add(w.mul(Math.sqrt(1 - r2)))).norm();
134
                return obj.e.add(f.mult(radiance(new Ray(x, d), newDepth)));
135
            }
136
            else if (obj.refl == Refl.SPEC) // Ideal SPECULAR reflection
137
            {
138
                return obj.e.add(f.mult(radiance(new Ray(x, r.d.sub(n.mul(2 * n.dot(r.d)))), newDepth)));
139
            }
140
            else // Ideal dielectric REFRACTION
141
            {
142
                var reflRay = new Ray(x, r.d.sub(n.mul(2 * n.dot(r.d))));
143
                var into = n.dot(nl) > 0; // var from outside going in?
144
                var nc = 1;
145
                var nt = 1.5;
146
                var nnt = into ? nc / nt : nt / nc;
147
                var ddn = r.d.dot(nl);
148
                var cos2t = 1 - nnt * nnt * (1 - ddn * ddn);
149
                if (cos2t < 0)  // Total internal reflection
150
                {
151
                    return obj.e.add(f.mult(radiance(reflRay, newDepth)));
152
                }
153
                else {
154
                    var tdir = (r.d.mul(nnt).sub(n.mul((into ? 1 : -1) * (ddn * nnt + Math.sqrt(cos2t))))).norm();
155
                    var a = nt - nc;
156
                    var b = nt + nc;
157
                    var R0 = a * a / (b * b);
158
                    var c = 1 - (into ? -ddn : tdir.dot(n));
159
                    var Re = R0 + (1 - R0) * c * c * c * c * c;
160
                    var Tr = 1 - Re;
161
                    var P = .25 + .5 * Re;
162
                    var RP = Re / P;
163
                    var TP = Tr / (1 - P);
164
                    var result;
165
                    if (newDepth > 2) {
166
                        // Russian roulette and splitting for selecting reflection and/or refraction
167
                        if (rand() < P)
168
                            result = radiance(reflRay, newDepth).mul(RP);
169
                        else
170
                            result = radiance(new Ray(x, tdir), newDepth).mul(TP);
171
                    }
172
                    else
173
                        result = radiance(reflRay, newDepth).mul(Re).add(radiance(new Ray(x, tdir), newDepth).mul(Tr));
174
                    return obj.e.add(f.mult(result));
175
                }
176
            }
177
        }
178
    }
179
}
180
function render(canvas, status) {
181
    var start = new Date().getTime();
182
    var w = canvas.attributes.width.value;
183
    var h = canvas.attributes.height.value;
184
    var samps = 25;
185
    // cam pos, dir
186
    var cam = new Ray(new Vec(50, 52, 295.6), new Vec(0, -0.042612, -1).norm());
187
    var cx = new Vec(w * .5135 / h, 0, 0);
188
    var cy = (cx.cross(cam.d)).norm().mul(.5135);
189
    // final color buffer
190
    var c = new Array(w * h);
191
    for (var i = 0; i < w * h; i++)
192
        c[i] = Vec.Zero;
193
    // Output
194
    var ctx = canvas.getContext("2d");
195
    var imgdata = ctx.getImageData(0, 0, w, h);
196
    var pixels = imgdata.data;
197
    // Loop over image rows
198
    var y = 0;
199
    setTimeout(renderLine, 0);
200
    function renderLine()
201
    {
202
        status.innerHTML = "Rendering (" + samps * 4 + " spp) " + (100.0 * y / (h - 1)).toFixed(2) + "%";
203
        // Loop cols
204
        for (var x = 0; x < w; x++) {
205
            // 2x2 subpixel rows
206
            for (var sy = 0; sy < 2; sy++) {
207
                var i = (h - y - 1) * w + x;
208
                // 2x2 subpixel cols
209
                for (var sx = 0; sx < 2; sx++) {
210
                    var r = Vec.Zero;
211
                    for (var s = 0; s < samps; s++) {
212
                        var r1 = 2 * rand();
213
                        var r2 = 2 * rand();
214
                        var dx = r1 < 1 ? Math.sqrt(r1) - 1 : 1 - Math.sqrt(2 - r1);
215
                        var dy = r2 < 1 ? Math.sqrt(r2) - 1 : 1 - Math.sqrt(2 - r2);
216
                        var d = cx.mul(((sx + .5 + dx) / 2 + x) / w - .5).add(
217
                        cy.mul(((sy + .5 + dy) / 2 + y) / h - .5)).add(cam.d);
218
                        // Camera rays are pushed forward to start in interior
219
                        var camRay = new Ray(cam.o.add(d.mul(140)), d.norm());
220
                        // Accumuate radiance
221
                        r = r.add(radiance(camRay, 0).mul(1.0 / samps));
222
                    }
223
                    // Convert radiance to color
224
                    c[i] = c[i].add((new Vec(clamp(r.x), clamp(r.y), clamp(r.z))).mul(.25));
225
                }
226
            }
227
        }
228
        renderOutput();
229
        y++;
230
        if (y < h)
231
            setTimeout(renderLine, 0);
232
        else
233
            status.innerHTML = (new Date().getTime() - start) / 1000 + " sec";
234
    }
235
    function renderOutput() {
236
        var i = (h - y - 1) * w * 4, j = (h - y - 1) * w;
237
        for (var x = 0; x < w; x++) {
238
            pixels[i++] = toInt(c[j].x);
239
            pixels[i++] = toInt(c[j].y);
240
            pixels[i++] = toInt(c[j].z);
241
            pixels[i++] = 255;
242
            j++;
243
        }
244
        ctx.putImageData(imgdata, 0, 0);
245
    }
246
}