Skip to content

Commit 9bd18ef

Browse files
mooooooimooooooi
committed
feat: add time manager
1 parent 952648c commit 9bd18ef

File tree

3 files changed

+172
-76
lines changed

3 files changed

+172
-76
lines changed

‎example/bundle.js

Lines changed: 108 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1234,13 +1234,16 @@ var StateSync = (function (exports) {
12341234
};
12351235
return ADirty;
12361236
})();
1237-
/** @class */ (function (_super) {
1237+
var Int = /** @class */ (function (_super) {
12381238
__extends(Int, _super);
1239-
function Int() {
1240-
var _this =
1241-
(_super !== null && _super.apply(this, arguments)) || this;
1239+
function Int(value) {
1240+
if (value === void 0) {
1241+
value = 0;
1242+
}
1243+
var _this = _super.call(this) || this;
12421244
_this.dirty = false;
12431245
_this._value = 0;
1246+
_this._value = value;
12441247
return _this;
12451248
}
12461249
Object.defineProperty(Int.prototype, "value", {
@@ -1276,11 +1279,14 @@ var StateSync = (function (exports) {
12761279
})(ADirty);
12771280
/** @class */ (function (_super) {
12781281
__extends(Float, _super);
1279-
function Float() {
1280-
var _this =
1281-
(_super !== null && _super.apply(this, arguments)) || this;
1282+
function Float(value) {
1283+
if (value === void 0) {
1284+
value = 0;
1285+
}
1286+
var _this = _super.call(this) || this;
12821287
_this.dirty = false;
12831288
_this._value = 0;
1289+
_this._value = value;
12841290
return _this;
12851291
}
12861292
Object.defineProperty(Float.prototype, "value", {
@@ -1316,11 +1322,14 @@ var StateSync = (function (exports) {
13161322
})(ADirty);
13171323
/** @class */ (function (_super) {
13181324
__extends(Long, _super);
1319-
function Long() {
1320-
var _this =
1321-
(_super !== null && _super.apply(this, arguments)) || this;
1325+
function Long(value) {
1326+
if (value === void 0) {
1327+
value = 0;
1328+
}
1329+
var _this = _super.call(this) || this;
13221330
_this.dirty = false;
13231331
_this._value = 0;
1332+
_this._value = value;
13241333
return _this;
13251334
}
13261335
Object.defineProperty(Long.prototype, "value", {
@@ -1356,11 +1365,14 @@ var StateSync = (function (exports) {
13561365
})(ADirty);
13571366
/** @class */ (function (_super) {
13581367
__extends(Uint, _super);
1359-
function Uint() {
1360-
var _this =
1361-
(_super !== null && _super.apply(this, arguments)) || this;
1368+
function Uint(value) {
1369+
if (value === void 0) {
1370+
value = 0;
1371+
}
1372+
var _this = _super.call(this) || this;
13621373
_this.dirty = false;
13631374
_this._value = 0;
1375+
_this._value = value;
13641376
return _this;
13651377
}
13661378
Object.defineProperty(Uint.prototype, "value", {
@@ -1396,11 +1408,14 @@ var StateSync = (function (exports) {
13961408
})(ADirty);
13971409
/** @class */ (function (_super) {
13981410
__extends(Double, _super);
1399-
function Double() {
1400-
var _this =
1401-
(_super !== null && _super.apply(this, arguments)) || this;
1411+
function Double(value) {
1412+
if (value === void 0) {
1413+
value = 0;
1414+
}
1415+
var _this = _super.call(this) || this;
14021416
_this.dirty = false;
14031417
_this._value = 0;
1418+
_this._value = value;
14041419
return _this;
14051420
}
14061421
Object.defineProperty(Double.prototype, "value", {
@@ -1436,11 +1451,14 @@ var StateSync = (function (exports) {
14361451
})(ADirty);
14371452
/** @class */ (function (_super) {
14381453
__extends(Ulong, _super);
1439-
function Ulong() {
1440-
var _this =
1441-
(_super !== null && _super.apply(this, arguments)) || this;
1454+
function Ulong(value) {
1455+
if (value === void 0) {
1456+
value = 0;
1457+
}
1458+
var _this = _super.call(this) || this;
14421459
_this.dirty = false;
14431460
_this._value = 0;
1461+
_this._value = value;
14441462
return _this;
14451463
}
14461464
Object.defineProperty(Ulong.prototype, "value", {
@@ -1476,11 +1494,14 @@ var StateSync = (function (exports) {
14761494
})(ADirty);
14771495
/** @class */ (function (_super) {
14781496
__extends(Short, _super);
1479-
function Short() {
1480-
var _this =
1481-
(_super !== null && _super.apply(this, arguments)) || this;
1497+
function Short(value) {
1498+
if (value === void 0) {
1499+
value = 0;
1500+
}
1501+
var _this = _super.call(this) || this;
14821502
_this.dirty = false;
14831503
_this._value = 0;
1504+
_this._value = value;
14841505
return _this;
14851506
}
14861507
Object.defineProperty(Short.prototype, "value", {
@@ -1516,11 +1537,14 @@ var StateSync = (function (exports) {
15161537
})(ADirty);
15171538
/** @class */ (function (_super) {
15181539
__extends(Ushort, _super);
1519-
function Ushort() {
1520-
var _this =
1521-
(_super !== null && _super.apply(this, arguments)) || this;
1540+
function Ushort(value) {
1541+
if (value === void 0) {
1542+
value = 0;
1543+
}
1544+
var _this = _super.call(this) || this;
15221545
_this.dirty = false;
15231546
_this._value = 0;
1547+
_this._value = value;
15241548
return _this;
15251549
}
15261550
Object.defineProperty(Ushort.prototype, "value", {
@@ -1816,11 +1840,29 @@ var StateSync = (function (exports) {
18161840
View = __decorate([NetComp("view")], View);
18171841
return View;
18181842
})();
1843+
var ServerTime = /** @class */ (function () {
1844+
function ServerTime() {
1845+
this.timestamp = 0;
1846+
this.deltaTime = new Int();
1847+
}
1848+
__decorate(
1849+
[NetVar(DataType.int)],
1850+
ServerTime.prototype,
1851+
"timestamp",
1852+
void 0
1853+
);
1854+
__decorate([NetVar(Int)], ServerTime.prototype, "deltaTime", void 0);
1855+
ServerTime = __decorate([NetComp("time")], ServerTime);
1856+
return ServerTime;
1857+
})();
18191858

18201859
var Time = /** @class */ (function () {
1821-
function Time() {}
1822-
Time.deltaTime = 0;
1823-
Time.fixedDeltaTime = 1 / 30;
1860+
function Time() {
1861+
this.deltaTime = 0;
1862+
this.fixedDeltaTime = (1 / 10) * 1000;
1863+
this.fixedTimestamp = 0;
1864+
this.timestamp = 0;
1865+
}
18241866
return Time;
18251867
})();
18261868
var Base = /** @class */ (function () {
@@ -1829,6 +1871,8 @@ var StateSync = (function (exports) {
18291871
this.bg = "#947A6D";
18301872
this.yelloBall = 0xf7d94c;
18311873
this.whiteBall = 0xf8c3cd;
1874+
this.time = new Time();
1875+
this.doInterpolating = false;
18321876
this._preTimestamp = 0;
18331877
this._fixedTimeAccumulator = 0;
18341878
this.domain = Domain.Create(name, StringDataBuffer, rpcType);
@@ -1839,58 +1883,62 @@ var StateSync = (function (exports) {
18391883
this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
18401884
this.myLoop = this.loop.bind(this);
18411885
this.initScene();
1842-
this.render(0);
1886+
this.render();
18431887
}
18441888
Base.prototype.update = function () {};
18451889
Base.prototype.fixedUpdate = function () {};
18461890
Base.prototype.lateUpdate = function () {};
1847-
Base.prototype.loop = function (time) {
1848-
this.update();
1891+
Base.prototype.loop = function (timestamp) {
1892+
var Time = this.time;
18491893
if (this._preTimestamp === 0) {
1850-
Time.deltaTime = 1 / 60;
1894+
Time.deltaTime = (1 / 60) * 1000;
18511895
} else {
1852-
Time.deltaTime = time - this._preTimestamp;
1896+
Time.deltaTime = timestamp - this._preTimestamp;
18531897
}
1854-
this._preTimestamp = time;
1855-
this._fixedTimeAccumulator += time;
1898+
Time.timestamp += Time.deltaTime;
1899+
this.update();
1900+
this._preTimestamp = timestamp;
1901+
this._fixedTimeAccumulator += Time.deltaTime;
18561902
var count = 0;
18571903
while (
18581904
this._fixedTimeAccumulator >= Time.fixedDeltaTime &&
18591905
count < 3
18601906
) {
18611907
count++;
18621908
this._fixedTimeAccumulator -= Time.fixedDeltaTime;
1909+
Time.fixedTimestamp += Time.fixedDeltaTime;
18631910
this.fixedUpdate();
18641911
}
1865-
this.render(time);
1912+
this.render();
18661913
this.lateUpdate();
18671914
};
1868-
Base.prototype.render = function (time) {
1915+
Base.prototype.render = function () {
18691916
requestAnimationFrame(this.myLoop);
1870-
this.canvas.width = this.canvas.width;
1917+
this.time;
18711918
this.domain;
1919+
this.canvas.width = this.canvas.width;
18721920
var ctx = this.ctx;
18731921
ctx.fillStyle = this.bg;
18741922
ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
18751923
var c1 = this.c1;
18761924
if (c1) {
18771925
var p1 = c1.$comps.trans;
18781926
var v1 = c1.$comps.view;
1879-
ctx.fillStyle = "#" + v1.color.toString(16);
1880-
ctx.beginPath();
1881-
ctx.arc(p1.pos.x, p1.pos.y, 26, 0, 2 * Math.PI);
1882-
ctx.fill();
1927+
this._drawBall(ctx, p1.pos, "#" + v1.color.toString(16));
18831928
}
18841929
var c2 = this.c2;
18851930
if (c2) {
18861931
var p2 = c2.$comps.trans;
18871932
var v2 = c2.$comps.view;
1888-
ctx.fillStyle = "#" + v2.color.toString(16);
1889-
ctx.beginPath();
1890-
ctx.arc(p2.pos.x, p2.pos.y, 26, 0, 2 * Math.PI);
1891-
ctx.fill();
1933+
this._drawBall(ctx, p2.pos, "#" + v2.color.toString(16));
18921934
}
18931935
};
1936+
Base.prototype._drawBall = function (ctx, pos, color) {
1937+
ctx.fillStyle = color;
1938+
ctx.beginPath();
1939+
ctx.arc(pos.x, pos.y, 26, 0, 2 * Math.PI);
1940+
ctx.fill();
1941+
};
18941942
Base.prototype.initScene = function () {
18951943
var ent1 = new Entity();
18961944
var trans1 = ent1.add(Transform);
@@ -1902,8 +1950,12 @@ var StateSync = (function (exports) {
19021950
ent2.add(View);
19031951
trans2.pos.y = 35;
19041952
trans2.pos.x = 30;
1953+
var server = new Entity();
1954+
server.add(ServerTime);
19051955
this.c1 = ent1;
19061956
this.c2 = ent2;
1957+
this.server = server;
1958+
this.domain.reg(server);
19071959
this.domain.reg(ent1);
19081960
this.domain.reg(ent2);
19091961
};
@@ -1925,6 +1977,9 @@ var StateSync = (function (exports) {
19251977
this.c2.$comps.trans;
19261978
};
19271979
Server.prototype.fixedUpdate = function () {
1980+
var Time = this.time;
1981+
var serverTime = this.server.get(ServerTime);
1982+
serverTime.timestamp = Time.fixedTimestamp;
19281983
var c1 = Net.client1;
19291984
var c2 = Net.client2;
19301985
var data = this.domain.asData();
@@ -1981,12 +2036,14 @@ var StateSync = (function (exports) {
19812036
Client.prototype.fixedUpdate = function () {
19822037
var input = this._input;
19832038
var trans = this.mine.get(Transform);
1984-
trans.serverMove(
1985-
(input.isLeft ? -1 : 0) + (input.isRight ? 1 : 0),
1986-
0
1987-
);
2039+
var dirX = (input.isLeft ? -1 : 0) + (input.isRight ? 1 : 0);
2040+
trans.serverMove(dirX * this.time.fixedDeltaTime * 0.1, 0);
19882041
var data = this.domain.asData();
19892042
Net.send(data).recv(Net.server.domain.setData, Net.server.domain);
2043+
var serverTime = this.server.get(ServerTime);
2044+
this.time.timestamp =
2045+
this.time.timestamp * 0.5 + serverTime.timestamp * 0.5;
2046+
console.log(serverTime.timestamp, this.time.timestamp);
19902047
};
19912048
return Client;
19922049
})(Base);
@@ -1995,6 +2052,7 @@ var StateSync = (function (exports) {
19952052
exports.Client = Client;
19962053
exports.Net = Net;
19972054
exports.Server = Server;
2055+
exports.ServerTime = ServerTime;
19982056
exports.Time = Time;
19992057
exports.Transform = Transform;
20002058
exports.Vector = Vector;

0 commit comments

Comments
 (0)