[Theme] CRT

alphatoanant

@Dominus yeah, i noticed this while trying to things set up again this week. I haven't found out why yet but am going to take a shot at reordering the XML to see if it's a layering issue maybe?

There was also an idea in https://retropie.org.uk/forum/topic/9261/bug-box-art-displaying-incorrect-size-the-first-time-i-enter-a-system that seemed to imply that it may be fixed by updating each system's theme file so I am going to take a shot at that as well (not ideal but it may help me find out something about my layout to change).

Maybe something with me using maxSize for the images but just size for the video? I have a list of ideas I am going to try one at a time to step through it.

Fingers crossed =)

mattrixk

@alphatoanant said in [New Theme] 'CRT' with support for Video Preview:

Trying to get a theming flow set up in Windows using @mattrixk ES Toolkit which will help streamline building going forward.

I've been trying to do that, but I still just have stuff everywhere. I have a 32GB Thumb drive (it's literally a silicon mould of my thumb, with a usb drive shoved in it. My wife made it. It's awesome.) with all of my theme making stuff on it, including a bunch of windows builds of ES, all the Toolkit stuff, all my UXS stuff etc.

I also have a bunch of stuff on my home computer, and a bunch on my work computer. It tends to spread.

KillerQ

@alphatoanant said in [New Theme] 'CRT' with support for Video Preview:

@KillerQ said in [New Theme] 'CRT' with support for Video Preview:

@alphatoanant,
Outstanding. Do you mind if i showcase this theme and share it in some other groups?

That's awesome @KillerQ, thank you! I don't mind at all. If there is any info I can help with please let me know.

Other updates:

I am planning to get back into the theme soon (life caught up the last few months) to clean up things further and start looking into things like grid view and system view. I have a commit almost ready with backward compatibility added and I have started also working on a 4x3 version using the theme nesting idea from @mattrixk in the Io theme.

Trying to get a theming flow set up in Windows using @mattrixk ES Toolkit which will help streamline building going forward.

If you have any additional recommendations to try or need help please don't hesitate to let me know. Thank you!

@alphatoanant ,

Can you please shoot me an email at mattborkin@gmail.com?

Thanks!!

Jaxel

How do you guys scrape for a video, screenshot, boxart and marquee? I tried using Universal XML Scraper but it only ever gets 1 image, not all 3 images.

mattrixk

@Jaxel UXS has 2 different types of Profile: A Scrape Profile that tells it what types of media to download (boxart, fanart, videos, logos, mix image, etc) and a Mix Profile that tells it what kind of Mix Image to download. A Mix image is the one that has logo, screenshot, box art, etc all combined into a single image.

You can have a look in the UXS section of the ES Toolkit for a bit more of an explanation and also some custom Mix and Scrape profiles that might help give you an idea of what can be done with UXS.

Dominus

@alphatoanant Sounds good! Let me know too! I am still using my customized theme off yours. Other than what I did I have no idea what all the other stuff is lol so wouldn't know where to start.

mattrixk

@Dominus said in [New Theme] 'CRT' with support for Video Preview:

wouldn't know where to start

There is a guide to creating your own theme in the docs. It needs updating with the new video and carousel stuff, but all the basics are there.

alphatoanant

@Dominus I think I figured out the box art resize issue last night.

In my first version of the theme I was using maxSize for boxart and size for the video (as maxSize was not yet supported for sizing video yet).

In the latest version of ES maxSize is supported for sizing video so I tried updating that and it looks like it fixed the resizing issue (for the most part... more on this later)

So for your custom layout try updating this...

<video name="md_video">
<origin>0.5 0.5</origin>
<pos>0.325 0.35</pos>
<size>0.25 0.33</size>
<delay>0.01</delay>
<default>./_inc/videos/static.mp4</default>
<showSnapshotNoVideo>false</showSnapshotNoVideo>
<showSnapshotDelay>false</showSnapshotDelay>
</video>

to this...

<video name="md_video">
<origin>0.5 0.5</origin>
<pos>0.325 0.35</pos>
<maxSize>0.25 0.33</maxSize>
<delay>0.01</delay>
<default>./_inc/videos/static.mp4</default>
<showSnapshotNoVideo>false</showSnapshotNoVideo>
<showSnapshotDelay>false</showSnapshotDelay>
</video>

The caveats with this fix is that I don't think the theme will be backwards compatible with users that don't have the latest version of ES with maxSize support - I need to dig a bit more to test that though

Once I work that out I am planning to update my github repo with the above fix by the end of the week.

Also, there is still a bug on initial load of a system where the first box in a list will be sized incorrectly. I believe that is going to be fixed by the fix discussed in this thread: https://retropie.org.uk/forum/topic/9261/bug-box-art-displaying-incorrect-size-the-first-time-i-enter-a-system

Let me know if this helps

Dominus

@alphatoanant THANKS! That worked perfectly!

alphatoanant

Updates 4/30/2017:

Fixed box art scaling issue on video view
Added 4x3 layout option
Added display of genre and release date metadata
Increased the logo size a small amount
Added backward compatibility check for older versions of retropie without video support

Preview:

4x3 Layout
Basic View

Video View

Detailed View

Notes:

4x3 Layout

thanks to help from @mattrixk and his IO theme a 4x3 layout option is available now
To use it you will need to edit the root theme.xml and change

<include>./_inc/templates/16x9.xml</include>

to

<include>./_inc/templates/4x3.xml</include>

Box Art Scaling Bug

The latest version of ES video tag supports maxSize for sizing the video
The introduction of this caused a bug in the theme as I was using an old static sizing approach and it conflicted with the maxSize values I was using for the box art
This new version fixes that issue by updating the theme to use maxSize for the video tag
make sure you are on the latest version of ES (4.2 or above)

Display of Genre and Release Date metadata

I had been thinking of ways to add in genre and release date metadata based on comments in the thread and I think I found a way to display them while keeping the same clean layout
Please let me know what you think

Up Next?

Will try to test z-index support from @jdrassa in https://retropie.org.uk/forum/topic/9785/z-index-support-for-themes (thinking this will help me add an image that sits underneath the video to fill the CRT frame for videos that don't fill the frame completely)
Start playing with marquee placement
Grid View possibly?

Download latest:
https://github.com/anthonycaccese/es-theme-crt/archive/master.zip

Please let me know what you think, thank you!

alphatoanant

CRT and CRT Centered can be installed directly from the ES Themes menu within retropie now (just make sure you are on the latest version of the setup script)

KillerQ

@alphatoanant said in [New Theme] 'CRT' with support for Video Preview:

CRT and CRT Centered can be installed directly from the ES Themes menu within retropie now (just make sure you are on the latest version of the setup script)

Oh, fancy! Congrats!

alphatoanant

Updates 5/3/2017:

Updated CRT Bezel images from PNG to SVG to help with clean scaling on different resolutions
Added future support for z-index layering being discussed in this thread - https://retropie.org.uk/forum/topic/9785/z-index-support-for-themes

Up Next?

Work on marquee placement
Carousel Theming
Grid View possibly?

A Former User

Carousel theming!

alphatoanant

Updates 5/14/2017:

Added display of marquee
Cleaned up layout of metadata
Added basic styling of carousel

lolo

Hi great theme.
Can you make the crt-bezel.svg file in tate (vertical) mode.
I exported the file in png with Inkscape program to rotate it but I can't do it properly with the svg format.

alphatoanant

@lolo totally

I just pushed an update to github with svgs for the bezel (crt-bezel-tate.svg) and the screen (crt-screen-tate.svg)

You can find them both in the /_inc/images directory now

Hope that helps!

lolo

@alphatoanant Great, many thanks!

alphatoanant

Updates 5/21/2017:

Finishing up UXS profiles to streamline metadata scraping
Starting to experiment with grid view layouts. Here is a preview...

With Metadata
alt text

No Metadata
alt text

What do you think?

Dominus

@alphatoanant Wow that looks awesome too. Can Wheel art be used instead of boxes?