mirror of https://github.com/Squidex/squidex.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
73 lines
3.3 KiB
73 lines
3.3 KiB
<div class="card" [class.selectable]="isSelectable" [class.border-primary]="isSelected" (click)="selected.emit(asset)" (sqxFileDrop)="updateFile($event)">
|
|
<div class="card-body">
|
|
<div class="file-preview" *ngIf="asset && progress == 0" @fade>
|
|
<span class="file-type" *ngIf="asset.fileType">
|
|
{{asset.fileType}}
|
|
</span>
|
|
|
|
<div *ngIf="asset.isImage" class="file-image">
|
|
<img [sqxImageSource]="asset | sqxAssetPreviewUrl">
|
|
</div>
|
|
<div *ngIf="!asset.isImage" class="file-icon-container">
|
|
<img class="file-icon" [attr.src]="asset | sqxFileIcon">
|
|
</div>
|
|
|
|
<div class="file-overlay">
|
|
<div class="file-overlay-background"></div>
|
|
|
|
<div class="file-menu">
|
|
<a class="file-download" [attr.href]="asset | sqxAssetUrl" target="_blank" (click)="$event.stopPropagation()">
|
|
<i class="icon-download"></i>
|
|
</a>
|
|
|
|
<a class="file-delete ml-2" (click)="deleting.emit(asset); $event.stopPropagation()" *ngIf="!isDisabled && !removeMode">
|
|
<i class="icon-delete"></i>
|
|
</a>
|
|
<a class="file-delete ml-2" (click)="removing.emit(asset); $event.stopPropagation()" *ngIf="removeMode">
|
|
<i class="icon-close"></i>
|
|
</a>
|
|
</div>
|
|
|
|
<span class="file-overlay-type" *ngIf="asset.fileType">
|
|
{{asset.fileType}}
|
|
</span>
|
|
<span class="file-user">
|
|
<i class="icon-user"></i> {{asset.lastModifiedBy | sqxUserNameRef}}
|
|
</span>
|
|
<span class="file-modified">
|
|
{{asset.lastModified | sqxFromNow}}
|
|
</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-footer" *ngIf="asset && progress == 0">
|
|
<div>
|
|
<div *ngIf="!renaming" class="file-name editable" [attr.title]="asset.fileName" (dblclick)="renameStart()">
|
|
{{asset.fileName}}
|
|
</div>
|
|
<div *ngIf="renaming">
|
|
<form [formGroup]="renameForm.form" (ngSubmit)="renameAsset()">
|
|
<sqx-control-errors for="name" [submitted]="renameForm.submitted | async"></sqx-control-errors>
|
|
|
|
<input type="text" class="form-control form-underlined editable" id="assetName" formControlName="name" autocomplete="off" sqxFocusOnInit (blur)="renameCancel()" />
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<sqx-tag-editor class="blank"></sqx-tag-editor>
|
|
</div>
|
|
<div class="file-info">
|
|
<ng-container *ngIf="asset.pixelWidth">{{asset.pixelWidth}}x{{asset.pixelHeight}}px, </ng-container> {{asset.fileSize | sqxFileSize}}
|
|
</div>
|
|
</div>
|
|
|
|
<div class="upload-progress" *ngIf="progress > 0">
|
|
<sqx-progress-bar mode="Circle" [value]="progress"></sqx-progress-bar>
|
|
</div>
|
|
|
|
<div class="drop-overlay" *ngIf="asset && progress == 0">
|
|
<div class="drop-overlay-background"></div>
|
|
|
|
<span class="drop-overlay-text">Drop to update</span>
|
|
</div>
|
|
</div>
|