New design draft

main.go

@@ -11,6 +11,7 @@ import (
 	"github.com/go-gl/glfw/v3.3/glfw"
 	"github.com/libretro/ludo/audio"
 	"github.com/libretro/ludo/core"
+	"github.com/libretro/ludo/dat"
 	"github.com/libretro/ludo/history"
 	"github.com/libretro/ludo/input"
 	"github.com/libretro/ludo/menu"
@@ -20,6 +21,7 @@ import (
 	"github.com/libretro/ludo/scanner"
 	"github.com/libretro/ludo/settings"
 	"github.com/libretro/ludo/state"
+	"github.com/libretro/ludo/utils"
 	"github.com/libretro/ludo/video"
 )
 
@@ -40,6 +42,9 @@ func runLoop(vid *video.Video, m *menu.Menu) {
 		m.ProcessHotkeys()
 		ntf.Process(dt)
 		vid.ResizeViewport()
+		w, h := vid.Window.GetFramebufferSize()
+		vid.Font.UpdateResolution(w, h)
+		vid.BoldFont.UpdateResolution(w, h)
 		m.UpdatePalette()
 		input.Poll()
 		if !state.MenuActive {
@@ -135,7 +140,20 @@ func main() {
 				if err != nil {
 					ntf.DisplayAndLog(ntf.Error, "Menu", err.Error())
 				} else {
-					m.WarpToQuickMenu()
+					scanner.ScanFile(gamePath, func(game dat.Game) {
+						name := game.Name
+						if name == "" {
+							name = utils.FileName(gamePath)
+						}
+						history.Push(history.Game{
+							Path:     gamePath,
+							Name:     name,
+							System:   game.System,
+							CorePath: state.CorePath,
+						})
+						history.Load()
+						m.WarpToQuickMenu()
+					})
 				}
 			}
 		} else {

menu/hints.go

@@ -5,13 +5,23 @@ import (
 )
 
 // Used to easily compose different hint bars based on the context.
-func stackHint(stack *float32, icon uint32, label string, h int) {
-	menu.Font.SetColor(darkGrey)
-	*stack += 30 * menu.ratio
-	menu.DrawImage(icon, *stack, float32(h)-70*menu.ratio, 70*menu.ratio, 70*menu.ratio, 1.0, darkGrey)
+func stackHintLeft(stack *float32, icon uint32, label string, h int) {
+	menu.Font.SetColor(hintTextColor)
+	menu.DrawImage(icon, *stack, float32(h)-79*menu.ratio, 70*menu.ratio, 70*menu.ratio, 1.0, 0, hintTextColor)
 	*stack += 70 * menu.ratio
-	menu.Font.Printf(*stack, float32(h)-23*menu.ratio, 0.4*menu.ratio, label)
-	*stack += menu.Font.Width(0.4*menu.ratio, label)
+	menu.Font.Printf(*stack, float32(h)-30*menu.ratio, 0.5*menu.ratio, label)
+	*stack += menu.Font.Width(0.5*menu.ratio, label)
+	*stack += 32 * menu.ratio
+}
+
+// Used to easily compose different hint bars based on the context.
+func stackHintRight(stack *float32, icon uint32, label string, h int) {
+	*stack -= menu.Font.Width(0.5*menu.ratio, label)
+	menu.Font.SetColor(hintTextColor)
+	menu.Font.Printf(*stack, float32(h)-30*menu.ratio, 0.5*menu.ratio, label)
+	*stack -= 70 * menu.ratio
+	menu.DrawImage(icon, *stack, float32(h)-79*menu.ratio, 70*menu.ratio, 70*menu.ratio, 1.0, 0, hintTextColor)
+	*stack -= 32 * menu.ratio
 }
 
 func hintIcons() (arrows, upDown, leftRight, a, b, x, y, start, slct, guide uint32) {

menu/input.go

@@ -20,7 +20,7 @@ var (
 // Update takes care of calling the update method of the current scene.
 // Each scene has it's own input logic to allow a variety of navigation systems.
 func (m *Menu) Update(dt float32) {
-	currentScene := m.stack[len(m.stack)-1]
+	currentScene := m.stack[m.focus-1]
 	currentScene.update(dt)
 }
 
@@ -67,22 +67,20 @@ func withRepeat() func(dt float32, pressed bool, f func()) {
 func genericInput(list *entry, dt float32) {
 	// Down
 	repeatDown(dt, input.NewState[0][libretro.DeviceIDJoypadDown] == 1, func() {
-		list.ptr++
-		if list.ptr >= len(list.children) {
-			list.ptr = 0
+		if list.ptr < len(list.children)-1 {
+			list.ptr++
+			audio.PlayEffect(audio.Effects["down"])
+			genericAnimate(list)
 		}
-		audio.PlayEffect(audio.Effects["down"])
-		genericAnimate(list)
 	})
 
 	// Up
 	repeatUp(dt, input.NewState[0][libretro.DeviceIDJoypadUp] == 1, func() {
-		list.ptr--
-		if list.ptr < 0 {
-			list.ptr = len(list.children) - 1
+		if list.ptr > 0 {
+			list.ptr--
+			audio.PlayEffect(audio.Effects["up"])
+			genericAnimate(list)
 		}
-		audio.PlayEffect(audio.Effects["up"])
-		genericAnimate(list)
 	})
 
 	// OK
@@ -122,7 +120,10 @@ func genericInput(list *entry, dt float32) {
 		if len(menu.stack) > 1 {
 			audio.PlayEffect(audio.Effects["cancel"])
 			menu.stack[len(menu.stack)-2].segueBack()
-			menu.stack = menu.stack[:len(menu.stack)-1]
+			if len(menu.stack) > 2 {
+				menu.stack = menu.stack[:len(menu.stack)-1]
+			}
+			menu.focus--
 		}
 	}
 

menu/menu.go

@@ -16,12 +16,14 @@ var menu *Menu
 
 // Menu is a type holding the menu state, the stack of scenes, tweens, etc
 type Menu struct {
-	stack  []Scene
-	icons  map[string]uint32
-	tweens Tweens
-	scroll float32
-	ratio  float32
-	t      float64
+	focus    int // this is a hack to switch focus between top tabs and the other scenes
+	oldFocus int // this is used to come back to the previous focus when a dialog is canceled
+	stack    []Scene
+	icons    map[string]uint32
+	tweens   Tweens
+	scroll   float32
+	ratio    float32
+	t        float64
 
 	*video.Video // we embbed video here to have direct access to drawing functions
 }
@@ -40,6 +42,7 @@ func Init(v *video.Video) *Menu {
 	menu.icons = map[string]uint32{}
 
 	menu.Push(buildTabs())
+	menu.Push(buildHome())
 
 	menu.ContextReset()
 
@@ -50,6 +53,16 @@ func Init(v *video.Video) *Menu {
 // OK on a menu entry.
 func (m *Menu) Push(s Scene) {
 	m.stack = append(m.stack, s)
+	m.focus++
+}
+
+func haveTransparentBackground() bool {
+	for i := 0; i <= len(menu.stack)-1; i++ {
+		if menu.stack[i].Entry().label == "Quick Menu" {
+			return true
+		}
+	}
+	return false
 }
 
 // Render takes care of rendering the menu
@@ -64,11 +77,11 @@ func (m *Menu) Render(dt float32) {
 	w, h := m.GetFramebufferSize()
 	m.ratio = float32(w) / 1920
 
-	if state.CoreRunning {
-		m.DrawRect(0, 0, float32(w), float32(h), 0, bgColor.Alpha(0.85))
-	} else {
-		m.DrawRect(0, 0, float32(w), float32(h), 0, bgColor)
+	c := bgColor
+	if haveTransparentBackground() {
+		c = bgColor.Alpha(0.85)
 	}
+	m.DrawImage(menu.icons["bg"], 0, 0, float32(w), float32(h), 1, 0, c)
 
 	m.tweens.Update(dt)
 
@@ -80,7 +93,9 @@ func (m *Menu) Render(dt float32) {
 
 		m.stack[i].render()
 	}
-	m.stack[currentScreenIndex].drawHintBar()
+	if m.focus-1 < len(m.stack) {
+		m.stack[m.focus-1].drawHintBar()
+	}
 }
 
 // ContextReset uploads the UI images to the GPU.
@@ -102,10 +117,14 @@ func (m *Menu) ContextReset() {
 		m.icons[filename] = video.NewImage(path)
 	}
 
-	currentScreenIndex := len(m.stack) - 1
-	curList := m.stack[currentScreenIndex].Entry()
-	for i := range curList.children {
-		curList.children[i].thumbnail = 0
+	for h := 0; h < len(m.stack); h++ {
+		list := m.stack[h].Entry()
+		for i := range list.children {
+			list.children[i].thumbnail = 0
+			for j := range list.children[i].children {
+				list.children[i].children[j].thumbnail = 0
+			}
+		}
 	}
 }
 
@@ -116,8 +135,9 @@ func (m *Menu) WarpToQuickMenu() {
 	m.stack = []Scene{}
 	m.Push(buildTabs())
 	m.stack[0].segueNext()
-	m.Push(buildMainMenu())
+	m.Push(buildHome())
 	m.stack[1].segueNext()
 	m.Push(buildQuickMenu())
 	m.tweens.FastForward()
+	menu.focus = len(menu.stack)
 }

menu/menu_test.go

@@ -15,17 +15,17 @@ import (
 func Test_WarpToQuickMenu(t *testing.T) {
 	m := Init(&video.Video{})
 
-	t.Run("Starts with a single scene if no game is running", func(t *testing.T) {
+	t.Run("Starts with 2 scenes if no game is running", func(t *testing.T) {
 		got := len(menu.stack)
-		want := 1
+		want := 2
 		if !reflect.DeepEqual(got, want) {
 			t.Errorf("got = %v, want %v", got, want)
 		}
 	})
 
 	t.Run("Starts on the tabs scene if no game is running", func(t *testing.T) {
 		got := menu.stack[0].Entry().label
-		want := "Ludo"
+		want := "Tabs"
 		if !reflect.DeepEqual(got, want) {
 			t.Errorf("got = %v, want %v", got, want)
 		}

menu/notifications.go

@@ -21,8 +21,6 @@ var severityBgColor = map[ntf.Severity]video.Color{
 
 // RenderNotifications draws the list of notification messages on the viewport
 func (m *Menu) RenderNotifications() {
-	fbw, fbh := m.GetFramebufferSize()
-	m.Font.UpdateResolution(fbw, fbh)
 	var h float32 = 75
 	stack := h
 	for _, n := range ntf.List() {

menu/palette.go

@@ -9,14 +9,18 @@ import (
 var white = video.Color{R: 1, G: 1, B: 1, A: 1}
 var black = video.Color{R: 0, G: 0, B: 0, A: 1}
 
-var orange = video.Color{R: 0.8, G: 0.4, B: 0.1, A: 1}
-var cyan = video.Color{R: 0.8784, G: 1, B: 1, A: 1}
-var darkBlue = video.Color{R: 0.1, G: 0.1, B: 0.4, A: 1}
+var blue = video.Color{R: 0.129, G: 0.441, B: 0.684, A: 1}
+// var orange = video.Color{R: 0.8, G: 0.4, B: 0.1, A: 1}
+// var cyan = video.Color{R: 0.8784, G: 1, B: 1, A: 1}
+var darkBlue = video.Color{R: 0.1, G: 0.15, B: 0.4, A: 1}
+var lightBlue = video.Color{R: 0.329, G: 0.641, B: 0.884, A: 1}
 
 var lightGrey = video.Color{R: 0.75, G: 0.75, B: 0.75, A: 1}
 var mediumGrey = video.Color{R: 0.5, G: 0.5, B: 0.5, A: 1}
 var darkGrey = video.Color{R: 0.25, G: 0.25, B: 0.25, A: 1}
-var darkerGrey = video.Color{R: 0.10, G: 0.10, B: 0.10, A: 1}
+// var darkerGrey = video.Color{R: 0.10, G: 0.10, B: 0.10, A: 1}
+// var ultraDarkerGrey = video.Color{R: 0.05, G: 0.05, B: 0.05, A: 1}
+var ultraDarkerBlue = video.Color{R: 0, G: 0.05, B: 0.15, A: 1}
 
 var darkInfo = video.Color{R: 0.04, G: 0.36, B: 0.46, A: 1}
 var lightInfo = video.Color{R: 0.53, G: 0.89, B: 1.00, A: 1}
@@ -31,18 +35,37 @@ var darkWarning = video.Color{R: 0.47, G: 0.40, B: 0.04, A: 1}
 var lightWarning = video.Color{R: 1.00, G: 0.92, B: 0.53, A: 1}
 
 var bgColor = white
-var cursorBg = cyan
+var cursorBg = white
 var textColor = black
+var sepColor = lightGrey
+var hintTextColor = darkGrey
+var hintBgColor = white
+var tabTextColor = blue
+var tabBgColor = white
+var titleColor = darkBlue
 
 // UpdatePalette updates the color palette to honor the dark theme
 func (m *Menu) UpdatePalette() {
 	bgColor = white
-	cursorBg = cyan
+	cursorBg = white
 	textColor = black
+	sepColor = lightGrey
+	hintTextColor = darkGrey
+	hintBgColor = white
+	tabTextColor = blue
+	tabBgColor = white
+	titleColor = darkBlue
 
 	if state.CoreRunning || settings.Current.VideoDarkMode {
-		bgColor = darkerGrey
+		bgColor = ultraDarkerBlue
 		cursorBg = darkBlue
 		textColor = white
+		sepColor = darkBlue
+		hintTextColor = lightBlue
+		hintBgColor = ultraDarkerBlue
+		tabTextColor = lightBlue
+		tabBgColor = darkBlue
+		titleColor = lightBlue
 	}
 }
+