Compare commits
13 Commits
Author | SHA1 | Date | |
---|---|---|---|
c1f82be85f | |||
ca3398c4fd | |||
0884b61099 | |||
db8ea28cee | |||
cb898eeef5 | |||
7a0d767e9d | |||
49ca240237 | |||
c802e8846a | |||
1f7be6b8a0 | |||
a0cbe170c8 | |||
5df46f8b77 | |||
c12e9eaf76 | |||
2aa1839c22 |
@ -19,23 +19,35 @@ mirror:
|
||||
stage: security
|
||||
script:
|
||||
- npmci git mirror
|
||||
only:
|
||||
- tags
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
audit:
|
||||
auditProductionDependencies:
|
||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
stage: security
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci command npm install --production --ignore-scripts
|
||||
- npmci command npm config set registry https://registry.npmjs.org
|
||||
- npmci command npm audit --audit-level=high --only=prod --production
|
||||
tags:
|
||||
- docker
|
||||
|
||||
auditDevDependencies:
|
||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
stage: security
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci command npm install --ignore-scripts
|
||||
- npmci command npm config set registry https://registry.npmjs.org
|
||||
- npmci command npm audit --audit-level=high
|
||||
- npmci command npm audit --audit-level=high --only=dev
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
allow_failure: true
|
||||
|
||||
# ====================
|
||||
# test stage
|
||||
@ -50,9 +62,7 @@ testStable:
|
||||
- npmci npm test
|
||||
coverage: /\d+.?\d+?\%\s*coverage/
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- priv
|
||||
|
||||
testBuild:
|
||||
stage: test
|
||||
@ -63,9 +73,7 @@ testBuild:
|
||||
- npmci command npm run build
|
||||
coverage: /\d+.?\d+?\%\s*coverage/
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
release:
|
||||
stage: release
|
||||
@ -85,6 +93,8 @@ release:
|
||||
codequality:
|
||||
stage: metadata
|
||||
allow_failure: true
|
||||
only:
|
||||
- tags
|
||||
script:
|
||||
- npmci command npm install -g tslint typescript
|
||||
- npmci npm prepare
|
||||
|
2
.vscode/settings.json
vendored
2
.vscode/settings.json
vendored
@ -15,7 +15,7 @@
|
||||
"properties": {
|
||||
"projectType": {
|
||||
"type": "string",
|
||||
"enum": ["website", "element", "service", "npm"]
|
||||
"enum": ["website", "element", "service", "npm", "wcc"]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
8889
package-lock.json
generated
8889
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
18
package.json
18
package.json
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "@pushrocks/websetup",
|
||||
"version": "2.0.15",
|
||||
"version": "3.0.3",
|
||||
"private": false,
|
||||
"description": "setup basic page properties",
|
||||
"main": "dist_ts/index.js",
|
||||
@ -16,15 +16,16 @@
|
||||
"websafe"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@gitzone/tsbuild": "^2.1.22",
|
||||
"@gitzone/tsbundle": "^1.0.57",
|
||||
"@gitzone/tstest": "^1.0.28",
|
||||
"@pushrocks/tapbundle": "^3.2.1",
|
||||
"tslint": "^6.1.0",
|
||||
"@gitzone/tsbuild": "^2.1.25",
|
||||
"@gitzone/tsbundle": "^1.0.78",
|
||||
"@gitzone/tstest": "^1.0.52",
|
||||
"@pushrocks/tapbundle": "^3.2.9",
|
||||
"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/**/*",
|
||||
@ -37,5 +38,8 @@
|
||||
"cli.js",
|
||||
"npmextra.json",
|
||||
"readme.md"
|
||||
],
|
||||
"browserslist": [
|
||||
"last 1 chrome versions"
|
||||
]
|
||||
}
|
||||
|
@ -31,10 +31,6 @@ Use TypeScript for best in class intellisense.
|
||||
|
||||
We are always happy for code contributions. If you are not the code contributing type that is ok. Still, maintaining Open Source repositories takes considerable time and thought. If you like the quality of what we do and our modules are useful to you we would appreciate a little monthly contribution: You can [contribute one time](https://lossless.link/contribute-onetime) or [contribute monthly](https://lossless.link/contribute). :)
|
||||
|
||||
## Contribution
|
||||
|
||||
We are always happy for code contributions. If you are not the code contributing type that is ok. Still, maintaining Open Source repositories takes considerable time and thought. If you like the quality of what we do and our modules are useful to you we would appreciate a little monthly contribution: You can [contribute one time](https://lossless.link/contribute-onetime) or [contribute monthly](https://lossless.link/contribute). :)
|
||||
|
||||
For further information read the linked docs at the top of this readme.
|
||||
|
||||
> MIT licensed | **©** [Lossless GmbH](https://lossless.gmbh)
|
||||
|
16
test/test.browser.ts
Normal file
16
test/test.browser.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { expect, tap } from '@pushrocks/tapbundle';
|
||||
import * as websetup from '../ts/index';
|
||||
|
||||
tap.test('first test', async () => {
|
||||
const websetupInstance = new websetup.WebSetup({
|
||||
metaObject: {
|
||||
description: 'A awesome description',
|
||||
title: 'mytitle',
|
||||
canonicalDomain: 'lossless.com',
|
||||
},
|
||||
});
|
||||
await websetupInstance.readyPromise;
|
||||
expect(document.title).to.equal('mytitle');
|
||||
});
|
||||
|
||||
tap.start();
|
@ -1,8 +0,0 @@
|
||||
import { expect, tap } from '@pushrocks/tapbundle';
|
||||
import * as websetup from '../ts/index';
|
||||
|
||||
tap.test('first test', async () => {
|
||||
console.log('Waiting for proper puppeteer support here');
|
||||
});
|
||||
|
||||
tap.start();
|
37
ts/index.ts
37
ts/index.ts
@ -1,33 +1,4 @@
|
||||
import * as plugins from './websetup.plugins';
|
||||
|
||||
import { setupGoogleAnalytics } from './tools/ganalytics';
|
||||
import { setupFullStory } from './tools/fullstory';
|
||||
import { IMetaObject, setupMetaInformation } from './meta';
|
||||
|
||||
export interface IWebSetupConstructorOptions {
|
||||
googleAnalyticsCode?: string;
|
||||
fsCode?: string;
|
||||
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);
|
||||
|
||||
if (this.options.googleAnalyticsCode) {
|
||||
await setupGoogleAnalytics(this.options.googleAnalyticsCode);
|
||||
}
|
||||
|
||||
if (this.options.fsCode) {
|
||||
await setupFullStory(this.options.fsCode);
|
||||
}
|
||||
}
|
||||
}
|
||||
export * from './websetup.classes.websetup';
|
||||
export * from './websetup.classes.tag.metatag';
|
||||
export * from './websetup.classes.tag.opengraphtag';
|
||||
export * from './websetup.classes.tag.jsonldtag';
|
||||
|
9
ts/interfaces/index.ts
Normal file
9
ts/interfaces/index.ts
Normal file
@ -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;
|
||||
}
|
122
ts/meta/index.ts
122
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;
|
||||
};
|
@ -1,70 +0,0 @@
|
||||
declare global {
|
||||
// tslint:disable-next-line: interface-name
|
||||
interface Window {
|
||||
_fs_debug: boolean;
|
||||
_fs_host: any;
|
||||
_fs_org: string;
|
||||
_fs_namespace: string;
|
||||
}
|
||||
}
|
||||
export const setupFullStory = async (fsCodeArg: string) => {
|
||||
// tslint:disable-next-line: no-string-literal
|
||||
window['_fs_debug'] = false;
|
||||
// tslint:disable-next-line: no-string-literal
|
||||
window['_fs_host'] = 'fullstory.com';
|
||||
// tslint:disable-next-line: no-string-literal
|
||||
window['_fs_org'] = fsCodeArg;
|
||||
// tslint:disable-next-line: no-string-literal
|
||||
window['_fs_namespace'] = 'FS';
|
||||
((m, n, e, t, l, o, g, y) => {
|
||||
if (e in m) {
|
||||
if (m.console && m.console.log) {
|
||||
m.console.log('FullStory namespace conflict. Please set window["_fs_namespace"].');
|
||||
}
|
||||
return;
|
||||
}
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
g = m[e] = function (a, b, s) {
|
||||
g.q ? g.q.push([a, b, s]) : g._api(a, b, s);
|
||||
};
|
||||
g.q = [];
|
||||
o = n.createElement(t);
|
||||
o.async = 1;
|
||||
o.src = 'https://' + window._fs_host + '/s/fs.js';
|
||||
o.crossorigin = 'anonymous';
|
||||
y = n.getElementsByTagName(t)[0];
|
||||
y.parentNode.insertBefore(o, y);
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
g.identify = function (i, v, s) {
|
||||
g(l, { uid: i }, s);
|
||||
if (v) g(l, v, s);
|
||||
};
|
||||
g.setUserVars = function (v, s) {
|
||||
g(l, v, s);
|
||||
};
|
||||
g.event = function (i, v, s) {
|
||||
g('event', { n: i, p: v }, s);
|
||||
};
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
g.shutdown = function () {
|
||||
g('rec', !1);
|
||||
};
|
||||
g.restart = function () {
|
||||
g('rec', !0);
|
||||
};
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
g.consent = function (a) {
|
||||
g('consent', !arguments.length || a);
|
||||
};
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
g.identifyAccount = function (i, v) {
|
||||
o = 'account';
|
||||
v = v || {};
|
||||
v.acctId = i;
|
||||
g(o, v);
|
||||
};
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
g.clearUserCookie = function () {};
|
||||
// tslint:disable-next-line: no-string-literal
|
||||
})(window, document, window['_fs_namespace'], 'script', 'user');
|
||||
};
|
@ -1,32 +0,0 @@
|
||||
declare global {
|
||||
// tslint:disable-next-line: interface-name
|
||||
interface Window {
|
||||
analytics: any;
|
||||
}
|
||||
}
|
||||
|
||||
export const setupGoogleAnalytics = async (gaCode: string) => {
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
(function (i, s, o, g, r, a, m) {
|
||||
// tslint:disable-next-line: no-string-literal
|
||||
i['GoogleAnalyticsObject'] = r;
|
||||
// tslint:disable-next-line: ban-comma-operator
|
||||
(i[r] =
|
||||
i[r] ||
|
||||
// tslint:disable-next-line: only-arrow-functions
|
||||
function () {
|
||||
(i[r].q = i[r].q || []).push(arguments);
|
||||
}),
|
||||
(i[r].l = new Date().getTime());
|
||||
// tslint:disable-next-line: ban-comma-operator
|
||||
(a = s.createElement(o)), (m = s.getElementsByTagName(o)[0]);
|
||||
a.async = 1;
|
||||
a.src = g;
|
||||
a.crossorigin = 'anonymous';
|
||||
m.parentNode.insertBefore(a, m);
|
||||
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'analytics');
|
||||
|
||||
window.analytics('create', gaCode, 'auto');
|
||||
window.analytics('send', 'pageview');
|
||||
console.log('Loaded Google Analytics. You may view our privacy policy at https://lossless.gmbh');
|
||||
};
|
45
ts/websetup.classes.tag.jsonldtag.ts
Normal file
45
ts/websetup.classes.tag.jsonldtag.ts
Normal file
@ -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;
|
||||
}
|
||||
}
|
13
ts/websetup.classes.tag.linktag.ts
Normal file
13
ts/websetup.classes.tag.linktag.ts
Normal file
@ -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;
|
||||
}
|
||||
}
|
11
ts/websetup.classes.tag.metatag.ts
Normal file
11
ts/websetup.classes.tag.metatag.ts
Normal file
@ -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;
|
||||
}
|
||||
}
|
11
ts/websetup.classes.tag.opengraphtag.ts
Normal file
11
ts/websetup.classes.tag.opengraphtag.ts
Normal file
@ -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;
|
||||
}
|
||||
}
|
21
ts/websetup.classes.tag.ts
Normal file
21
ts/websetup.classes.tag.ts
Normal file
@ -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);
|
||||
}
|
||||
}
|
||||
}
|
71
ts/websetup.classes.taglevel.ts
Normal file
71
ts/websetup.classes.taglevel.ts
Normal file
@ -0,0 +1,71 @@
|
||||
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 addPostInfo() {}
|
||||
|
||||
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();
|
||||
}
|
||||
}
|
||||
}
|
53
ts/websetup.classes.tagmanager.ts
Normal file
53
ts/websetup.classes.tagmanager.ts
Normal file
@ -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();
|
||||
}
|
||||
}
|
||||
}
|
44
ts/websetup.classes.websetup.ts
Normal file
44
ts/websetup.classes.websetup.ts
Normal file
@ -0,0 +1,44 @@
|
||||
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) {}
|
||||
}
|
@ -1,3 +1,9 @@
|
||||
// pushrocks scope
|
||||
import * as smartpromise from '@pushrocks/smartpromise';
|
||||
|
||||
export { smartpromise };
|
||||
|
||||
// tsclass scope
|
||||
import * as tsclass from '@tsclass/tsclass';
|
||||
|
||||
export { tsclass };
|
||||
|
Reference in New Issue
Block a user