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

External css and html for document list

Browse Source 
refs #9
This commit is contained in:
Denys Vuika 2016-05-03 10:49:10 +01:00
parent d780292ac0
commit e8ab482f74
5 changed files with 162 additions and 165 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
ng2-components/ng2-alfresco-documentlist/src/components/document-list.css Normal file
View File

@ -0,0 +1,49 @@
:host .full-width { width: 100%; }
:host .folder-thumbnail {
font-size: 48px;
cursor: pointer;
}
:host .document-thumbnail {
width: 48px;
height: 48px;
cursor: pointer;
}
:host .content-header {
font-size: 15px;
}
:host .content-header:hover {
text-decoration: underline;
cursor: pointer;
}
:host .parent-folder-link { cursor: pointer; }
:host .parent-folder-link > td { text-align: left; }
:host .folder-header-cell { cursor: pointer; }
:host .breadcrumb { margin-bottom: 4px; }
:host .folder-icon {
float: left;
margin-right: 10px;
font-size: 4em;
}
:host .file-icon {
width: 52px;
height: 52px;
float: left;
margin-right: 10px;
}
:host .document-header {
font-size: 24px;
line-height: 32px;
}
:host .document-header:hover {
text-decoration: underline;
}

105
ng2-components/ng2-alfresco-documentlist/src/components/document-list.html Normal file
View File

@ -0,0 +1,105 @@
<ol *ngIf="breadcrumb" class="breadcrumb">
<li *ngFor="#r of route; #last = last" [class.active]="last" [ngSwitch]="last">
<span *ngSwitchWhen="true">{{r.name}}</span>
<a *ngSwitchDefault href="#" (click)="goToRoute(r, $event)">{{r.name}}</a>
</li>
</ol>
<table *ngIf="folder" class="mdl-data-table mdl-js-data-table mdl-shadow--2dp full-width">
<thead>
<tr>
<!-- Thumbnails -->
<th *ngIf="thumbnails"></th>
<!-- Name -->
<th class="mdl-data-table__cell--non-numeric full-width">Name</th>
<!-- Actions -->
<th></th>
</tr>
</thead>
<tbody>
<tr class="parent-folder-link" *ngIf="canNavigateParent()" (click)="onNavigateParentClick($event)">
<td colspan="3">
<button class="mdl-button mdl-js-button mdl-button--icon"
(click)="onNavigateParentClick($event)">
<i class="material-icons">arrow_upward</i>
</button>
</td>
</tr>
<tr *ngFor="#content of folder.items; #idx = index">
<!-- Thumbnails: folder -->
<td *ngIf="thumbnails && content.isFolder">
<i class="material-icons folder-thumbnail"
(click)="onItemClick(content, $event)">{{folderIcon || 'folder_open'}}</i>
</td>
<!-- Thumbnails: document -->
<td *ngIf="thumbnails && !content.isFolder">
<img *ngIf="thumbnails" class="document-thumbnail"
alt=""
src="{{getDocumentThumbnailUrl(content)}}"
(click)="onItemClick(content, $event)">
</td>
<!-- Name: folder -->
<td *ngIf="content.isFolder" class="mdl-data-table__cell--non-numeric folder-header-cell"
(click)="onItemClick(content, $event)">
<span class="content-header">
{{content.displayName}}
</span>
</td>
<!-- Name: document -->
<td *ngIf="!content.isFolder" class="mdl-data-table__cell--non-numeric" >
<span class="content-header" (click)="onItemClick(content, $event)">
{{content.displayName}}
</span>
</td>
<!-- Actions: Folder cell template -->
<td *ngIf="content.isFolder">
<!-- quick action buttons -->
<button class="mdl-button mdl-js-button mdl-button--icon"
*ngFor="#action of quickFolderActions"
(click)="executeContentAction(content, action)">
<i class="material-icons">{{action.icon}}</i>
</button>
<!-- action menu -->
<button [id]="'folder_action_menu_' + idx" class="mdl-button mdl-js-button mdl-button--icon">
<i class="material-icons">more_vert</i>
</button>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
[attr.for]="'folder_action_menu_' + idx">
<li class="mdl-menu__item"
*ngFor="#action of folderActions"
(click)="executeContentAction(content, action)">
{{action.title}}
</li>
</ul>
</td>
<!-- Actions: Document cell template -->
<td *ngIf="!content.isFolder">
<!-- quick action buttons -->
<button class="mdl-button mdl-js-button mdl-button--icon"
*ngFor="#action of quickDocumentActions"
(click)="executeContentAction(content, action)">
<i class="material-icons">{{action.icon}}</i>
</button>
<!-- action menu -->
<button [id]="'document_action_menu_' + idx" class="mdl-button mdl-js-button mdl-button--icon">
<i class="material-icons">more_vert</i>
</button>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
[attr.for]="'document_action_menu_' + idx">
<li class="mdl-menu__item"
*ngFor="#action of documentActions"
(click)="executeContentAction(content, action)">
{{action.title}}
</li>
</ul>
</td>
</tr>
</tbody>
</table>

7
ng2-components/ng2-alfresco-documentlist/src/components/document-list.js
View File

File diff suppressed because one or more lines are too long

2
ng2-components/ng2-alfresco-documentlist/src/components/document-list.js.map
View File

@ -1 +1 @@
{"version":3,"file":"document-list.js","sourceRoot":"","sources":["document-list.ts"],"names":[],"mappings":"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"}
{"version":3,"file":"document-list.js","sourceRoot":"","sources":["document-list.ts"],"names":[],"mappings":"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"}

164
ng2-components/ng2-alfresco-documentlist/src/components/document-list.ts
View File

@ -29,169 +29,13 @@ import {DocumentEntity} from './../core/entities/document.entity';
import {ContentActionModel} from './../models/content-action.model';
declare var componentHandler;
declare let __moduleName:string;
@Component({
moduleId: __moduleName,
selector: 'alfresco-document-list',
styles: [
`
:host .full-width { width: 100%; }
:host .folder-thumbnail {
font-size: 48px;
cursor: pointer;
}
:host .document-thumbnail {
width: 48px;
height: 48px;
cursor: pointer;
}
:host .content-header {
font-size: 15px;
}
:host .content-header:hover {
text-decoration: underline;
cursor: pointer;
}
:host .parent-folder-link { cursor: pointer; }
:host .parent-folder-link > td { text-align: left; }
:host .folder-header-cell { cursor: pointer; }
:host .breadcrumb { margin-bottom: 4px; }
:host .folder-icon {
float: left;
margin-right: 10px;
font-size: 4em;
}
:host .file-icon {
width: 52px;
height: 52px;
float: left;
margin-right: 10px;
}
:host .document-header {
font-size: 24px;
line-height: 32px;
}
:host .document-header:hover {
text-decoration: underline;
}
`
],
template: `
<ol *ngIf="breadcrumb" class="breadcrumb">
<li *ngFor="#r of route; #last = last" [class.active]="last" [ngSwitch]="last">
<span *ngSwitchWhen="true">{{r.name}}</span>
<a *ngSwitchDefault href="#" (click)="goToRoute(r, $event)">{{r.name}}</a>
</li>
</ol>
<table *ngIf="folder" class="mdl-data-table mdl-js-data-table mdl-shadow--2dp full-width">
<thead>
<tr>
<!-- Thumbnails -->
<th *ngIf="thumbnails"></th>
<!-- Name -->
<th class="mdl-data-table__cell--non-numeric full-width">Name</th>
<!-- Actions -->
<th></th>
</tr>
</thead>
<tbody>
<tr class="parent-folder-link" *ngIf="canNavigateParent()" (click)="onNavigateParentClick($event)">
<td colspan="3">
<button class="mdl-button mdl-js-button mdl-button--icon"
(click)="onNavigateParentClick($event)">
<i class="material-icons">arrow_upward</i>
</button>
</td>
</tr>
<tr *ngFor="#content of folder.items; #idx = index">
<!-- Thumbnails: folder -->
<td *ngIf="thumbnails && content.isFolder">
<i class="material-icons folder-thumbnail"
(click)="onItemClick(content, $event)">{{folderIcon || 'folder_open'}}</i>
</td>
<!-- Thumbnails: document -->
<td *ngIf="thumbnails && !content.isFolder">
<img *ngIf="thumbnails" class="document-thumbnail"
alt=""
src="{{getDocumentThumbnailUrl(content)}}"
(click)="onItemClick(content, $event)">
</td>
<!-- Name: folder -->
<td *ngIf="content.isFolder" class="mdl-data-table__cell--non-numeric folder-header-cell"
(click)="onItemClick(content, $event)">
<span class="content-header">
{{content.displayName}}
</span>
</td>
<!-- Name: document -->
<td *ngIf="!content.isFolder" class="mdl-data-table__cell--non-numeric" >
<span class="content-header" (click)="onItemClick(content, $event)">
{{content.displayName}}
</span>
</td>
<!-- Actions: Folder cell template -->
<td *ngIf="content.isFolder">
<!-- quick action buttons -->
<button class="mdl-button mdl-js-button mdl-button--icon"
*ngFor="#action of quickFolderActions"
(click)="executeContentAction(content, action)">
<i class="material-icons">{{action.icon}}</i>
</button>
<!-- action menu -->
<button [id]="'folder_action_menu_' + idx" class="mdl-button mdl-js-button mdl-button--icon">
<i class="material-icons">more_vert</i>
</button>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
[attr.for]="'folder_action_menu_' + idx">
<li class="mdl-menu__item"
*ngFor="#action of folderActions"
(click)="executeContentAction(content, action)">
{{action.title}}
</li>
</ul>
</td>
<!-- Actions: Document cell template -->
<td *ngIf="!content.isFolder">
<!-- quick action buttons -->
<button class="mdl-button mdl-js-button mdl-button--icon"
*ngFor="#action of quickDocumentActions"
(click)="executeContentAction(content, action)">
<i class="material-icons">{{action.icon}}</i>
</button>
<!-- action menu -->
<button [id]="'document_action_menu_' + idx" class="mdl-button mdl-js-button mdl-button--icon">
<i class="material-icons">more_vert</i>
</button>
<ul class="mdl-menu mdl-menu--bottom-right mdl-js-menu mdl-js-ripple-effect"
[attr.for]="'document_action_menu_' + idx">
<li class="mdl-menu__item"
*ngFor="#action of documentActions"
(click)="executeContentAction(content, action)">
{{action.title}}
</li>
</ul>
</td>
</tr>
</tbody>
</table>
`,
styleUrls: ['./document-list.css'],
templateUrl: './document-list.html',
providers: [AlfrescoService]
})
export class DocumentList implements OnInit, AfterViewChecked {