<!--
    Slate for ES-DE Frontend (slate-es-de)
    Author: ES-DE project
    License: Creative Commons CC-BY-NC-SA
    Based on: recalbox-multi by the Recalbox community
-->

<theme>
    <include>./navigationsounds.xml</include>
    <include>./languages.xml</include>
    <include>./colors.xml</include>

    <!-- Per-system band colors and platform info -->
    <include>./${system.theme}/colors.xml</include>
    <include>./${system.theme}/systeminfo.xml</include>

    <variables>
        <regularFont>./core/fonts/Exo2-RegularCondensed.otf</regularFont>
        <semiBoldFont>./core/fonts/Exo2-SemiBoldCondensed.otf</semiBoldFont>
        <boldFont>./core/fonts/Exo2-BoldCondensed.otf</boldFont>
        <systemConsoleImage>./${system.theme}/images/consolegame.svg</systemConsoleImage>
        <systemControllerImage>./${system.theme}/images/controller.svg</systemControllerImage>
        <systemLogo>./${system.theme}/images/logo.svg</systemLogo>
    </variables>

    <aspectRatio name="16:9">
        <include>./aspect-ratio-16-9.xml</include>
    </aspectRatio>
    <aspectRatio name="16:9_vertical">
        <include>./aspect-ratio-16-9-vertical.xml</include>
    </aspectRatio>
    <aspectRatio name="4:3">
        <include>./aspect-ratio-4-3.xml</include>
    </aspectRatio>
    <aspectRatio name="4:3_vertical">
        <include>./aspect-ratio-4-3-vertical.xml</include>
    </aspectRatio>

    <variant name="all">
        <view name="system, gamelist">
            <systemstatus name="systemStatus">
                <pos>0.985 0.014</pos>
                <height>0.035</height>
                <textRelativeScale>0.8</textRelativeScale>
                <color>${statusColor}</color>
                <backgroundColor>00000066</backgroundColor>
                <backgroundHorizontalPadding>0.004 0.005</backgroundHorizontalPadding>
                <backgroundVerticalPadding>0.004 0.004</backgroundVerticalPadding>
                <backgroundCornerRadius>0.003</backgroundCornerRadius>
                <entrySpacing>0.005</entrySpacing>
            </systemstatus>
            <clock name="clock">
                <pos>0.018 0.014</pos>
                <fontSize>0.033</fontSize>
                <color>${statusColor}</color>
                <backgroundColor>00000066</backgroundColor>
                <backgroundHorizontalPadding>0.004 0.004</backgroundHorizontalPadding>
                <backgroundVerticalPadding>0.004 0.004</backgroundVerticalPadding>
                <backgroundCornerRadius>0.003</backgroundCornerRadius>
                <format>%H:%M</format>
            </clock>
            <image name="background">
                <pos>0 0</pos>
                <size>1 1</size>
                <path>./core/images/background.png</path>
                <tile>true</tile>
                <color>${backgroundColor}</color>
                <zIndex>0</zIndex>
            </image>
            <image name="band1">
                <pos>0.80 0</pos>
                <size>0.03 1</size>
                <path>./core/images/band.png</path>
                <zIndex>5</zIndex>
            </image>
            <image name="band2">
                <pos>0.829 0</pos>
                <size>0.03 1</size>
                <path>./core/images/band.png</path>
                <zIndex>5</zIndex>
            </image>
            <image name="band3">
                <pos>0.858 0</pos>
                <size>0.03 1</size>
                <path>./core/images/band.png</path>
                <zIndex>5</zIndex>
            </image>
            <image name="band4">
                <pos>0.887 0</pos>
                <size>0.03 1</size>
                <path>./core/images/band.png</path>
                <zIndex>5</zIndex>
            </image>
        </view>

        <view name="system">
            <carousel name="systemCarousel">
                <type>horizontal</type>
                <staticImage>./${system.theme}/images/logo.svg</staticImage>
                <imageInterpolation>linear</imageInterpolation>
                <unfocusedItemOpacity>0.5</unfocusedItemOpacity>
                <color>${systemCarouselColor}</color>
                <text>${system.fullName}</text>
                <textColor>${systemCarouselTextColor}</textColor>
                <fontPath>${regularFont}</fontPath>
                <letterCase>uppercase</letterCase>
                <lineSpacing>1.2</lineSpacing>
            </carousel>
            <text name="gameCounter">
                <origin>0.5 0.5</origin>
                <systemdata>gamecount</systemdata>
                <fontPath>${regularFont}</fontPath>
                <horizontalAlignment>center</horizontalAlignment>
                <color>${systemGameCounterColor}</color>
                <backgroundColor>${systemGameCounterBackgroundColor}</backgroundColor>
                <letterCase>uppercase</letterCase>
                <zIndex>50</zIndex>
            </text>
            <image name="consolegame">
                <origin>0 1</origin>
                <path>${systemConsoleImage}</path>
            </image>
            <image name="controller">
                <origin>1 1</origin>
                <path>${systemControllerImage}</path>
            </image>
            <text name="info1, info2, info3, info4, info5, info6, info7, info8, info9, info10">
                <fontPath>${semiBoldFont}</fontPath>
                <horizontalAlignment>left</horizontalAlignment>
                <color>${systemInfoTextColor}</color>
            </text>
            <helpsystem name="help">
                <textColor>${systemHelpColor}</textColor>
                <iconColor>${systemHelpColor}</iconColor>
                <textColorDimmed>${systemHelpColorDimmed}</textColorDimmed>
                <iconColorDimmed>${systemHelpColorDimmed}</iconColorDimmed>
            </helpsystem>
        </view>

        <view name="gamelist">
            <textlist name="gamelistTextlist">
                <pos>0.025 0.201</pos>
                <size>0.39 0.711</size>
                <selectorColor>${gamelistTextlistSelectorColor}</selectorColor>
                <selectedColor>${gamelistTextlistSelectedColor}</selectedColor>
                <primaryColor>${gamelistTextlistPrimaryColor}</primaryColor>
                <secondaryColor>${gamelistTextlistSecondaryColor}</secondaryColor>
                <fontPath>${boldFont}</fontPath>
                <horizontalAlignment>left</horizontalAlignment>
                <horizontalMargin>0.01</horizontalMargin>
                <letterCase>uppercase</letterCase>
                <indicators>symbols</indicators>
                <collectionIndicators>symbols</collectionIndicators>
            </textlist>
            <image name="consolegame">
                <pos>0.02 0.17</pos>
                <origin>0 1</origin>
                <path>${systemConsoleImage}</path>
            </image>
            <image name="logo">
                <pos>0.78 0.17</pos>
                <origin>1 1</origin>
                <path>${systemLogo}</path>
            </image>
            <image name="backframe2">
                <pos>0.02 0.19</pos>
                <size>0.4 0.735</size>
                <path>./core/images/frame.png</path>
                <color>${gamelistBackFrameColor}</color>
                <zIndex>10</zIndex>
            </image>
            <image name="backframe3">
                <pos>0.44 0.19</pos>
                <size>0.54 0.735</size>
                <path>./core/images/frame.png</path>
                <color>${gamelistBackFrameColor}</color>
                <zIndex>10</zIndex>
            </image>
            <text name="collectionsSystemName, customCollectionsSystemName">
                <origin>1 1</origin>
                <metadataElement>true</metadataElement>
                <fontPath>${regularFont}</fontPath>
                <fontSize>0.025</fontSize>
                <horizontalAlignment>right</horizontalAlignment>
                <color>${gamelistCollectionsHeaderColor}</color>
                <letterCase>uppercase</letterCase>
                <lineSpacing>1.0</lineSpacing>
            </text>
            <text name="customCollectionsHeader, customCollectionsHeaderNoMedia">
                <origin>1 1</origin>
                <fontPath>${regularFont}</fontPath>
                <horizontalAlignment>right</horizontalAlignment>
                <color>${gamelistCollectionsHeaderColor}</color>
                <letterCase>uppercase</letterCase>
                <lineSpacing>1.0</lineSpacing>
            </text>
            <text name="collectionsSystemName">
                <pos>0.42 0.174</pos>
            </text>
            <text name="customCollectionsHeaderNoMedia">
                <visible>false</visible>
            </text>
            <text name="labelReleasedate, labelDeveloper, labelPublisher,
                        labelGenre, labelPlayers, labelLastplayed, labelPlaytime">
                <fontPath>${boldFont}</fontPath>
                <color>${gamelistDefaultTextColor}</color>
                <letterCase>uppercase</letterCase>
            </text>
            <text name="developer, publisher, genre, players, playtime">
                <fontPath>${regularFont}</fontPath>
                <color>${gamelistDefaultTextColor}</color>
                <letterCase>uppercase</letterCase>
            </text>
            <text name="description">
                <container>true</container>
                <containerVerticalSnap>true</containerVerticalSnap>
                <containerScrollSpeed>1</containerScrollSpeed>
                <containerStartDelay>4.5</containerStartDelay>
                <containerResetDelay>7</containerResetDelay>
                <metadata>description</metadata>
                <fontPath>${semiBoldFont}</fontPath>
                <color>${gamelistDefaultTextColor}</color>
                <letterCase>uppercase</letterCase>
                <lineSpacing>1.2</lineSpacing>
            </text>
            <datetime name="releasedate, lastplayed">
                <fontPath>${regularFont}</fontPath>
                <color>${gamelistDefaultTextColor}</color>
                <letterCase>uppercase</letterCase>
            </datetime>
            <text name="labelReleasedate">
                <text>${langLabelReleasedate}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <datetime name="releasedate">
                <metadata>releasedate</metadata>
            </datetime>
            <text name="labelDeveloper">
                <text>${langLabelDeveloper}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <text name="developer">
                <metadata>developer</metadata>
            </text>
            <text name="labelPublisher">
                <text>${langLabelPublisher}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <text name="publisher">
                <metadata>publisher</metadata>
            </text>
            <text name="labelGenre">
                <text>${langLabelGenre}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <text name="genre">
                <metadata>genre</metadata>
            </text>
            <text name="labelPlayers">
                <text>${langLabelPlayers}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <text name="players">
                <metadata>players</metadata>
            </text>
            <text name="labelLastplayed">
                <text>${langLabelLastPlayed}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <datetime name="lastplayed">
                <metadata>lastplayed</metadata>
            </datetime>
            <text name="labelPlaytime">
                <text>${langLabelPlayTime}:</text>
                <metadataElement>true</metadataElement>
            </text>
            <text name="playtime">
                <metadata>playtime</metadata>
            </text>
            <rating name="rating">
                <pos>0.453 0.203</pos>
                <interpolation>nearest</interpolation>
                <color>${gamelistRatingColor}</color>
                <filledPath>./core/images/rating_filled.svg</filledPath>
                <unfilledPath>./core/images/rating_empty.svg</unfilledPath>
                <overlay>false</overlay>
            </rating>
            <gamelistinfo name="gamelistInfo">
                <fontPath>${boldFont}</fontPath>
                <horizontalAlignment>right</horizontalAlignment>
                <color>${gamelistInfoColor}</color>
            </gamelistinfo>
            <badges name="badges">
                <horizontalAlignment>left</horizontalAlignment>
                <direction>row</direction>
                <slots>collection, folder, favorite, completed, kidgame, broken, controller, altemulator, manual</slots>
                <controllerPos>0.5 0.572</controllerPos>
                <controllerSize>0.81</controllerSize>
                <folderLinkPos>0.54 0.64</folderLinkPos>
                <folderLinkSize>0.31</folderLinkSize>
                <itemMargin>-1.0 0.005</itemMargin>
            </badges>
            <helpsystem name="help">
                <textColor>${gamelistHelpColor}</textColor>
                <iconColor>${gamelistHelpColor}</iconColor>
                <textColorDimmed>${gamelistHelpColorDimmed}</textColorDimmed>
                <iconColorDimmed>${gamelistHelpColorDimmed}</iconColorDimmed>
            </helpsystem>
        </view>
    </variant>

    <variant name="withVideos">
        <view name="gamelist">
            <video name="gameVideo">
                <origin>0.5 0.5</origin>
                <imageType>image</imageType>
                <interpolation>nearest</interpolation>
                <pillarboxes>true</pillarboxes>
                <pillarboxThreshold>0.85 0.90</pillarboxThreshold>
                <delay>1.7</delay>
                <scrollFadeIn>true</scrollFadeIn>
            </video>
        </view>
    </variant>

    <variant name="withoutVideos">
        <view name="gamelist">
            <image name="gameImage">
                <origin>0.5 0.5</origin>
                <imageType>image</imageType>
                <interpolation>nearest</interpolation>
                <scrollFadeIn>true</scrollFadeIn>
            </image>
        </view>
    </variant>

    <variant name="noGameMedia">
        <view name="gamelist">
            <textlist name="gamelistTextlist">
                <pos>0.04 0.201</pos>
                <size>0.92 0.71</size>
                <horizontalAlignment>center</horizontalAlignment>
                <horizontalMargin>0.01</horizontalMargin>
            </textlist>
            <image name="backframe1">
                <pos>0.02 0.19</pos>
                <size>0.96 0.735</size>
                <path>./core/images/frame.png</path>
                <color>${gamelistBackFrameColor}</color>
            </image>
            <image name="backframe2">
                <visible>false</visible>
            </image>
            <image name="backframe3">
                <visible>false</visible>
            </image>
            <badges name="badges">
                <visible>false</visible>
            </badges>
            <text name="customCollectionsHeaderNoMedia">
                <visible>true</visible>
            </text>
            <text name="collectionsSystemName, customCollectionsSystemName, customCollectionsHeader">
                <visible>false</visible>
            </text>
            <text name="labelReleasedate, labelDeveloper, labelPublisher, labelGenre, labelPlayers,
                        labelLastplayed, labelPlaytime, developer, publisher, genre, players,
                        playtime, description">
                <visible>false</visible>
            </text>
            <datetime name="releasedate, lastplayed">
                <visible>false</visible>
            </datetime>
            <gamelistinfo name="gamelistInfo">
                <visible>false</visible>
            </gamelistinfo>
            <rating name="rating">
                <visible>false</visible>
            </rating>
        </view>
    </variant>
</theme>