Skip to content

Commit

Permalink
#66: Second pass at article view HTML
Browse files Browse the repository at this point in the history 
Added basic loading indicator, refactored table to have better structure
(I think)
  • Loading branch information
@roryschadler
roryschadler committed Jan 27, 2022
1 parent e1b36f9 commit b67a694
Showing 1 changed file with 54 additions and 32 deletions.
86 changes: 54 additions & 32 deletions app/src/pages/explorer/article/article.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,44 +5,66 @@
</md-app-drawer>
<md-app-content>
<div class="section_pages">
<div class="wrapper">
<h1 class="article_title">{{ article.title }}</h1>
<h3 class="article_authors">{{ article.authorNames }}</h3>
<div class="article_metadata">
{{ article.year }}, DOI: <a :href="doiLink" target="_blank">{{ doi }}</a>
<div v-if="!loading" class="wrapper" key="article_loaded">
<h1 class="visualize_header-h1 article_title">{{ article.title }}</h1>
<div class="article_authors">{{ article.authorNames }}</div>
<div v-if="article.venue" class="article_metadata" key="article_venue">
<span class="article_metadata_strong">{{ article.venue }}</span> ({{ article.year }})
</div>
<div v-else class="article_metadata" key="article_no_venue">
{{ article.year }}
</div>
<h3>Additional Semantic Scholar Metadata:</h3>
<div class="article_abstract">
<div class="article_abstract teams_text">
<h3>Abstract</h3>
{{ article.abstract }}
<p>{{ article.abstract }}</p>
</div>
<div class="article_metadata">
DOI: <a :href="doiLink" target="_blank">{{ doi }}</a>
</div>
<div class="article_metadata">
Cited by <span class="article_metadata_strong">{{ article.citationCount }}</span> other works.
</div>
<table class="article_references article_table">
<tr class="article_table-header">
<th>Year</th>
<th>Author(s)</th>
<th>Title</th>
</tr>
<tr class="article_table-row" v-for="(refObject, index) of article.references" :key="refObject.paperId">
<td class="article_table-item_year">{{ refObject.year }}</td>
<td class="article_table-item_authors">{{ refObject.authorNames }}</td>
<td class="article_table-item_title">{{ refObject.title }}</td>
</tr>
</table>
<table class="article_citations article_table">
<tr class="article_table-header">
<th>Year</th>
<th>Author(s)</th>
<th>Title</th>
</tr>
<tr class="article_table-row" v-for="(refObject, index) of article.citations" :key="refObject.paperId">
<td class="article_table-item_year">{{ refObject.year }}</td>
<td class="article_table-item_authors">{{ refObject.authorNames }}</td>
<td class="article_table-item_title">{{ refObject.title }}</td>
</tr>
</table>
<div class="article_references article_table">
<div class="article_subtitle">References</div>
<table class="article_table">
<thead>
<tr class="article_table-header">
<th scope="col">Year</th>
<th scope="col">Author(s)</th>
<th scope="col">Title</th>
</tr>
</thead>
<tbody>
<tr class="article_table-row" v-for="(refObject, index) of article.references" :key="refObject.paperId">
<td>{{ refObject.year }}</td>
<td>{{ refObject.authorNames }}</td>
<td>{{ refObject.title }}</td>
</tr>
</tbody>
</table>
</div>
<div class="article_citations article_table">
<div class="article_subtitle">Cited By</div>
<table>
<thead>
<tr class="article_table-header">
<th scope="col">Year</th>
<th scope="col">Author(s)</th>
<th scope="col">Title</th>
</tr>
</thead>
<tbody>
<tr class="article_table-row" v-for="(refObject, index) of article.citations" :key="refObject.paperId">
<td>{{ refObject.year }}</td>
<td>{{ refObject.authorNames }}</td>
<td>{{ refObject.title }}</td>
</tr>
</tbody>
</table>
</div>
</div>
<div v-else class="wrapper article_title" key="article_loading">
<h1>Loading...</h1>
</div>
</div>
</md-app-content>
Expand Down

0 comments on commit b67a694

Please sign in to comment.