{
  "version": 3,
  "file": "frontend.css",
  "sources": [
    "Frontend.svelte",
    "Logo.svelte",
    "RemoteControl.svelte",
    "Status.svelte"
  ],
  "sourcesContent": [
    "<script>\n    import { Router, Route } from \"svelte-routing\";\n    import Home from \"./routes/Home.svelte\";\n    import RemoteControl from \"./remote/RemoteControl.svelte\";\n\n    export let url= \"\";\n</script>\n\n<style>\n    :global(body) {\n        font: normal 13px Verdana, Geneva, sans-serif;\n        background-color: #657b83;\n        border:           0px;\n        margin:           0px;\n        padding:          0px;\n        max-width:        100%;\n        overflow-x:       hidden;\n        text-overflow:    ellipsis;\n    }\n</style>\n\n<Router url=\"{url}\">\n    <div>\n        <Route path=\"/MythFE/GetRemote\" component=\"{RemoteControl}\" />\n        <Route path=\"/\" component=\"{Home}\" />\n    </div>\n</Router>",
    "<style>\n    logo { color: #26c; }\n</style>\n<logo>\n    <img src=\"/images/mythtv.png\" alt=\"MythTV logo\">\n</logo>",
    "<script>\n    import Link from \"svelte-routing/src/Link.svelte\";\n    import RemoteButton from \"./RemoteButton.svelte\";\n    function buttonNumber(num) {\n        // Passed 0-8, buttons listed as 1-9\n        return (num + 1).toString();\n    }\n</script>\n\n<style>\n    remote {\n        background-color: #073642;\n    }\n    remotelayout {\n        grid-template-columns: repeat(3, 80px);\n        grid-template-rows: repeat(4, 58px) 10px 58px 10px repeat(3, 58px) 10px repeat(2, 58px);\n        width: auto;\n        display: grid;\n    }\n    linktext {\n        color: #fdf6e3;\n    }\n</style>\n\n<remote>\n    <!-- Buttons: 0-9, menu, info, back, mute, up, down, left, right, enter, ffwd, rewind-->\n    <remotelayout>\n        {#each {length: 9} as _, num}\n            <RemoteButton title={buttonNumber(num)} action={buttonNumber(num)}/>\n        {/each}\n        <div class=\"item left\"></div>\n        <RemoteButton title=\"0\" action=\"0\"/>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <RemoteButton title=\"Menu\" action=\"MENU\" icon=\"fas fa-bars\"/>\n        <RemoteButton title=\"Mute\" action=\"MUTE\" icon=\"fas fa-volume-mute\"/>\n        <RemoteButton title=\"Info\" action=\"INFO\" icon=\"fas fa-info\"/>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <RemoteButton title=\"^\" action=\"UP\" icon=\"fas fa-angle-up\"/>\n        <div class=\"item left\"></div>\n        <RemoteButton title=\"<\" action=\"LEFT\" icon=\"fas fa-angle-left\"/>\n        <RemoteButton title=\"ENTER\" action=\"SELECT\" icon=\"fas fa-check\"/>\n        <RemoteButton title=\">\" action=\"RIGHT\" icon=\"fas fa-angle-right\"/>\n        <RemoteButton title=\"BACK\" action=\"ESCAPE\" icon=\"fas fa-backspace\"/>\n        <RemoteButton title=\"v\" action=\"DOWN\" icon=\"fas fa-angle-down\"/>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <div class=\"item left\"></div>\n        <RemoteButton title=\"<<\" action=\"JUMPRWND\" icon=\"fas fa-angle-double-left\"/>\n        <RemoteButton title=\"II\" action=\"PAUSE\" icon=\"fas fa-pause\"/>\n        <RemoteButton title=\">>\" action=\"JUMPFFWD\" icon=\"fas fa-angle-double-right\"/>\n        <RemoteButton title=\"SEEKRWND\" action=\"SEEKRWND\" icon=\"fas fa-step-backward\"/>\n        <RemoteButton title=\"PLAY\" action=\"PLAY\" icon=\"fas fa-play\"/>\n        <RemoteButton title=\"SEEKFFWD\" action=\"SEEKFFWD\" icon=\"fas fa-step-forward\"/>\n        </remotelayout>\n</remote>\n<br>\n<div class=\"item left waves-effect waves-light btn-large\">\n    <Link to=\"/\"><linktext>Back to Status</linktext></Link>\n</div>\n",
    "<script>\n    import { onMount } from \"svelte\";\n    import { Link } from \"svelte-routing\";\n    import DetailItem from \"./DetailItem.svelte\";\n\n    let fe_status = getStatus();\n    async function getStatus() {\n        const params = {\n            method: 'GET',\n            headers: {\n                'Accept':       'application/json'\n            },\n        };\n        const res = await fetch('/Frontend/GetStatus', params);\n        const data = await res.json();\n        if (res.ok) {\n            return data.FrontendStatus;\n        } else {\n            console.log (\"failed to load status\");\n        }\n    }\n    onMount(getStatus);\n</script>\n\n<style>\n    status {\n        position: absolute;\n        top: 64px;\n        right: 0px;\n        left: 27px;\n        width: calc(100% - 27px);\n        height: calc(100% - 64px);\n        padding: 0px;\n        box-sizing: border-box;\n    }\n    linktext {\n        color: #002b36;\n    }\n</style>\n\n{#await fe_status}\n    <status>\n        <h2 class=\"truncate\">MythFrontend Status</h2>\n        <DetailItem title=\"This Frontend\">\n            <p>loading...</p>\n        </DetailItem>\n        <DetailItem title=\"Services\">\n            <div slot=\"action\">\n                <div class=\"item left waves-effect waves-light btn-small\">\n                    <Link to=\"/MythFE/GetRemote\"><linktext>Switch to Remote Control</linktext></Link>\n                </div>\n            </div>\n        </DetailItem>\n        <DetailItem title=\"Machine Information\">\n            <p>loading...</p>\n        </DetailItem>\n        </status>\n{:then Status}\n    <status>\n        <h2 class=\"truncate\">MythFrontend Status</h2>\n        <DetailItem title=\"This Frontend\">\n            Name: {Status.Name}\n            <br>\n            Version: {Status.Version}\n        </DetailItem>\n        <DetailItem title=\"Services\">\n            <div slot=\"action\">\n                <div class=\"item left waves-effect waves-light btn-small\">\n                    <Link to=\"/MythFE/GetRemote\"><linktext>Switch to Remote Control</linktext></Link>\n                </div>\n            </div>\n        </DetailItem>\n        <DetailItem title=\"Machine Information\">\n            <span>\n                The current frontend status is: {Status.State.state}\n                {#if Status.State.state == \"WatchingPreRecorded\"}\n                    , Title: {Status.State.title}, Subtitle: {Status.State.subtitle}\n                {/if}\n            </span>\n        </DetailItem>\n    </status>\n{/await}\n\n"
  ],
  "names": [],
  "mappings": "AASY,IAAI,AAAE,CAAC,AACX,IAAI,CAAE,MAAM,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,UAAU,CAC7C,gBAAgB,CAAE,OAAO,CACzB,MAAM,CAAY,GAAG,CACrB,MAAM,CAAY,GAAG,CACrB,OAAO,CAAW,GAAG,CACrB,SAAS,CAAS,IAAI,CACtB,UAAU,CAAQ,MAAM,CACxB,aAAa,CAAK,QAAQ,AAC9B,CAAC;ACjBD,IAAI,cAAC,CAAC,AAAC,KAAK,CAAE,IAAI,AAAE,CAAC;ACSrB,MAAM,eAAC,CAAC,AACJ,gBAAgB,CAAE,OAAO,AAC7B,CAAC,AACD,YAAY,eAAC,CAAC,AACV,qBAAqB,CAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CACtC,kBAAkB,CAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CACvF,KAAK,CAAE,IAAI,CACX,OAAO,CAAE,IAAI,AACjB,CAAC,AACD,QAAQ,eAAC,CAAC,AACN,KAAK,CAAE,OAAO,AAClB,CAAC;ACID,MAAM,cAAC,CAAC,AACJ,QAAQ,CAAE,QAAQ,CAClB,GAAG,CAAE,IAAI,CACT,KAAK,CAAE,GAAG,CACV,IAAI,CAAE,IAAI,CACV,KAAK,CAAE,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CACxB,MAAM,CAAE,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CACzB,OAAO,CAAE,GAAG,CACZ,UAAU,CAAE,UAAU,AAC1B,CAAC,AACD,QAAQ,cAAC,CAAC,AACN,KAAK,CAAE,OAAO,AAClB,CAAC"
}