-
Notifications
You must be signed in to change notification settings - Fork 0
/
bage.min.js
169 lines (166 loc) · 13.5 KB
/
bage.min.js
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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
function name(e) {}
const BageJSEssential = { isChrome: !1, supportsOffscreenCanvas: !1, offscreenCanvas: function(e, t) { if (this.supportsOffscreenCanvas) return new OffscreenCanvas(e, t); var a = document.createElement("canvas"); return a.width = e, a.height = t, a } };
BageJSEssential.isChrome = null != window.chrome, BageJSEssential.supportsOffscreenCanvas = null != window.OffscreenCanvas;
const BageJS = {
loadAssets: function(e) {
var t = 0;
e.assets.forEach(a => {
function n() { console.log("beginning to render" + t), e.finish() }
function i(a) { t += 1, t == e.assets.length && n() }
var o = a[0],
s = a[1];
const r = new Image;
r.onload = function() { window["img_" + o] = r, console.log(o + " is loaded"), i() }, r.onerror = function(e) { console.log(o + " couldn't be loaded"), i() }, r.src = s
})
},
getFromID: function(e, t) { var a; return e.forEach(function(e, n) { t != e.id || (a = e) }), a },
getFromType: function(e, t) { var a = []; return e.forEach(function(e, n) { t != e.type || a.push(e) }), a },
createCanvas: function(e) {
var t = document.createElement("canvas");
t.id = "tempcanvas" + performance.now(), t.width = 500, t.height = 500;
const a = t.getContext("2d"),
n = BageJSEssential.isChrome ? document.createElement("img") : document.createElement("canvas");
n.id = e, document.body.appendChild(n), console.log(n);
let i = t.width;
return { innerCanvas: t, domCanvas: n, width: i, height: t.height, innerContext: a, lastCalledTime: void 0, fps: 60, camera: void 0, scale: 1, debug: { enabled: !1, outline: !1 } }
},
draw: function(e, t) {
function a(e, t, a) { return e + (t - e) * a }
function n(e, t) { e.imageSmoothingEnabled = t, e.webkitImageSmoothingEnabled = t, e.mozImageSmoothingEnabled = t, e.msImageSmoothingEnabled = t, e.oImageSmoothingEnabled = t }
const i = { width: t.width / t.scale, height: t.height / t.scale };
if (null == t.camera || null == t.camera.type || null == t.camera.position || "camera" != t.camera.type) return;
const o = t.innerContext;
if (t.innerCanvas.width = t.width, t.innerCanvas.height = t.height, t.domCanvas.width = t.width, t.domCanvas.height = t.height, o.clearRect(0, 0, t.width, t.height), o.save(), t.debug.enabled) {
var s = o.createLinearGradient(0, 0, t.width / 1.2, t.height / 1.2);
s.addColorStop(0, "black"), s.addColorStop(.8, "rgb(20,20,20)"), s.addColorStop(1, "rgb(20,20,100)"), o.fillStyle = s, o.fillRect(0, 0, t.width, t.height), o.textBaseline = "bottom", o.textAlign = "start", o.font = "48px sans", o.fillStyle = "rgb(50,50,255)", o.fillText("Debug Session", 0, t.height)
} else o.fillStyle = "black", o.fillRect(0, 0, t.width, t.height);
o.restore();
const r = function(e, t, a, n, i) { o.fillStyle = i, o.fillRect(e, t, a, n) },
l = function(e, t, a, n, i) {
const s = new Image;
loadImageSync(s), s.src = i, o.drawImage(s, e, t, a, n)
},
c = function(e, a, i, s, r, l) {
n(o, !1), null == l && (l = 1), l > 1 && (l = 1), l <= 0 && (l = 1);
const c = new OffscreenCanvas(i, s),
d = c.getContext("2d", { alpha: !0 });
d.filter = "blur(" + r * l + "px)", d.drawImage(t.innerCanvas, e, a, i, s, 0, 0, i * l, s * l), o.rect(e, a, i, s), o.clip(), n(o, !0);
for (let t = 0; t < 100; t += 1) o.drawImage(c, e, a, i / l, s / l)
},
d = function(e, a, n, i, s) {
const r = new OffscreenCanvas(n, i),
l = r.getContext("2d", { alpha: !0 });
l.filter = "saturate(" + s + ")", l.drawImage(t.innerCanvas, e, a, n, i, 0, 0, n, i);
l.getImageData(0, 0, r.width, r.height).data;
o.drawImage(r, e, a)
},
h = function(e, a, n, i, s) {
const r = new OffscreenCanvas(n, i),
l = r.getContext("2d", { alpha: !0 });
l.filter = "contrast(" + s + ")", l.drawImage(t.innerCanvas, e, a, n, i, 0, 0, n, i);
l.getImageData(0, 0, r.width, r.height).data;
o.drawImage(r, e, a)
},
g = function(e, a, n, i, s) {
o.rect(e, a, n, i), o.clip();
const r = new OffscreenCanvas(n, i),
l = r.getContext("2d", { alpha: !0 });
l.drawImage(t.innerCanvas, e, a, n, i, 0, 0, n, i);
l.getImageData(0, 0, r.width, r.height).data;
o.fillStyle = "black", o.fillRect(e, a, n, i);
var [c, d] = [e + n / 2 - n * s / 2, a + i / 2 - i * s / 2];
o.drawImage(r, c, d, n * s, i * s), s < 1 && (o.drawImage(r, 0, 0, 1, i, e, d, c - e, i * s), o.drawImage(r, n - 1, 0, 1, i, e + e + n - c, d, c - e, i * s), o.drawImage(r, 0, 0, n, 1, c, a, n * s, d - a), o.drawImage(r, 0, i - 1, n, 1, c, a + a + i - d, n * s, d - a), o.drawImage(r, 0, 0, 1, 1, e, a, c - e, d - a), o.drawImage(r, n - 1, 0, 1, 1, e + e + n - c, a, c - e, d - a), o.drawImage(r, 0, i - 1, 1, 1, e, a + a + i - d, c - e, d - a), o.drawImage(r, n - 1, i - 1, 1, 1, e + e + n - c, a + a + i - d, c - e, d - a))
},
m = function(e, t, a, n, i) { o.textBaseline = "top", o.font = n, o.fillStyle = i, o.fillText(a, e, t) },
f = function(e) { var t = 2; return Math.pow(t, 1 + e / 2) / t };
var p = [i.width / 2, i.height / 2],
u = [p[0] - t.camera.position[0], p[1] - t.camera.position[1]];
if (e.forEach(function(s, w) {
o.save();
const b = s.type,
v = s;
switch (null != v.filter && (o.filter = v.filter), b) {
case "bage-rectangle":
r(v.x, v.y, v.w * t.scale, v.h * t.scale, v.color);
break;
case "testobject":
r((u[0] - p[0]) * f(v.zindex) + p[0] + v.position[0] * f(v.zindex) - v.size[0] / 2, u[1] - v.position[1] - v.size[1] / 2, v.size[0] * t.scale, v.size[1] * t.scale, "white");
break;
case "sprite":
var x = window["img_" + v.bitmaps.collection.default],
C = [x.width, x.height];
null == v.pinpoint && (v.pinpoint = "d"), null == v.scale && (v.scale = 1), n(o, !1);
var y = window["img_" + v.bitmaps.collection[v.bitmaps.play]].width / C[0],
I = v.bitmaps.options.fps / t.fps;
v.bitmaps.options.playing && (v.bitmaps.options.loop ? v.bitmaps.options.currentframe = v.bitmaps.options.currentframe + I >= y ? 0 : v.bitmaps.options.currentframe += I : v.bitmaps.options.currentframe = v.bitmaps.options.currentframe + I >= y ? y - 1 : v.bitmaps.options.currentframe += I);
const [s, w] = [(u[0] - p[0]) * f(v.zindex) + p[0] + v.position[0] * f(v.zindex) - C[0] / 2 * v.scale, (u[1] - p[1]) * f(v.zindex) + p[1] + v.position[1] * f(v.zindex) - C[1] / 2 * v.scale];
o.drawImage(window["img_" + v.bitmaps.collection[v.bitmaps.play]], Math.floor(v.bitmaps.options.currentframe) * C[0], 0, C[0], C[1], s * t.scale, w * t.scale, C[0] * v.scale * t.scale, C[1] * v.scale * t.scale), t.debug.outline && t.debug.enabled && (o.strokeStyle = "white", o.lineWidth = t.scale, o.strokeRect(s * t.scale, w * t.scale, C[0] * v.scale * t.scale, C[1] * v.scale * t.scale));
break;
case "tile":
var S = window["img_" + v.bitmap],
k = [v.repetation[0] * v.scale * S.width, v.repetation[1] * v.scale * S.height],
M = [(u[0] - p[0]) * f(v.zindex) + p[0] + v.position[0] * f(v.zindex), (u[1] - p[1]) * f(v.zindex) + p[1] + v.position[1] * f(v.zindex)];
n(o, !1);
for (var z = 0; v.repetation[0] > z; z++)
for (var E = 0; v.repetation[1] > E; E++) {
const e = [M[0] + v.scale * S.width * z, M[1] + v.scale * S.height * E, v.scale * S.width, v.scale * S.height];
var B = t.debug.enabled ? e[0] < 0 || e[1] < 0 || e[0] + e[2] > i.width || e[1] + e[3] > i.height : e[0] + e[2] < 0 || e[1] + e[3] < 0 || e[0] > i.width || e[1] > i.height;
B || o.drawImage(S, e[0] * t.scale, e[1] * t.scale, e[2] * t.scale, e[3] * t.scale)
}
t.debug.outline && t.debug.enabled && (o.strokeStyle = "white", o.lineWidth = t.scale, o.strokeRect(Math.round(M[0]) * t.scale, Math.round(M[1]) * t.scale, k[0], k[1]));
break;
case "ray":
var O;
"#" == String(v.mask).charAt(0) ? (O = BageJS.getFromID(e, String(v.mask).substring(1)), x = window["img_" + O.bitmaps.collection.default]) : x = window["img_" + v.mask], C = [x.width, x.height];
const $ = BageJSEssential.offscreenCanvas(C[0], C[1]),
F = BageJSEssential.offscreenCanvas(i.width, i.height),
L = $.getContext("2d", { alpha: !0 }),
W = F.getContext("2d", { alpha: !0 });
null == v.pinpoint && (v.pinpoint = "d"), null == v.scale && (v.scale = 1), n(o, !1), n(L, !1), n(W, !1), L.filter = "saturate(0) brightness(10) brightness(10) contrast(10)", "#" == String(v.mask).charAt(0) ? "default" == O.bitmaps.play ? L.drawImage(window["img_" + O.bitmaps.collection.default], 0, 0, C[0], C[1]) : L.drawImage(window["img_" + O.bitmaps.collection[O.bitmaps.play]], Math.floor(O.bitmaps.options.currentframe) * C[0], 0, C[0], C[1], 0, 0, C[0], C[1]) : L.drawImage(x, 0, 0, C[0], C[1]), L.filter = "none", L.globalCompositeOperation = "source-in", L.fillStyle = `rgb(${v.color.start[0]},${v.color.start[1]},${v.color.start[2]})`, L.fillRect(0, 0, C[0], C[1]);
var [T, A] = [(u[0] - p[0]) * f(v.zindex.start) + p[0] + v.position.start[0] * f(v.zindex.start) - C[0] / 2 * v.scale.start, (u[1] - p[1]) * f(v.zindex.start) + p[1] + v.position.start[1] * f(v.zindex.start) - C[1] / 2 * v.scale.start];
var [J, R] = [(u[0] - p[0]) * f(v.zindex.end) + p[0] + v.position.end[0] * f(v.zindex.end) - C[0] / 2 * v.scale.end, (u[1] - p[1]) * f(v.zindex.end) + p[1] + v.position.end[1] * f(v.zindex.end) - C[1] / 2 * v.scale.end], _ = Math.pow(Math.pow(T - J, 2) + Math.pow(A - R, 2), .5) / 2;
_ = null == v.iteration ? 50 : v.iteration;
for (var D = 0; D < _; D++) W.globalAlpha = D / _, null != v.blur && (W.filter = `blur(${a(v.blur.start*v.scale.start,v.blur.end*v.scale.end,1-D/_)}px)`), W.drawImage($, T + (-T + J) * (1 - D / _), A + (-A + R) * (1 - D / _), C[0] * a(v.scale.start, v.scale.end, 1 - D / _), C[1] * a(v.scale.start, v.scale.end, 1 - D / _)), W.filter = "none";
W.globalAlpha = 1, W.drawImage($, T, A, C[0] * v.scale.start, C[1] * v.scale.start), o.globalAlpha = v.color.start[3], o.drawImage(F, 0, 0, F.width * t.scale, F.height * t.scale);
break;
case "bage-image":
l(v.x, v.y, v.w, v.h, v.url);
break;
case "bage-backdropblur":
if (v.intensity <= 40) c(v.x, v.y, v.w, v.h, v.intensity, v.quality);
else
for (let e = 0; e < Math.floor((v.intensity + 40) / 40); e += 1)(e + 1) / Math.floor((v.intensity + 40) / 40) == 1 ? c(v.x, v.y, v.w, v.h, 40 * Math.pow(v.intensity % 40 / 40, .5)) : c(v.x, v.y, v.w, v.h, 40);
break;
case "bage-backdropsaturate":
d(v.x, v.y, v.w, v.h, v.intensity);
break;
case "bage-backdropcontrast":
h(v.x, v.y, v.w, v.h, v.intensity);
break;
case "bage-backdropscale":
g(v.x, v.y, v.w, v.h, v.intensity);
break;
case "bage-text":
m(v.x, v.y, v.text, v.font, v.color)
}
o.restore()
}), true) {
lastfps = (lastfps == "none") ? t.fps : (lastfps * 60 + t.fps) / 61
o.font = "15px pixelfont", o.fillStyle = "white", o.textAlign = "end", o.textBaseline = "top";
const e = `FPS:${Math.round(lastfps)}`;
var w = 20;
const a = e.split("\n");
for (var b = 0; b < a.length; b++) o.fillText(a[b], t.width, 10 + b * w)
}
if (!t.lastCalledTime) return t.lastCalledTime = performance.now(), void(t.fps = 0);
delta = (performance.now() - t.lastCalledTime) / 1e3, t.lastCalledTime = performance.now(), t.fps = 1 / delta;
const v = t.innerCanvas.toDataURL();
if (BageJSEssential.isChrome) t.domCanvas.src = v;
else {
const e = t.domCanvas.getContext("2d");
n(e, !1), e.drawImage(t.innerCanvas, 0, 0)
}
return v
}
};
var lastfps = "none"