galaxy/static/scripts/templates/hda-templates.html

<!-- ---------------------------------------------------------------------- outer structure -->
<script type="text/template" class="template-hda" id="template-hda-skeleton">
<div class="dataset hda">
    <div class="dataset-warnings">
        {{#if error}}
        <div class="errormessagesmall">
            {{#local}}There was an error getting the data for this dataset{{/local}}:
            {{#local}}{{error}}{{/local}}
        </div>
        {{/if}}

        {{#if deleted}}
            {{#if purged}}
            <div class="dataset-purged-msg warningmessagesmall"><strong>
                {{#local}}This dataset has been deleted and removed from disk.{{/local}}
            </strong></div>

            {{else}}{{! deleted, not purged }}
            <div class="dataset-deleted-msg warningmessagesmall"><strong>
                {{#local}}This dataset has been deleted.{{/local}}
            </strong></div>
            {{/if}}
        {{/if}}

        {{#unless visible}}
        <div class="dataset-hidden-msg warningmessagesmall"><strong>
            {{#local}}This dataset has been hidden.{{/local}}
        </strong></div>
        {{/unless}}
    </div>

    <div class="dataset-selector"><span class="fa fa-2x fa-square-o"></span></div>
    <div class="dataset-primary-actions"></div>
    {{! adding a tabindex here allows focusing the title bar and the use of keydown to expand the dataset display }}
    <div class="dataset-title-bar clear" tabindex="0">
        <span class="dataset-state-icon state-icon"></span>
        <div class="dataset-title">
            <span class="hda-hid">{{ hid }}</span>
            <span class="dataset-name">{{ name }}</span>
        </div>
    </div>

    <div class="dataset-body"></div>
</div>
</script>

<!-- ---------------------------------------------------------------------- body structure -->
<script type="text/template" class="template-hda" id="template-hda-body">
<div class="dataset-body">
    {{#if body}}
    <div class="dataset-summary">
        {{{ body }}}
    </div>
    <div class="dataset-actions clear">
        <div class="left"></div>
        <div class="right"></div>
    </div>

    {{else}}
    <div class="dataset-summary">
        {{#if misc_blurb }}
        <div class="dataset-blurb">
            <span class="value">{{ misc_blurb }}</span>
        </div>
        {{/if}}

        {{#if data_type }}
        <div class="dataset-datatype">
            <label class="prompt">{{#local}}format{{/local}}</label>
            <span class="value">{{ data_type }}</span>
        </div>
        {{/if}}

        {{#if metadata_dbkey }}
        <div class="dataset-dbkey">
            <label class="prompt">{{#local}}database{{/local}}</label>
            <span class="value">
                {{ metadata_dbkey }}
            </span>
        </div>
        {{/if}}

        {{#if misc_info}}
        <div class="dataset-info">
            <span class="value">{{ misc_info }}</span>
        </div>
        {{/if}}
    </div>{{! end dataset-summary }}

    <div class="dataset-actions clear">
        <div class="left"></div>
        <div class="right"></div>
    </div>

    {{#unless deleted }}
    <div class="tags-display"></div>
    <div class="annotation-display"></div>

    <div class="dataset-display-applications">
        {{#each display_apps}}
        <div class="display-application">
            <span class="display-application-location">{{label}}</span>
            <span class="display-application-links">
                {{#each links}}
                <a target="{{target}}" href="{{href}}">{{#local}}{{text}}{{/local}}</a>
                {{/each}}
            </span>
        </div>
        {{/each}}

        {{#each display_types}}
        <div class="display-application">
            <span class="display-application-location">{{label}}</span>
            <span class="display-application-links">
                {{#each links}}
                <a target="{{target}}" href="{{href}}">{{#local}}{{text}}{{/local}}</a>
                {{/each}}
            </span>
        </div>
        {{/each}}
    </div>

    <div class="dataset-peek">
    {{#if peek }}
        <pre class="peek">{{{ peek }}}</pre>
    {{/if}}
    </div>

    {{/unless}}{{! unless deleted }}

    {{/if}}{{! end if body }}
</div>
</script>