summaryrefslogtreecommitdiffstats
path: root/tests/baselineserver/src/templates/view.html
blob: c048f4781c0a9f7d1a5028313e308ea90e15c3f3 (plain)
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
<h3>Lancelot Viewer</h3>

<p>
Zoom:
<input name="zoom" id="z1" type="radio" checked="Checked">1x</input>
<input name="zoom" id="z2" type="radio">2x</input>
<input name="zoom" id="z4" type="radio">4x</input>
</p>

<p><table>
<tr>
<td><input name="imgselect" id="baseline" type="radio" checked="Checked">Baseline</input></td>
<td>%1</td>
</tr>
<tr>
<td><input name="imgselect" id="rendered" type="radio">Rendered</input></td>
<td>%2</td>
</tr>
<tr>
<td><input name="imgselect" id="compared" type="radio">Differences</input></td>
<td></td>
</tr>
</table></p>


<p>
<canvas id="c" width="800" height="800"></canvas>
</p>

<script>
  var canvas = document.getElementById("c");
  var context = canvas.getContext("2d");
  var cat = new Image();
  cat.src = "%1";
  var z = 1;
  cat.onload = function() {
    context.mozImageSmoothingEnabled = false;
    context.drawImage(cat, 0, 0, z*cat.width, z*cat.height);
  };

  var bbut = document.getElementById("baseline");
  bbut.onclick = function() {
    cat.src = "%1";
  };

  var rbut = document.getElementById("rendered");
  rbut.onclick = function() {
    cat.src = "%2";
  };

  var cbut = document.getElementById("compared");
  cbut.onclick = function() {
    cat.src = "%3";
  };

  function setZoom(zoom)
  {
    z = zoom;
    canvas.width = z*800;
    canvas.height = z*800;
    context.mozImageSmoothingEnabled = false;
    context.drawImage(cat, 0, 0, z*cat.width, z*cat.height);
  }

  var z1but = document.getElementById("z1");
  z1but.onclick = function() {
      setZoom(1);
  };

  var z2but = document.getElementById("z2");
  z2but.onclick = function() {
      setZoom(2);
  };

  var z4but = document.getElementById("z4");
  z4but.onclick = function() {
      setZoom(4);
  };
</script>