vdr-plugin-skindesigner/skins/estuary4vdr/xmlfiles/plug-tvguideng-root.xml

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE displayplugin SYSTEM "../../../dtd/displayplugin.dtd">

<displayplugin x="0" y="0" width="100%" height="100%" fadetime="0" scaletvx="0" scaletvy="0" scaletvwidth="100%" scaletvheight="100%">

    <viewelement name="background_hor">
        <area x="0" y="0" width="100%" height="100%" layer="1">
            <drawimage imagetype="skinpart" x="0" y="0" width="100%" height="100%" path="background_menu" />
        </area>
        <area x="2%" y="0" width="30%" height="7%" layer="2">
            <drawimage name="icon" imagetype="icon" path="tvguideng" x="0" valign="center" width="{areaheight}*0.8" height="{areaheight}*0.8"/>
            <drawtext x="{width(icon)} + 20" valign="center" font="{regular}" fontsize="{areaheight}*{headerfontsize}/100" color="{fontdefault}" text="TV Guide" />
        </area>
        <area x="0" y="0" width="100%" height="100%" layer="2">
            <drawrectangle x="2%" y="10%" width="96%" height="65%" color="{menuback}" />
            <drawrectangle x="17%" y="77%" width="73%" height="14%" color="{menuback}" />
            <drawrectangle x="5%" y="16%" width="2" height="59%" color="{menubackline}" />
            <drawrectangle x="17%" y="16%" width="2" height="59%" color="{menubackline}" />
            <drawrectangle x="2%" y="16%" width="96%" height="2" color="{menubackline}" />
            <drawrectangle x="{areawidth}*0.98 - 3" y="14%" width="2" height="2%" color="{menubackline}" />
        </area>
    </viewelement>

    <viewelement name="background_ver">
        <area x="0" y="0" width="100%" height="100%" layer="1">
            <drawimage imagetype="skinpart" x="0" y="0" width="100%" height="100%" path="background_menu" />
        </area>
        <area x="2%" y="0" width="30%" height="7%" layer="2">
            <drawimage name="icon" imagetype="icon" path="tvguideng" x="0" valign="center" width="{areaheight}*0.8" height="{areaheight}*0.8"/>
            <drawtext x="{width(icon)} + 20" valign="center" font="{regular}" fontsize="{areaheight}*{headerfontsize}/100" color="{fontdefault}" text="TV Guide" />
        </area>
        <area x="0" y="0" width="100%" height="100%" layer="2">
            <drawrectangle x="2%" y="9%" width="96%" height="68%" color="{menuback}" />
            <drawrectangle x="6%" y="78%" width="92%" height="14%" color="{menuback}" />
            <drawrectangle x="{areawidth}*0.02 - 2" y="9%" width="2" height="68%" color="{menubackline}" />
            <drawrectangle x="{areawidth}*0.06 - 2" y="9%" width="2" height="68%" color="{menubackline}" />
            <drawrectangle x="2%" y="9%" width="96%" height="2" color="{menubackline}" />
            <drawrectangle x="6%" y="13%" width="92%" height="2" color="{menubackline}" />
            <drawrectangle x="6%" y="21%" width="92%" height="2" color="{menubackline}" />
            <drawrectangle x="2%" y="{areaheight}*0.77 - 2" width="6%" height="2" color="{menubackline}" />
        </area>
    </viewelement>

    <viewelement name="header_hor">
        <area x="18%" y="78%" width="50%" height="4%" layer="3">
            <drawtext x="0" y="0" font="{regular}" fontsize="{areaheight}*{tvgcurrenttitlesize}/100" width="100%" color="{fontdefault}" text="{day} {date} {start} - {stop}: {title}" />
        </area>
        <areascroll orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="18%" y="{areaheight}*0.815" width="71%" height="9%" layer="3">
            <drawtextbox x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{tvgcurrenttextsize}/100" color="{fontdefault}" text="{description}" />
        </areascroll>
    </viewelement>

    <viewelement name="header_ver">
        <area x="7%" y="79%" width="80%" height="4%" layer="3">
            <drawtext x="0" y="0" font="{regular}" fontsize="{areaheight}*{tvgcurrenttitlesize}/100" width="100%" color="{fontdefault}" text="{day} {date} {start} - {stop}: {title}" />
        </area>
        <areascroll orientation="vertical" mode="forthandback" delay="3000" scrollspeed="medium" x="7%" y="{areaheight}*0.825" width="71%" height="8%" layer="3">
            <drawtextbox x="0" y="0" font="{regular}" width="100%" fontsize="{areaheight}*{tvgcurrenttextsize}/100" color="{fontdefault}" text="{description}" />
        </areascroll>
    </viewelement>

    <viewelement name="footer_hor">
        <!--red-->
        <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>

        <!--red-->
        <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>

        <!--red-->
        <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>

        <!--red-->
        <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>
    </viewelement>

    <viewelement name="footer_ver">
        <!--red-->
        <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue1}" x="0" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>

        <!--red-->
        <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue2}" x="25%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>

        <!--red-->
        <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue3}" x="50%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>

        <!--red-->
        <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_red" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{red4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{red}" />
        </area>
        <!--green-->
        <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_green" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{green4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{green}" />
        </area>
        <!--yellow-->
        <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_yellow" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{yellow4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{yellow}" />
        </area>
        <!--blue-->
        <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="2">
            <drawimage imagetype="skinpart" path="button_blue" x="0" y="0" width="100%" height="100%"/>
        </area>
        <area condition="{blue4}" x="75%" y="94%" width="25%" height="6%" layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="{areaheight}*{buttonfontsize}/100" color="{fontdefault}" text="{blue}" />
        </area>
    </viewelement>

    <viewelement name="time_hor">
        <area x="60%" y="0" width="25%" height="7%" layer="2">
            <drawtext align="right" valign="center" fontsize="70%" font="{regular}" color="{fontdefault}" text="{dayname} {day}. {monthnameshort}" />
        </area>
        <area x="87%" y="0" width="13%" height="7%" layer="2">
            <drawimage imagetype="icon" x="0" valign="center" width="{areaheight}*0.5" height="{areaheight}*0.5" path="clock" />
            <drawtext name="clock" x="25%" valign="center" fontsize="80%" font="{digital}" color="{fontdefault}" text="{hour}:{printf('%02d', min)}" />
            <drawtext name="clocksec" x="{posx(clock)} + {width(clock)}" y="{areaheight}/2 -  {height(clocksec)}/2 + {height(clock)}/2 - {height(clocksec)}/2 - 3" fontsize="60%" font="{digital}" color="{fontdefault}" text=":{printf('%02d', sec)}" />
        </area>
    </viewelement>

    <viewelement name="time_ver">
        <area x="60%" y="0" width="25%" height="7%" layer="2">
            <drawtext align="right" valign="center" fontsize="70%" font="{regular}" color="{fontdefault}" text="{dayname} {day}. {monthnameshort}" />
        </area>
        <area x="87%" y="0" width="13%" height="7%" layer="2">
            <drawimage imagetype="icon" x="0" valign="center" width="{areaheight}*0.5" height="{areaheight}*0.5" path="clock" />
            <drawtext name="clock" x="25%" valign="center" fontsize="80%" font="{digital}" color="{fontdefault}" text="{hour}:{printf('%02d', min)}" />
            <drawtext name="clocksec" x="{posx(clock)} + {width(clock)}" y="{areaheight}/2 -  {height(clocksec)}/2 + {height(clock)}/2 - {height(clocksec)}/2 - 3" fontsize="60%" font="{digital}" color="{fontdefault}" text=":{printf('%02d', sec)}" />
        </area>
    </viewelement>

    <viewelement name="datetimeline_hor">
        <area x="2%" y="10%" width="15%" height="5%" layer="3">
            <drawtext name="datetime" x="20%" valign="center" fontsize="70%" font="{regular}" color="{fontdefault}" text="{weekday} {date}" />
        </area>
    </viewelement>

    <viewelement name="datetimeline_ver">
        <area x="2%" y="9%" width="4%" height="10%" layer="3">
            <drawtextvertical align="center" valign="center" fontsize="{areawidth}*0.45" font="{regular}" color="{fontdefault}" text="{date}" />
        </area>
    </viewelement>

    <viewelement name="timeindicator_hor">
        <area x="{areawidth}*0.17 + 2" y="16%" width="{areawidth}*0.81 - 1" height="59%" layer="4">
            <drawrectangle x="{areawidth}*{percenttotal}/1000 - 1" y="0" width="3" height="100%" color="{tvgtimeline}" />
        </area>
    </viewelement>

    <viewelement name="timeindicator_ver">
        <area x="6%" y="21%" width="92%" height="56%" layer="4">
            <drawrectangle x="0" y="{areaheight}*{percenttotal}/1000" width="100%" height="2" color="{tvgtimeline}" />
        </area>
    </viewelement>

    <grid name="timeline_hor" x="15%" y="11%" width="81%" height="5%">
        <area layer="3">
            <drawrectangle x="{areawidth}*1/6-5" y="60%" width="2" height="40%" color="{menubackline}" />
            <drawrectangle x="{areawidth}*2/6-5" y="80%" width="2" height="20%" color="{menubackline}" />
            <drawrectangle x="{areawidth}*3/6-5" y="80%" width="2" height="20%" color="{menubackline}" />
            <drawrectangle x="{areawidth}*4/6-5" y="70%" width="2" height="30%" color="{menubackline}" />
            <drawrectangle x="{areawidth}*5/6-5" y="80%" width="2" height="20%" color="{menubackline}" />
            <drawrectangle x="{areawidth}-5" y="80%" width="2" height="20%" color="{menubackline}" />
        </area>
        <area layer="4">
            <drawtext condition="not{fullhour}" x="2" y="0" fontsize="55%" font="{regular}" color="{fontdefault}" text="{timestring}" />
            <drawtext condition="{fullhour}" x="2" y="0" fontsize="55%" font="{regular}" color="{fontactive}" text="{timestring}" />
        </area>
    </grid>

    <grid name="timeline_ver" x="2%" y="{areaheight}*0.2" width="4%" height="56%">
        <area layer="3">
            <drawrectangle x="75%" y="{areaheight}*1/6-6" width="25%" height="2" color="{menubackline}" />
            <drawrectangle x="90%" y="{areaheight}*2/6-6" width="10%" height="2" color="{menubackline}" />
            <drawrectangle x="90%" y="{areaheight}*3/6-6" width="10%" height="2" color="{menubackline}" />
            <drawrectangle x="80%" y="{areaheight}*4/6-6" width="20%" height="2" color="{menubackline}" />
            <drawrectangle x="90%" y="{areaheight}*5/6-6" width="10%" height="2" color="{menubackline}" />
            <drawrectangle x="90%" y="{areaheight}-6" width="20%" height="2" color="{menubackline}" />
        </area>
        <area layer="4">
            <drawtext condition="not{fullhour}" x="3%" y="0" fontsize="21%" font="{regular}" color="{fontdefault}" text="{timestring}" />
            <drawtext condition="{fullhour}" x="3%" y="0" fontsize="21%" font="{regular}" color="{fontactive}" text="{timestring}" />
        </area>
    </grid>

    <grid name="channels_hor" x="5%" y="16%" width="12%" height="59%">
        <area layer="3">
            <drawtext name="channum" x="{areawidth}*0.3 - {width(channum)}" valign="center" fontsize="50%" font="{regular}" color="{fontdefault}" text="{number}" />
            <drawimage condition="{channellogoexists}" name="logo" x="{areawidth}*0.3 + {areawidth}*0.7/2 - {width(logo)}/2" imagetype="channellogo" path="{channelid}" width="50%" height="70%" valign="center" />
            <drawtext condition="not{channellogoexists}" name="channame" x="33%" width="66%" valign="center" font="regular" color="{fontdefault}" fontsize="35%" text="{name}" />
            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
        </area>
    </grid>

    <grid name="channels_ver" x="6%" y="13%" width="92%" height="8%">
        <area layer="3">
            <drawtext name="channum" x="{areawidth}*0.2 - {width(channum)}" valign="center" fontsize="50%" font="{regular}" color="{fontdefault}" text="{number}" />
            <drawimage condition="{channellogoexists}" name="logo" x="{areawidth}*0.2 + {areawidth}*0.7/2 - {width(logo)}/2" imagetype="channellogo" path="{channelid}" width="70%" height="70%" valign="center" />
            <drawtext condition="not{channellogoexists}" name="channame" x="23%" width="76%" valign="center" font="regular" color="{fontdefault}" fontsize="30%" text="{name}" />
            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
        </area>
    </grid>

    <grid name="channelgroups_hor" x="2%" y="16%" width="3%" height="59%">
        <area layer="3">
            <drawtextvertical align="center" valign="center" font="{regular}" fontsize="50%" color="{fontdefault}" text="{group}" />
            <drawrectangle x="0" y="{areaheight}-3" width="100%" height="2" color="{menubackline}" />
        </area>
    </grid>

    <grid name="channelgroups_ver" x="6%" y="9%" width="92%" height="4%">
       <area layer="3">
            <drawtext align="center" valign="center" font="{regular}" fontsize="90%" color="{fontdefault}" text="{group}" />
            <drawrectangle x="{areawidth}-3" y="" width="2" height="100%" color="{menubackline}" />
        </area>
     </grid>

    <grid name="schedules_hor" x="{areawidth}*0.17 + 2" y="16%" width="{areawidth}*0.81 - 1" height="59%">
        <area condition="{current}" layer="3">
            <fill color="{menubackactive}" />
        </area>
        <area condition="{tvgshowtime}" layer="4">
            <drawtext condition="not{current}" x="10" width="96%" y="{areaheight}*{tvghorgriddateposy}/100" font="regular" color="{fontdefault}" fontsize="{areaheight}*{tvghorgriddatesize}/100" text="{start} - {stop}" />
            <drawtext condition="not{current}" x="10" width="96%" y="{areaheight}*{tvghorgridtitleposy}/100" font="regular" color="{fontdefault}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
            <drawtext condition="{current}" x="10" width="96%" y="{areaheight}*{tvghorgriddateposy}/100" font="regular" color="{fontmenuactive}" fontsize="{areaheight}*{tvghorgriddatesize}/100" text="{start} - {stop}" />
            <drawtext condition="{current}" x="10" width="96%" y="{areaheight}*{tvghorgridtitleposy}/100" font="regular" color="{fontmenuactive}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
            <drawimage condition="{timer}" imagetype="icon" path="ico_rec_selected" x="{areawidth} - {areaheight}*0.4 - 5" y="5" width="0.4*{areaheight}" height="0.4*{areaheight}" />
        </area>
        <area condition="not{tvgshowtime}" layer="4">
            <drawtext condition="not{current}" x="10" width="96%" valign="center" font="regular" color="{fontdefault}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
            <drawtext condition="{current}" x="10" width="96%" valign="center"  font="regular" color="{fontmenuactive}" fontsize="{areaheight}*{tvghorgridtitlesize}/100" text="{title}" />
            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
            <drawimage condition="{timer}" imagetype="icon" path="ico_rec_selected" x="{areawidth} - {areaheight}*0.4 - 5" y="5" width="0.4*{areaheight}" height="0.4*{areaheight}" />
        </area>
    </grid>

    <grid name="schedules_ver" x="6%" y="21%" width="92%" height="56%">
        <area condition="{current}" layer="3">
            <fill color="{menubackactive}" />
        </area>
        <area condition="{tvgshowtime}" layer="4">
            <drawtext condition="not{current}" x="2%" width="97%" y="{areawidth}*{tvgvergriddateposy}/100" font="regular" color="{fontdefault}" fontsize="{areawidth}*{tvgvergriddatesize}/100" text="{start} - {stop}" />
            <drawtextbox condition="not{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontdefault}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
            <drawtext condition="{current}" x="2%" width="97%" y="{areawidth}*{tvgvergriddateposy}/100" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*{tvgvergriddatesize}/100" text="{start} - {stop}" />
            <drawtextbox condition="{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
        </area>
        <area condition="not{tvgshowtime}" layer="4">
            <drawtextbox condition="not{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontdefault}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
            <drawtextbox condition="{current}" x="2%" width="97%" y="{areawidth}*{tvgvergridtitleposy}/100" height="{areawidth}*0.85" font="regular" color="{fontmenuactive}" fontsize="{areawidth}*{tvgvergridtitlesize}/100" text="{title}" />
            <drawrectangle x="0" y="{areaheight}-2" width="100%" height="2" color="{menubackline}" />
            <drawrectangle x="{areawidth}-2" y="0" width="2" height="100%" color="{menubackline}" />
        </area>
    </grid>

    <viewelement name="channeljump">
        <area x="40%" y="44%" width="20%" height="10%" layer="6">
            <fill color="{menubackline}" />
            <drawrectangle x="2" y="2" width="{areawidth}-4" height="{areaheight}-4" color="{tvgrecmenuback}" />
        </area>
        <area x="40%" y="44%" width="20%" height="10%" layer="7">
            <drawtext align="center" valign="center" font="regular" color="{fontdefault}" fontsize="70%" text="{channel}" />
        </area>
    </viewelement>

</displayplugin>