spee.ch/views/partials/asset.handlebars

<div id="asset-display-component">
    <div id="asset-status">
        <div id="searching-message" hidden="true">
            <p>Sit tight, we're searching the LBRY blockchain for your asset!</p>
            {{> progressBar}}
            <p>Curious what magic is happening here? <a class="link--primary" target="blank" href="https://lbry.io/faq/what-is-lbry">Learn more.</a></p>
        </div>
        <div id="failure-message" hidden="true">
            <p>Unfortunately, we couldn't download your asset from LBRY.  You can help us out by sharing the below error message in the <a class="link--primary" href="https://discord.gg/YjYbwhS" target="_blank">LBRY discord</a>.</p>
            <i><p id="error-message"></p></i>
        </div>
    </div>
    <div id="asset-holder" hidden="true">
        {{#ifConditional claimInfo.contentType '===' 'video/mp4'}}
            {{> video}}
        {{else}}
            {{> image}}
        {{/ifConditional}}
        <div>
            <a id="asset-boilerpate" class="link--primary fine-print" href="/{{claimInfo.claimId}}/{{claimInfo.name}}">hosted via Spee&lt;h</a>
        </div>

    </div>
</div>

<script type="text/javascript">

    const asset = new Asset();
    asset.setState('src', '/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}');
    asset.setState('claimName', '{{claimInfo.name}}');
    asset.setState('claimId', '{{claimInfo.claimId}}');
    asset.setState('fileExt', '{{claimInfo.fileExt}}');
    asset.setState('contentType', '{{claimInfo.contentType}}');
    console.log('asset state:', asset.state);
    asset.checkClaimAvailability();

</script>