adam and dropzone changes #38

src/app/eav-material-controls/adam/simple-dropzone-wrapper/simple-dropzone-wrapper.component.html → src/app/eav-material-controls/adam/adam-attach-wrapper/adam-attach-wrapper.component.html

@@ -1,11 +1,13 @@
-<div class="dropzone dropzone-container" [dropzone]="dropzoneConfig" [disabled]="disabled" (error)="onUploadError($event)"
-  (success)="onUploadSuccess($event)" (drop)="onDrop($event)">
-  <div class="dropzone-content">
+<div class="adam-dialog-container">
+  <div class="adam-dialog-content">
     <ng-container #fieldComponent></ng-container>
   </div>
+  <adam-browser (openUpload)="openUpload()" [url]="url" [metadataOfCmsObject]="" [config]="config">
+  </adam-browser>
   <div class="{{'field-' + config.index}}">
     <div class="dropzone-previews">
     </div>
     <span #invisibleClickable class="invisible-clickable" data-note="just a fake, invisible area for dropzone"></span>
   </div>
+  <adam-hint class="field-hints"></adam-hint>
 </div>

src/app/eav-material-controls/adam/adam-attach-wrapper/adam-attach-wrapper.component.ts

@@ -0,0 +1,57 @@
+import { Component, OnInit, ViewContainerRef, Input, ViewChild, AfterContentInit, AfterViewInit, ElementRef } from '@angular/core';
+import { FieldWrapper } from '../../../eav-dynamic-form/model/field-wrapper';
+import { DropzoneDirective, DropzoneConfigInterface } from 'ngx-dropzone-wrapper';
+import { FieldConfig } from '../../../eav-dynamic-form/model/field-config';
+import { AdamBrowserComponent } from '../browser/adam-browser.component';
+import { EavConfiguration } from '../../../shared/models/eav-configuration';
+import { EavService } from '../../../shared/services/eav.service';
+import { UrlHelper } from '../../../shared/helpers/url-helper';
+import { FormGroup } from '@angular/forms';
+
+@Component({
+  selector: 'app-adam-attach-wrapper',
+  templateUrl: './adam-attach-wrapper.component.html',
+  styleUrls: ['./adam-attach-wrapper.component.scss']
+})
+export class AdamAttachWrapperComponent implements FieldWrapper, OnInit {
+  @ViewChild('fieldComponent', { read: ViewContainerRef }) fieldComponent: ViewContainerRef;
+  @ViewChild('invisibleClickable') invisibleClickableReference: ElementRef;
+  @ViewChild(AdamBrowserComponent) adamRef: AdamBrowserComponent;
+
+  @Input() config: FieldConfig;
+  group: FormGroup;
+
+  url: string;
+
+  private eavConfig: EavConfiguration;
+
+  get disabled() {
+    return this.group.controls[this.config.name].disabled;
+  }
+
+  constructor(private eavService: EavService) {
+    this.eavConfig = this.eavService.getEavConfiguration();
+  }
+
+  ngOnInit() {
+    this.config.adam = this.adamRef;
+    // const serviceRoot = 'http://2sxc-dnn742.dnndev.me/en-us/desktopmodules/2sxc/api/';
+    const serviceRoot = this.eavConfig.portalroot + 'desktopmodules/2sxc/api/';
+    // const url = UrlHelper.resolveServiceUrl('app-content/' + contentType + '/' + entityGuid + '/' + field, serviceRoot);
+    const contentType = this.config.header.contentTypeName;
+    // const contentType = '106ba6ed-f807-475a-b004-cd77e6b317bd';
+    const entityGuid = this.config.header.guid;
+    // const entityGuid = '386ec145-d884-4fea-935b-a4d8d0c68d8d';
+    const field = this.config.name;
+    // const field = 'HyperLinkStaticName';
+    this.url = UrlHelper.resolveServiceUrl(`app-content/${contentType}/${entityGuid}/${field}`, serviceRoot);
+  }
+
+  // /**
+  //  * triger click on clickable element for load open
+  //  */
+  openUpload() {
+    console.log('openUpload click');
+    this.invisibleClickableReference.nativeElement.click();
+  }
+}

src/app/eav-material-controls/adam/browser/adam-browser.component.html

@@ -1,5 +1,4 @@
 <!-- TODO: this dropzone class only because css - need to change-->
-<!--  -->
 <div class="dropzone u-shadow-top" *ngIf="!disabled" [@adamShowAnimate]="show ? 'open' : 'closed'">
   <div *ngIf="show" ngClass="{{'adam-scope-' + (adamModeConfig.usePortalRoot ? 'site' : field)}}">
 

src/app/eav-material-controls/adam/dropzone-wrapper/dropzone-wrapper.component.html

@@ -0,0 +1,6 @@
+<div class="dropzone dropzone-container" [dropzone]="dropzoneConfig" [disabled]="disabled" (error)="onUploadError($event)"
+  (success)="onUploadSuccess($event)" (drop)="onDrop($event)">
+  <!-- <div class="dropzone-content"> -->
+  <ng-container #fieldComponent></ng-container>
+  <!-- </div> -->
+</div>

src/app/eav-material-controls/adam/dropzone-wrapper/dropzone-wrapper.component.scss

@@ -0,0 +1,3 @@
+.dropzone-container {
+    height: 100%;
+}

src/app/eav-material-controls/adam/simple-dropzone-wrapper/simple-dropzone-wrapper.component.ts → src/app/eav-material-controls/adam/dropzone-wrapper/dropzone-wrapper.component.ts

@@ -10,11 +10,11 @@ import { FormGroup } from '@angular/forms';
 
 
 @Component({
-  selector: 'app-simple-dropzone-wrapper',
-  templateUrl: './simple-dropzone-wrapper.component.html',
-  styleUrls: ['./simple-dropzone-wrapper.component.scss']
+  selector: 'app-dropzone-wrapper',
+  templateUrl: './dropzone-wrapper.component.html',
+  styleUrls: ['./dropzone-wrapper.component.scss']
 })
-export class SimpleDropzoneWrapperComponent implements FieldWrapper, OnInit, AfterViewInit {
+export class DropzoneWrapperComponent implements FieldWrapper, OnInit, AfterViewInit {
   @ViewChild('fieldComponent', { read: ViewContainerRef }) fieldComponent: ViewContainerRef;
   @ViewChild(DropzoneDirective) dropzoneRef?: DropzoneDirective;
   @ViewChild('invisibleClickable') invisibleClickableReference: ElementRef;
@@ -106,10 +106,10 @@ export class SimpleDropzoneWrapperComponent implements FieldWrapper, OnInit, Aft
   /**
    * triger click on clickable element for load open
    */
-  openUpload() {
-    console.log('openUpload click');
-    this.invisibleClickableReference.nativeElement.click();
-  }
+  // openUpload() {
+  //   console.log('openUpload click');
+  //   this.invisibleClickableReference.nativeElement.click();
+  // }
 
   // updateCallback() {
   //   console.log('update callback');

src/app/eav-material-controls/eav-material-controls.module.ts

@@ -53,7 +53,7 @@ import { FileTypeService } from '../shared/services/file-type.service';
 import { EavLanguageSwitcherComponent } from './localization/eav-language-switcher/eav-language-switcher.component';
 import { AdamBrowserComponent } from './adam/browser/adam-browser.component';
 import { AdamHintComponent } from './adam/adam-hint/adam-hint.component';
-import { DropzoneComponent } from './adam/dropzone/dropzone.component';
+import { AdamAttachWrapperComponent } from './adam/adam-attach-wrapper/adam-attach-wrapper.component';
 import { FilterPipe } from '../shared/pipes/filter.pipe';
 import { OrderByPipe } from '../shared/pipes/orderby.pipe';
 import { ClickStopPropagationDirective } from '../shared/directives/click-stop-propagination.directive';
@@ -76,7 +76,7 @@ import { EntityQueryComponent } from './input-types/entity/entity-query/entity-q
 import {
     HyperlinkDefaultExpandableWrapperComponent
 } from './wrappers/hyperlink-default-expandable-wrapper/hyperlink-default-expandable-wrapper.component';
-import { SimpleDropzoneWrapperComponent } from './adam/simple-dropzone-wrapper/simple-dropzone-wrapper.component';
+import { DropzoneWrapperComponent } from './adam/dropzone-wrapper/dropzone-wrapper.component';
 import {
     HyperlinkLibraryExpandableWrapperComponent
 } from './wrappers/hyperlink-library-expandable-wrapper/hyperlink-library-expandable-wrapper.component';
@@ -102,7 +102,7 @@ import {
         ExternalComponent,
         AdamBrowserComponent,
         AdamHintComponent,
-        DropzoneComponent,
+        AdamAttachWrapperComponent,
         HyperlinkLibraryComponent,
         EavLanguageSwitcherComponent,
         FilterPipe,
@@ -123,7 +123,7 @@ import {
         EntityDefaultMainSearchComponent,
         EntityQueryComponent,
         HyperlinkDefaultExpandableWrapperComponent,
-        SimpleDropzoneWrapperComponent,
+        DropzoneWrapperComponent,
         HyperlinkLibraryExpandableWrapperComponent,
     ],
     imports: [
@@ -163,7 +163,7 @@ import {
         BooleanDefaultComponent,
         CollapsibleWrapperComponent,
         DatetimeDefaultComponent,
-        DropzoneComponent,
+        AdamAttachWrapperComponent,
         EavLocalizationComponent,
         EmptyDefaultComponent,
         EntityDefaultComponent,
@@ -186,7 +186,7 @@ import {
         TextEntryWrapperComponent,
         LinkToOtherLanguageComponent,
         HyperlinkDefaultExpandableWrapperComponent,
-        SimpleDropzoneWrapperComponent,
+        DropzoneWrapperComponent,
         HyperlinkLibraryExpandableWrapperComponent
     ],
     exports: [EavLanguageSwitcherComponent],

src/app/eav-material-controls/input-types/custom/external/external.component.ts

@@ -22,7 +22,7 @@ import { AdamConfig } from '../../../../shared/models/adam/adam-config';
   styleUrls: ['./external.component.scss']
 })
 @InputType({
-  wrapper: ['app-eav-localization-wrapper', 'app-expandable-wrapper', 'app-dropzone'],
+  wrapper: ['app-eav-localization-wrapper', 'app-expandable-wrapper', 'app-dropzone-wrapper', 'app-adam-attach-wrapper'],
 })
 export class ExternalComponent implements FieldExternal, OnInit {
   @ViewChild('container') elReference: ElementRef;

src/app/eav-material-controls/input-types/hyperlink/hyperlink-default/hyperlink-default.component.html

@@ -35,18 +35,7 @@
     </button>
   </mat-menu>
 </div>
-<!-- </span> -->
 
-<!-- class="c-hld-thumbnail" -->
-<!-- (mouseenter)="showPreview = true" (mouseleave)="showPreview = false"  -->
-<div [ngClass]="{'c-hld-icon': value && !isImage()}" [ngStyle]="{'background-image': value && isImage() ? 'url(' + thumbnailUrl(1, true) + ')' : ''}">
-  <a *ngIf="value && !isImage()" [href]="link" target="_blank" tabindex="-1" [ngClass]="icon()" matTooltip="{{tooltipUrl(link)}}"
-    matTooltipPosition="right">
-  </a>
-</div>
-
-<!-- <div class="c-hld" fxLayout="row" fxLayoutAlign="start start"> -->
-<!-- class="c-hld-field--short"  fxFlex="auto" -->
 <div class="mdc-layout-grid">
   <div class="mdc-layout-grid__inner">
     <mat-card class="mdc-layout-grid__cell--span-12 c-hld--border-radius">
@@ -75,6 +64,11 @@
           <img [src]="thumbnailUrl(2)" class="c-hld-image" />
         </div>
       </div>
+      <div [ngClass]="{'c-hld-icon': value && !isImage()}" [ngStyle]="{'background-image': value && isImage() ? 'url(' + thumbnailUrl(1, true) + ')' : ''}">
+        <a *ngIf="value && !isImage()" [href]="link" target="_blank" tabindex="-1" [ngClass]="icon()" matTooltip="{{tooltipUrl(link)}}"
+          matTooltipPosition="right">
+        </a>
+      </div>
     </mat-card>
   </div>
 </div>