3.0.15

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushrocks/websetup",
-  "version": "3.0.8",
+  "version": "3.0.15",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pushrocks/websetup",
-  "version": "3.0.8",
+  "version": "3.0.15",
   "private": false,
   "description": "setup basic page properties",
   "main": "dist_ts/index.js",
@@ -24,6 +24,7 @@
     "tslint-config-prettier": "^1.15.0"
   },
   "dependencies": {
+    "@pushrocks/smartdelay": "^2.0.10",
     "@pushrocks/smartpromise": "^3.1.3",
     "@tsclass/tsclass": "^3.0.29"
   },

ts/index.ts

@@ -2,3 +2,4 @@ export * from './websetup.classes.websetup';
 export * from './websetup.classes.tag.metatag';
 export * from './websetup.classes.tag.opengraphtag';
 export * from './websetup.classes.tag.jsonldtag';
+export * from './websetup.classes.title';

ts/interfaces/index.ts

@@ -6,4 +6,15 @@ export interface IMetaObject {
   canonicalDomain?: string;
   ldCompany?: plugins.tsclass.business.ICompany;
   ldProduct?: any;
+
+  // handles
+  twitterHandle?: string;
+  facebookHandle?: string;
+
+  // links
+  companyWebsiteLink?: string;
+  googleNewsLink?: string;
+  mediumLink?: string;
+  slackLink?: string;
+  airmeetLink?: string;
 }

ts/websetup.classes.tag.jsonldtag.ts

@@ -35,35 +35,33 @@ export class JsonLdTag extends Tag {
     return ldTag;
   }
 
-  public static createNewsArticleLd (newsArticleArg: plugins.tsclass.content.IArticle) {
+  public static createNewsArticleJsonLd(newsArticleArg: plugins.tsclass.content.IArticle) {
     const newsArticleLd = {
-      "@context": "https://schema.org",
+      '@context': 'https://schema.org',
-      "@type": "NewsArticle",
+      '@type': 'NewsArticle',
-      "mainEntityOfPage": {
+      mainEntityOfPage: {
-        "@type": "WebPage",
+        '@type': 'WebPage',
-        "@id": window.location.href
+        '@id': window.location.href,
       },
-      "headline": "Article headline",
+      headline: 'Article headline',
-      "image": [
+      image: [newsArticleArg.featuredImageUrl],
-        newsArticleArg.featuredImageUrl
+      datePublished: new Date(newsArticleArg.timestamp).toISOString(),
-       ],
+      dateModified: new Date(newsArticleArg.timestamp).toISOString(),
-      "datePublished": new Date(newsArticleArg.timestamp).toISOString(),
+      author: {
-      "dateModified": new Date(newsArticleArg.timestamp).toISOString(),
+        '@type': 'Person',
-      "author": {
+        name: `${newsArticleArg.author.firstName} ${newsArticleArg.author.surName}`,
-        "@type": "Person",
-        "name": `${newsArticleArg.author.firstName} ${newsArticleArg.author.surName}`
       },
-       "publisher": {
+      publisher: {
-        "@type": "Organization",
+        '@type': 'Organization',
-        "name": newsArticleArg.author.surName, // TODO
+        name: newsArticleArg.author.surName, // TODO
-        "logo": {
+        logo: {
-          "@type": "ImageObject",
+          '@type': 'ImageObject',
-          "url": newsArticleArg.author.surName // TODO
+          url: newsArticleArg.author.surName, // TODO
-        }
+        },
       },
-      "description": newsArticleArg.author.firstName
+      description: newsArticleArg.author.firstName,
     };
-    const ldTag = new JsonLdTag(newsArticleArg);
+    const ldTag = new JsonLdTag(newsArticleLd);
     return ldTag;
   }
 
@@ -71,7 +69,7 @@ export class JsonLdTag extends Tag {
     super();
     const jsonLdElement = document.createElement('script');
     jsonLdElement.type = 'application/ld+json';
-    jsonLdElement.text = JSON.stringify(JSON.stringify(ldObjectArg));
+    jsonLdElement.text = JSON.stringify(ldObjectArg);
     this.elementRef = jsonLdElement;
   }
 }

ts/websetup.classes.tag.opengraphtag.ts

@@ -1,6 +1,16 @@
+import * as plugins from './websetup.plugins';
 import { Tag } from './websetup.classes.tag';
 
 export class OpengraphTag extends Tag {
+  public static createNewsArticleOgTags(newsArticleArg: plugins.tsclass.content.IArticle) {
+    const tagArray: OpengraphTag[] = [];
+    tagArray.push(new OpengraphTag('og:url', newsArticleArg.url));
+    tagArray.push(new OpengraphTag('og:title', newsArticleArg.title));
+    tagArray.push(new OpengraphTag('og:description', newsArticleArg.content));
+    tagArray.push(new OpengraphTag('og:image', newsArticleArg.featuredImageUrl));
+    return tagArray;
+  }
+
   constructor(propertyNameArg: string, contentArg: string) {
     super();
     const openGraphElement = document.createElement('meta');

ts/websetup.classes.taglevel.ts

@@ -31,10 +31,16 @@ export class TagLevel {
     this.tagManagerRef = tagManagerRefArg;
   }
 
-  public addTag(tagArg: Tag) {
+  public addTag(tagArg: Tag | Tag[]) {
-    this.tags.push(tagArg);
+    if (tagArg instanceof Array) {
-    if (this.state === 'enabled') {
+      for (const tagArg2 of tagArg) {
-      tagArg.appendToDom();
+        this.addTag(tagArg2);
+      }
+    } else {
+      this.tags.push(tagArg);
+      if (this.state === 'enabled') {
+        tagArg.appendToDom();
+      }
     }
   }
 
@@ -70,7 +76,8 @@ export class TagLevel {
   }
 
   public addNewsArticleInfo(articleArg: plugins.tsclass.content.IArticle) {
-    this.addTag(JsonLdTag.createNewsArticleLd(articleArg));
+    this.addTag(JsonLdTag.createNewsArticleJsonLd(articleArg));
+    this.addTag(OpengraphTag.createNewsArticleOgTags(articleArg));
   }
 
   public async enable() {

ts/websetup.classes.tagmanager.ts

@@ -17,6 +17,12 @@ export class TagManager {
     this.globalLevel.addTag(new MetaTag('google', 'notranslate'));
     this.globalLevel.addTag(new MetaTag('revisit-after', '1 days'));
 
+    if (metaObjectArg.twitterHandle) {
+      this.globalLevel.addTag(new MetaTag('twitter:card', 'summary_large_image'));
+      this.globalLevel.addTag(new MetaTag('twitter:site', metaObjectArg.twitterHandle));
+      this.globalLevel.addTag(new MetaTag('twitter:creator', metaObjectArg.twitterHandle));
+    }
+
     // base tag level
     this.baseLevel.title = metaObjectArg.title;
     if (metaObjectArg.description) {
@@ -31,26 +37,27 @@ export class TagManager {
       this.baseLevel.addCompanyInfo(metaObjectArg.ldCompany);
     }
     await this.globalLevel.enable();
-    await this.baseLevel.enable();
+    this.activeLevel = this.baseLevel;
+    await this.activeLevel.enable();
   }
 
-  public setSubPageLevel(metaObjectArg: interfaces.IMetaObject) {
+  public async setSubPageLevel(metaObjectArg: interfaces.IMetaObject) {
     const subPageLevel = new TagLevel(this, 'subpage');
     subPageLevel.title = metaObjectArg.title;
     if (metaObjectArg.description) {
-      this.baseLevel.addTag(new MetaTag('description', metaObjectArg.description));
+      subPageLevel.addTag(new MetaTag('description', metaObjectArg.description));
     }
-    this.activeLevel.disable();
+    await this.activeLevel.disable();
     this.activeLevel = subPageLevel;
-    this.activeLevel.enable();
+    await this.activeLevel.enable();
     return subPageLevel;
   }
 
-  public revertToBaseLevel() {
+  public async revertToBaseLevel() {
     if (this.activeLevel !== this.baseLevel) {
-      this.activeLevel.disable();
+      await this.activeLevel.disable();
       this.activeLevel = this.baseLevel;
-      this.activeLevel.enable();
+      await this.activeLevel.enable();
     }
   }
 }

ts/websetup.classes.title.ts

@@ -0,0 +1,9 @@
+import * as plugins from './websetup.plugins';
+
+/**
+ * a title proxy class
+ * --> to be used in the future when flashing titles is supported
+ */
+export class Title {
+
+}

ts/websetup.classes.websetup.ts

@@ -5,6 +5,7 @@ import { TagLevel } from './websetup.classes.taglevel';
 
 export interface IWebSetupConstructorOptions {
   metaObject: interfaces.IMetaObject;
+  smartssrWaitForReadySignal?: boolean;
 }
 
 /**
@@ -13,12 +14,21 @@ export interface IWebSetupConstructorOptions {
 export class WebSetup {
   public tagManager: TagManager = new TagManager();
   public options: IWebSetupConstructorOptions;
+  
+  // private deferreds
   private readyDeferred = plugins.smartpromise.defer();
+  private readyForSmartssrDeferred = plugins.smartpromise.defer();
+
+  // public promises
   public readyPromise = this.readyDeferred.promise;
+  public readyForSmartssrPromise = this.readyForSmartssrDeferred.promise;
   constructor(optionsArg: IWebSetupConstructorOptions) {
     this.options = optionsArg;
     this.setup().then(() => {
       this.readyDeferred.resolve();
+      if (!this.options.smartssrWaitForReadySignal) {
+        this.readyForSmartssrDeferred.resolve();
+      }
     });
   }
 
@@ -43,7 +53,24 @@ export class WebSetup {
    * sets a subpage
    * @param metaObjectArg
    */
-  public setSubLevel(metaObjectArg: interfaces.IMetaObject) {
+  public async setSubLevel(metaObjectArg: interfaces.IMetaObject) {
-    return this.tagManager.setSubPageLevel(metaObjectArg);
+    const subLevel = await this.tagManager.setSubPageLevel(metaObjectArg);
+    return subLevel;
+  }
+
+  /**
+   * flashes the title with the given text
+   * @param flashTextArg
+   */
+  public flashTitle(flashTextArg: string) {}
+
+  /**
+   * informs smartssr that the page is ready to be rendered
+   */
+  public informReadyForSmartssr() {
+    if (!this.options.smartssrWaitForReadySignal) {
+      console.error(`You have not indicated that you inform smartssr by a dedicated signal! Please consider doing so!`);
+    }
+    this.readyForSmartssrDeferred.resolve();
   }
 }

ts/websetup.plugins.ts

@@ -1,7 +1,8 @@
 // pushrocks scope
+import * as smartdelay from '@pushrocks/smartdelay';
 import * as smartpromise from '@pushrocks/smartpromise';
 
-export { smartpromise };
+export { smartdelay, smartpromise };
 
 // tsclass scope
 import * as tsclass from '@tsclass/tsclass';