Add button for hiding/showing metadata
This commit is contained in:
parent
3deca81c1d
commit
0ab2e9e732
|
@ -24,6 +24,8 @@ export default Controller.extend({
|
|||
jsonShowTree: computed.equal('jsonView', 'tree'),
|
||||
jsonShowSource: computed.equal('jsonView', 'source'),
|
||||
|
||||
metadataHidden: false,
|
||||
|
||||
actions: {
|
||||
|
||||
showJsonTree () {
|
||||
|
@ -34,6 +36,10 @@ export default Controller.extend({
|
|||
this.set('jsonView', 'source');
|
||||
},
|
||||
|
||||
toggleMetadata () {
|
||||
this.toggleProperty('metadataHidden');
|
||||
},
|
||||
|
||||
deleteItem () {
|
||||
if (window.confirm('Sure?')) {
|
||||
this.get('storage.client')
|
||||
|
|
|
@ -87,6 +87,11 @@
|
|||
display: grid;
|
||||
grid-template-columns: 1.618fr 3rem 1fr;
|
||||
margin-bottom: 3rem;
|
||||
transition: all 0.3s ease-out;
|
||||
|
||||
&.hide-metadata {
|
||||
grid-template-columns: 1.618fr 0 0;
|
||||
}
|
||||
|
||||
section {
|
||||
border-top: 1px solid $light-grey-2;
|
||||
|
|
|
@ -6,28 +6,36 @@
|
|||
<button disabled={{jsonShowTree}} class="{{if jsonShowTree "active"}}" {{action "showJsonTree"}}>tree view</button>
|
||||
<button disabled={{jsonShowSource}} class="{{if jsonShowSource "active"}}" {{action "showJsonSource"}}>source</button>
|
||||
</div>
|
||||
<div class="button-group json-view">
|
||||
<button {{action "toggleMetadata"}}>
|
||||
{{if metadataHidden "show" "hide"}} metadata
|
||||
</button>
|
||||
</div>
|
||||
{{/if}}
|
||||
<button class="delete" {{action "deleteItem"}}>delete</button>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<div class="inspect-details">
|
||||
<div class="inspect-details {{if metadataHidden "hide-metadata"}}">
|
||||
<section class="content">
|
||||
{{file-preview metaData=model.documentMetaData
|
||||
isJSON=documentIsJSON
|
||||
jsonShowTree=jsonShowTree
|
||||
jsonShowSource=jsonShowSource}}
|
||||
</section>
|
||||
<section class="meta">
|
||||
<dl>
|
||||
<dt>Name</dt>
|
||||
<dd>{{model.documentMetaData.name}}</dd>
|
||||
<dt>Content type</dt>
|
||||
<dd>{{model.documentMetaData.type}}</dd>
|
||||
<dt>Size</dt>
|
||||
<dd>{{human-file-size model.documentMetaData.size}}</dd>
|
||||
<dt>Revision (ETag)</dt>
|
||||
<dd>{{model.documentMetaData.etag}}</dd>
|
||||
</dl>
|
||||
</section>
|
||||
|
||||
{{#unless metadataHidden}}
|
||||
<section class="meta">
|
||||
<dl>
|
||||
<dt>Name</dt>
|
||||
<dd>{{model.documentMetaData.name}}</dd>
|
||||
<dt>Content type</dt>
|
||||
<dd>{{model.documentMetaData.type}}</dd>
|
||||
<dt>Size</dt>
|
||||
<dd>{{human-file-size model.documentMetaData.size}}</dd>
|
||||
<dt>Revision (ETag)</dt>
|
||||
<dd>{{model.documentMetaData.etag}}</dd>
|
||||
</dl>
|
||||
</section>
|
||||
{{/unless}}
|
||||
</div>
|
Loading…
Reference in New Issue