games/spacetac
games
/
spacetac
1
0
Fork 0
Code Releases Activity

Fixed laser animation and targetting display

This commit is contained in:
Michaël Lemaire 2018-06-06 00:34:03 +02:00
parent 50567ddb9d
commit 312ce0e99a
3 changed files with 76 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/ui/battle/Targetting.ts
View File

@ -167,21 +167,29 @@ module TK.SpaceTac.UI {
if (radius) {
if (angle) {
area.lineStyle(2, color, 0.6);
area.fillStyle(color, 0.2);
area.arc(0, 0, radius, angle, -angle, true);
area.lineStyle(1, color, 0.3);
area.fillStyle(color, 0.1);
area.arc(0, 0, radius * 0.95, angle * 0.95, -angle * 0.95, true);
area.addCircleArc({
radius: radius,
angle: { start: -angle, span: angle * 2 },
fill: { color: color, alpha: 0.2 },
border: { color: color, alpha: 0.6, width: 2 },
});
area.addCircleArc({
radius: radius * 0.95,
angle: { start: -angle * 0.95, span: angle * 1.9 },
fill: { color: color, alpha: 0.1 },
border: { color: color, alpha: 0.3, width: 1 },
});
} else {
area.lineStyle(2, color, 0.6);
area.fillStyle(color, 0.2);
area.fillCircle(0, 0, radius);
area.lineStyle(1, color, 0.3);
area.fillStyle(color, 0.1);
area.fillCircle(0, 0, radius * 0.95);
area.addCircle({
radius: radius,
fill: { color: color, alpha: 0.2 },
border: { color: color, alpha: 0.6, width: 2 },
});
area.addCircle({
radius: radius * 0.95,
fill: { color: color, alpha: 0.1 },
border: { color: color, alpha: 0.3, width: 1 },
});
}
}
}

10
src/ui/battle/WeaponEffect.ts
View File

@ -92,15 +92,14 @@ module TK.SpaceTac.UI {
/**
* Get the function that will be called to start the visual effect
*/
getEffectForWeapon(weapon: string, action: BaseAction | null): () => number {
getEffectForWeapon(weapon: string, action: TriggerAction): () => number {
switch (weapon) {
case "gatlinggun":
return () => this.gunEffect();
case "prokhorovlaser":
let trigger = <TriggerAction>nn(action);
let angle = arenaAngle(this.source, this.target);
let dangle = radians(trigger.angle) * 0.5;
return () => this.angularLaser(this.source, trigger.range, angle - dangle, angle + dangle);
let dangle = radians(action.angle) * 0.5;
return () => this.angularLaser(this.source, action.range, angle - dangle, angle + dangle);
default:
return () => this.defaultEffect();
}
@ -198,7 +197,8 @@ module TK.SpaceTac.UI {
laser.setOrigin(0, 0.5);
laser.setRotation(start_angle);
laser.setScale(radius / laser.width);
this.view.animations.addAnimation(laser, { rotation: end_angle }, duration).then(() => laser.destroy());
let dest_angle = laser.rotation + angularDifference(laser.rotation, end_angle);
this.view.animations.addAnimation(laser, { rotation: dest_angle }, duration).then(() => laser.destroy());
return duration;
}

49
src/ui/common/UIGraphics.ts
View File

@ -1,4 +1,15 @@
module TK.SpaceTac.UI {
export interface UIGraphicsCircleOptions {
center?: { x: number, y: number }
radius: number
fill?: { color: number, alpha?: number }
border?: { color: number, width?: number, alpha?: number }
}
export interface UIGraphicsCirclePortionOptions extends UIGraphicsCircleOptions {
angle: { start: number, span: number }
}
/**
* UI component that supports drawing simple shapes (circles, lines...)
*/
@ -23,5 +34,43 @@ module TK.SpaceTac.UI {
this.strokeRectShape(rect);
}
}
/**
* Add a portion of circle
*/
addCircleArc(options: UIGraphicsCirclePortionOptions): void {
let x = options.center ? options.center.x : 0;
let y = options.center ? options.center.y : 0;
if (options.fill) {
this.fillStyle(options.fill.color, options.fill.alpha);
this.slice(x, y, options.radius, options.angle.start, options.angle.start + options.angle.span, false);
this.fillPath();
}
if (options.border) {
this.lineStyle(options.border.width || 1, options.border.color, options.border.alpha);
this.slice(x, y, options.radius, options.angle.start, options.angle.start + options.angle.span, false);
this.strokePath();
}
}
/**
* Add a full circle
*/
addCircle(options: UIGraphicsCircleOptions): void {
let x = options.center ? options.center.x : 0;
let y = options.center ? options.center.y : 0;
if (options.fill) {
this.fillStyle(options.fill.color, options.fill.alpha);
this.fillCircle(x, y, options.radius);
}
if (options.border) {
this.lineStyle(options.border.width || 1, options.border.color, options.border.alpha);
this.strokeCircle(x, y, options.radius);
}
}
}
}