inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-10-01 14:41:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

File download button for ng2 document list

Browse Source 
- ability to download the file from the list
- ability to toggle download button via attributes
This commit is contained in:
Denys Vuika
2016-04-16 08:55:07 +01:00
parent 0625bf8116
commit 549755ecf4
3 changed files with 45 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
demo-shell-ng2/app/components/document-list.component.ts
View File

@@ -26,6 +26,15 @@ import {DocumentEntity} from "./core/entities/document.entity";
:host .document-header:hover {
text-decoration: underline;
}
:host .download-button {
color: #777;
text-decoration: none;
}
:host .download-button:hover {
color: #555;
}
`
],
template: `
@@ -36,10 +45,13 @@ import {DocumentEntity} from "./core/entities/document.entity";
</li>
</ol>
<div *ngIf="folder" class="list-group">
<a href="#" *ngIf="!breadcrumb && canNavigateParent()" (click)="onNavigateParentClick($event)" class="list-group-item">
<a href="#" *ngIf="canNavigateParent()" (click)="onNavigateParentClick($event)" class="list-group-item">
<i class="fa fa-level-up"></i> ...
</a>
<a href="#" *ngFor="#document of folder.items" (click)="onItemClick(document, $event)" class="list-group-item clearfix">
<a *ngIf="downloads && !document.isFolder" href="{{getContentUrl(document)}}" (click)="onDownloadClick($event)" class="download-button pull-right" download target="_blank">
<i class="fa fa-download fa-2x"></i>
</a>
<i *ngIf="thumbnails && document.isFolder" class="folder-icon {{folderIconClass}}"></i>
<img *ngIf="thumbnails && !document.isFolder" class="file-icon" src="{{getDocumentThumbnailUrl(document)}}">
<h4 class="list-group-item-heading document-header">
@@ -64,6 +76,8 @@ export class DocumentList implements OnInit {
@Input('folder-icon-class') folderIconClass: string = 'fa fa-folder-o fa-4x';
// example: <alfresco-document-list #list [thumbnails]="false"></alfresco-document-list>
@Input() thumbnails: boolean = true;
// example: <alfresco-document-list #list [downloads]="false"></alfresco-document-list>
@Input() downloads: boolean = true;
rootFolder = {
name: 'Document Library',
@@ -76,7 +90,9 @@ export class DocumentList implements OnInit {
route: any[] = [];
canNavigateParent(): boolean {
return this.currentFolderPath !== this.rootFolder.path;
return this.navigate &&
!this.breadcrumb &&
this.currentFolderPath !== this.rootFolder.path;
}
constructor (
@@ -112,6 +128,10 @@ export class DocumentList implements OnInit {
}
}
onDownloadClick(event) {
event.stopPropagation();
}
onItemClick(item: DocumentEntity, $event) {
if ($event) {
$event.preventDefault();
@@ -134,10 +154,12 @@ export class DocumentList implements OnInit {
$event.preventDefault();
}
var idx = this.route.indexOf(r);
if (idx > -1) {
this.route.splice(idx + 1);
this.displayFolderContent(r.path);
if (this.navigate) {
var idx = this.route.indexOf(r);
if (idx > -1) {
this.route.splice(idx + 1);
this.displayFolderContent(r.path);
}
}
}
@@ -148,6 +170,10 @@ export class DocumentList implements OnInit {
return item.location.site + '/' + relativePath;
}
getContentUrl(document: DocumentEntity) {
return this._alfrescoService.getContentUrl(document);
}
getDocumentThumbnailUrl(document: DocumentEntity) {
return this._alfrescoService.getDocumentThumbnailUrl(document);
}