<script type="application/javascript" src="{{ url_for('static', filename='js/plugins/media/info.js') }}"></script>

<script type="text/x-template" id="tmpl-media-info">
    <div class="info-container">
        <div class="row">
            <div class="col-3 attr">URL</div>
            <div class="col-9 value">
                <a :href="item.url" v-text="item.url" target="_blank"></a>
            </div>
        </div>

        <div class="row" v-if="item.title">
            <div class="col-3 attr">Title</div>
            <div class="col-9 value">
                <a :href="'https://imdb.com/title/' + item.imdb_id" v-if="item.imdb_id" target="_blank">
                    {% raw %}{{ item.title }}{% endraw %}
                </a>
                <span v-text="item.title" v-else></span>
            </div>
        </div>

        <div class="row" v-if="item.description || item.synopsis">
            <div class="col-3 attr">Description</div>
            <div class="col-9 value" v-text="item.description || item.synopsis"></div>
        </div>

        <div class="row" v-if="item.channelTitle">
            <div class="col-3 attr">Channel</div>
            <div class="col-9 value">
                <a :href="'https://www.youtube.com/channel/' + item.channelId" v-if="item.channelId" target="_blank">
                    {% raw %}{{ item.channelTitle }}{% endraw %}
                </a>
                <span v-text="item.channelTitle" v-else></span>
            </div>
        </div>

        <div class="row" v-if="item.publishedAt">
            <div class="col-3 attr">Published</div>
            <div class="col-9 value" v-text="new Date(item.publishedAt).toDateString()"></div>
        </div>

        <div class="row" v-if="item.duration">
            <div class="col-3 attr">Duration</div>
            <div class="col-9 value" v-text="convertTime(item.duration)"></div>
        </div>

        <div class="row" v-if="item.size">
            <div class="col-3 attr">Size</div>
            <div class="col-9 value" v-text="convertSize(item.size)"></div>
        </div>

        <div class="row" v-if="item.peers != null || item.num_peers != null">
            <div class="col-3 attr">Peers</div>
            <div class="col-9 value" v-text="item.peers || item.num_peers"></div>
        </div>

        <div class="row" v-if="item.seeds != null">
            <div class="col-3 attr">Seeds</div>
            <div class="col-9 value" v-text="item.seeds"></div>
        </div>
    </div>
</script>

