SandboXP

1
"use strict";
2

3
/**
4
 * Adapter to use visual screen in browsers (in contrast to node)
5
 * @constructor
6
 *
7
 * @param {BusConnector} bus
8
 */
9
function ScreenAdapter(screen_container, bus) {
10
    console.assert(screen_container, "1st argument must be a DOM container");
11

12
    var
13
        graphic_screen = screen_container.getElementsByTagName("canvas")[0],
14
        graphic_context = graphic_screen.getContext("2d", {
15
            alpha: false
16
        });
17

18
    var
19
        /** @type {number} */
20
        cursor_row,
21

22
        /** @type {number} */
23
        cursor_col,
24

25
        // are we in graphical mode now?
26
        is_graphical = false;
27

28
    var stopped = false;
29

30
    var screen = this;
31

32
    graphic_context["imageSmoothingEnabled"] = false;
33

34
    graphic_screen.style.display = "block";
35

36
    this.bus = bus;
37

38
    bus.register("screen-set-mode", function(data) {
39
        this.set_mode(data);
40
    }, this);
41

42
    bus.register("screen-fill-buffer-end", function(data) {
43
        this.update_buffer(data);
44
    }, this);
45

46
    bus.register("screen-clear", function() {
47
        this.clear_screen();
48
    }, this);
49
    bus.register("screen-set-size-graphical", function(data) {
50
        this.set_size_graphical(data[0], data[1], data[2], data[3]);
51
    }, this);
52

53

54
    this.init = function() {
55
        this.timer();
56
    };
57

58
    this.make_screenshot = function() {
59
        try {
60
            const image = new Image();
61
            image.src = graphic_screen.toDataURL("image/png");
62
            const w = window.open("");
63
            w.document.write(image.outerHTML);
64
        } catch (e) {}
65
    };
66

67
    this.put_char = function(row, col, chr, bg_color, fg_color) {
68
        if (row < text_mode_height && col < text_mode_width) {
69
            var p = 3 * (row * text_mode_width + col);
70

71
            dbg_assert(chr >= 0 && chr < 0x100);
72
            text_mode_data[p] = chr;
73
            text_mode_data[p + 1] = bg_color;
74
            text_mode_data[p + 2] = fg_color;
75

76
            changed_rows[row] = 1;
77
        }
78
    };
79

80
    this.timer = function() {
81
        if (!stopped) {
82
            requestAnimationFrame(update_graphical);
83
        }
84
    };
85

86
    var update_graphical = function() {
87
        if (is_graphical)
88
            this.bus.send("screen-fill-buffer");
89
        this.timer();
90
    }.bind(this);
91

92
    this.destroy = function() {
93
        stopped = true;
94
    };
95

96
    this.set_mode = function(graphical) {
97
        is_graphical = graphical;
98
    };
99

100
    this.clear_screen = function() {
101
        graphic_context.fillStyle = "#000";
102
        graphic_context.fillRect(0, 0, graphic_screen.width, graphic_screen.height);
103
    };
104

105
    this.set_size_graphical = function(width, height, buffer_width, buffer_height) {
106
        graphic_screen.style.display = "block";
107

108
        graphic_screen.width = width;
109
        graphic_screen.height = height;
110
    };
111

112
    this.update_buffer = function(layers) {
113
        layers.forEach(layer => {
114
            graphic_context.putImageData(
115
                layer.image_data,
116
                layer.screen_x - layer.buffer_x,
117
                layer.screen_y - layer.buffer_y,
118
                layer.buffer_x,
119
                layer.buffer_y,
120
                layer.buffer_width,
121
                layer.buffer_height
122
            );
123
        });
124
    };
125

126
    this.init();
127
}
128