@bizdoc/core 1.14.9 → 1.14.10

package/src/lib/core/functions.ts

@@ -1,246 +0,0 @@
-import { MATERIAL_PALETTES } from "./colors";
-
-export declare type MaterialMode = 50 | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | 'A100' | 'A200' | 'A400' | 'A700';
-
-const IMAGE_TYPE = ['image/png', 'image/jpeg', 'image/jpg', 'image/gif'];
-
-export function mapToArray(map: { [key: string]: any }) {
-  return Object.keys(map).map(k => ({ key: k, value: map[k] }));
-}
-
-export function isImage(contentType: string): boolean {
-  return IMAGE_TYPE.indexOf(contentType) > -1;
-}
-
-export function cleanup(params) {
-  Object.keys(params).forEach(k => {
-    const val = params[k];
-    if (val === null || val === undefined || (isArray(val) && !val.length)) delete params[k]
-  });
-  return params;
-}
-
-export function outOfBound(element: HTMLElement) {
-  const bounding = element.getBoundingClientRect();
-  return bounding.top < 0 ||
-    bounding.left < 0 ||
-    bounding.right > document.documentElement.clientWidth ||
-    bounding.bottom > document.documentElement.clientHeight;
-}
-
-const IS_MOBILE = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
-export function isMobile() {
-  return IS_MOBILE /*|| document.cookie.indexOf('aria=1') > -1*/;
-} export function isFunction(val): val is Function {
-  return typeof val === 'function';
-}
-export function isBoolean(val): val is boolean {
-  return typeof val === 'boolean';
-}
-export function isObject(val) {
-  return val !== null && typeof val === 'object';
-}
-export function isPrimitive(val) {
-  return typeof val !== 'object' && !Array.isArray(val);
-}
-export function isPromise(obj): obj is Promise<any> {
-  return obj instanceof Promise;
-}
-export function isDate(val): val is Date {
-  return val instanceof Date;
-}
-export function isArray(val): val is Array<any> {
-  return Array.isArray(val);
-}
-export function isString(val: any): val is string {
-  return typeof val === 'string' || val instanceof String;
-}
-
-export function getWarn(mode: MaterialMode = 500) {
-  return MATERIAL_PALETTES['red'][mode];
-}
-
-export function playAudio(name: 'notification_simple-01' | 'alert_error-03') {
-  try {
-    const audio = new Audio();
-    audio.src = `/assets/sounds/${name}.ogg`;
-    audio.load();
-    audio.play();
-  } catch (e) {
-    console.log(e);
-  }
-}
-
-/**
- * 
- * @param o1
- * @param o2
- */
-export function deepAssign(o1, o2) {
-  o2 && Object.keys(o2).forEach(p => {
-    const val2 = o2[p], val1 = o1[p];
-    if (val1 === undefined || val1 === null || isPrimitive(val2)) // val !== 'object' && !Array.isArray(val)
-      o1[p] = val2;
-    else if (Array.isArray(val2)) {
-      if (val2.length && !isPrimitive(val2[0])) {
-        for (let i = 0; i < val2.length; i++) {
-          if (val1[i] !== undefined)
-            deepAssign(val1[i], val2[i]);
-          else
-            val1.push(val2[i]);
-        }
-        (val1 as any[]).splice(val2.length);
-      }
-      else
-        //(val2 as any[]).splice(0, val2.length, ...val);
-        o1[p] = val2;
-    }
-    else //if (isObject(val2))
-      deepAssign(val1, val2);
-  });
-  return o1;
-}
-
-function generateEncryptionMap(): { [key: string]: string | number } {
-  const values = {};
-  for (let i = 65; i < 91; i++) {
-    const d = (i - 65).toString(),
-      c = String.fromCharCode(i);
-    values[d] = c;
-    values[c] = d;
-  }
-  for (let i = 97; i < 123; i++) {
-    const d = (i - 71).toString(),
-      c = String.fromCharCode(i);
-    values[d] = c;
-    values[c] = d;
-  }
-  return values;
-}
-const decode = generateEncryptionMap();
-declare global {
-  interface String {
-    decodeId: () => number;
-  }
-  interface Number {
-    encodeId: () => string;
-  }
-}
-String.prototype.decodeId = function (): number {
-  let v = '';
-  for (let i = 0; i < this.length; i++) {
-    const c = this.charAt(i);
-    v += decode[c];
-  }
-  return parseInt(v);
-};
-Number.prototype.encodeId = function (): string {
-  let v = '',
-    d = this.toString();
-  while (d.length > 0) {
-    let i = 51,
-      c = i.toString();
-    while (!d.startsWith(c)) {
-      --i, c = i.toString();
-    } v += decode[c];
-    d = d.substring(c.length);
-  }
-  return v;
-};
-
-/** global extended array functions */
-(window as any).global = window;
-declare global {
-  interface Array<T> {
-    remove(item: T): T[];
-    last(): T;
-    average(predicate: (i: T) => number): number;
-    distinct<M>(predicate: (i: T) => M): Set<M>;
-    sum(predicate: (i: T) => number): number;
-    max(predicate: (i: T) => number): number;
-  }
-  interface String {
-    formatArgs(...args): string;
-    normalize(): string;
-  }
-}
-String.prototype.normalize = function () {
-  return this.replace(/ /g, '_').replace(/[^\w]/g, '').toLowerCase();
-}
-
-String.prototype.formatArgs = function (...args): string {
-  return this.replace(/{(\d+)}/g, (_, index) => args[index] || '');
-}
-Array.prototype.last = function () {
-  return this[this.length - 1];
-}
-/** remove element from array */
-Array.prototype.remove = function <T>(value: T): T[] {
-  const index = this.indexOf(value);
-  if (index > -1) this.splice(index, 1);
-  return this;
-};
-/** calculate average using element predicate */
-Array.prototype.average = function <T>(predicate?: (i: T) => number): number {
-  let average = 0;
-  this.forEach(i =>
-    average += predicate(i)
-  );
-  return average !== 0 ? average / this.length : 0;
-}
-Array.prototype.distinct = function <T, M>(predicate?: (i: T) => M): Set<M> {
-  const values = new Set<M>();
-  this.forEach(i =>
-    values.add(predicate(i))
-  );
-  return values;
-}
-Array.prototype.max = function <T>(predicate?: (i: T) => number): number {
-  let n = 0;
-  this.forEach(i =>
-    n = Math.max(n, predicate(i))
-  );
-  return n;
-}
-/** sum elements using predicate */
-Array.prototype.sum = function <T>(predicate?: (i: T) => number): number {
-  let n = 0;
-  this.forEach(i =>
-    n += predicate(i)
-  );
-  return n;
-}
-/**
- * 
- * @param args
- */
-export function queryParams(args: any) {
-  const params = {};
-  args &&
-    Object.keys(args).forEach(k => {
-      const val = args[k];
-
-      if (val !== null && val !== undefined) {
-        if (isString(val))
-          params[k] = val;
-        else if (isArray(val) && val.length)
-          params[k] = val;
-        else if (isDate(val))
-          params[k] = val.toJSON();
-        else if (isObject(val)) {
-          if (Object.keys(val).length) params[k] = queryParams(val);
-        }
-        else
-          params[k] = val;
-      }
-    });
-  return params;
-}
-function getParameterByName(name, url = window.location.href) {
-  name = name.replace(/[\[\]]/g, '\\$&');
-  var regex = new RegExp('[?&]' + name + '(=([^&#]*)|&|#|$)'),
-    results = regex.exec(url);
-  if (!results) return null;
-  if (!results[2]) return '';
-  return decodeURIComponent(results[2].replace(/\+/g, ' '));
-}

package/src/lib/core/guide/_guide-theme.scss

@@ -1,197 +0,0 @@
-@mixin guide-theme($theme) {
-  $accent: mat.get-color-from-palette($theme, accent);
-  $foreground: mat.get-color-from-palette($theme, foreground);
-  $background: mat.get-color-from-palette($theme, background);
-
-  $guide-border-color:  mat.get-color-from-palette($accent, 300);
-  $guide-tooltip-size: 9px;
-  $guide-margin: 12px;
-  $guide-padding: 8px;
-  $guide-background:  mat.get-color-from-palette($background, card);
-
-  .guide-panel {
-    .container {
-      display: flex;
-
-      .content {
-        padding: 8px;
-        display: block;
-        min-width: 250px;
-        color:  mat.get-color-from-palette($foreground, text);
-        background: $guide-background;
-        border-radius: 5px;
-        border: 3px solid $guide-border-color;
-      }
-
-      .tooltip-container {
-        display: none;
-
-        .tooltip {
-          display: block;
-          position: relative;
-          transform: translate(-50%,50%) rotate(45deg);
-          width: $guide-tooltip-size;
-          height: $guide-tooltip-size;
-          background: $guide-background;
-          border: 3px solid $guide-border-color;
-          border-radius: 1px;
-
-          &:after {
-            content: '\00a0';
-            position: absolute;
-            background: $guide-background;
-            width: 15px;
-            height: 15px;
-          }
-        }
-      }
-    }
-
-    &.start, &.center, &.end {
-      .tooltip-container {
-        display: flex;
-      }
-    }
-
-    &.center .tooltip-container {
-      align-self: center;
-      align-items: center;
-    }
-
-    &.end .tooltip-container {
-      align-self: flex-end;
-      align-items: flex-end;
-    }
-
-    &.before, &.after {
-      &.start .tooltip {
-        margin-top: 4px;
-      }
-
-      &.center .tooltip {
-        margin-bottom: 17px;
-      }
-
-      &.end .tooltip {
-        margin-bottom: 20px;
-      }
-    }
-
-    &.above, &.below {
-      .container {
-        margin-left: $guide-padding;
-        margin-right: $guide-padding;
-      }
-
-      &.start .tooltip {
-        margin-left: 20px;
-      }
-
-      &.end .tooltip {
-        margin-right: 4px;
-      }
-    }
-
-    &.above .tooltip, &.after .tooltip {
-      position: absolute !important;
-    }
-
-    &.before {
-      .container {
-        -ms-flex-direction: row;
-        -webkit-flex-direction: row;
-        flex-direction: row;
-      }
-
-      .tooltip:after {
-        left: -5px;
-        top: 0;
-      }
-    }
-
-    &.after {
-      .container {
-        margin-left: $guide-margin;
-        -ms-flex-direction: row-reverse;
-        -webkit-flex-direction: row-reverse;
-        flex-direction: row-reverse;
-      }
-
-      .tooltip:after {
-        top: -5px;
-        left: 0;
-      }
-    }
-
-    &.above {
-      .container {
-        margin-top: $guide-padding;
-        -ms-flex-direction: column;
-        -webkit-flex-direction: column;
-        flex-direction: column;
-      }
-
-      .tooltip {
-        margin-top: -17px;
-
-        &:after {
-          left: -5px;
-          top: -5px;
-        }
-      }
-    }
-
-    &.below {
-      .container {
-        margin-bottom: $guide-padding;
-        -ms-flex-direction: column-reverse;
-        -webkit-flex-direction: column-reverse;
-        flex-direction: column-reverse;
-      }
-
-      .tooltip:after {
-      }
-    }
-  }
-
-  [dir=rtl] .guide-panel {
-    &.above.start .tooltip, &.below.start .tooltip {
-      margin-right: 8px;
-      margin-left: unset;
-    }
-
-    &.above.end .tooltip, &.below.end .tooltip {
-      margin-left: 20px;
-    }
-
-    &.below .tooltip:after {
-      top: 0;
-      right: -5px;
-    }
-
-    &.before .tooltip {
-      margin-right: -17px;
-
-      &:after {
-        top: 0;
-        left: -5px;
-      }
-    }
-
-    &.above .tooltip, &.after .tooltip {
-      position: relative !important;
-    }
-
-    &.after {
-      .container {
-        margin-left: unset;
-        margin-right: $guide-margin;
-      }
-
-      .tooltip:after {
-        left: -5px;
-        top: 0;
-      }
-    }
-  }
-}

package/src/lib/core/guide/guide.component.html

@@ -1,20 +0,0 @@
-<div class="container" [style.display]="step ? '': 'none'" cdkTrapFocus>
-  <div fxLayout="column" class="content">
-    <div fxLayout="row">
-      <h2 *ngIf="step?.title" class="mat-h2">{{step?.title}}</h2>
-      <span class="divider"></span>
-      <button mat-icon-button (click)="close()" *ngIf="index < count - 1"><mat-icon>close</mat-icon></button>
-    </div>
-    <p class="mat-body" [innerHTML]="step?.content | sanitizeHtml">
-    </p>
-    <div fxLayout="row">
-      <span class="divider"></span>
-      <button mat-icon-button (click)="prev()" [disabled]="index < 1 || working"><mat-icon class="mat-icon-rtl-mirror">keyboard_arrow_left</mat-icon></button>
-      <button mat-icon-button (click)="next()" [disabled]="index >= count - 1 || working" cdkFocusInitial><mat-icon class="mat-icon-rtl-mirror">keyboard_arrow_right</mat-icon></button>
-      <button mat-button (click)="close()" *ngIf="index >= count - 1">{{'GuideFinish'|translate}}</button>
-    </div>
-  </div>
-  <div class="tooltip-container">
-    <div class="tooltip"></div>
-  </div>
-</div>

package/src/lib/core/guide/guide.component.ts

@@ -1,222 +0,0 @@
-import { Inject, Component, OnInit, ElementRef, InjectionToken, HostListener } from '@angular/core';
-import { Overlay, OverlayRef, PositionStrategy, ConnectedPosition } from "@angular/cdk/overlay";
-import { trigger, state, style, transition, animate } from '@angular/animations';
-import { Directionality } from '@angular/cdk/bidi';
-import { ESCAPE, LEFT_ARROW, RIGHT_ARROW } from '@angular/cdk/keycodes';
-import { GuideStep, Guide } from '../models';
-import { outOfBound } from '../functions';
-import { Router } from '@angular/router';
-import { SessionService } from '../session.service';
-
-export const TOUR_TOKEN = new InjectionToken<Guide>('guide');
-
-const BELOW: ConnectedPosition[] = [{
-  originX: 'start',
-  originY: 'bottom',
-  overlayX: 'start',
-  overlayY: 'top',
-  panelClass: ['below', 'start']
-}, {
-  originX: 'center',
-  originY: 'bottom',
-  overlayX: 'center',
-  overlayY: 'top',
-  panelClass: ['below', 'center']
-}, {
-  originX: 'end',
-  originY: 'bottom',
-  overlayX: 'end',
-  overlayY: 'top',
-  panelClass: ['below', 'end']
-}],
-  ABOVE: ConnectedPosition[] = [{
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'start',
-    overlayY: 'bottom',
-    panelClass: ['above', 'start']
-  },
-  {
-    originX: 'center',
-    originY: 'top',
-    overlayX: 'center',
-    overlayY: 'bottom',
-    panelClass: ['above', 'center']
-  },
-  {
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'end',
-    overlayY: 'bottom',
-    panelClass: ['above', 'end']
-  }],
-  AFTER: ConnectedPosition[] = [{
-    originX: 'end',
-    originY: 'top',
-    overlayX: 'start',
-    overlayY: 'top',
-    panelClass: ['after', 'start']
-  },
-  {
-    originX: 'end',
-    originY: 'center',
-    overlayX: 'start',
-    overlayY: 'center',
-    panelClass: ['after', 'center']
-  },
-  {
-    originX: 'end',
-    originY: 'bottom',
-    overlayX: 'start',
-    overlayY: 'bottom',
-    panelClass: ['after', 'end']
-  }],
-  BEFORE: ConnectedPosition[] = [{
-    originX: 'start',
-    originY: 'top',
-    overlayX: 'end',
-    overlayY: 'top',
-    panelClass: ['before', 'start']
-  }, {
-    originX: 'start',
-    originY: 'center',
-    overlayX: 'end',
-    overlayY: 'center',
-    panelClass: ['before', 'center']
-  }, {
-    originX: 'start',
-    originY: 'center',
-    overlayX: 'end',
-    overlayY: 'bottom',
-    panelClass: ['before', 'end']
-  }];
-
-@Component({
-  templateUrl: './guide.component.html',
-  animations: [trigger('body', [
-    state('here', style({ width: '*', height: '*' })),
-    transition('*<=>*', animate('250ms', style({})))])]
-})
-export class GuideComponent implements OnInit {
-  step: GuideStep;
-  index = -1;
-  readonly count: number = this._data.steps.length;
-  working = true;
-  constructor(
-    @Inject(TOUR_TOKEN)
-    private _data: Guide,
-    private _session: SessionService,
-    private _overlay: Overlay,
-    private _ngRouter: Router,
-    private _overlayRef: OverlayRef) {
-  }
-  ngOnInit(): void {
-    if (this._data.name) {
-      const lastindex = localStorage.getItem(this._data.name + '_guide_step');
-      if (lastindex) {
-        this.index = Number.parseInt(lastindex);
-      }
-    }
-    this._moveBy(1);
-  }
-  /**
-   * 
-   * @param steps
-   */
-  private _moveBy(steps: 1 | -1) {
-    const index = this.index + steps;
-    if (index < 0 || index > this.count - 1) {
-      localStorage.removeItem(this._data.name + '_guide_step');
-      return;
-    }
-    this._data.name && localStorage.setItem(this._data.name + '_guide_step', this.index.toString());
-    this.working = true;
-    const step = this._data.steps[index];
-    const { selector, position, navigate, simulate } = step, promisses: Promise<any>[] = [];
-    if (navigate) {
-      const promise = this._ngRouter.navigateByUrl(navigate);
-      promisses.push(promise);
-    }
-    let positionStrategy: PositionStrategy;
-    if (selector) {
-      const element = document.querySelector(selector) as HTMLElement;
-      if (!element) {
-        console.warn(`Guide ${this._data.name} selector '${selector}' not found. skipping.`);
-        this._moveBy(steps);
-        return;
-      }
-      let positions: ConnectedPosition[];
-      switch (position) {
-        case 'Above':
-          positions = [...ABOVE, ...BELOW, ...AFTER, ...BEFORE];
-          break;
-        case 'End':
-          positions = [...AFTER, ...BEFORE, ...BELOW, ...ABOVE];
-          break;
-        case 'Start':
-          positions = [...BEFORE, ...AFTER, ...BELOW, ...ABOVE];
-          break;
-        case 'Below':
-          positions = [...BELOW, ...BEFORE, ...ABOVE, ...AFTER];
-          break;
-        default:
-          positions = [...BEFORE, ...BELOW, ...ABOVE, ...AFTER];
-      }
-      positionStrategy = this._overlay.position().
-        flexibleConnectedTo(new ElementRef(element)).
-        withPositions(positions).
-        withGrowAfterOpen();
-      if (outOfBound(element)) {
-        promisses.push(new Promise<any>(resolve => {
-          const task = setInterval(() => {
-            if (!outOfBound(element)) {
-              clearInterval(task);
-              resolve(null);
-            }
-          }, 150);
-        }));
-        element.scrollIntoView({ behavior: 'smooth' });
-      }
-      simulate &&
-        promisses.push(new Promise(resolve => {
-          element.click();
-          resolve(null);
-        }));
-    }
-    else positionStrategy = this._overlay.position().global().centerVertically().centerHorizontally();
-
-    const complete = () => {
-      this.index = index;
-      this.step = step;
-      this.working = false;
-      this._overlayRef.updatePositionStrategy(positionStrategy);
-      this._overlayRef.updatePosition();
-    };
-    promisses.length ? Promise.all(promisses).then(() => complete()) : complete();
-  }
-  @HostListener('window:keydown', ['$event'])
-  keydown(evt: KeyboardEvent) {
-    if (!this.working)
-      switch (evt.keyCode) {
-        case LEFT_ARROW:
-          this._moveBy(this._session.direction === 'ltr' ? -1 : 1);
-          break;
-        case RIGHT_ARROW:
-          this._moveBy(this._session.direction === 'ltr' ? 1 : -1);
-          break;
-        case ESCAPE:
-          this.close();
-          evt.stopPropagation();
-          break;
-      }
-  }
-  next() {
-    this._moveBy(1);
-  }
-  prev() {
-    this._moveBy(-1);
-  }
-  close() {
-    this._overlayRef.detach();
-  }
-}