Add loading indicator for jobs list

This also fixes an occasional bug which occurs when jobs list is being
displayed, but job data is not loaded yet and links are not rendering
properly.
This commit is contained in:
Piotr Sarnacki 2015-03-18 11:35:25 +01:00
parent 0ce971bd60
commit 69d6f9e8a1

View File

@ -15,61 +15,65 @@
{{#each job in view.jobs}} {{#each job in view.jobs}}
{{#view 'jobs-item' context=job}} {{#view 'jobs-item' context=job}}
<div {{bind-attr class=":tile :tile--jobs :row job.state" }}> <div {{bind-attr class=":tile :tile--jobs :row job.state" }}>
{{#link-to "job" repo job}} {{#if job.config}}
{{#link-to "job" job.repo job}}
<div class="tile-status tile-status--job"> <div class="tile-status tile-status--job">
<span {{bind-attr class=":icon :icon--job job.state"}}></span> <span {{bind-attr class=":icon :icon--job job.state"}}></span>
</div> </div>
<p class="job-id jobs-item build-status"> <p class="job-id jobs-item build-status">
<span class="icon icon--hash"></span> <span class="icon icon--hash"></span>
{{#if job.id}} {{#if job.id}}
{{#if job.repo.slug}} {{#if job.repo.slug}}
{{number}} {{number}}
{{/if}}
{{/if}} {{/if}}
</p>
<p {{bind-attr class=":job-os :jobs-item :build-os config.os"}}>
<span {{bind-attr class=":icon config.os"}}></span>
{{!-- {{config.os}} --}}
</p>
{{#if view.languages}}
<p class="job-lang jobs-item build-lang">
<span class="icon icon--lang"></span>
{{view.languages}}
</p>
{{else}}
<p class="job-lang jobs-item build-lang is-empty">
<span class="icon icon--lang"></span>
no language set
</p>
{{/if}} {{/if}}
</p>
<p {{bind-attr class=":job-os :jobs-item :build-os config.os"}}> {{#if config.env}}
<span {{bind-attr class=":icon config.os"}}></span> <p class="job-env jobs-item build-env">
{{!-- {{config.os}} --}} <span class="icon icon--env"></span>
</p> {{config.env}}
</p>
{{else}}
<p class="job-env jobs-item build-env is-empty">
<span class="icon icon--env"></span>
no environments set
</p>
{{/if}}
{{#if view.languages}} <p class="job-duration jobs-item" {{bind-attr title="startedAt"}}>
<p class="job-lang jobs-item build-lang"> <span class="icon icon--clock"></span>
<span class="icon icon--lang"></span> {{format-duration duration}}
{{view.languages}}
</p> </p>
{{else}}
<p class="job-lang jobs-item build-lang is-empty">
<span class="icon icon--lang"></span>
no language set
</p>
{{/if}}
{{#if config.env}} {{!-- <p class="" {{bind-attr title="formattedFinishedAt"}}>
<p class="job-env jobs-item build-env"> <span class="icon icon--cal"></span>
<span class="icon icon--env"></span> {{format-time finishedAt}}
{{config.env}} </p> --}}
</p>
{{else}}
<p class="job-env jobs-item build-env is-empty">
<span class="icon icon--env"></span>
no environments set
</p>
{{/if}}
<p class="job-duration jobs-item" {{bind-attr title="startedAt"}}> {{/link-to}}
<span class="icon icon--clock"></span> {{else}}
{{format-duration duration}} <span class="sync-spinner sync-spinner--grey"><i></i><i></i><i></i></span>
</p> {{/if}}
{{!-- <p class="" {{bind-attr title="formattedFinishedAt"}}>
<span class="icon icon--cal"></span>
{{format-time finishedAt}}
</p> --}}
{{/link-to}}
</div> </div>
{{/view}} {{/view}}
{{!-- {{job.configKeys}} --}} {{!-- {{job.configKeys}} --}}