rich text editor changes

- cleanup old leftover codes
- remove unecessary service dependency

src/Squidex/Squidex.csproj

@@ -22,10 +22,6 @@
     <None Remove="Assets\**" />
   </ItemGroup>
 
-  <ItemGroup>
-    <None Remove="app\shared\components\asset-drop.handler.ts" />
-  </ItemGroup>
-
   <ItemGroup>
 	  <None Update="dockerfile">
       <CopyToPublishDirectory>PreserveNewest</CopyToPublishDirectory>
@@ -85,10 +81,6 @@
     <PackageReference Include="System.ValueTuple" Version="4.4.0" />
   </ItemGroup>
 
-  <ItemGroup>
-    <TypeScriptCompile Include="app\shared\components\asset-drop.handler.ts" />
-  </ItemGroup>
-
   <Target Name="IncludeDocFile" BeforeTargets="PrepareForPublish">
     <ItemGroup Condition=" '$(DocumentationFile)' != '' ">
       <_DocumentationFile Include="$(DocumentationFile)" />

src/Squidex/app/shared/components/asset-drop.handler.ts

@@ -1,31 +0,0 @@
-/*
- * Squidex Headless CMS
- *
- * @license
- * Copyright (c) Sebastian Stehle. All rights reserved
- */
-
-import { AssetUrlPipe } from './pipes';
-import { ApiUrlConfig, AssetDto } from './../declarations-base';
-
-export class AssetDropHandler {
-
-    private assetUrlGenerator: AssetUrlPipe;
-
-    constructor(private readonly apiUrlConfig: ApiUrlConfig) {
-        this.assetUrlGenerator = new AssetUrlPipe(this.apiUrlConfig);
-    }
-
-    public buildDroppedAssetData(asset: AssetDto, dragEvent: DragEvent) {
-        if (asset.isImage) {
-            return this.handleImageAsset(asset, dragEvent);
-        }
-        return '';
-    }
-
-    private handleImageAsset(asset: AssetDto, dragEvent: DragEvent) {
-        let res = '<img src="' + this.assetUrlGenerator.transform(asset) + '" ';
-        res += 'width="' + asset.pixelWidth + '" height="' + asset.pixelHeight + '">';
-        return res;
-    }
-}

src/Squidex/app/shared/components/asset.component.html

@@ -18,17 +18,17 @@
             <div class="file-overlay">
                 <div class="file-overlay-background"></div>
                 
-                <a class="file-edit" (click)="renameDialog.show()" *ngIf="!hideIcons">
+                <a class="file-edit" (click)="renameDialog.show()">
                     <i class="icon-pencil"></i>
                 </a>
-                <a class="file-download" [attr.href]="asset | sqxAssetUrl" target="_blank" *ngIf="!hideIcons">
+                <a class="file-download" [attr.href]="asset | sqxAssetUrl" target="_blank">
                     <i class="icon-download"></i>
                 </a>
 
-                <a class="file-delete" (click)="deleting.emit(asset)" *ngIf="!closeMode && !hideIcons">
+                <a class="file-delete" (click)="deleting.emit(asset)" *ngIf="!closeMode">
                     <i class="icon-delete"></i>
                 </a>
-                <a class="file-delete" (click)="closing.emit(asset)" *ngIf="closeMode && !hideIcons">
+                <a class="file-delete" (click)="closing.emit(asset)" *ngIf="closeMode">
                     <i class="icon-close"></i>
                 </a>
 

src/Squidex/app/shared/components/asset.component.ts

@@ -45,10 +45,7 @@ export class AssetComponent implements OnInit {
 
     @Input()
     public closeMode = false;
-
+    
-    @Input()
-    public hideIcons = false;
-
     @Output()
     public loaded = new EventEmitter<AssetDto>();
 

src/Squidex/app/shared/components/rich-editor.component.ts

@@ -8,8 +8,7 @@
 import { AfterViewInit, Component, forwardRef, ElementRef, OnDestroy, ViewChild, Input } from '@angular/core';
 import { ControlValueAccessor,  NG_VALUE_ACCESSOR, FormBuilder } from '@angular/forms';
 
-import { ApiUrlConfig, MessageBus, AssetDragged, Types, ResourceLoaderService } from './../declarations-base';
+import { MessageBus, AssetDragged, AssetsService, Types, ResourceLoaderService } from './../declarations-base';
-import { AssetDropHandler } from './asset-drop.handler';
 
 declare var tinymce: any;
 
@@ -30,7 +29,6 @@ export class RichEditorComponent implements ControlValueAccessor, AfterViewInit,
     private tinyInitTimer: any;
     private value: string;
     private isDisabled = false;
-    private assetDropHandler: AssetDropHandler;
 
     public draggedOver = false;
     private assetDraggedSubscription: any;
@@ -46,11 +44,9 @@ export class RichEditorComponent implements ControlValueAccessor, AfterViewInit,
 
     constructor(private readonly resourceLoader: ResourceLoaderService,
         private readonly formBuilder: FormBuilder,
-        private readonly apiUrlConfig: ApiUrlConfig,
+        private readonly messageBus: MessageBus,
-        private readonly messageBus: MessageBus
+        private readonly assetsService: AssetsService
     ) {
-        this.assetDropHandler = new AssetDropHandler(this.apiUrlConfig);
-
         this.assetDraggedSubscription = this.messageBus.of(AssetDragged).subscribe(message => {
             // only handle images for now
             if (message.assetDto.isImage) {
@@ -139,7 +135,7 @@ export class RichEditorComponent implements ControlValueAccessor, AfterViewInit,
     }
 
     public onItemDropped(event: any) {
-        let content = this.assetDropHandler.buildDroppedAssetData(event.dragData, event.mouseEvent);
+        let content = this.assetsService.buildDroppedAssetData(event.dragData, event.mouseEvent);
         if (content) {
             this.tinyEditor.execCommand('mceInsertContent', false, content);
         }

src/Squidex/app/shared/services/assets.service.ts

@@ -19,6 +19,8 @@ import {
     Versioned
 } from 'framework';
 
+import { AssetUrlPipe } from 'shared';
+
 export class AssetsDto {
     constructor(
         public readonly total: number,
@@ -100,12 +102,16 @@ export class AssetReplacedDto {
 
 @Injectable()
 export class AssetsService {
+
+    private assetUrlGenerator: AssetUrlPipe;
+
     constructor(
         private readonly http: HttpClient,
         private readonly apiUrl: ApiUrlConfig,
         private readonly analytics: AnalyticsService,
         private readonly localCache: LocalCacheService
     ) {
+        this.assetUrlGenerator = new AssetUrlPipe(this.apiUrl);
     }
 
     public getAssets(appName: string, take: number, skip: number, query?: string, mimeTypes?: string[], ids?: string[]): Observable<AssetsDto> {
@@ -302,6 +308,19 @@ export class AssetsService {
                 })
                 .pretifyError('Failed to delete asset. Please reload.');
     }
+
+    public buildDroppedAssetData(asset: AssetDto, dragEvent: DragEvent) {
+        if (asset.isImage) {
+            return this.handleImageAsset(asset, dragEvent);
+        }
+        return '';
+    }
+
+    private handleImageAsset(asset: AssetDto, dragEvent: DragEvent) {
+        let res = '<img src="' + this.assetUrlGenerator.transform(asset) + '" ';
+        res += 'width="' + asset.pixelWidth + '" height="' + asset.pixelHeight + '">';
+        return res;
+    }
 }
 
 function getFormData(file: File) {