Script to show game titles in overview

[thatkookooguy]

Hi Everyone! I found it really hard to search for games when looking at a console and none are expanded.

I wrote a little script that writes the name of each game on top of it's cover so I'll be able to find games easier and even use the browser's search functionality on a console.

Here's the script and how to use it:

1. Create a new bookmark in your favorite browser

2. Enter the following name: "Launchbox - inject names"

3. As the URL, enter the following code: 

javascript:(function() { $('.box-item').each(function(){ let qElm = $(this); let boxWidth = this.clientWidth; let imgWidth = qElm.find('img')[0].clientWidth; let boxHeight = this.clientHeight; let imgHeight = qElm.find('img')[0].clientHeight; let hSpace = (boxHeight - imgHeight) / 2; let wSpace = (boxWidth - imgWidth) / 2; let name = $.trim(qElm.next().find('h3').text()); qElm.append(`<div style="position: absolute;bottom: ${hSpace + 5}px;left: ${wSpace}px;right: ${wSpace}px;color: white;display: flex;align-items: center;text-align: center;justify-content: center;background: rgba(0, 0, 0, 0.5)">${name}</div>`); });})()

I usually put this in my bookmark bar for easy access. Look at the gif for a quick demo.

I hope someone else will find this useful ?
 

 

Notice that it might take a while if your rom collection for a specific console is huge ?

Edited October 2, 2018 by thatkookooguy
grammar + nit fixes