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

map: Added current location marker

Browse source
This commit is contained in:
Michaël Lemaire 2017-03-16 00:45:52 +01:00
parent 01d5d0ce14
commit 18daed4c72
7 changed files with 113 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
TODO
View file

@ -1,7 +1,7 @@
* UI: Use a common component class, and a layer abstraction
* Character sheet: allow item moving to another ship
* Character sheet: add tooltips (on values, slots and equipments)
* Character sheet: add levelling up (spending of available points)
* Character sheet: add levelling up (spending of available points) + initial character creation
* Character sheet: disable interaction during battle (except for loot screen)
* Add battle statistics and/or critics in outcome dialog
* Ensure that tweens and particle emitters get destroyed once animation is done (or view changes)
@ -33,7 +33,6 @@
* TacticalAI: add pauses to not play too quickly
* TacticalAI: replace BullyAI
* Add retreat from battle
* Map: current fleet position is not visible enough
* Map: restore fog of war
* Map: add information on current star/location + information on hovered location
* Map: add stores and shipyards

44
graphics/ui/map.svg
View file

@ -15,7 +15,7 @@
viewBox="0 0 507.99999 285.75001"
version="1.1"
id="svg8"
inkscape:version="0.92.0 r15299"
inkscape:version="0.92.1 r15371"
sodipodi:docname="map.svg">
<defs
id="defs2">
@ -338,9 +338,9 @@
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="3.0789058"
inkscape:cx="1479.9807"
inkscape:cy="585.99498"
inkscape:zoom="2.8284271"
inkscape:cx="1297.0192"
inkscape:cy="519.42484"
inkscape:document-units="mm"
inkscape:current-layer="layer5"
showgrid="false"
@ -638,6 +638,42 @@
id="tspan4898"
sodipodi:role="line">JUMP</tspan></text>
</g>
<g
id="g4933"
transform="translate(-0.31764818,-0.26517487)"
inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/map/current-location.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96">
<rect
style="fill:none;fill-rule:evenodd;stroke:#778189;stroke-width:0.5291667;stroke-linecap:butt;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.78297873"
id="rect4935"
width="32.08374"
height="32.08374"
x="326.9437"
y="127.3401"
ry="0" />
<path
inkscape:connector-curvature="0"
id="path4922"
d="m 338.42724,128.4328 h 20.96794"
style="fill:#ffffff;fill-rule:evenodd;stroke:#ffffff;stroke-width:0.5291667;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.6404255" />
<use
transform="translate(-12.274461,29.184755)"
height="100%"
width="100%"
id="use4924"
xlink:href="#path4922"
y="0"
x="0" />
<rect
ry="0"
y="126.83313"
x="326.41156"
height="32.08374"
width="32.08374"
id="rect4920"
style="fill:none;fill-rule:evenodd;stroke:#cdd8e2;stroke-width:0.5291667;stroke-linecap:butt;stroke-linejoin:bevel;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.76382979" />
</g>
</g>
<g
inkscape:groupmode="layer"

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 130 KiB

After

Width:  |  Height:  |  Size: 131 KiB

BIN
out/assets/images/map/current-location.png Normal file
View file

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 963 B

1
src/ui/Preload.ts
View file

@ -79,6 +79,7 @@ module TS.SpaceTac.UI {
this.loadImage("common/standard-bar-background.png");
this.loadImage("common/standard-bar-foreground.png");
this.loadImage("map/starsystem-background.png");
this.loadImage("map/current-location.png");
this.loadImage("map/zoom-in.png");
this.loadImage("map/zoom-out.png");
this.loadImage("map/button-jump.png");

61
src/ui/map/CurrentLocationMarker.ts Normal file
View file

@ -0,0 +1,61 @@
module TS.SpaceTac.UI {
/**
* Marker to show current location on the map
*/
export class CurrentLocationMarker extends Phaser.Image {
private zoom = -1;
private moving = false;
private fleet: FleetDisplay;
constructor(parent: UniverseMapView, fleet: FleetDisplay) {
super(parent.game, 0, 0, "map-current-location");
this.fleet = fleet;
this.anchor.set(0.5, 0.5);
this.alpha = 0;
}
tweenTo(alpha: number, scale: number) {
this.game.tweens.removeFrom(this);
this.game.tweens.removeFrom(this.scale);
this.game.tweens.create(this).to({ alpha: alpha }, 500).start();
this.game.tweens.create(this.scale).to({ x: scale, y: scale }, 500).start();
}
show() {
this.position.set(this.fleet.x, this.fleet.y);
let scale = (this.zoom >= 2) ? (this.fleet.scale.x * 4) : 0.002;
this.alpha = 0;
this.scale.set(scale * 10, scale * 10);
this.tweenTo(1, scale);
}
hide() {
this.tweenTo(0, this.scale.x * 10);
}
setZoom(level: number) {
if (level != this.zoom) {
this.zoom = level;
if (!this.moving) {
this.show();
}
}
}
setFleetMoving(moving: boolean) {
if (moving != this.moving) {
this.moving = moving;
if (moving) {
this.hide();
} else {
this.show();
}
}
}
}
}

2
src/ui/map/FleetDisplay.ts
View file

@ -76,6 +76,7 @@ module TS.SpaceTac.UI {
let dy = location.universe_y - this.fleet.location.universe_y;
let distance = Math.sqrt(dx * dx + dy * dy);
let angle = Math.atan2(dx, dy);
this.map.current_location.setFleetMoving(true);
this.goToOrbitPoint(angle - Math.PI / 2, 40, 1, () => {
let duration = 10000 * distance / speed;
if (on_leave) {
@ -87,6 +88,7 @@ module TS.SpaceTac.UI {
if (this.fleet.battle) {
this.game.state.start("router");
} else {
this.map.current_location.setFleetMoving(false);
this.map.updateInfo(location.star);
this.loopOrbit();
}

8
src/ui/map/UniverseMapView.ts
View file

@ -22,6 +22,9 @@ module TS.SpaceTac.UI {
// Fleets
player_fleet: FleetDisplay;
// Frame to highlight current location
current_location: CurrentLocationMarker;
// Button to jump to another system
button_jump: Phaser.Button;
@ -71,6 +74,9 @@ module TS.SpaceTac.UI {
this.layer_universe.add(this.player_fleet);
this.current_location = new CurrentLocationMarker(this, this.player_fleet);
this.layer_universe.add(this.current_location);
this.button_jump = new Phaser.Button(this.game, 0, 0, "map-button-jump", () => this.doJump());
this.button_jump.anchor.set(0.5, 0.5);
this.button_jump.visible = false;
@ -113,6 +119,8 @@ module TS.SpaceTac.UI {
* Update info on all star systems (fog of war, available data...)
*/
updateInfo(current_star: Star | null) {
this.current_location.setZoom(this.zoom);
this.starsystems.forEach(system => system.updateInfo(this.zoom, system.starsystem == current_star));
let location = this.player.fleet.location;