diff --git a/demo-shell/resources/i18n/en.json b/demo-shell/resources/i18n/en.json index a1e7268e20..fb92745f4f 100644 --- a/demo-shell/resources/i18n/en.json +++ b/demo-shell/resources/i18n/en.json @@ -52,6 +52,7 @@ "APP_LAYOUT": { "APP_NAME": "ADF Demo Application", "HOME": "Home", + "NODE-SELECTOR": "Node Selector", "CONTENT_SERVICES": "Content Services", "BREADCRUMB": "Breadcrumb", "PROCESS_SERVICES": "Process Services", diff --git a/demo-shell/src/app/app.module.ts b/demo-shell/src/app/app.module.ts index 4b209fac23..aaf3e5e302 100644 --- a/demo-shell/src/app/app.module.ts +++ b/demo-shell/src/app/app.module.ts @@ -52,6 +52,7 @@ import { SharedLinkViewComponent } from './components/shared-link-view/shared-li import { DemoPermissionComponent } from './components/permissions/demo-permissions.component'; import { PreviewService } from './services/preview.service'; import { BreadcrumbDemoComponent } from './components/breadcrumb-demo/breadcrumb-demo.component'; +import { ContentNodeSelectorComponent } from './components/content-node-selector/content-node-selector.component'; import { NotificationsComponent } from './components/notifications/notifications.component'; @NgModule({ @@ -106,7 +107,8 @@ import { NotificationsComponent } from './components/notifications/notifications FormLoadingComponent, BlobPreviewComponent, BreadcrumbDemoComponent, - NotificationsComponent + NotificationsComponent, + ContentNodeSelectorComponent ], providers: [ { provide: AppConfigService, useClass: DebugAppConfigService }, // not use this service in production diff --git a/demo-shell/src/app/app.routes.ts b/demo-shell/src/app/app.routes.ts index d9485f9c6a..92933c670c 100644 --- a/demo-shell/src/app/app.routes.ts +++ b/demo-shell/src/app/app.routes.ts @@ -50,6 +50,7 @@ import { DemoPermissionComponent } from './components/permissions/demo-permissio import { BlobPreviewComponent } from './components/blob-preview/blob-preview.component'; import { BreadcrumbDemoComponent } from './components/breadcrumb-demo/breadcrumb-demo.component'; import { NotificationsComponent } from './components/notifications/notifications.component'; +import { ContentNodeSelectorComponent } from './components/content-node-selector/content-node-selector.component'; export const appRoutes: Routes = [ { path: 'login', component: LoginComponent }, @@ -86,6 +87,10 @@ export const appRoutes: Routes = [ path: 'home', component: HomeComponent }, + { + path: 'node-selector', + component: ContentNodeSelectorComponent + }, { path: 'settings-layout', component: SettingsComponent diff --git a/demo-shell/src/app/components/app-layout/app-layout.component.ts b/demo-shell/src/app/components/app-layout/app-layout.component.ts index 9cf5138759..aa12898c5e 100644 --- a/demo-shell/src/app/components/app-layout/app-layout.component.ts +++ b/demo-shell/src/app/components/app-layout/app-layout.component.ts @@ -34,6 +34,7 @@ export class AppLayoutComponent implements OnInit { { href: '/files', icon: 'folder_open', title: 'APP_LAYOUT.CONTENT_SERVICES' }, { href: '/breadcrumb', icon: 'label', title: 'APP_LAYOUT.BREADCRUMB' }, { href: '/notifications', icon: 'alarm', title: 'APP_LAYOUT.NOTIFICATIONS'}, + { href: '/node-selector', icon: 'attachment', title: 'APP_LAYOUT.NODE-SELECTOR' }, { href: '/activiti', icon: 'device_hub', title: 'APP_LAYOUT.PROCESS_SERVICES' }, { href: '/login', icon: 'vpn_key', title: 'APP_LAYOUT.LOGIN' }, { href: '/trashcan', icon: 'delete', title: 'APP_LAYOUT.TRASHCAN' }, diff --git a/demo-shell/src/app/components/breadcrumb-demo/breadcrumb-demo.component.ts b/demo-shell/src/app/components/breadcrumb-demo/breadcrumb-demo.component.ts index 242933207a..12df02215e 100644 --- a/demo-shell/src/app/components/breadcrumb-demo/breadcrumb-demo.component.ts +++ b/demo-shell/src/app/components/breadcrumb-demo/breadcrumb-demo.component.ts @@ -19,7 +19,7 @@ import { Component } from '@angular/core'; @Component({ templateUrl: './breadcrumb-demo.component.html', - styleUrls: [`./breadcrumb-demo.component.scss`], + styleUrls: [`./breadcrumb-demo.component.scss`] }) export class BreadcrumbDemoComponent { diff --git a/demo-shell/src/app/components/content-node-selector/content-node-selector.component.html b/demo-shell/src/app/components/content-node-selector/content-node-selector.component.html new file mode 100644 index 0000000000..4e86c2097d --- /dev/null +++ b/demo-shell/src/app/components/content-node-selector/content-node-selector.component.html @@ -0,0 +1,198 @@ +
+

Object picker

+ + + + + +

Plain picker

+ + + + + + +
+ + +
+ + + + +

Hide My files

+ + + + + + +
+ + +
+ + + + +

Custom Site List

+ + + + + + +
+ +

Add Site

+
+ + + + + + + + + +
+ + + + +

Custom Sites Added

+ + shopping_basket +

{{customSite.entry.title}}

+

{{customSite.entry.guid}}

+ + +
+ + +
+ + +
+ + + + +

Row Filtering

+ + + + + + + + Show Files + + + Slide Folders + + +
+ + +
+ + + + +

Custom Image Resolving

+ + + + + + + + Add Custom Images Resolver + + +
+ + +
+ + + + +

Set Page Size

+ + + + + +
+ + +
+ + + + +

Is Valid Selection Function

+ + + + + + + +
+ + +
+ + + + +

BreadCrumb Transform Function

+ + + + + + +
+ + +
+ + +
diff --git a/demo-shell/src/app/components/content-node-selector/content-node-selector.component.scss b/demo-shell/src/app/components/content-node-selector/content-node-selector.component.scss new file mode 100644 index 0000000000..17c04d8f4d --- /dev/null +++ b/demo-shell/src/app/components/content-node-selector/content-node-selector.component.scss @@ -0,0 +1,27 @@ +.content-node-selector-demo { + + &-main { + display: flex; + flex-direction: column; + justify-content: space-around; + align-content: center; + align-self: center; + align-items: center; + } + + &-basic-table { + height:400px; + width:700px + } + + &-basic-label { + display: flex; + align-self: center; + } + + &-example-form { + display: flex; + flex-direction: column; + align-items: flex-start; + } +} diff --git a/demo-shell/src/app/components/content-node-selector/content-node-selector.component.ts b/demo-shell/src/app/components/content-node-selector/content-node-selector.component.ts new file mode 100644 index 0000000000..d933b7fa3f --- /dev/null +++ b/demo-shell/src/app/components/content-node-selector/content-node-selector.component.ts @@ -0,0 +1,115 @@ +/*! + * @license + * Copyright 2016 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { Component, ViewEncapsulation } from '@angular/core'; +import { SitePaging, SiteEntry, MinimalNodeEntryEntity } from 'alfresco-js-api'; +import { ShareDataRow } from '@alfresco/adf-content-services'; +import { DataRow, DataColumn, ThumbnailService } from '@alfresco/adf-core'; + +@Component({ + templateUrl: './content-node-selector.component.html', + styleUrls: [`./content-node-selector.component.scss`], + encapsulation: ViewEncapsulation.None +}) +export class ContentNodeSelectorComponent { + + constructor(private thumbnailService: ThumbnailService) { + } + + dropdownHideMyFiles = false; + showFiles = false; + showFolders = false; + enableImageResolver = false; + validSelection = false; + + customSideGuid = ''; + customSideTitle = ''; + actualPageSize = 2; + + rowFilterFunction: any = null; + customImageResolver: any = null; + + defaultSites: SiteEntry[] = [ + { entry: { title: 'MINE', guid: '-my-' } }, + { entry: { title: 'ROOTY', guid: '-root-' } }]; + + customSites: SitePaging = { + list: { + entries: [ + { entry: { title: 'MINE', guid: '-my-' } }, + { entry: { title: 'ROOTY', guid: '-root-' } }], + pagination: {} + } + }; + + onClickAddSite() { + const newSiteEntry: SiteEntry = { entry: { title: this.customSideTitle, guid: this.customSideGuid } }; + this.customSites.list.entries.push(newSiteEntry); + this.customSideGuid = ''; + this.customSideTitle = ''; + } + + onClickResetSite() { + this.customSites.list.entries = this.defaultSites; + this.customSideGuid = ''; + this.customSideTitle = ''; + } + + recreateRowFilterFunction() { + this.rowFilterFunction = this.rowFilteringExample.bind(this); + } + + recreateImageResolverFunction() { + this.enableImageResolver = !this.enableImageResolver; + if (this.enableImageResolver) { + this.customImageResolver = this.customImageResolverExample.bind(this); + } else { + this.customImageResolver = null; + } + } + + rowFilteringExample(row: ShareDataRow) { + let showNode = true; + const node: MinimalNodeEntryEntity = row.node.entry; + if (this.showFiles) { + showNode = node.isFile; + } + if (this.showFolders) { + showNode = node.isFolder; + } + return showNode; + } + + customImageResolverExample(row: DataRow, col: DataColumn) { + return this.thumbnailService.getMimeTypeIcon('video/quicktime'); + } + + onNodeSelect(node: MinimalNodeEntryEntity) { + this.validSelection = !!node; + } + + customIsValidFunction(entry: MinimalNodeEntryEntity): boolean { + return entry.name.startsWith('a') || entry.name.startsWith('A'); + } + + customBreadcrumbFunction(node: MinimalNodeEntryEntity) { + if (node && node.path && node.path.elements) { + node.path.elements = node.path.elements.filter((element) => !element.name.toLocaleLowerCase().startsWith('d') ? element : null ); + } + return node; + } +} diff --git a/lib/content-services/content-node-selector/content-node-selector-panel.component.scss b/lib/content-services/content-node-selector/content-node-selector-panel.component.scss index 5ca1d76cc7..8aa6c1f626 100644 --- a/lib/content-services/content-node-selector/content-node-selector-panel.component.scss +++ b/lib/content-services/content-node-selector/content-node-selector-panel.component.scss @@ -153,7 +153,7 @@ } & .adf-name-location-cell-name { - padding: 18px 0 2px 0; + padding: 5px 0 2px 0; } &.adf-content-selector-modified-cell { diff --git a/lib/content-services/document-list/components/document-list.component.ts b/lib/content-services/document-list/components/document-list.component.ts index 5487b830a0..3dc87a97d0 100644 --- a/lib/content-services/document-list/components/document-list.component.ts +++ b/lib/content-services/document-list/components/document-list.component.ts @@ -416,7 +416,7 @@ export class DocumentListComponent implements OnInit, OnChanges, OnDestroy, Afte if (changes.node && changes.node.currentValue) { this.data.loadPage(changes.node.currentValue); this.onDataReady(changes.node.currentValue); - } else if (changes.rowFilter) { + } else if (changes.rowFilter && changes.rowFilter.currentValue !== changes.rowFilter.previousValue) { this.data.setFilter(changes.rowFilter.currentValue); if (this.currentFolderId) { this.loadFolderNodesByFolderNodeId(this.currentFolderId, this.pagination.getValue()).catch(err => this.error.emit(err));