Javascript in eZ Templates with literals and variables

ez-media.tpl

<div class="landing-video-surround">
    <div class="audio-player" id="LandingPageVideo"></div>
</div>
<script type="text/javascript">
    var videoURL = '{$video-url|trim}',
        videoHeight = '{$player_height}',
        videoWidth = '{$player_width}',
        jwPlayer = {'javascript/player.swf'|ezdesign},
        titleCard = '{$title-card-url}',
        rtmpFile = '{$rtmp-file|trim}',
        rtmpStreamer = '{$rtmp-streamer|trim}';
{literal}
    jwplayer("LandingPageVideo").setup({
        logo: {hide: true}, 
        height: videoHeight, 
        width: videoWidth, 
        'skin': '/extension/jsh/design/ezflow/javascript/modieus/modieus-slim.xml',
        image: titleCard,
        plugins: {
            "gapro-2": {
                accountid:'UA-688649-2',
                trackingobject:'_gaq',
                trackstarts:'true',
                trackpercentage:'true',
                tracktime:'true',
                idstring:'||streamer||/||file||'
            }
        },
        modes: [{
            type: "flash",
            src: jwPlayer,
            config: {
                bufferlength: 6,
                provider: "rtmp",
                streamer: rtmpStreamer,
                file: rtmpFile
            }
        },{
            type: "html5",
            config: {
                file: videoURL
            }
        }]
    })
{/literal}
</script>