ng-ipa-library 0.7.2 → 0.7.6

package/src/lib/pipes/pipes.module.ts

@@ -0,0 +1,8 @@
+import { NgModule } from '@angular/core';
+import { HijriDatePipe } from './hijri-date.pipe';
+
+@NgModule({
+  declarations: [HijriDatePipe],
+  exports: [HijriDatePipe],
+})
+export class PipesModule {}

package/src/lib/services/breadcrumbs.service.ts

@@ -0,0 +1,189 @@
+import { Injectable } from '@angular/core';
+import { Breadcrumbs } from '../models/breadcrumbs.model';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class BreadcrumbsService {
+  constructor() {}
+
+  setPageTitle(text: string) {
+    const titleEl = document.querySelector('.sub-section-title');
+    if (titleEl) {
+      titleEl.textContent = text;
+    }
+  }
+
+  setMainPageTitle(text: string, url: string) {
+    const div = document.getElementsByClassName('main-section-title');
+    if (div && div.length > 0) {
+      div[0].innerHTML = `<a id="site-url" href="${url}">${text}</a>`;
+    }
+  }
+
+  addBreadcrumb(
+    nodeName: string,
+    spanClasses = 'bc-current',
+    linkClasses = 'bc-node'
+  ) {
+    const spans = document.getElementById('ctl00_path')?.children;
+    //get last child
+    const lastIndex = spans?.item(spans.length - 1) as HTMLSpanElement;
+    const innerHTML = lastIndex.innerHTML;
+    lastIndex.innerHTML = '';
+    lastIndex.classList.remove(...['bc-current']);
+    //add new link
+    lastIndex.appendChild(
+      this.createLink(innerHTML, location.pathname, linkClasses)
+    );
+    //add new span and empty span
+    const newSpan = this.createSpan(nodeName, spanClasses);
+    const emptySpan = document.createElement('span');
+    lastIndex.after(...[emptySpan, newSpan]);
+  }
+
+  addBreadcrumbList(
+    nodeList: Breadcrumbs[],
+    spanClasses = 'bc-current',
+    linkClasses = 'bc-node'
+  ) {
+    const spans = document.getElementById('ctl00_path')?.childNodes;
+    //get last child
+    const lastSpan = spans?.item(spans.length - 1) as HTMLSpanElement;
+    const innerHTML = lastSpan.innerHTML;
+    lastSpan.classList.remove(...[spanClasses]);
+    lastSpan.innerHTML = '';
+    //add new link
+    lastSpan.appendChild(
+      this.createLink(innerHTML, location.pathname, linkClasses)
+    );
+
+    for (let i = 0; i < nodeList.length; i++) {
+      const lastIndex = spans?.item(spans.length - 1) as HTMLSpanElement;
+      if (nodeList[i].nodeUrl) {
+        const newSpan = document.createElement('span');
+        newSpan.appendChild(
+          this.createLink(
+            nodeList[i].nodeName,
+            nodeList[i].nodeUrl,
+            linkClasses
+          )
+        );
+        const emptySpan = document.createElement('span');
+        lastIndex.after(...[emptySpan, newSpan]);
+      } else {
+        const newSpan = this.createSpan(nodeList[i].nodeName, spanClasses);
+        const emptySpan = document.createElement('span');
+        lastIndex.after(...[emptySpan, newSpan]);
+      }
+    }
+  }
+
+  createBreadcrumbs(
+    nodeList: Breadcrumbs[],
+    spanClasses = 'bc-current',
+    linkClasses = 'bc-node'
+  ) {
+    const currentSpan = document.getElementById(
+      'ctl00_path'
+    ) as HTMLSpanElement;
+    currentSpan.innerHTML = '';
+    const newSpan = document.createElement('span');
+    currentSpan?.appendChild(newSpan);
+    newSpan.appendChild(
+      this.createLink(nodeList[0].nodeName, nodeList[0].nodeUrl, linkClasses)
+    );
+    const spans = currentSpan?.children;
+    for (let i = 1; i < nodeList.length; i++) {
+      const lastIndex = spans?.item(spans.length - 1) as HTMLSpanElement;
+      if (nodeList[i].nodeUrl) {
+        const newSpan = document.createElement('span');
+        newSpan.appendChild(
+          this.createLink(
+            nodeList[i].nodeName,
+            nodeList[i].nodeUrl,
+            linkClasses
+          )
+        );
+        const emptySpan = document.createElement('span');
+        lastIndex?.after(...[emptySpan, newSpan]);
+      } else {
+        const newSpan = this.createSpan(nodeList[i].nodeName, spanClasses);
+        const emptySpan = document.createElement('span');
+        lastIndex.after(...[emptySpan, newSpan]);
+      }
+    }
+  }
+
+  removeLastBreadcrumb() {
+    const spans = document.getElementById('ctl00_path')?.children;
+    spans?.item(spans.length - 1)?.remove();
+    spans?.item(spans.length - 1)?.remove();
+    this.setCurrentNode(spans);
+  }
+
+  removeBreadcrumbByNodeName(nodeName: string) {
+    const spans = document.getElementById('ctl00_path')
+      ?.children as HTMLCollection;
+    let index = -1;
+    for (let i = 0; i < spans.length; i++) {
+      const span = spans.item(i);
+      if (span?.textContent?.trim() === nodeName) {
+        index = i;
+        break;
+      }
+    }
+    const lastNode = spans.length - 1 === index;
+    if (index !== -1 && !lastNode) {
+      spans?.item(index)?.remove();
+      spans?.item(index)?.remove();
+    } else {
+      spans?.item(index)?.remove();
+      spans?.item(index - 1)?.remove();
+    }
+    if (lastNode) {
+      this.setCurrentNode(spans);
+    }
+  }
+
+  removeLastBreadcrumbsByLength(length: number) {
+    const spans = document.getElementById('ctl00_path')
+      ?.children as HTMLCollection;
+    while (length > 0) {
+      spans?.item(spans.length - 1)?.remove();
+      spans?.item(spans.length - 1)?.remove();
+      length--;
+    }
+    if (spans.length > 0) {
+      this.setCurrentNode(spans);
+    }
+  }
+
+  private createLink(
+    innerHTML: string,
+    href: string | null,
+    classes: string
+  ): HTMLAnchorElement {
+    const link = document.createElement('a');
+    link.innerHTML = ' ' + innerHTML;
+    link.href = href ?? '';
+    link.classList.add(...[classes]);
+    return link;
+  }
+
+  private createSpan(innerHTML: string, classes: string): HTMLSpanElement {
+    const span = document.createElement('span');
+    span.classList.add(...[classes]);
+    span.innerHTML = ' ' + innerHTML;
+    return span;
+  }
+
+  private setCurrentNode(spans?: HTMLCollection) {
+    const lastSpan = spans?.item(spans.length - 1) as HTMLSpanElement;
+    const lastSpanLink = spans
+      ?.item(spans.length - 1)
+      ?.children.item(0) as HTMLAnchorElement;
+    lastSpan?.classList.add(...['bc-current']);
+    lastSpan.innerHTML = lastSpanLink.innerHTML;
+  }
+}

package/src/lib/services/common.service.ts

@@ -0,0 +1,63 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class CommonService {
+  constructor() {}
+
+  print(element: string, title: string, classes?: string) {
+    const styles = this.getElementTag('style');
+    const linkes = this.getElementTag('link');
+    const scripts = this.getElementTag('script');
+
+    const printContents = document.getElementById(element)?.innerHTML;
+    const popupWin = window.open('', '', 'top=0,left=0,height=100%,width=auto');
+    const data = `
+        <!DOCTYPE html>
+            <head>
+            <title> ${title} </title>
+            <meta charset="utf-8">
+            ${linkes}
+            ${styles}
+            <style>
+                @media print {
+                  .noPrint{
+                    display: none !important;
+                  }
+                  body {
+                    direction: rtl;
+                  }
+              }
+            </style>
+            </head>
+          <body class="${classes}">
+            ${printContents}
+            ${scripts}
+          </body>
+
+        </html>`;
+    popupWin?.document.open();
+    popupWin?.document.write(data);
+    popupWin?.document.close();
+    popupWin?.focus();
+    popupWin?.addEventListener('focus', () => {
+      setTimeout(() => {
+        if (popupWin.document.hasFocus()) {
+          popupWin.print();
+          popupWin.close();
+        }
+      }, 1000);
+    });
+  }
+
+  private getElementTag(tag: keyof HTMLElementTagNameMap): string {
+    const html: string[] = [];
+    const elements = document.getElementsByTagName(tag);
+    for (let index = 0; index < elements.length; index++) {
+      html.push(elements[index].outerHTML);
+    }
+
+    return html.join('\r\n');
+  }
+}

package/src/lib/share-button/share-button.component.html

@@ -0,0 +1,3 @@
+<share-popup-button [title]="title" [description]="description" [icon]="'share-alt'"
+    [include]="['facebook','twitter','linkedin','telegram','whatsapp','email','copy']">
+</share-popup-button>

package/src/lib/share-button/share-button.component.ts

@@ -0,0 +1,23 @@
+import { Component, AfterViewInit, Input } from '@angular/core';
+
+@Component({
+  selector: 'ipa-share-button',
+  templateUrl: './share-button.component.html',
+  styleUrls: ['./share-button.component.scss'],
+})
+export class ShareButtonComponent implements AfterViewInit {
+  @Input() title = '';
+  @Input() description = '';
+  @Input() btnLabel = '';
+  constructor() {}
+  ngAfterViewInit(): void {
+    const elements = document.getElementsByClassName('sb-show-icon');
+    elements[0].setAttribute('type', 'button');
+    elements[0].setAttribute('id', 'IPAShareBtn');
+    const label = document.createElement('label');
+    label.innerHTML = this.btnLabel;
+    label.classList.add('sm-share-title');
+    label.classList.add('me-1');
+    elements[0].before(label);
+  }
+}

package/src/lib/share-button/share-button.module.ts

@@ -0,0 +1,32 @@
+import { OverlayModule } from '@angular/cdk/overlay';
+import { NgModule } from '@angular/core';
+import {
+  FaIconLibrary,
+  FontAwesomeModule,
+} from '@fortawesome/angular-fontawesome';
+import { fas } from '@fortawesome/free-solid-svg-icons';
+import { ShareIconsModule } from 'ngx-sharebuttons/icons';
+import { ShareButtonsPopupModule } from 'ngx-sharebuttons/popup';
+import { ShareButtonComponent } from './share-button.component';
+
+@NgModule({
+  declarations: [ShareButtonComponent],
+  imports: [
+    ShareIconsModule,
+    ShareButtonsPopupModule,
+    OverlayModule,
+    FontAwesomeModule,
+  ],
+  exports: [
+    ShareButtonComponent,
+    ShareIconsModule,
+    ShareButtonsPopupModule,
+    OverlayModule,
+    FontAwesomeModule,
+  ]
+})
+export class ShareButtonModule {
+  constructor(library: FaIconLibrary) {
+    library.addIconPacks(fas);
+  }
+}

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

@@ -1,9 +1,16 @@
+/*
+ * Public API Surface of ipa-library
+ */
+// module
 export * from './lib/ng-ipa-library.module';
 export * from 'ngx-toastr';
-export * from '@ng-select/ng-select';
 export * from './lib/pipes/pipes.module';
 export * from './lib/share-button/share-button.module';
+
+// core components
 export * from './lib/core/components/loading/loading.component';
+
+// form components
 export * from './lib/ipa-form/text-input/text-input.component';
 export * from './lib/ipa-form/textarea-input/textarea-input.component';
 export * from './lib/ipa-form/dropdown-input/dropdown-input.component';
@@ -13,16 +20,24 @@ export * from './lib/ipa-form/datepicker/gregorian-datepicker/gregorian-datepick
 export * from './lib/ipa-form/recaptcha/recaptcha.component';
 export * from './lib/generate-form/generate-form.component';
 export * from './lib/share-button/share-button.component';
+
+// interceptors
 export * from './lib/core/interceptors/loading.interceptor';
 export * from './lib/core/interceptors/error.interceptor';
 export * from './lib/core/interceptors/token.interceptor';
+
+// services
 export * from './lib/core/services/loader.service';
 export * from './lib/core/services/auth.service';
 export * from './lib/ipa-form/ipa-form.service';
 export * from './lib/core/services/error.service';
 export * from './lib/services/breadcrumbs.service';
 export * from './lib/services/common.service';
+
+//pipes
 export * from './lib/pipes/hijri-date.pipe';
+
+//models
 export * from './lib/models/pagedResult';
 export * from './lib/models/apiException';
 export * from './lib/models/apiResponse';

package/src/test.ts

@@ -0,0 +1,26 @@
+// 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()
+);
+// 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"
+  ]
+}