inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Thumbnails for ng2 file list

Browse Source
This commit is contained in:
Denys Vuika 2016-04-15 16:25:12 +01:00
parent 6832e591b4
commit d951c00ac6
2 changed files with 30 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
demo-shell-ng2/app/components/alfresco.service.ts
View File

@ -2,6 +2,7 @@ import {Injectable} from 'angular2/core';
import {Http, Response, RequestOptions, Headers} from 'angular2/http';
import {Observable} from 'rxjs/Observable';
import {FolderEntity} from "./core/entities/folder.entity";
import {DocumentEntity} from "./core/entities/document.entity";
@Injectable()
export class AlfrescoService {
@ -23,6 +24,10 @@ export class AlfrescoService {
.catch(this.handleError);
}
getDocumentThumbnailUrl(document: DocumentEntity) {
return this._host + '/alfresco/service/api/node/' + document.nodeRef.replace('://', '/') + '/content/thumbnails/doclib?c=queue&ph=true&lastModified=1';
}
private handleError (error: Response) {
// in a real world app, we may send the error to some remote logging infrastructure
// instead of just logging it to the console

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

@ -5,14 +5,32 @@ import {DocumentEntity} from "./core/entities/document.entity";
@Component({
selector: 'alfresco-document-list',
styles: [
`
:host .folder-icon {
float: left;
margin-right: 10px;
}
:host .file-icon {
width: 52px;
height: 52px;
float: left;
margin-right: 10px;
}
`
],
template: `
<div *ngIf="folder" class="list-group">
<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">
<i *ngIf="document.isFolder" class="fa fa-folder-o"></i>
{{document.displayName}}
<a href="#" *ngFor="#document of folder.items" (click)="onItemClick(document, $event)" class="list-group-item clearfix">
<i *ngIf="document.isFolder" class="folder-icon fa fa-folder-o fa-4x"></i>
<img *ngIf="!document.isFolder" class="file-icon" src="{{getDocumentThumbnailUrl(document)}}">
<h4 class="list-group-item-heading">
{{document.displayName}}
</h4>
<p class="list-group-item-text">{{document.description}}</p>
</a>
</div>
`,
@ -87,4 +105,8 @@ export class DocumentList implements OnInit {
var relativePath = container + path + item.fileName;
return item.location.site + '/' + relativePath;
}
getDocumentThumbnailUrl(document: DocumentEntity) {
return this._alfrescoService.getDocumentThumbnailUrl(document);
}
}