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

[ADF-2030] set the download name before to download it

Browse Source 
fix theming documentation
remove old reference pack in the home
This commit is contained in:
Eugenio Romano
2017-11-24 23:58:04 +00:00
parent eba46e4e44
commit 4549dbf1f5
7 changed files with 71 additions and 269 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
demo-shell/src/app/components/app-layout/app-layout.component.html
View File

@@ -12,7 +12,7 @@
</mat-nav-list> </mat-nav-list>
</mat-sidenav> </mat-sidenav>
<mat-toolbar color="primary" class="adf-app-layout-toolbar" md-no-ink> <mat-toolbar color="primary" class="adf-app-layout-toolbar mat-elevation-z6">
<adf-userinfo <adf-userinfo
class="adf-app-layout-user-profile" class="adf-app-layout-user-profile"
[menuPositionX]="'before'" [menuPositionX]="'before'"

4
demo-shell/src/app/components/app-layout/app-layout.component.scss
View File

@@ -10,6 +10,10 @@
} }
} }
.adf-app-layout-toolbar {
position: relative;
}
.adf-app-layout { .adf-app-layout {
display: block; display: block;
min-width: $minimumAppWidth; min-width: $minimumAppWidth;

198
demo-shell/src/app/components/home/home.component.html
View File

@@ -1,187 +1,11 @@
<!-- DOCUMENT LIST--> <header class="adf-home-background adf-primary-background-color">
<mat-card class="adf-home-card"> <div class="adf-home-section ad">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/files"> <div class="adf-home-headline">
<h2 > <h1 class="mat-h1">ADF</h1>
<mat-icon>dvr</mat-icon> <h2> Angular components for Alfresco</h2>
<span class="adf-home-card__text">DocumentList - Content Services</span> </div>
</h2> <div class="adf-home-start">
</mat-card-title> <a mat-raised-button class="adf-home-docs-button adf-primary-color" href="https://github.com/Alfresco/alfresco-ng2-components/tree/master/docs">DOCS</a>
<mat-card-content> </div>
Demonstrates multiple Alfresco Content Services components used together to display the files of your Content Services instance: </div>
<ul class="adf-home-feature-list"> </header>
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with the Rest Api and core services</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
<li>
<mat-icon>dvr</mat-icon>
<span class="adf-home-feature-list__text">Document List</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-documentlist" target="_blank">ng2-alfresco-documentlist</a>
</li>
<li>
<mat-icon>file_upload</mat-icon>
<span class="adf-home-feature-list__text">Upload</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-upload" target="_blank">ng2-alfresco-upload</a>
</li>
<li>
<mat-icon>view_module</mat-icon>
<span class="adf-home-feature-list__text">DataTable</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-datatable" target="_blank">ng2-alfresco-datatable</a>
</li>
</ul>
</mat-card-content>
</mat-card>
<!-- Process Services-->
<mat-card class="adf-home-card">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/activiti">
<h2 >
<mat-icon>apps</mat-icon>
<span class="adf-home-card__text">Process Services</span>
</h2>
</mat-card-title>
<mat-card-content>
Demonstrates multiple Alfresco Process Services components used together to show your Process Services process and tasks:
<ul class="adf-home-feature-list">
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with the Rest Api and core services</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
<li>
<mat-icon>view_module</mat-icon>
<span class="adf-home-feature-list__text">App List</span>
<a href="https://www.npmjs.com/package/ng2-activiti-tasklist" target="_blank">ng2-activiti-apps</a>
</li>
<li>
<mat-icon>view_headline</mat-icon>
<span class="adf-home-feature-list__text">Task List</span>
<a href="https://www.npmjs.com/package/ng2-activiti-tasklist" target="_blank">ng2-activiti-tasklist</a>
</li>
<li>
<mat-icon>view_headline</mat-icon>
<span class="adf-home-feature-list__text">Process List</span>
<a href="https://www.npmjs.com/package/ng2-activiti-processlist" target="_blank">ng2-activiti-processlist</a>
</li>
<li>
<mat-icon>view_quilt</mat-icon>
<span class="adf-home-feature-list__text">Form</span>
<a href="https://www.npmjs.com/package/ng2-activiti-form" target="_blank">ng2-activiti-form</a>
</li>
<li>
<mat-icon>pie_chart</mat-icon>
<span class="adf-home-feature-list__text">Analytics</span>
<a href="https://www.npmjs.com/package/ng2-activiti-analytics" target="_blank">ng2-activiti-analytics</a>,
<a href="https://www.npmjs.com/package/ng2-activiti-diagrams" target="_blank">ng2-activiti-diagrams</a>
</li>
<li>
<mat-icon>view_module</mat-icon>
<span class="adf-home-feature-list__text">DataTable</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-datatable" target="_blank">ng2-alfresco-datatable</a>
</li>
</ul>
</mat-card-content>
</mat-card>
<!-- DATATABLE-->
<mat-card class="adf-home-card">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/datatable">
<h2 >
<mat-icon>view_module</mat-icon>
<span class="adf-home-card__text">DataTable - Content Services & Process Services</span>
</h2>
</mat-card-title>
<mat-card-content>
Basic table component:
<ul class="adf-home-feature-list">
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with the Rest Api and core services</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
</ul>
</mat-card-content>
</mat-card>
<!-- UPLOADER-->
<mat-card class="adf-home-card">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/uploader">
<h2 >
<mat-icon>file_upload</mat-icon>
<span class="adf-home-card__text">Uploader - Content Services</span>
</h2>
</mat-card-title>
<mat-card-content>
Basic table uploader component for the Content Services & Process Services:
<ul class="adf-home-feature-list">
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with the Rest Api and core services</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
</ul>
</mat-card-content>
</mat-card>
<!-- LOGIN-->
<mat-card class="adf-home-card">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/login">
<h2 >
<mat-icon>account_circle</mat-icon>
<span class="adf-home-card__text">Login - Content Services & Process Services</span>
</h2>
</mat-card-title>
<mat-card-content>
Login component for the Content Services and Process Services:
<ul class="adf-home-feature-list">
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with the Rest Api and core services</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
</ul>
</mat-card-content>
</mat-card>
<!-- WEBSCRIPT-->
<mat-card class="adf-home-card">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/webscript">
<h2 >
<mat-icon>extension</mat-icon>
<span class="adf-home-card__text">Webscript - Content Services</span>
</h2>
</mat-card-title>
<mat-card-content>
Displays and creates webscripts in your Content Services instance:
<ul class="adf-home-feature-list">
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with the Rest Api and core services</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
</ul>
</mat-card-content>
</mat-card>
<!-- TAG-->
<mat-card class="adf-home-card">
<mat-card-title class="adf-home-card-title adf-primary-background-color" routerLink="/tag">
<h2 >
<mat-icon>local_offer</mat-icon>
<span class="adf-home-card__text">Tag - Content Services</span>
</h2>
</mat-card-title>
<mat-card-content>
Displays and adds tags to the node of your Content Services instance:
<ul class="adf-home-feature-list">
<li>
<mat-icon>brightness_1</mat-icon>
<span class="adf-home-feature-list__text">Communication with Rest</span>
<a href="https://www.npmjs.com/package/ng2-alfresco-core" target="_blank">ng2-alfresco-core</a>
</li>
</ul>
</mat-card-content>
</mat-card>

58
demo-shell/src/app/components/home/home.component.scss
View File

@@ -1,42 +1,28 @@
.adf-home-card { .adf-home-header-background {
float: left; overflow: hidden;
margin: 10px 10px 10px 10px; }
width: 290px;
display: block; .adf-home-section {
overflow-y: auto; text-align: center;
height: 400px; padding-top: 60px;
}
.adf-home-headline {
h1 {
font-size: 56px;
font-weight: 300;
line-height: 56px;
margin: 15px 5px;
}
h2 { h2 {
line-height: 30px; font-size: 18px;
overflow: hidden; font-weight: 300;
text-overflow: ellipsis; line-height: 28px;
white-space: nowrap; margin: 15px 0 25px 0;
}
.material-icons {
position: relative;
top: 6px;
} }
} }
.adf-home-card-title { .adf-home-docs-button {
padding: 24px; margin: 30px;
cursor: pointer;
height: 55px;
margin: -63px -24px 18px -25px !important;
}
.adf-home-card__text {
font-size: 16px;
line-height: 18px;
}
.adf-home-feature-list {
list-style: none;
padding-left: 0;
}
span.home--feature-list__text:before {
content: '';
padding-left: 4px;
} }

49
docs/theming.md
View File

@@ -7,7 +7,7 @@ include all of the styles for core (styles common to all components), so you onl
single css file for Angular Material in your app. single css file for Angular Material in your app.
You can include a theme file directly into your application from You can include a theme file directly into your application from
`ng2-alfresco-core/prebuilt-themes` `@alfresco/adf-core/prebuilt-themes`
Available pre-built themes: Available pre-built themes:
* `adf-blue-orange.css` * `adf-blue-orange.css`
@@ -38,21 +38,14 @@ When you want more customization than a pre-built theme offers, you can create y
/* /*
* Include only packages that you are using (and core by default) * Include only packages that you are using (and core by default)
*/ */
@import '~@angular/material/theming'; @import '~@alfresco/adf-content-services/theming';
@import '~ng2-alfresco-core/styles/theming'; @import '~@alfresco/adf-process-services/theming';
@import '~ng2-alfresco-core/styles/index'; @import '~@alfresco/adf-insights/theming';
@import '~ng2-activiti-analytics/styles/index'; @import '~@alfresco/adf-core/theming';
@import '~ng2-activiti-diagrams/styles/index';
@import '~ng2-activiti-form/styles/index';
@import '~ng2-activiti-processlist/styles/index';
@import '~ng2-activiti-tasklist/styles/index';
@import '~ng2-alfresco-datatable/styles/index';
@import '~ng2-alfresco-documentlist/styles/index';
@import '~ng2-alfresco-login/styles/index';
//@import '~ng2-alfresco-upload/styles/index';
//@import '~ng2-alfresco-userinfo/styles/index';
@include mat-core(); @import '~@angular/material/theming';
@include mat-core($alfresco-typography);
$primary: mat-palette($alfresco-accent-orange); $primary: mat-palette($alfresco-accent-orange);
$accent: mat-palette($alfresco-accent-purple); $accent: mat-palette($alfresco-accent-purple);
@@ -61,18 +54,10 @@ $theme: mat-light-theme($primary, $accent, $warn);
@include angular-material-theme($theme); @include angular-material-theme($theme);
@include alfresco-core-theme($theme); @include adf-content-services-theme($theme);
@include adf-analytics-theme($theme); @include adf-process-services-theme($theme);
@include adf-diagrams-theme($theme); @include adf-insights-theme($theme);
@include adf-form-theme($theme); @include adf-core-theme($theme);
@include adf-processlist-theme($theme);
@include adf-tasklist-theme($theme);
@include alfresco-datatable-theme($theme);
@include alfresco-documentlist-theme($theme);
@include alfresco-login-theme($theme);
//@include alfresco-upload-theme($theme);
//@include alfresco-userinfo-theme($theme);
``` ```
Notes: if you are using the Generator or the demo shell you need only to change the`/src/custom-style.scss` with your set of colors Notes: if you are using the Generator or the demo shell you need only to change the`/src/custom-style.scss` with your set of colors
@@ -84,9 +69,11 @@ You can create multiple themes for your application:
#### Example of defining multiple themes #### Example of defining multiple themes
```scss ```scss
@import '~@alfresco/adf-content-services/theming';
@import '~@alfresco/adf-process-services/theming';
@import '~@alfresco/adf-insights/theming';
@import '~@alfresco/adf-core/theming';
@import '~@angular/material/theming'; @import '~@angular/material/theming';
@import '~ng2-alfresco-core/styles/theming';
@import '~ng2-alfresco-core/styles/index';
... ...
@include mat-core(); @include mat-core();
@@ -98,11 +85,11 @@ $warn: mat-palette($alfresco-warn);
$theme: mat-light-theme($primary, $accent, $warn); $theme: mat-light-theme($primary, $accent, $warn);
$dark-theme: mat-dark-theme($primary, $accent, $warn); $dark-theme: mat-dark-theme($primary, $accent, $warn);
@include alfresco-core-theme($theme); @include adf-core-theme($theme);
...like above ...like above
.adf-dark-theme { .adf-dark-theme {
@include alfresco-core-theme($dark-theme); @include adf-core-theme($dark-theme);
...like above ...like above
} }
``` ```

3
lib/content-services/document-list/services/document-actions.service.spec.ts
View File

@@ -162,6 +162,7 @@ describe('DocumentActionsService', () => {
it('should execute download action and cleanup', () => { it('should execute download action and cleanup', () => {
let file = new FileNode(); let file = new FileNode();
file.entry.name = 'test.png';
let url = 'http://<address>'; let url = 'http://<address>';
spyOn(contentService, 'getContentUrl').and.returnValue(url); spyOn(contentService, 'getContentUrl').and.returnValue(url);
@@ -179,7 +180,7 @@ describe('DocumentActionsService', () => {
expect(contentService.getContentUrl).toHaveBeenCalledWith(file); expect(contentService.getContentUrl).toHaveBeenCalledWith(file);
expect(document.createElement).toHaveBeenCalledWith('a'); expect(document.createElement).toHaveBeenCalledWith('a');
expect(link.setAttribute).toHaveBeenCalledWith('download', 'download'); expect(link.setAttribute).toHaveBeenCalledWith('download', 'test.png');
expect(document.body.appendChild).toHaveBeenCalledWith(link); expect(document.body.appendChild).toHaveBeenCalledWith(link);
expect(link.click).toHaveBeenCalled(); expect(link.click).toHaveBeenCalled();
expect(document.body.removeChild).toHaveBeenCalledWith(link); expect(document.body.removeChild).toHaveBeenCalledWith(link);

26
lib/content-services/document-list/services/document-actions.service.ts
View File

@@ -69,12 +69,12 @@ export class DocumentActionsService {
this.handlers['delete'] = this.deleteNode.bind(this); this.handlers['delete'] = this.deleteNode.bind(this);
} }
private download(obj: any): Observable<boolean> { private download(node: MinimalNodeEntity): Observable<boolean> {
if (this.canExecuteAction(obj) && this.contentService) { if (this.canExecuteAction(node) && this.contentService) {
let link = document.createElement('a'); let link = document.createElement('a');
document.body.appendChild(link); document.body.appendChild(link);
link.setAttribute('download', 'download'); link.setAttribute('download', node.entry.name);
link.href = this.contentService.getContentUrl(obj); link.href = this.contentService.getContentUrl(node);
link.click(); link.click();
document.body.removeChild(link); document.body.removeChild(link);
return Observable.of(true); return Observable.of(true);
@@ -82,14 +82,14 @@ export class DocumentActionsService {
return Observable.of(false); return Observable.of(false);
} }
private copyNode(obj: MinimalNodeEntity, target?: any, permission?: string) { private copyNode(node: MinimalNodeEntity, target?: any, permission?: string) {
const actionObservable = this.nodeActionsService.copyContent(obj.entry, permission); const actionObservable = this.nodeActionsService.copyContent(node.entry, permission);
this.prepareHandlers(actionObservable, 'content', 'copy', target, permission); this.prepareHandlers(actionObservable, 'content', 'copy', target, permission);
return actionObservable; return actionObservable;
} }
private moveNode(obj: MinimalNodeEntity, target?: any, permission?: string) { private moveNode(node: MinimalNodeEntity, target?: any, permission?: string) {
const actionObservable = this.nodeActionsService.moveContent(obj.entry, permission); const actionObservable = this.nodeActionsService.moveContent(node.entry, permission);
this.prepareHandlers(actionObservable, 'content', 'move', target, permission); this.prepareHandlers(actionObservable, 'content', 'move', target, permission);
return actionObservable; return actionObservable;
} }
@@ -106,17 +106,17 @@ export class DocumentActionsService {
); );
} }
private deleteNode(obj: any, target?: any, permission?: string): Observable<any> { private deleteNode(node: any, target?: any, permission?: string): Observable<any> {
let handlerObservable; let handlerObservable;
if (this.canExecuteAction(obj)) { if (this.canExecuteAction(node)) {
if (this.contentService.hasPermission(obj.entry, permission)) { if (this.contentService.hasPermission(node.entry, permission)) {
handlerObservable = this.documentListService.deleteNode(obj.entry.id); handlerObservable = this.documentListService.deleteNode(node.entry.id);
handlerObservable.subscribe(() => { handlerObservable.subscribe(() => {
if (target && typeof target.reload === 'function') { if (target && typeof target.reload === 'function') {
target.reload(); target.reload();
} }
this.success.next(obj.entry.id); this.success.next(node.entry.id);
}); });
return handlerObservable; return handlerObservable;
} else { } else {