fix(core): update

package.json

@@ -16,15 +16,16 @@
     "websafe"
   ],
   "devDependencies": {
-    "@gitzone/tsbuild": "^2.1.22",
+    "@gitzone/tsbuild": "^2.1.25",
-    "@gitzone/tsbundle": "^1.0.72",
+    "@gitzone/tsbundle": "^1.0.78",
-    "@gitzone/tstest": "^1.0.38",
+    "@gitzone/tstest": "^1.0.52",
-    "@pushrocks/tapbundle": "^3.2.7",
+    "@pushrocks/tapbundle": "^3.2.9",
-    "tslint": "^6.1.0",
+    "tslint": "^6.1.3",
     "tslint-config-prettier": "^1.15.0"
   },
   "dependencies": {
-    "@tsclass/tsclass": "^3.0.18"
+    "@pushrocks/smartpromise": "^3.1.3",
+    "@tsclass/tsclass": "^3.0.29"
   },
   "files": [
     "ts/**/*",

ts/index.ts

@@ -1,20 +1,4 @@
-import * as plugins from './websetup.plugins';
+export * from './websetup.classes.websetup';
-import { IMetaObject, setupMetaInformation } from './meta';
+export * from './websetup.classes.tag.metatag';
-
+export * from './websetup.classes.tag.opengraphtag';
-export interface IWebSetupConstructorOptions {
+export * from './websetup.classes.tag.jsonldtag';
-  metaObject: IMetaObject;
-}
-
-/**
- * the main WebSetup class
- */
-export class WebSetup {
-  public options: IWebSetupConstructorOptions;
-  constructor(optionsArg: IWebSetupConstructorOptions) {
-    this.options = optionsArg;
-  }
-
-  public async setup() {
-    await setupMetaInformation(this.options.metaObject);
-  }
-}

ts/interfaces/index.ts

@@ -0,0 +1,9 @@
+import * as plugins from '../websetup.plugins';
+
+export interface IMetaObject {
+  title: string;
+  description: string;
+  canonicalDomain?: string;
+  ldCompany?: plugins.tsclass.business.ICompany;
+  ldProduct?: any;
+}

ts/meta/index.ts

@@ -1,122 +0,0 @@
-import * as plugins from '../websetup.plugins';
-
-export interface IMetaObject {
-  title: string;
-  description: string;
-  canonicalDomain?: string;
-  ldCompany?: plugins.tsclass.business.ICompany;
-  ldProduct?: any;
-}
-
-export const setupMetaInformation = async (metaObjectArg: IMetaObject) => {
-  document.title = metaObjectArg.title;
-  addMetaTag('description', metaObjectArg.description);
-  addMetaTag('google', 'notranslate');
-  addMetaTag('revisit-after', '1 days');
-  metaObjectArg.canonicalDomain ? addLinkTag('canonical', metaObjectArg.canonicalDomain) : null;
-
-  if (metaObjectArg.ldCompany) {
-    addCompanyInfo(metaObjectArg.ldCompany);
-  }
-};
-
-const addMetaTag = async (metaNameArg: string, contentArg: string) => {
-  const metaElement = document.createElement('meta');
-  metaElement.name = metaNameArg;
-  metaElement.content = contentArg;
-  document.getElementsByTagName('head')[0].appendChild(metaElement);
-};
-
-const addLinkTag = async (relArg, hrefArg): Promise<Element> => {
-  const link = !!document.querySelector("link[rel='canonical']")
-    ? document.querySelector("link[rel='canonical']")
-    : document.createElement('link');
-  link.setAttribute('rel', relArg);
-  link.setAttribute('href', hrefArg);
-  document.head.appendChild(link);
-  return link;
-};
-
-const addOpenGraphProperty = async (
-  propertyNameArg: string,
-  contentArg: string
-): Promise<Element> => {
-  const openGraphElement = document.createElement('meta');
-  openGraphElement.setAttribute('property', propertyNameArg);
-  openGraphElement.content = contentArg;
-  document.getElementsByTagName('head')[0].appendChild(openGraphElement);
-  return openGraphElement;
-};
-
-const addCompanyInfo = async (
-  companyDataArg: plugins.tsclass.business.ICompany
-): Promise<Element[]> => {
-  const returnElementArray: Element[] = [];
-
-  // lets care about linked data
-  const companyLd = {
-    '@context': 'https://schema.org',
-    '@type': 'Corporation',
-    name: companyDataArg.name,
-    alternateName: companyDataArg.name.replace(' GmbH', ''),
-    url: companyDataArg.contact.website,
-    logo: companyDataArg.contact.logoUrl,
-    contactPoint: {
-      '@type': 'ContactPoint',
-      telephone: companyDataArg.contact.phone,
-      contactType: 'customer service',
-      areaServed: 'DE',
-      availableLanguage: ['en', 'German'],
-    },
-    sameAs: [],
-  };
-
-  if (companyDataArg.contact.facebookUrl) {
-    companyLd.sameAs.push(companyDataArg.contact.facebookUrl);
-  }
-
-  if (companyDataArg.contact.twitterUrl) {
-    companyLd.sameAs.push(companyDataArg.contact.twitterUrl);
-  }
-
-  const jsonLdElement = document.createElement('script');
-  jsonLdElement.type = 'application/ld+json';
-  jsonLdElement.text = JSON.stringify(companyLd);
-  document.querySelector('head').appendChild(jsonLdElement);
-  returnElementArray.push(jsonLdElement);
-
-  // lets care about open graph
-  returnElementArray.push(await addOpenGraphProperty('og:type', 'business.business'));
-  returnElementArray.push(await addOpenGraphProperty('og:title', companyDataArg.name));
-  returnElementArray.push(await addOpenGraphProperty('og:url', companyDataArg.contact.website));
-  returnElementArray.push(await addOpenGraphProperty('og:image', companyDataArg.contact.logoUrl));
-  returnElementArray.push(
-    await addOpenGraphProperty(
-      'business:contact_data:street_address',
-      `${companyDataArg.contact.address.streetName} ${companyDataArg.contact.address.houseNumber}`
-    )
-  );
-  returnElementArray.push(
-    await addOpenGraphProperty(
-      'business:contact_data:locality',
-      companyDataArg.contact.address.postalCode
-    )
-  );
-  returnElementArray.push(
-    await addOpenGraphProperty('business:contact_data:region', companyDataArg.contact.address.city)
-  );
-  returnElementArray.push(
-    await addOpenGraphProperty(
-      'business:contact_data:postal_code',
-      companyDataArg.contact.address.postalCode
-    )
-  );
-  returnElementArray.push(
-    await addOpenGraphProperty(
-      'business:contact_data:country_name',
-      companyDataArg.contact.address.country
-    )
-  );
-
-  return returnElementArray;
-};

ts/websetup.classes.tag.jsonldtag.ts

@@ -0,0 +1,45 @@
+import * as plugins from './websetup.plugins';
+import * as interfaces from './interfaces';
+
+import { Tag } from "./websetup.classes.tag";
+
+export class JsonLdTag extends Tag {
+  public static createCompanyLd(companyDataArg: plugins.tsclass.business.ICompany) {
+    // lets care about linked data
+    const companyLd = {
+      '@context': 'https://schema.org',
+      '@type': 'Corporation',
+      name: companyDataArg.name,
+      alternateName: companyDataArg.name.replace(' GmbH', ''),
+      url: companyDataArg.contact.website,
+      logo: companyDataArg.contact.logoUrl,
+      contactPoint: {
+        '@type': 'ContactPoint',
+        telephone: companyDataArg.contact.phone,
+        contactType: 'customer service',
+        areaServed: 'DE',
+        availableLanguage: ['en', 'German'],
+      },
+      sameAs: [],
+    };
+  
+    if (companyDataArg.contact.facebookUrl) {
+      companyLd.sameAs.push(companyDataArg.contact.facebookUrl);
+    }
+  
+    if (companyDataArg.contact.twitterUrl) {
+      companyLd.sameAs.push(companyDataArg.contact.twitterUrl);
+    }
+
+    const ldTag = new JsonLdTag(companyLd);
+    return ldTag;
+  }
+
+  constructor(ldObjectArg: any) {
+    super();
+    const jsonLdElement = document.createElement('script');
+    jsonLdElement.type = 'application/ld+json';
+    jsonLdElement.text = JSON.stringify(JSON.stringify(ldObjectArg));
+    this.elementRef = jsonLdElement;
+  }
+}

ts/websetup.classes.tag.linktag.ts

@@ -0,0 +1,13 @@
+import { Tag } from './websetup.classes.tag';
+
+export class LinkTag extends Tag {
+  constructor(relArg: string, hrefArg: string) {
+    super();
+    const linkElement = !!document.querySelector("link[rel='canonical']")
+      ? document.querySelector("link[rel='canonical']")
+      : document.createElement('link');
+    linkElement.setAttribute('rel', relArg);
+    linkElement.setAttribute('href', hrefArg);
+    this.elementRef = linkElement;
+  }
+}

ts/websetup.classes.tag.metatag.ts

@@ -0,0 +1,11 @@
+import { Tag } from "./websetup.classes.tag";
+
+export class MetaTag extends Tag {
+  constructor(metaNameArg: string, contentArg: string) {
+    super();
+    const metaElement = document.createElement('meta');
+    metaElement.name = metaNameArg;
+    metaElement.content = contentArg;
+    this.elementRef = metaElement;
+  }
+}

ts/websetup.classes.tag.opengraphtag.ts

@@ -0,0 +1,11 @@
+import { Tag } from './websetup.classes.tag';
+
+export class OpengraphTag extends Tag {
+  constructor(propertyNameArg: string, contentArg: string) {
+    super();
+    const openGraphElement = document.createElement('meta');
+    openGraphElement.setAttribute('property', propertyNameArg);
+    openGraphElement.content = contentArg;
+    this.elementRef = openGraphElement;
+  }
+}

ts/websetup.classes.tag.ts

@@ -0,0 +1,21 @@
+import * as plugins from './websetup.plugins';
+
+export class Tag {
+  public elementRef: Element;
+
+  public tagLevel: 'global' | 'levelbound';
+
+  public appendToDom() {
+    if (!this.elementRef.parentElement && !this.elementRef.parentNode) {
+      document.getElementsByTagName('head')[0].appendChild(this.elementRef);
+    }
+  }
+
+  public removeFromDom() {
+    if (this.elementRef.parentElement) {
+      this.elementRef.parentElement.removeChild(this.elementRef);
+    } else if (this.elementRef.parentNode) {
+      this.elementRef.parentNode.removeChild(this.elementRef);
+    }
+  }
+}

ts/websetup.classes.taglevel.ts

@@ -0,0 +1,78 @@
+import { Tag } from './websetup.classes.tag';
+import { JsonLdTag } from './websetup.classes.tag.jsonldtag';
+import { OpengraphTag } from './websetup.classes.tag.opengraphtag';
+import { TagManager } from './websetup.classes.tagmanager';
+import * as plugins from './websetup.plugins';
+
+export type TBaseLevelType = 'global' | 'base' | 'subpage';
+
+export class TagLevel {
+  public tagManagerRef: TagManager;
+  
+  public title: string;
+  public type: TBaseLevelType;
+  public tags: Tag[] = [];
+
+  constructor(tagManagerRefArg: TagManager, levelType: TBaseLevelType) {
+    this.tagManagerRef = tagManagerRefArg;
+  }
+
+  public addTag(tagArg: Tag) {
+    this.tags.push(tagArg);
+  }
+
+  public async addCompanyInfo(
+    companyDataArg: plugins.tsclass.business.ICompany
+  ) {
+  
+    this.addTag(JsonLdTag.createCompanyLd(companyDataArg));
+  
+    // lets care about open graph
+    this.addTag(new OpengraphTag('og:type', 'business.business'));
+    this.addTag(new OpengraphTag('og:title', companyDataArg.name));
+    this.addTag(new OpengraphTag('og:url', companyDataArg.contact.website));
+    this.addTag(new OpengraphTag('og:image', companyDataArg.contact.logoUrl));
+    this.addTag(
+      new OpengraphTag(
+        'business:contact_data:street_address',
+        `${companyDataArg.contact.address.streetName} ${companyDataArg.contact.address.houseNumber}`
+      )
+    );
+    this.addTag(
+      new OpengraphTag(
+        'business:contact_data:locality',
+        companyDataArg.contact.address.postalCode
+      )
+    );
+    this.addTag(
+      new OpengraphTag('business:contact_data:region', companyDataArg.contact.address.city)
+    );
+    this.addTag(
+      new OpengraphTag(
+        'business:contact_data:postal_code',
+        companyDataArg.contact.address.postalCode
+      )
+    );
+    this.addTag(
+      new OpengraphTag(
+        'business:contact_data:country_name',
+        companyDataArg.contact.address.country
+      )
+    );
+  }
+
+  public async enable() {
+    if (this.title) {
+      document.title = this.title;
+    }
+    for (const tagArg of this.tags) {
+      tagArg.appendToDom();
+    }
+  }
+
+  public async disable() {
+    for (const tagArg of this.tags) {
+      tagArg.removeFromDom();
+    }
+  }
+}

ts/websetup.classes.tagmanager.ts

@@ -0,0 +1,53 @@
+import { TagLevel } from './websetup.classes.taglevel';
+import * as plugins from './websetup.plugins';
+import * as interfaces from './interfaces';
+import { MetaTag } from './websetup.classes.tag.metatag';
+import { JsonLdTag } from './websetup.classes.tag.jsonldtag';
+import { OpengraphTag } from './websetup.classes.tag.opengraphtag';
+
+export class TagManager {
+  public globalLevel: TagLevel;
+
+  public baseLevel: TagLevel;
+
+  public activeLevel: TagLevel;
+
+  public async setup(metaObjectArg: interfaces.IMetaObject) {
+    // global tag level
+    this.globalLevel = new TagLevel(this, 'global');
+    this.globalLevel.addTag(new MetaTag('google', 'notranslate'));
+    this.globalLevel.addTag(new MetaTag('revisit-after', '1 days'));
+
+    // base tag level
+    this.baseLevel = new TagLevel(this, 'base');
+    this.baseLevel.title = metaObjectArg.title;
+    this.baseLevel.addTag(new MetaTag('description', metaObjectArg.description));
+    
+    if (metaObjectArg.canonicalDomain){
+      this.baseLevel.addTag(new MetaTag('canonical', metaObjectArg.canonicalDomain))
+    }
+  
+    if (metaObjectArg.ldCompany) {
+      this.baseLevel.addCompanyInfo(metaObjectArg.ldCompany);
+    }
+    await this.globalLevel.enable();
+    await this.baseLevel.enable();
+  }
+
+  public setSubPageLevel(metaObjectArg: interfaces.IMetaObject) {
+    const subPageLevel = new TagLevel(this, 'subpage');
+    subPageLevel.title = metaObjectArg.title;
+    subPageLevel.addTag(new MetaTag('description', metaObjectArg.description));
+    this.activeLevel.disable();
+    this.activeLevel = subPageLevel;
+    this.activeLevel.enable();
+  }
+
+  public revertToBaseLevel() {
+    if (this.activeLevel !== this.baseLevel) {
+      this.activeLevel.disable();
+      this.activeLevel = this.baseLevel;
+      this.activeLevel.enable();
+    }
+  }
+}

ts/websetup.classes.websetup.ts

@@ -0,0 +1,43 @@
+import * as plugins from './websetup.plugins';
+import * as interfaces from './interfaces';
+import { TagManager } from './websetup.classes.tagmanager';
+import { TagLevel } from './websetup.classes.taglevel';
+
+export interface IWebSetupConstructorOptions {
+  metaObject: interfaces.IMetaObject;
+}
+
+/**
+ * the main WebSetup class
+ */
+export class WebSetup {
+  public tagManager: TagManager = new TagManager();
+  public options: IWebSetupConstructorOptions;
+  private readyDeferred = plugins.smartpromise.defer();
+  public readyPromise = this.readyDeferred.promise;
+  constructor(optionsArg: IWebSetupConstructorOptions) {
+    this.options = optionsArg;
+    this.setup().then(() => {this.readyDeferred.resolve()});
+  }
+
+  /**
+   * an async setup called by the constructor
+   */
+  private async setup() {
+    await this.tagManager.setup(this.options.metaObject);
+  }
+
+  /**
+   * reverts the active level and returns to the base level
+   */
+  public revertToBaseLevel() {
+    this.tagManager.revertToBaseLevel();
+  }
+
+  /**
+   * sets a subpage
+   * @param metaObject
+   */
+  public setSubLevel(metaObject: interfaces.IMetaObject) {
+  }
+}

ts/websetup.plugins.ts

@@ -1,3 +1,11 @@
+// pushrocks scope
+import * as smartpromise from '@pushrocks/smartpromise';
+
+export {
+  smartpromise
+};
+
+// tsclass scope
 import * as tsclass from '@tsclass/tsclass';
 
 export { tsclass };