Center view on starting tile, add README content (#6)

* center view on starting tile
* add screenshot and some text to readme

README.md

@@ -1 +1,18 @@
 # Tiny World
+
+A tiny, slow-paced world and colony building game.
+
+Made with [Arche](https://github.com/mlange-42/arche) and [Ebitengine](https://github.com/hajimehoshi/ebiten).
+Very early work in progress!
+
+![Tiny World screenshot](https://github.com/mlange-42/tiny-world/assets/44003176/9d7b0314-3c29-4773-8670-7e3a9b0df74b)
+
+## Usage
+
+Currently, you need to clone the repository and run the game with [Go](https://go.dev):
+
+```shell
+git clone https://github.com/mlange-42/tiny-world.git
+cd tiny-world
+go run .
+```

game/render/center_view.go

@@ -0,0 +1,42 @@
+package render
+
+import (
+	"image"
+
+	"github.com/mlange-42/arche/ecs"
+	"github.com/mlange-42/arche/generic"
+	"github.com/mlange-42/tiny-world/game/res"
+)
+
+// UI is a system to render the user interface.
+type CenterView struct {
+	view    generic.Resource[res.View]
+	screen  generic.Resource[res.EbitenImage]
+	terrain generic.Resource[res.Terrain]
+
+	isInitialized bool
+}
+
+// InitializeUI the system
+func (s *CenterView) InitializeUI(world *ecs.World) {
+	s.view = generic.NewResource[res.View](world)
+	s.screen = generic.NewResource[res.EbitenImage](world)
+	s.terrain = generic.NewResource[res.Terrain](world)
+}
+
+// UpdateUI the system
+func (s *CenterView) UpdateUI(world *ecs.World) {
+	if !s.isInitialized {
+		view := s.view.Get()
+		screen := s.screen.Get()
+		terrain := s.terrain.Get()
+		view.Center(image.Point{terrain.Width() / 2, terrain.Height() / 2}, screen.Width, screen.Height)
+		s.isInitialized = true
+	}
+}
+
+// PostUpdateUI the system
+func (s *CenterView) PostUpdateUI(world *ecs.World) {}
+
+// FinalizeUI the system
+func (s *CenterView) FinalizeUI(world *ecs.World) {}

game/res/view.go

@@ -9,6 +9,22 @@ type View struct {
 	MouseOffset           int
 }
 
+func NewView(tileWidth, tileHeight int) View {
+	return View{
+		TileWidth:   tileWidth,
+		TileHeight:  tileHeight,
+		Zoom:        1,
+		MouseOffset: tileHeight,
+	}
+}
+
+func (v *View) Center(cell image.Point, screenWidth, screenHeight int) {
+	pos := v.TileToGlobal(cell.X, cell.Y)
+	v.Zoom = 1
+	v.X = pos.X - screenWidth/2
+	v.Y = pos.Y - screenHeight/2
+}
+
 func (v *View) Offset() image.Point {
 	return image.Pt(int(float64(v.X)*v.Zoom), int(float64(v.Y)*v.Zoom))
 }

main.go

@@ -13,6 +13,10 @@ import (
 	"github.com/mlange-42/tiny-world/game/terr"
 )
 
+const (
+	worldSize = 256
+)
+
 func main() {
 	ebiten.SetVsyncEnabled(true)
 	g := game.NewGame(model.New())
@@ -21,13 +25,13 @@ func main() {
 
 	ecs.AddResource(&g.Model.World, &g.Screen)
 
-	terrain := res.Terrain{Grid: res.NewGrid[terr.Terrain](100, 100)}
+	terrain := res.Terrain{Grid: res.NewGrid[terr.Terrain](worldSize, worldSize)}
 	ecs.AddResource(&g.Model.World, &terrain)
 
-	landUse := res.LandUse{Grid: res.NewGrid[terr.Terrain](100, 100)}
+	landUse := res.LandUse{Grid: res.NewGrid[terr.Terrain](worldSize, worldSize)}
 	ecs.AddResource(&g.Model.World, &landUse)
 
-	landUseEntities := res.LandUseEntities{Grid: res.NewGrid[ecs.Entity](100, 100)}
+	landUseEntities := res.LandUseEntities{Grid: res.NewGrid[ecs.Entity](worldSize, worldSize)}
 	ecs.AddResource(&g.Model.World, &landUseEntities)
 
 	selection := res.Selection{}
@@ -47,12 +51,7 @@ func main() {
 	ecs.AddResource(&g.Model.World, &hud)
 	ecs.AddResource(&g.Model.World, &ui)
 
-	view := res.View{
-		TileWidth:   48,
-		TileHeight:  24,
-		Zoom:        1,
-		MouseOffset: 24,
-	}
+	view := res.NewView(48, 24)
 	ecs.AddResource(&g.Model.World, &view)
 
 	production := res.Production{}
@@ -80,6 +79,7 @@ func main() {
 
 	// =========== UI Systems ===========
 
+	g.Model.AddUISystem(&render.CenterView{})
 	g.Model.AddUISystem(&render.Terrain{})
 	g.Model.AddUISystem(&render.UI{})