Compare commits
64 Commits
Author | SHA1 | Date | |
---|---|---|---|
d1c0501461 | |||
f5d33bdebe | |||
2b9c9225a5 | |||
5ce55190fe | |||
8fb071f57b | |||
3278ef7425 | |||
11282daa38 | |||
1fe7dd8d06 | |||
9175cb7841 | |||
6b9ebcec7a | |||
2159995342 | |||
7fa14ceabd | |||
0294895f78 | |||
74fc97a220 | |||
bab9124ad9 | |||
fda71ac3e6 | |||
3d6a421d25 | |||
a7fca4e0c1 | |||
782c9cd740 | |||
b8ab19a683 | |||
e47869caed | |||
4f06c5d7c5 | |||
c0d223959d | |||
c40c01b5c8 | |||
57868de491 | |||
ccd68a1257 | |||
c1f82be85f | |||
ca3398c4fd | |||
0884b61099 | |||
db8ea28cee | |||
cb898eeef5 | |||
7a0d767e9d | |||
49ca240237 | |||
c802e8846a | |||
1f7be6b8a0 | |||
a0cbe170c8 | |||
5df46f8b77 | |||
c12e9eaf76 | |||
2aa1839c22 | |||
8e4bdb867c | |||
359e18f5dc | |||
751a325c81 | |||
93d4bc491f | |||
bdf55a19d9 | |||
cd1f68f55e | |||
f2bd7145b3 | |||
6d9789df45 | |||
0be8a6f60d | |||
a3793572e7 | |||
6ace59d1d1 | |||
b6ddf6a87b | |||
b999627ba5 | |||
5e8a91f302 | |||
2fc0613fa6 | |||
2283cdb633 | |||
c0db06fc18 | |||
4557000629 | |||
78997e1e5a | |||
4d5564e8d4 | |||
11d89adc4b | |||
a99fd6374c | |||
ba287cdb76 | |||
5318408037 | |||
16ef41ae20 |
4
.gitignore
vendored
4
.gitignore
vendored
@ -15,8 +15,6 @@ node_modules/
|
||||
|
||||
# builds
|
||||
dist/
|
||||
dist_web/
|
||||
dist_serve/
|
||||
dist_ts_web/
|
||||
dist_*/
|
||||
|
||||
# custom
|
102
.gitlab-ci.yml
102
.gitlab-ci.yml
@ -3,14 +3,14 @@ image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
|
||||
cache:
|
||||
paths:
|
||||
- .npmci_cache/
|
||||
key: "$CI_BUILD_STAGE"
|
||||
- .npmci_cache/
|
||||
key: '$CI_BUILD_STAGE'
|
||||
|
||||
stages:
|
||||
- security
|
||||
- test
|
||||
- release
|
||||
- metadata
|
||||
- security
|
||||
- test
|
||||
- release
|
||||
- metadata
|
||||
|
||||
# ====================
|
||||
# security stage
|
||||
@ -18,60 +18,74 @@ stages:
|
||||
mirror:
|
||||
stage: security
|
||||
script:
|
||||
- npmci git mirror
|
||||
- npmci git mirror
|
||||
only:
|
||||
- tags
|
||||
tags:
|
||||
- docker
|
||||
- notpriv
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
snyk:
|
||||
auditProductionDependencies:
|
||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
||||
stage: security
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci command npm install -g snyk
|
||||
- npmci command npm install --ignore-scripts
|
||||
- npmci command snyk test
|
||||
- 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
|
||||
- notpriv
|
||||
- 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 --only=dev
|
||||
tags:
|
||||
- docker
|
||||
allow_failure: true
|
||||
|
||||
# ====================
|
||||
# test stage
|
||||
# ====================
|
||||
|
||||
testLTS:
|
||||
testStable:
|
||||
stage: test
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci node install lts
|
||||
- npmci npm install
|
||||
- npmci npm test
|
||||
- npmci npm prepare
|
||||
- npmci node install stable
|
||||
- npmci npm install
|
||||
- npmci npm test
|
||||
coverage: /\d+.?\d+?\%\s*coverage/
|
||||
tags:
|
||||
- docker
|
||||
- notpriv
|
||||
- docker
|
||||
|
||||
testBuild:
|
||||
stage: test
|
||||
script:
|
||||
- npmci npm prepare
|
||||
- npmci node install lts
|
||||
- npmci npm install
|
||||
- npmci command npm run build
|
||||
- npmci npm prepare
|
||||
- npmci node install stable
|
||||
- npmci npm install
|
||||
- npmci command npm run build
|
||||
coverage: /\d+.?\d+?\%\s*coverage/
|
||||
tags:
|
||||
- docker
|
||||
- notpriv
|
||||
- docker
|
||||
|
||||
release:
|
||||
stage: release
|
||||
script:
|
||||
- npmci node install lts
|
||||
- npmci npm publish
|
||||
- npmci node install stable
|
||||
- npmci npm publish
|
||||
only:
|
||||
- tags
|
||||
- tags
|
||||
tags:
|
||||
- docker
|
||||
- notpriv
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
# ====================
|
||||
# metadata stage
|
||||
@ -79,33 +93,39 @@ release:
|
||||
codequality:
|
||||
stage: metadata
|
||||
allow_failure: true
|
||||
only:
|
||||
- tags
|
||||
script:
|
||||
- npmci command npm install -g tslint typescript
|
||||
- npmci npm prepare
|
||||
- npmci npm install
|
||||
- npmci command "tslint -c tslint.json ./ts/**/*.ts"
|
||||
tags:
|
||||
- docker
|
||||
- priv
|
||||
- lossless
|
||||
- docker
|
||||
- priv
|
||||
|
||||
trigger:
|
||||
stage: metadata
|
||||
script:
|
||||
- npmci trigger
|
||||
- npmci trigger
|
||||
only:
|
||||
- tags
|
||||
- tags
|
||||
tags:
|
||||
- docker
|
||||
- notpriv
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
|
||||
pages:
|
||||
image: hosttoday/ht-docker-node:npmci
|
||||
stage: metadata
|
||||
script:
|
||||
- npmci node install lts
|
||||
- npmci command npm install -g @gitzone/tsdoc
|
||||
- npmci npm prepare
|
||||
- npmci npm install
|
||||
- npmci command tsdoc
|
||||
tags:
|
||||
- lossless
|
||||
- docker
|
||||
- notpriv
|
||||
only:
|
||||
@ -113,5 +133,5 @@ pages:
|
||||
artifacts:
|
||||
expire_in: 1 week
|
||||
paths:
|
||||
- public
|
||||
- public
|
||||
allow_failure: true
|
||||
|
29
.vscode/launch.json
vendored
Normal file
29
.vscode/launch.json
vendored
Normal file
@ -0,0 +1,29 @@
|
||||
{
|
||||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"name": "current file",
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"args": [
|
||||
"${relativeFile}"
|
||||
],
|
||||
"runtimeArgs": ["-r", "@gitzone/tsrun"],
|
||||
"cwd": "${workspaceRoot}",
|
||||
"protocol": "inspector",
|
||||
"internalConsoleOptions": "openOnSessionStart"
|
||||
},
|
||||
{
|
||||
"name": "test.ts",
|
||||
"type": "node",
|
||||
"request": "launch",
|
||||
"args": [
|
||||
"test/test.ts"
|
||||
],
|
||||
"runtimeArgs": ["-r", "@gitzone/tsrun"],
|
||||
"cwd": "${workspaceRoot}",
|
||||
"protocol": "inspector",
|
||||
"internalConsoleOptions": "openOnSessionStart"
|
||||
}
|
||||
]
|
||||
}
|
26
.vscode/settings.json
vendored
Normal file
26
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,26 @@
|
||||
{
|
||||
"json.schemas": [
|
||||
{
|
||||
"fileMatch": ["/npmextra.json"],
|
||||
"schema": {
|
||||
"type": "object",
|
||||
"properties": {
|
||||
"npmci": {
|
||||
"type": "object",
|
||||
"description": "settings for npmci"
|
||||
},
|
||||
"gitzone": {
|
||||
"type": "object",
|
||||
"description": "settings for gitzone",
|
||||
"properties": {
|
||||
"projectType": {
|
||||
"type": "string",
|
||||
"enum": ["website", "element", "service", "npm", "wcc"]
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
@ -4,6 +4,7 @@
|
||||
"npmAccessLevel": "public"
|
||||
},
|
||||
"gitzone": {
|
||||
"projectType": "npm",
|
||||
"module": {
|
||||
"githost": "gitlab.com",
|
||||
"gitscope": "pushrocks",
|
||||
|
26791
package-lock.json
generated
26791
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
39
package.json
39
package.json
@ -1,37 +1,46 @@
|
||||
{
|
||||
"name": "@pushrocks/websetup",
|
||||
"version": "2.0.2",
|
||||
"version": "3.0.16",
|
||||
"private": false,
|
||||
"description": "setup basic page properties",
|
||||
"main": "dist/index.js",
|
||||
"typings": "dist/index.d.ts",
|
||||
"main": "dist_ts/index.js",
|
||||
"typings": "dist_ts/index.d.ts",
|
||||
"author": "Lossless GmbH",
|
||||
"license": "MIT",
|
||||
"scripts": {
|
||||
"test": "(tstest test/)",
|
||||
"build": "(tsbuild --web)",
|
||||
"format": "(gitzone format)"
|
||||
"build": "(tsbuild --web && tsbundle npm)"
|
||||
},
|
||||
"keywords": [
|
||||
"lossless",
|
||||
"websafe"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@gitzone/tsbuild": "^2.0.22",
|
||||
"@gitzone/tstest": "^1.0.15",
|
||||
"@pushrocks/tapbundle": "^3.0.7",
|
||||
"tslint": "^5.11.0",
|
||||
"@gitzone/tsbuild": "^2.1.28",
|
||||
"@gitzone/tsbundle": "^1.0.88",
|
||||
"@gitzone/tstest": "^1.0.60",
|
||||
"@pushrocks/tapbundle": "^3.2.15",
|
||||
"tslint": "^6.1.3",
|
||||
"tslint-config-prettier": "^1.15.0"
|
||||
},
|
||||
"dependencies": {},
|
||||
"dependencies": {
|
||||
"@pushrocks/smartdelay": "^2.0.13",
|
||||
"@pushrocks/smartpromise": "^3.1.6",
|
||||
"@tsclass/tsclass": "^3.0.37"
|
||||
},
|
||||
"files": [
|
||||
"ts/*",
|
||||
"ts_web/*",
|
||||
"dist/*",
|
||||
"dist_web/*",
|
||||
"assets/*",
|
||||
"ts/**/*",
|
||||
"ts_web/**/*",
|
||||
"dist/**/*",
|
||||
"dist_*/**/*",
|
||||
"dist_ts/**/*",
|
||||
"dist_ts_web/**/*",
|
||||
"assets/**/*",
|
||||
"cli.js",
|
||||
"npmextra.json",
|
||||
"readme.md"
|
||||
],
|
||||
"browserslist": [
|
||||
"last 1 chrome versions"
|
||||
]
|
||||
}
|
||||
|
31
readme.md
31
readme.md
@ -8,19 +8,32 @@ setup basic page properties
|
||||
* [docs (typedoc)](https://pushrocks.gitlab.io/websetup/)
|
||||
|
||||
## Status for master
|
||||
[](https://gitlab.com/pushrocks/websetup/commits/master)
|
||||
[](https://gitlab.com/pushrocks/websetup/commits/master)
|
||||
[](https://www.npmjs.com/package/@pushrocks/websetup)
|
||||
[](https://snyk.io/test/npm/@pushrocks/websetup)
|
||||
[](https://nodejs.org/dist/latest-v10.x/docs/api/)
|
||||
[](https://nodejs.org/dist/latest-v10.x/docs/api/)
|
||||
[](https://prettier.io/)
|
||||
|
||||
Status Category | Status Badge
|
||||
-- | --
|
||||
GitLab Pipelines | [](https://lossless.cloud)
|
||||
GitLab Pipline Test Coverage | [](https://lossless.cloud)
|
||||
npm | [](https://lossless.cloud)
|
||||
Snyk | [](https://lossless.cloud)
|
||||
TypeScript Support | [](https://lossless.cloud)
|
||||
node Support | [](https://nodejs.org/dist/latest-v10.x/docs/api/)
|
||||
Code Style | [](https://lossless.cloud)
|
||||
PackagePhobia (total standalone install weight) | [](https://lossless.cloud)
|
||||
PackagePhobia (package size on registry) | [](https://lossless.cloud)
|
||||
BundlePhobia (total size when bundled) | [](https://lossless.cloud)
|
||||
Platform support | [](https://lossless.cloud) [](https://lossless.cloud)
|
||||
|
||||
## Usage
|
||||
|
||||
Use TypeScript for best in class intellisense.
|
||||
|
||||
## 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)
|
||||
| By using this npm module you agree to our [privacy policy](https://lossless.gmbH/privacy.html)
|
||||
| By using this npm module you agree to our [privacy policy](https://lossless.gmbH/privacy)
|
||||
|
||||
[](https://maintainedby.lossless.com)
|
||||
[](https://maintainedby.lossless.com)
|
||||
|
18
test/test.browser.ts
Normal file
18
test/test.browser.ts
Normal file
@ -0,0 +1,18 @@
|
||||
import { expect, tap, webhelpers } from '@pushrocks/tapbundle';
|
||||
webhelpers.enable();
|
||||
|
||||
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();
|
38
ts/index.ts
38
ts/index.ts
@ -1,33 +1,5 @@
|
||||
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';
|
||||
export * from './websetup.classes.title';
|
||||
|
20
ts/interfaces/index.ts
Normal file
20
ts/interfaces/index.ts
Normal file
@ -0,0 +1,20 @@
|
||||
import * as plugins from '../websetup.plugins';
|
||||
|
||||
export interface IMetaObject {
|
||||
title: string;
|
||||
description?: string;
|
||||
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;
|
||||
}
|
@ -1,18 +0,0 @@
|
||||
export interface IMetaObject {
|
||||
title: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
export const setupMetaInformation = async (metaObjectArg: IMetaObject) => {
|
||||
document.title = metaObjectArg.title;
|
||||
addMetaTag('description', metaObjectArg.description);
|
||||
addMetaTag('google', 'notranslate');
|
||||
addMetaTag('revisited-after', '1 days');
|
||||
};
|
||||
|
||||
const addMetaTag = async (linkNameArg: string, contentArg: string) => {
|
||||
const metaElement = document.createElement('meta');
|
||||
metaElement.name = linkNameArg;
|
||||
metaElement.content = contentArg;
|
||||
document.getElementsByTagName('head')[0].appendChild(metaElement);
|
||||
};
|
@ -1,66 +0,0 @@
|
||||
declare global {
|
||||
// tslint:disable-next-line: interface-name
|
||||
interface Window {
|
||||
_fs_host: any;
|
||||
}
|
||||
}
|
||||
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';
|
||||
(function(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';
|
||||
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,31 +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;
|
||||
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');
|
||||
};
|
75
ts/websetup.classes.tag.jsonldtag.ts
Normal file
75
ts/websetup.classes.tag.jsonldtag.ts
Normal file
@ -0,0 +1,75 @@
|
||||
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;
|
||||
}
|
||||
|
||||
public static createNewsArticleJsonLd(newsArticleArg: plugins.tsclass.content.IArticle) {
|
||||
const newsArticleLd = {
|
||||
'@context': 'https://schema.org',
|
||||
'@type': 'NewsArticle',
|
||||
mainEntityOfPage: {
|
||||
'@type': 'WebPage',
|
||||
'@id': window.location.href,
|
||||
},
|
||||
headline: 'Article headline',
|
||||
image: [newsArticleArg.featuredImageUrl],
|
||||
datePublished: new Date(newsArticleArg.timestamp).toISOString(),
|
||||
dateModified: new Date(newsArticleArg.timestamp).toISOString(),
|
||||
author: {
|
||||
'@type': 'Person',
|
||||
name: `${newsArticleArg.author.firstName} ${newsArticleArg.author.surName}`,
|
||||
},
|
||||
publisher: {
|
||||
'@type': 'Organization',
|
||||
name: newsArticleArg.author.surName, // TODO
|
||||
logo: {
|
||||
'@type': 'ImageObject',
|
||||
url: newsArticleArg.author.surName, // TODO
|
||||
},
|
||||
},
|
||||
description: newsArticleArg.author.firstName,
|
||||
};
|
||||
const ldTag = new JsonLdTag(newsArticleLd);
|
||||
return ldTag;
|
||||
}
|
||||
|
||||
constructor(ldObjectArg: any) {
|
||||
super();
|
||||
const jsonLdElement = document.createElement('script');
|
||||
jsonLdElement.type = 'application/ld+json';
|
||||
jsonLdElement.text = 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;
|
||||
}
|
||||
}
|
21
ts/websetup.classes.tag.opengraphtag.ts
Normal file
21
ts/websetup.classes.tag.opengraphtag.ts
Normal file
@ -0,0 +1,21 @@
|
||||
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');
|
||||
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);
|
||||
}
|
||||
}
|
||||
}
|
99
ts/websetup.classes.taglevel.ts
Normal file
99
ts/websetup.classes.taglevel.ts
Normal file
@ -0,0 +1,99 @@
|
||||
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 type TLevelState = 'enabled' | 'disabled';
|
||||
|
||||
export class TagLevel {
|
||||
public tagManagerRef: TagManager;
|
||||
|
||||
private titleStore: string;
|
||||
public set title(titleArg: string) {
|
||||
this.titleStore = titleArg;
|
||||
if (this.state === 'enabled') {
|
||||
document.title = this.titleStore;
|
||||
}
|
||||
}
|
||||
public get title() {
|
||||
return this.titleStore;
|
||||
}
|
||||
|
||||
public type: TBaseLevelType;
|
||||
public tags: Tag[] = [];
|
||||
|
||||
public state: TLevelState = 'disabled';
|
||||
|
||||
constructor(tagManagerRefArg: TagManager, levelType: TBaseLevelType) {
|
||||
this.tagManagerRef = tagManagerRefArg;
|
||||
}
|
||||
|
||||
public addTag(tagArg: Tag | Tag[]) {
|
||||
if (tagArg instanceof Array) {
|
||||
for (const tagArg2 of tagArg) {
|
||||
this.addTag(tagArg2);
|
||||
}
|
||||
} else {
|
||||
this.tags.push(tagArg);
|
||||
if (this.state === 'enabled') {
|
||||
tagArg.appendToDom();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
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 addNewsArticleInfo(articleArg: plugins.tsclass.content.IArticle) {
|
||||
this.addTag(JsonLdTag.createNewsArticleJsonLd(articleArg));
|
||||
this.addTag(OpengraphTag.createNewsArticleOgTags(articleArg));
|
||||
}
|
||||
|
||||
public async enable() {
|
||||
if (this.title) {
|
||||
document.title = this.title;
|
||||
}
|
||||
for (const tagArg of this.tags) {
|
||||
tagArg.appendToDom();
|
||||
}
|
||||
this.state = 'enabled';
|
||||
}
|
||||
|
||||
public async disable() {
|
||||
for (const tagArg of this.tags) {
|
||||
tagArg.removeFromDom();
|
||||
}
|
||||
this.state = 'disabled';
|
||||
}
|
||||
}
|
63
ts/websetup.classes.tagmanager.ts
Normal file
63
ts/websetup.classes.tagmanager.ts
Normal file
@ -0,0 +1,63 @@
|
||||
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 = new TagLevel(this, 'global');
|
||||
|
||||
public baseLevel: TagLevel = new TagLevel(this, 'base');
|
||||
|
||||
public activeLevel: TagLevel;
|
||||
|
||||
public async setup(metaObjectArg: interfaces.IMetaObject) {
|
||||
// global tag level
|
||||
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) {
|
||||
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();
|
||||
this.activeLevel = this.baseLevel;
|
||||
await this.activeLevel.enable();
|
||||
}
|
||||
|
||||
public async setSubPageLevel(metaObjectArg: interfaces.IMetaObject) {
|
||||
const subPageLevel = new TagLevel(this, 'subpage');
|
||||
subPageLevel.title = metaObjectArg.title;
|
||||
if (metaObjectArg.description) {
|
||||
subPageLevel.addTag(new MetaTag('description', metaObjectArg.description));
|
||||
}
|
||||
await this.activeLevel.disable();
|
||||
this.activeLevel = subPageLevel;
|
||||
await this.activeLevel.enable();
|
||||
return subPageLevel;
|
||||
}
|
||||
|
||||
public async revertToBaseLevel() {
|
||||
if (this.activeLevel !== this.baseLevel) {
|
||||
await this.activeLevel.disable();
|
||||
this.activeLevel = this.baseLevel;
|
||||
await this.activeLevel.enable();
|
||||
}
|
||||
}
|
||||
}
|
9
ts/websetup.classes.title.ts
Normal file
9
ts/websetup.classes.title.ts
Normal file
@ -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 {
|
||||
|
||||
}
|
76
ts/websetup.classes.websetup.ts
Normal file
76
ts/websetup.classes.websetup.ts
Normal file
@ -0,0 +1,76 @@
|
||||
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;
|
||||
smartssrWaitForReadySignal?: boolean;
|
||||
}
|
||||
|
||||
/**
|
||||
* the main WebSetup class
|
||||
*/
|
||||
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();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* an async setup called by the constructor
|
||||
*/
|
||||
public async setup(optionsArg?: IWebSetupConstructorOptions) {
|
||||
if (optionsArg) {
|
||||
this.options = optionsArg;
|
||||
}
|
||||
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 metaObjectArg
|
||||
*/
|
||||
public async setSubLevel(metaObjectArg: interfaces.IMetaObject) {
|
||||
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();
|
||||
}
|
||||
}
|
@ -1,2 +1,10 @@
|
||||
const removeme = {};
|
||||
export { removeme };
|
||||
// pushrocks scope
|
||||
import * as smartdelay from '@pushrocks/smartdelay';
|
||||
import * as smartpromise from '@pushrocks/smartpromise';
|
||||
|
||||
export { smartdelay, smartpromise };
|
||||
|
||||
// tsclass scope
|
||||
import * as tsclass from '@tsclass/tsclass';
|
||||
|
||||
export { tsclass };
|
||||
|
Reference in New Issue
Block a user