py-multidraw/image.html at master · otadmor/py-multidraw · 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
80
81
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>just draw</title>
<script type='text/javascript' src="/jquery.min.js"></script>

<script type='text/javascript'  src="/multidraw.js"></script>

<script type="text/javascript">
  var client_id=0;
    var sent_lines=0;

  function set_bg(color) {

var painter = document.getElementById("painter");
var ctx = painter.getContext('2d');

ctx.globalCompositeOperation = "destination-over";
ctx.fillStyle = color;
ctx.fillRect(0,0,painter.width, painter.height);

  }

function push_lines(data)
{
d = $.parseJSON(data);
    var painter = document.getElementById("painter");
lines = d[0];
for (line in lines)
{
var l = lines[line];
funqueue.push(l);
}
        if (funqueue.length == 0) { document.write('<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAAAAAA6fptVAAAACklEQVQYV2P4DwABAQEAWk1v8QAAAABJRU5ErkJggg==" width="' + painter.width + '" height="' + painter.height + '" />'); return; }
draw_all_lines();
    set_bg("#ffffff");


    var img_data=painter.toDataURL('image/png');
    // i = document.createElement("img");
    // i.src=img_data;
    // document.body.appendChild(i);

 //document.write(img_data);
 //document.location.href = img_data;
 //document.location.replace(img_data);
 document.location.assign(img_data);
    /*var img_element="<img src=\"" + img_data + "\" />";
    $("#c").remove();
    $("head").html("<meta http-equiv=\"content-type\" content=\"image/png\"/>");
    $("body").html(img_element);*/
}


$(document).ready(function() {
var canvas = document.getElementById("painter");
    canvas.width = parseInt("%s");
    canvas.height = parseInt("%s");

$.ajax({url:"/0"}).done(push_lines);

});

</script>

</head>

<body>

<canvas id="painter" style="position: absolute; left: 0; top: 0; background-color: transparent;">


</canvas>

</body>
</html>