@frxjs/ngx-timeline 1.0.12 → 1.1.0

package/projects/ngx-timeline/src/lib/components/ngx-timeline.scss

@@ -1,226 +0,0 @@
-$flex-display-col: 49 49 0;
-$flex-display-col-center: 2 2 0;
-$background-line: #464646;
-$background-orange: orange;
-
-.main-container {
-  display: flex;
-  justify-content: center;
-  width: 100%
-}
-
-.items-container {
-  padding: 1rem 0;
-  min-width: max(20rem, 100%);
-}
-
-.row {
-  display: -webkit-box;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  flex-wrap: wrap;
-}
-
-.row > [class*="col-"] {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-}
-
-.col-left {
-  align-items: flex-end;
-  padding: 0;
-  flex: $flex-display-col;
-}
-
-.col-right {
-  align-items: flex-start;
-  padding: 0;
-  flex: $flex-display-col;
-}
-
-.col-center {
-  min-height: 6rem;
-  padding: 0;
-  flex: $flex-display-col-center;
-}
-
-.center-inner {
-  width: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  height: 100%;
-
-  .line {
-    min-height: 50%;
-    max-height: 50%;
-    height: 50%;
-    background: $background-line;
-    width: 0.1rem;
-
-    &.transparent {
-      background: transparent;
-    }
-  }
-}
-
-.period-container {
-  background: $background-orange;
-  color: white;
-  margin: 0;
-  padding: 0.2rem 0.5rem;
-
-  .period-inner-container {
-    width: max-content;
-    padding: 0.2rem 0.5rem;
-    z-index: 10;
-  }
-}
-
-.center-icon-container {
-  padding: .8rem 0;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  position: absolute;
-  height: 10px;
-  width: 10px;
-  background: white;
-
-  .icon {
-    height: 1rem;
-    width: 1rem;
-    border-radius: 50%;
-    background: $background-orange;
-    margin: 0;
-    position: absolute;
-  }
-}
-
-.event-outer-container {
-  margin: 0 0.5rem;
-  width: 100%;
-}
-
-.hour {
-  padding: 0.5rem;
-  background: none;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-
-  &.right {
-    justify-content: flex-start;
-  }
-
-  &.left {
-    justify-content: flex-end;
-  }
-
-  .hour-inner-container {
-    margin: 0;
-  }
-}
-
-.desktop {
-  display: flex !important;
-}
-.mobile {
-  display: none !important;
-}
-
-@media (max-width: 900px) {
-  .desktop {
-    display: none !important;
-  }
-  .mobile {
-    display: flex !important;
-  }
-
-  .event-outer-container {
-    margin: 0.5rem 0.3rem;
-  }
-
-  .col-left {
-    align-items: flex-start;
-
-    .hour {
-      font-size: 12px;
-      padding: 0;
-      margin-right: 0.3rem;
-    }
-
-    &.col-period {
-      flex: 18 18 0;
-    }
-    &.col-event {
-      flex: 18 18 0;
-      padding: 0;
-      align-items: flex-end;
-    }
-  }
-
-  .col-right {
-    align-items: flex-start;
-
-    &.col-period {
-      flex: 77 77 0;
-    }
-    &.col-event {
-      flex: 77 77 0;
-      padding: 0;
-    }
-  }
-
-  .col-center {
-    min-height: 6rem;
-    justify-content: center;
-    margin: 0;
-
-    &.col-period {
-      flex: 5 5 0;
-      min-height: 3rem;
-    }
-    &.col-event {
-      flex: 5 5 0;
-    }
-  }
-
-  .center-inner {
-    align-items: center;
-  }
-
-  .period-container {
-    min-height: 20%;
-    height: 20%;
-    max-height: 20%;
-    background: transparent;
-    background: transparent;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    border-radius: 6px;
-
-    .period-inner-container {
-      position: absolute;
-      background: $background-orange;
-      color: white;
-      width: max-content;
-      padding: 0.2rem 0.5rem;
-      z-index: 10;
-    }
-  }
-
-  .center-icon-container {
-    align-items: center;
-    justify-content: center;
-    .icon {
-      height: 1rem;
-      width: 1rem;
-      position: absolute;
-    }
-  }
-}

package/projects/ngx-timeline/src/lib/models/NgxConfigObj.ts

@@ -1,110 +0,0 @@
-export let supportedLanguageCodes = ['en', 'it', 'fr', 'de', 'es'];
-
-export interface NgxConfigDate {
-  code: string;
-  dayMonthYear: string;
-  fullDate: string;
-  hoursMinutes: string;
-  monthYear: string;
-  year: string;
-}
-
-export interface NgxDateObjMap {
-  [key: string]: NgxConfigDate;
-}
-
-export let dateConfigMap: NgxDateObjMap = {
-  en: {
-    code: 'en-US',
-    fullDate: 'MM/dd/yyyy h:mm a',
-    dayMonthYear: 'dd MMMM yyyy',
-    monthYear: 'MMMM yyyy',
-    year: 'yyyy',
-    hoursMinutes: 'hh:mm a'
-  },
-  it: {
-    code: 'it-IT',
-    fullDate: 'dd/MM/yyyy H:mm',
-    dayMonthYear: 'dd MMMM yyyy',
-    monthYear: 'MMMM yyyy',
-    year: 'yyyy',
-    hoursMinutes: 'HH:mm'
-  },
-  fr: {
-    code: 'fr-FR',
-    fullDate: 'dd/MM/yyyy H:mm',
-    dayMonthYear: 'dd MMMM yyyy',
-    monthYear: 'MMMM yyyy',
-    year: 'yyyy',
-    hoursMinutes: 'HH:mm'
-  },
-  de: {
-    code: 'de',
-    fullDate: 'dd/MM/yyyy H:mm',
-    dayMonthYear: 'dd MMMM yyyy',
-    monthYear: 'MMMM yyyy',
-    year: 'yyyy',
-    hoursMinutes: 'HH:mm'
-  },
-  es: {
-    code: 'es',
-    fullDate: 'dd/MM/yyyy H:mm',
-    dayMonthYear: 'dd MMMM yyyy',
-    monthYear: 'MMMM yyyy',
-    year: 'yyyy',
-    hoursMinutes: 'HH:mm'
-  }
-};
-
-export enum NgxDateFormat {
-  DAY_MONTH_YEAR  = 'DAY_MONTH_YEAR',
-  FULL_DATE  = 'FULL_DATE',
-  MONTH_YEAR  = 'MONTH_YEAR',
-  HOURS_MINUTES = 'HOURS_MINUTES',
-  YEAR  = 'YEAR'
-}
-
-export let fieldConfigDate = {
-  MONTH_YEAR: 'monthYear',
-  YEAR: 'year',
-  HOURS_MINUTES: 'hoursMinutes',
-  FULL_DATE: 'fullDate',
-  DAY_MONTH_YEAR: 'dayMonthYear'
-}
-
-/**
- * Enum used to set the group event logic
- */
-export enum NgxTimelineEventGroup {
-  YEAR = 'YEAR',
-  MONTH_YEAR = 'MONTH_YEAR',
-  DAY_MONTH_YEAR = 'DAY_MONTH_YEAR'
-}
-
-export let fieldsToAddEventGroup = {
-  YEAR: ['getFullYear'],
-  MONTH_YEAR: ['getFullYear', 'getMonth'],
-  DAY_MONTH_YEAR: ['getFullYear', 'getMonth', 'getDate']
-};
-
-export let periodKeyDateFormat = {
-  YEAR: NgxDateFormat.YEAR,
-  MONTH_YEAR: NgxDateFormat.MONTH_YEAR,
-  DAY_MONTH_YEAR: NgxDateFormat.DAY_MONTH_YEAR,
-};
-
-/**
- * Enum used to set the change side event logic
- */
-export enum NgxTimelineEventChangeSideInGroup {
-  ALL = 'ALL',
-  ON_DIFFERENT_HMS = 'ON_DIFFERENT_HMS',
-  ON_DIFFERENT_DAY = 'ON_DIFFERENT_DAY',
-  ON_DIFFERENT_MONTH = 'ON_DIFFERENT_MONTH'
-}
-
-export let fieldsToCheckEventChangeSideInGroup = {
-  ON_DIFFERENT_MONTH: ['getFullYear', 'getMonth'],
-  ON_DIFFERENT_DAY: ['getFullYear', 'getMonth', 'getDate'],
-  ON_DIFFERENT_HMS: ['getFullYear', 'getMonth', 'getDate', 'getHours', 'getMinutes', 'getSeconds']
-};

package/projects/ngx-timeline/src/lib/models/NgxTimelineEvent.ts

@@ -1,32 +0,0 @@
-/**
- * Event to be provided from outside the timeline
- */
-export interface NgxTimelineEvent {
-  timestamp?: Date;
-  title?: string;
-  description?: string;
-  id?: any;
-}
-
-export interface NgxTimelinePeriodInfo {
-  periodKey?: string;
-  year?: number;
-  month?: number;
-  day?: number;
-  firstDate?: any;
-}
-
-/**
- * Item used inside the timeline
- */
-export interface NgxTimelineItem {
-  type?: string;
-  position?: NgxTimelineItemPosition.ON_LEFT | NgxTimelineItemPosition.ON_RIGHT;
-  periodInfo?: NgxTimelinePeriodInfo;
-  eventInfo?: NgxTimelineEvent;
-}
-
-export enum NgxTimelineItemPosition {
-  ON_LEFT = 'ON_LEFT',
-  ON_RIGHT = 'ON_RIGHT'
-}

package/projects/ngx-timeline/src/lib/ngx-timeline.module.ts

@@ -1,21 +0,0 @@
-import { NgModule } from '@angular/core';
-import { NgxTimelineComponent } from './components/ngx-timeline.component';
-import { NgxTimelineEventComponent } from './components/ngx-timeline-event/ngx-timeline-event.component';
-import { CommonModule, registerLocaleData } from '@angular/common';
-import { NgxDatePipe } from './pipes/ngx-date-pipe';
-import localeIt from '@angular/common/locales/it';
-import localeFr from '@angular/common/locales/fr';
-import localeDe from '@angular/common/locales/de';
-import localeEs from '@angular/common/locales/es';
-
-registerLocaleData(localeIt);
-registerLocaleData(localeFr);
-registerLocaleData(localeDe);
-registerLocaleData(localeEs);
-
-@NgModule({
-  declarations: [NgxTimelineComponent, NgxTimelineEventComponent, NgxDatePipe],
-  imports: [CommonModule],
-  exports: [NgxTimelineComponent, NgxDatePipe]
-})
-export class NgxTimelineModule { }

package/projects/ngx-timeline/src/lib/pipes/ngx-date-pipe.ts

@@ -1,29 +0,0 @@
-import { DatePipe } from '@angular/common';
-import { Pipe, PipeTransform } from '@angular/core';
-import { NgxConfigDate, NgxDateObjMap, NgxDateFormat, supportedLanguageCodes, fieldConfigDate, dateConfigMap } from '../models';
-
-@Pipe({ name: 'ngxdate', pure: false })
-export class NgxDatePipe implements PipeTransform {
-
-  constructor() {
-  }
-
-  transform(date: Date | string, dateFormat?: string, langCode?: string): string {
-    let transformedDate = null;
-    if (date) {
-      const objDate = this.getDateConfig(langCode);
-      transformedDate = new DatePipe(objDate.code).transform(new Date(date), this.dateFormat(dateFormat, objDate));
-    }
-    return transformedDate;
-  }
-
-  private dateFormat(dateFormat: string, configDate: NgxConfigDate): string {
-    return configDate[fieldConfigDate[dateFormat]];
-  }
-
-  private getDateConfig(langCode: string): NgxConfigDate {
-    const code = langCode || supportedLanguageCodes[0];
-    const configDate = dateConfigMap[code] || dateConfigMap[supportedLanguageCodes[0]];
-    return configDate;
-  }
-}

package/projects/ngx-timeline/src/test.ts

@@ -1,26 +0,0 @@
-// 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/projects/ngx-timeline/tsconfig.lib.json

@@ -1,25 +0,0 @@
-/* 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"
-    ]
-  },
-  "angularCompilerOptions": {
-    "skipTemplateCodegen": true,
-    "strictMetadataEmit": true,
-    "enableResourceInlining": true
-  },
-  "exclude": [
-    "src/test.ts",
-    "**/*.spec.ts"
-  ]
-}

package/projects/ngx-timeline/tsconfig.lib.prod.json

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

package/projects/ngx-timeline/tsconfig.spec.json

@@ -1,17 +0,0 @@
-/* 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"
-  ]
-}

package/projects/ngx-timeline/tslint.json

@@ -1,17 +0,0 @@
-{
-  "extends": "../../tslint.json",
-  "rules": {
-    "directive-selector": [
-      true,
-      "attribute",
-      "ngx",
-      "camelCase"
-    ],
-    "component-selector": [
-      true,
-      "element",
-      "ngx",
-      "kebab-case"
-    ]
-  }
-}

package/tsconfig.json

@@ -1,35 +0,0 @@
-{
-  "compileOnSave": false,
-  "compilerOptions": {
-    "baseUrl": "./",
-    "outDir": "./dist/out-tsc",
-    "forceConsistentCasingInFileNames": true,
-    "preserveSymlinks": true,
-    "strict": false,
-    "noImplicitReturns": true,
-    "noFallthroughCasesInSwitch": true,
-    "sourceMap": true,
-    "declaration": false,
-    "downlevelIteration": true,
-    "experimentalDecorators": true,
-    "moduleResolution": "node",
-    "importHelpers": true,
-    "target": "es2015",
-    "module": "es2020",
-    "lib": [
-      "es2018",
-      "dom"
-    ],
-    "paths": {
-      "ngx-timeline": [
-        "dist/ngx-timeline/ngx-timeline",
-        "dist/ngx-timeline"
-      ]
-    }
-  },
-  "angularCompilerOptions": {
-    "strictInjectionParameters": true,
-    "strictInputAccessModifiers": true,
-    "strictTemplates": false
-  }
-}

package/tslint.json

@@ -1,140 +0,0 @@
-{
-  "extends": "tslint:recommended",
-  "rulesDirectory": [
-    "codelyzer"
-  ],
-  "rules": {
-    "align": {
-      "options": [
-        "parameters",
-        "statements"
-      ]
-    },
-    "array-type": false,
-    "arrow-return-shorthand": true,
-    "curly": true,
-    "deprecation": {
-      "severity": "warning"
-    },
-    "eofline": true,
-    "import-blacklist": [
-      true,
-      "rxjs/Rx"
-    ],
-    "import-spacing": true,
-    "indent": {
-      "options": [
-        "spaces"
-      ]
-    },
-    "max-classes-per-file": false,
-    "max-line-length": [
-      true,
-      140
-    ],
-    "member-ordering": [
-      true,
-      {
-        "order": [
-          "static-field",
-          "instance-field",
-          "static-method",
-          "instance-method"
-        ]
-      }
-    ],
-    "no-console": [
-      true,
-      "debug",
-      "info",
-      "time",
-      "timeEnd",
-      "trace"
-    ],
-    "no-empty": false,
-    "no-inferrable-types": [
-      true,
-      "ignore-params"
-    ],
-    "no-non-null-assertion": true,
-    "no-redundant-jsdoc": true,
-    "no-switch-case-fall-through": true,
-    "no-var-requires": false,
-    "object-literal-key-quotes": [
-      true,
-      "as-needed"
-    ],
-    "quotemark": [
-      true,
-      "single"
-    ],
-    "semicolon": {
-      "options": [
-        "always"
-      ]
-    },
-    "space-before-function-paren": {
-      "options": {
-        "anonymous": "never",
-        "asyncArrow": "always",
-        "constructor": "never",
-        "method": "never",
-        "named": "never"
-      }
-    },
-    "typedef": [
-      true,
-      "call-signature"
-    ],
-    "typedef-whitespace": {
-      "options": [
-        {
-          "call-signature": "nospace",
-          "index-signature": "nospace",
-          "parameter": "nospace",
-          "property-declaration": "nospace",
-          "variable-declaration": "nospace"
-        },
-        {
-          "call-signature": "onespace",
-          "index-signature": "onespace",
-          "parameter": "onespace",
-          "property-declaration": "onespace",
-          "variable-declaration": "onespace"
-        }
-      ]
-    },
-    "variable-name": {
-      "options": [
-        "ban-keywords",
-        "check-format",
-        "allow-pascal-case"
-      ]
-    },
-    "whitespace": {
-      "options": [
-        "check-branch",
-        "check-decl",
-        "check-operator",
-        "check-separator",
-        "check-type",
-        "check-typecast"
-      ]
-    },
-    "component-class-suffix": true,
-    "contextual-lifecycle": true,
-    "directive-class-suffix": true,
-    "no-conflicting-lifecycle": true,
-    "no-host-metadata-property": true,
-    "no-input-rename": true,
-    "no-inputs-metadata-property": true,
-    "no-output-native": true,
-    "no-output-on-prefix": true,
-    "no-output-rename": true,
-    "no-outputs-metadata-property": true,
-    "template-banana-in-box": true,
-    "template-no-negated-async": true,
-    "use-lifecycle-interface": true,
-    "use-pipe-transform-interface": true
-  }
-}