croco-html 0.0.1 → 0.1.1

package/src/lib/index.ts

@@ -0,0 +1,119 @@
+import { ImageEditorComponent } from "./components/editor/image-editor/image-editor.component";
+import { MainEditorBlockComponent } from "./components/editor/main-editor-block/main-editor-block.component";
+import { MainEditorComponent } from "./components/editor/main-editor/main-editor.component";
+import { TextEditorComponent } from "./components/editor/text-editor/text-editor.component";
+import { FileIdSelectComponent } from "./components/file-id-select/file-id-select.component";
+import { XmlTagHeaderInnerTextViewComponent } from "./components/xml-tags/xml-tag-header-inner-text-view/xml-tag-header-inner-text-view.component";
+import { XmlTagHeaderTextViewComponent } from "./components/xml-tags/xml-tag-header-text-view/xml-tag-header-text-view.component";
+import { XmlTagHtmlViewComponent } from "./components/xml-tags/xml-tag-html-view/xml-tag-html-view.component";
+import { XmlTagRichTextViewComponent } from "./components/xml-tags/xml-tag-rich-text-view/xml-tag-rich-text-view.component";
+import { XmlTagTableViewComponent } from "./components/xml-tags/xml-tag-table-view/xml-tag-table-view.component";
+import { XmlTagTextViewComponent } from "./components/xml-tags/xml-tag-text-view/xml-tag-text-view.component";
+import { XmlTagViewComponent } from "./components/xml-tags/xml-tag-view/xml-tag-view.component";
+import { VisualEditorComponent } from './components/editor/visual-editor/visual-editor.component';
+import { AddFilesBtnComponent } from './components/add-files-btn/add-files-btn.component';
+import { ExternalVideoBlockComponent } from "./components/editor/external-video-block/external-video-block.component";
+import { XmlTagExternalVideoComponent } from "./components/xml-tags/xml-tag-external-video/xml-tag-external-video.component";
+import { HtmlRawEditorComponent } from "./components/editor/html-raw-editor/html-raw-editor.component";
+
+import { MatSnackBarModule } from '@angular/material/snack-bar';
+import { MatSelectModule } from '@angular/material/select';
+import { MatTooltipModule } from '@angular/material/tooltip';
+import {MatCheckboxModule} from '@angular/material/checkbox';
+import { DragDropModule } from '@angular/cdk/drag-drop';
+import { MatAutocompleteModule } from '@angular/material/autocomplete';
+import { MatButtonModule } from '@angular/material/button';
+import { MatCardModule } from '@angular/material/card';
+import { MatChipsModule } from '@angular/material/chips';
+import { MatNativeDateModule } from '@angular/material/core';
+import { MatDatepickerModule } from '@angular/material/datepicker';
+import { MatDialogModule } from '@angular/material/dialog';
+import { MatExpansionModule } from '@angular/material/expansion';
+import { MatFormFieldModule } from '@angular/material/form-field';
+import { MatGridListModule } from '@angular/material/grid-list';
+import { MatIconModule } from '@angular/material/icon';
+import { MatInputModule } from '@angular/material/input';
+import { MatListModule } from '@angular/material/list';
+import { MatMenuModule } from '@angular/material/menu';
+import { MatPaginatorModule } from '@angular/material/paginator';
+import { MatProgressBarModule } from '@angular/material/progress-bar';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSidenavModule } from '@angular/material/sidenav';
+import { MatSlideToggleModule } from '@angular/material/slide-toggle';
+import { MatTableModule } from '@angular/material/table';
+import { MatTabsModule } from '@angular/material/tabs';
+import { MatTreeModule } from '@angular/material/tree';
+import { MatBadgeModule } from '@angular/material/badge';
+import {MatButtonToggleModule} from '@angular/material/button-toggle';
+import { RichTextToHtmlPipe, TagToSpanPipe, ToHtmlBodyTagsPipe, ToPreviewPipe } from "./pipes";
+import { UploadFilesBtnComponent } from "./components";
+
+
+export const EditorComponents = [
+    MainEditorComponent,
+    FileIdSelectComponent,
+    TextEditorComponent,
+    ExternalVideoBlockComponent,
+    ImageEditorComponent,
+    MainEditorBlockComponent,
+    VisualEditorComponent,
+    AddFilesBtnComponent,
+    HtmlRawEditorComponent,
+];
+
+export const XmlComponents = [
+    XmlTagTableViewComponent,
+    XmlTagViewComponent,
+    XmlTagRichTextViewComponent,
+    XmlTagHtmlViewComponent,
+    XmlTagTextViewComponent,
+    XmlTagHeaderTextViewComponent,
+    XmlTagHeaderInnerTextViewComponent,
+    XmlTagExternalVideoComponent
+];
+
+export const CrocoPipes = [
+  RichTextToHtmlPipe,
+  TagToSpanPipe,
+  ToPreviewPipe,
+  ToHtmlBodyTagsPipe,
+]
+
+export const CrocoHtmlDeclarations = [
+    UploadFilesBtnComponent,
+    ...XmlComponents,
+    ...EditorComponents,
+    ...CrocoPipes
+]
+
+export const MaterialModules = [
+  MatBadgeModule,
+  MatTableModule,
+  MatExpansionModule,
+  MatFormFieldModule,
+  MatSnackBarModule,
+  MatProgressBarModule,
+  MatProgressSpinnerModule,
+  MatTabsModule,
+  MatMenuModule,
+  MatCardModule,
+  MatSelectModule,
+  MatTooltipModule,
+  MatCheckboxModule,
+  MatChipsModule,
+  MatListModule,
+  MatButtonModule,
+  MatInputModule,
+  MatDialogModule,
+  MatPaginatorModule,
+  MatDatepickerModule,
+  MatGridListModule,
+  MatSlideToggleModule,
+  MatTreeModule,
+  MatNativeDateModule,
+  MatAutocompleteModule,
+  MatSidenavModule,
+  MatIconModule,
+  DragDropModule,
+  MatButtonToggleModule
+];

package/{lib/models/models.d.ts → src/lib/models/models.ts}

@@ -1,10 +1,11 @@
-export interface TagItem {
-    tag: string;
-    displayValue: string;
-}
-export interface HtmlBodyTag {
-    tagDescription: TagItem;
-    innerHtml: string;
-    attributes: Object;
-    presentOrEdit: boolean;
-}
+export interface TagItem {
+    tag: string;
+    displayValue: string;
+}
+
+export interface HtmlBodyTag {
+    tagDescription: TagItem;
+    innerHtml: string;
+    attributes: Object;
+    presentOrEdit: boolean;
+}

package/src/lib/pipes/RichTextToHtmlPipe.ts

@@ -0,0 +1,25 @@
+import { Pipe, PipeTransform } from "@angular/core";
+import { RichTextData } from "../extensions/TextMethods";
+
+@Pipe({
+    name: 'richTextToHtml'
+})
+export class RichTextToHtmlPipe implements PipeTransform {
+
+    transform(value: RichTextData): string {
+        let result = "";
+
+        for (let i = 0; i < value.data.children.length; i++) {
+            const child = value.data.children[i];
+
+            if (child.type === "text-block") {
+                result += `<span>${child.data.text}</span>`;
+            }
+            else if (child.type === "line-break") {
+                result += "</br>";
+            }
+        }
+
+        return result;
+    }
+}

package/src/lib/pipes/TagToSpanPipe.ts

@@ -0,0 +1,10 @@
+import { Pipe, PipeTransform } from "@angular/core";
+
+@Pipe({
+    name: 'tagToSpan'
+})
+export class TagToSpanPipe implements PipeTransform {
+    transform(value: string[]): string {
+        return value.map(x => (`<b>${x}</b>`)).join(' | ')
+    }
+}

package/src/lib/pipes/ToHtmlBodyTagsPipe.ts

@@ -0,0 +1,14 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { BodyTagsExtensions } from '../extensions/BodyTagsExtensions';
+import { HtmlBodyTag } from '../models/models';
+
+@Pipe({
+    name: 'tohtmlbodytags'
+})
+export class ToHtmlBodyTagsPipe implements PipeTransform {
+    
+    transform(value: string): HtmlBodyTag[] {
+        return BodyTagsExtensions.getBodyTags(value);
+    }
+    
+}

package/{lib/pipes/index.d.ts → src/lib/pipes/index.ts}

@@ -1,4 +1,4 @@
-export * from "./RichTextToHtmlPipe";
-export * from "./TagToSpanPipe";
-export * from "./to-preview.pipe";
-export * from "./ToHtmlBodyTagsPipe";
+export * from "./RichTextToHtmlPipe";
+export * from "./TagToSpanPipe";
+export * from "./to-preview.pipe";
+export * from "./ToHtmlBodyTagsPipe";

package/src/lib/pipes/to-preview.pipe.ts

@@ -0,0 +1,12 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { HtmlExtractionMethods } from '../extensions/HtmlExtractionMethods';
+import { InterfaceBlock } from "../extensions/InterfaceBlock";
+
+@Pipe({
+  name: 'topreview'
+})
+export class ToPreviewPipe implements PipeTransform {
+  transform(value: string): InterfaceBlock[] {
+    return HtmlExtractionMethods.transformHtmlStringToBlocks(value);
+  }
+}

package/src/lib/services/file-upload.service.ts

@@ -0,0 +1,56 @@
+import { HttpClient } from "@angular/common/http";
+import { Inject, Injectable } from "@angular/core";
+import { Observable } from "rxjs";
+
+export interface BaseApiResponse {
+  isSucceeded: boolean;
+  message: string;
+}
+
+export interface GenericBaseApiResponse<T> extends BaseApiResponse {
+  responseObject: T;
+}
+
+export interface BaseApiResponseWithFilesIds extends BaseApiResponse{
+    responseObject: number[];
+}
+
+@Injectable({providedIn: 'root'})
+export class FileUploadService {
+
+    constructor(private _httpClient: HttpClient,
+        @Inject('BASE_URL') private baseUrl: string) {
+    }
+
+    postFile(file: File, createLocalCopiesNow = false):Observable<BaseApiResponseWithFilesIds>{
+        const formData: FormData = new FormData();
+
+        formData.append(`fileKey1`, file, file.name);
+
+        return this.postFilesInner(formData, createLocalCopiesNow);
+    }
+
+    postFiles(files: FileList, createLocalCopiesNow = false): Observable<BaseApiResponseWithFilesIds> {
+
+        const formData: FormData = new FormData();
+
+        for(let i = 0; i < files.length; i++){
+            var fileToUpload = files.item(i);
+            formData.append(`fileKey${i}`, fileToUpload as Blob, fileToUpload?.name);
+        }
+
+        return this.postFilesInner(formData, createLocalCopiesNow);
+    }
+
+    postFilesInner(formData: FormData, createLocalCopiesNow = false): Observable<BaseApiResponseWithFilesIds> {
+
+        let endpoint = this.baseUrl + 'Api/Files/UploadFiles';
+
+        if(createLocalCopiesNow){
+            endpoint += '/Now';
+        }
+
+        return this._httpClient
+            .post<BaseApiResponseWithFilesIds>(endpoint, formData);
+    }
+}

package/src/lib/services/files-query.service.ts

@@ -0,0 +1,72 @@
+import { HttpClient } from "@angular/common/http";
+import { Inject, Injectable } from "@angular/core";
+import { Observable } from "rxjs";
+
+export interface GetListResult<T>{
+
+  /*
+  Сколько всего записей
+   */
+  totalCount:number;
+
+  /*
+  Текущий список
+   */
+  list:Array<T>;
+}
+
+export interface DbFileNoDataWithRelations {
+    id: number;
+    fileName: string;
+    relations: Array<FileRelationModel>;
+}
+
+export interface FileRelationModel {
+    entityTypeFullName: string;
+    entityKey: string;
+    relationName: string;
+    relationValue: string;
+    relationCustomData: string;
+}
+
+export interface SearchFiles {
+    fileName: string;
+    q: string;
+    count: number | null;
+    offSet: number;
+}
+
+export interface GetListSearchModel {
+    count: number | null;
+    offSet: number;
+}
+
+export interface FileNameAndIdModel {
+    fileId: number;
+    fileName: string;
+}
+
+@Injectable({
+    providedIn: 'root'
+})
+export class FilesQueryService{
+
+    _baseControllerUrl: string;
+
+    constructor(private _httpClient: HttpClient,
+        @Inject('BASE_URL') baseUrl: string) {
+        this._baseControllerUrl = baseUrl + 'Api/Files/';
+    }
+
+    public getFilesWithRelations(model: SearchFiles):Observable<GetListResult<DbFileNoDataWithRelations>>{
+        return this._httpClient.post<GetListResult<DbFileNoDataWithRelations>>(
+            this._baseControllerUrl + `GetFiles/WithRelations`, model
+        );
+    }
+
+    public getFiles(model: SearchFiles):Observable<GetListResult<FileNameAndIdModel>>{
+        return this._httpClient.post<GetListResult<FileNameAndIdModel>>(
+            this._baseControllerUrl + `GetFiles`, model
+        );
+    }
+}

package/{public-api.d.ts → src/public-api.ts}

@@ -1,4 +1,8 @@
-export * from './lib/components';
-export * from './lib/pipes';
-export * from './lib/extensions';
-export * from './lib/croco-html.module';
+/*
+ * Public API Surface of croco-html
+ */
+
+export * from './lib/components';
+export * from './lib/pipes';
+export * from './lib/extensions';
+export * from './lib/croco-html.module';

package/src/test.ts

@@ -0,0 +1,28 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+
+import 'zone.js';
+import 'zone.js/testing';
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
+
+declare const require: {
+  context(path: string, deep?: boolean, filter?: RegExp): {
+    keys(): string[];
+    <T>(id: string): T;
+  };
+};
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting(), {
+    teardown: { destroyAfterEach: false }
+}
+);
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);

package/tsconfig.lib.json

@@ -0,0 +1,20 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/lib",
+    "target": "es2015",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": [],
+    "lib": [
+      "dom",
+      "es2018"
+    ]
+  },
+  "exclude": [
+    "src/test.ts",
+    "**/*.spec.ts"
+  ]
+}

package/tsconfig.lib.prod.json

@@ -0,0 +1,10 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "./tsconfig.lib.json",
+  "compilerOptions": {
+    "declarationMap": false
+  },
+  "angularCompilerOptions": {
+    "compilationMode": "partial"
+  }
+}

package/tsconfig.spec.json

@@ -0,0 +1,17 @@
+/* To learn more about this file see: https://angular.io/config/tsconfig. */
+{
+  "extends": "../../tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../out-tsc/spec",
+    "types": [
+      "jasmine"
+    ]
+  },
+  "files": [
+    "src/test.ts"
+  ],
+  "include": [
+    "**/*.spec.ts",
+    "**/*.d.ts"
+  ]
+}