Compare commits
28 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| f306c1c8f8 | |||
| a59dbc12e5 | |||
| 75d64e1ebd | |||
| e8438140a7 | |||
| 3d2e5e48c1 | |||
| fa9f2afbad | |||
| 7a895c15ab | |||
| 2f04d66ec5 | |||
| 6acfddb70d | |||
| c34d71238a | |||
| 2f4fd839a1 | |||
| bd8585aa42 | |||
| e4f8e53066 | |||
| d381f8adad | |||
| d1c0501461 | |||
| f5d33bdebe | |||
| 2b9c9225a5 | |||
| 5ce55190fe | |||
| 8fb071f57b | |||
| 3278ef7425 | |||
| 11282daa38 | |||
| 1fe7dd8d06 | |||
| 9175cb7841 | |||
| 6b9ebcec7a | |||
| 2159995342 | |||
| 7fa14ceabd | |||
| 0294895f78 | |||
| 74fc97a220 |
-137
@@ -1,137 +0,0 @@
|
|||||||
# gitzone ci_default
|
|
||||||
image: registry.gitlab.com/hosttoday/ht-docker-node:npmci
|
|
||||||
|
|
||||||
cache:
|
|
||||||
paths:
|
|
||||||
- .npmci_cache/
|
|
||||||
key: '$CI_BUILD_STAGE'
|
|
||||||
|
|
||||||
stages:
|
|
||||||
- security
|
|
||||||
- test
|
|
||||||
- release
|
|
||||||
- metadata
|
|
||||||
|
|
||||||
# ====================
|
|
||||||
# security stage
|
|
||||||
# ====================
|
|
||||||
mirror:
|
|
||||||
stage: security
|
|
||||||
script:
|
|
||||||
- npmci git mirror
|
|
||||||
only:
|
|
||||||
- tags
|
|
||||||
tags:
|
|
||||||
- lossless
|
|
||||||
- docker
|
|
||||||
- notpriv
|
|
||||||
|
|
||||||
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 --only=dev
|
|
||||||
tags:
|
|
||||||
- docker
|
|
||||||
allow_failure: true
|
|
||||||
|
|
||||||
# ====================
|
|
||||||
# test stage
|
|
||||||
# ====================
|
|
||||||
|
|
||||||
testStable:
|
|
||||||
stage: test
|
|
||||||
script:
|
|
||||||
- npmci npm prepare
|
|
||||||
- npmci node install stable
|
|
||||||
- npmci npm install
|
|
||||||
- npmci npm test
|
|
||||||
coverage: /\d+.?\d+?\%\s*coverage/
|
|
||||||
tags:
|
|
||||||
- docker
|
|
||||||
|
|
||||||
testBuild:
|
|
||||||
stage: test
|
|
||||||
script:
|
|
||||||
- npmci npm prepare
|
|
||||||
- npmci node install stable
|
|
||||||
- npmci npm install
|
|
||||||
- npmci command npm run build
|
|
||||||
coverage: /\d+.?\d+?\%\s*coverage/
|
|
||||||
tags:
|
|
||||||
- docker
|
|
||||||
|
|
||||||
release:
|
|
||||||
stage: release
|
|
||||||
script:
|
|
||||||
- npmci node install stable
|
|
||||||
- npmci npm publish
|
|
||||||
only:
|
|
||||||
- tags
|
|
||||||
tags:
|
|
||||||
- lossless
|
|
||||||
- docker
|
|
||||||
- notpriv
|
|
||||||
|
|
||||||
# ====================
|
|
||||||
# metadata stage
|
|
||||||
# ====================
|
|
||||||
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:
|
|
||||||
- lossless
|
|
||||||
- docker
|
|
||||||
- priv
|
|
||||||
|
|
||||||
trigger:
|
|
||||||
stage: metadata
|
|
||||||
script:
|
|
||||||
- npmci trigger
|
|
||||||
only:
|
|
||||||
- tags
|
|
||||||
tags:
|
|
||||||
- lossless
|
|
||||||
- docker
|
|
||||||
- notpriv
|
|
||||||
|
|
||||||
pages:
|
|
||||||
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:
|
|
||||||
- tags
|
|
||||||
artifacts:
|
|
||||||
expire_in: 1 week
|
|
||||||
paths:
|
|
||||||
- public
|
|
||||||
allow_failure: true
|
|
||||||
@@ -0,0 +1,42 @@
|
|||||||
|
{
|
||||||
|
"@ship.zone/szci": {
|
||||||
|
"npmGlobalTools": [],
|
||||||
|
"npmRegistryUrl": "registry.npmjs.org"
|
||||||
|
},
|
||||||
|
"@git.zone/cli": {
|
||||||
|
"projectType": "npm",
|
||||||
|
"module": {
|
||||||
|
"githost": "code.foss.global",
|
||||||
|
"gitscope": "push.rocks",
|
||||||
|
"gitrepo": "websetup",
|
||||||
|
"shortDescription": "web metadata setup utilities",
|
||||||
|
"description": "A library for setting up basic properties of a web page including meta tags, OpenGraph tags, JSON-LD structured data, with support for dynamic content.",
|
||||||
|
"npmPackagename": "@push.rocks/websetup",
|
||||||
|
"license": "MIT",
|
||||||
|
"keywords": [
|
||||||
|
"web development",
|
||||||
|
"SEO",
|
||||||
|
"OpenGraph",
|
||||||
|
"JSON-LD",
|
||||||
|
"meta tags",
|
||||||
|
"structured data",
|
||||||
|
"TypeScript",
|
||||||
|
"dynamic content",
|
||||||
|
"website setup",
|
||||||
|
"smart delay",
|
||||||
|
"smart promise",
|
||||||
|
"tag management"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"release": {
|
||||||
|
"registries": [
|
||||||
|
"https://verdaccio.lossless.digital",
|
||||||
|
"https://registry.npmjs.org"
|
||||||
|
],
|
||||||
|
"accessLevel": "public"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"@git.zone/tsdoc": {
|
||||||
|
"legal": "\n## License and Legal Information\n\nThis repository contains open-source code that is licensed under the MIT License. A copy of the MIT License can be found in the [license](license) file within this repository. \n\n**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.\n\n### Trademarks\n\nThis project is owned and maintained by Task Venture Capital GmbH. The names and logos associated with Task Venture Capital GmbH and any related products or services are trademarks of Task Venture Capital GmbH and are not included within the scope of the MIT license granted herein. Use of these trademarks must comply with Task Venture Capital GmbH's Trademark Guidelines, and any usage must be approved in writing by Task Venture Capital GmbH.\n\n### Company Information\n\nTask Venture Capital GmbH \nRegistered at District court Bremen HRB 35230 HB, Germany\n\nFor any legal inquiries or if you require further information, please contact us via email at hello@task.vc.\n\nBy using this repository, you acknowledge that you have read this section, agree to comply with its terms, and understand that the licensing of the code does not imply endorsement by Task Venture Capital GmbH of any derivative works.\n"
|
||||||
|
}
|
||||||
|
}
|
||||||
Vendored
+3
-21
@@ -2,28 +2,10 @@
|
|||||||
"version": "0.2.0",
|
"version": "0.2.0",
|
||||||
"configurations": [
|
"configurations": [
|
||||||
{
|
{
|
||||||
"name": "current file",
|
"command": "npm test",
|
||||||
"type": "node",
|
"name": "Run npm test",
|
||||||
"request": "launch",
|
"request": "launch",
|
||||||
"args": [
|
"type": "node-terminal"
|
||||||
"${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"
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -0,0 +1,52 @@
|
|||||||
|
# Changelog
|
||||||
|
|
||||||
|
## 2026-05-01 - 3.0.20 - fix(metadata)
|
||||||
|
update package metadata and align company schema integration with latest tsclass types
|
||||||
|
|
||||||
|
- migrates build and test tooling to the @git.zone packages and adds package exports
|
||||||
|
- updates company-related metadata handling from legacy contact fields to the newer business type shape
|
||||||
|
- makes product publisher data optional and adds safer fallbacks for OpenGraph and JSON-LD tag generation
|
||||||
|
- replaces the browser test with the current chromium-based test entrypoint
|
||||||
|
|
||||||
|
## 2026-03-01 - 3.0.19 - maintenance
|
||||||
|
Repository housekeeping and metadata updates were consolidated for this release line.
|
||||||
|
|
||||||
|
- Removed `.gitlab-ci.yml`
|
||||||
|
- Updated project description
|
||||||
|
- Updated `tsconfig`
|
||||||
|
- Updated `npmextra.json` git host settings
|
||||||
|
|
||||||
|
## 2023-05-08 - 3.0.18 - core
|
||||||
|
Applied a core update as part of the 3.0.16–3.0.18 patch series.
|
||||||
|
|
||||||
|
- Summarized repeated `fix(core): update` changes across versions 3.0.16, 3.0.17, and 3.0.18
|
||||||
|
|
||||||
|
## 2021-12-10 - 3.0.15 - core
|
||||||
|
Applied a core update as part of the 3.0.0–3.0.15 patch series.
|
||||||
|
|
||||||
|
- Summarized repeated `fix(core): update` changes across versions 3.0.0 through 3.0.15
|
||||||
|
|
||||||
|
## 2020-09-22 - 3.0.0 - core
|
||||||
|
Introduced a breaking core update for the 3.0 release line.
|
||||||
|
|
||||||
|
- Breaking change from version 2.0.18 to 3.0.0 due to core update
|
||||||
|
|
||||||
|
## 2020-07-08 - 2.0.18 - core
|
||||||
|
Introduced a breaking core update for the 2.x release line.
|
||||||
|
|
||||||
|
- Breaking change from version 1.0.8 to 2.0.18 due to core update
|
||||||
|
|
||||||
|
## 2020-06-27 - 2.0.17 - core
|
||||||
|
Routine core maintenance updates were released across the 2.0.3–2.0.17 range.
|
||||||
|
|
||||||
|
- Summarized repeated `fix(core): update` changes across versions 2.0.3 through 2.0.17
|
||||||
|
|
||||||
|
## 2019-07-16 - 1.0.8 - core
|
||||||
|
Removed service worker support in a breaking core change.
|
||||||
|
|
||||||
|
- BREAKING CHANGE: remove serviceworker
|
||||||
|
|
||||||
|
## 2019-03-27 - 1.0.7 - core
|
||||||
|
Routine core maintenance updates were released across the 1.0.1–1.0.7 range.
|
||||||
|
|
||||||
|
- Summarized repeated `fix(core): update` changes across versions 1.0.1 through 1.0.7
|
||||||
@@ -1,4 +1,4 @@
|
|||||||
Copyright (c) 2018 Lossless GmbH (hello@lossless.com)
|
Copyright (c) 2026 Task Venture Capital GmbH <hello@task.vc>
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
|||||||
+33
-8
@@ -1,17 +1,42 @@
|
|||||||
{
|
{
|
||||||
"npmci": {
|
"@ship.zone/szci": {
|
||||||
"npmGlobalTools": [],
|
"npmGlobalTools": [],
|
||||||
"npmAccessLevel": "public"
|
"npmRegistryUrl": "registry.npmjs.org"
|
||||||
},
|
},
|
||||||
"gitzone": {
|
"@git.zone/cli": {
|
||||||
"projectType": "npm",
|
"projectType": "npm",
|
||||||
"module": {
|
"module": {
|
||||||
"githost": "gitlab.com",
|
"githost": "code.foss.global",
|
||||||
"gitscope": "pushrocks",
|
"gitscope": "push.rocks",
|
||||||
"gitrepo": "websetup",
|
"gitrepo": "websetup",
|
||||||
"shortDescription": "setup basic page properties",
|
"shortDescription": "web metadata setup utilities",
|
||||||
"npmPackagename": "@pushrocks/websetup",
|
"description": "A library for setting up basic properties of a web page including meta tags, OpenGraph tags, JSON-LD structured data, with support for dynamic content.",
|
||||||
"license": "MIT"
|
"npmPackagename": "@push.rocks/websetup",
|
||||||
|
"license": "MIT",
|
||||||
|
"keywords": [
|
||||||
|
"web development",
|
||||||
|
"SEO",
|
||||||
|
"OpenGraph",
|
||||||
|
"JSON-LD",
|
||||||
|
"meta tags",
|
||||||
|
"structured data",
|
||||||
|
"TypeScript",
|
||||||
|
"dynamic content",
|
||||||
|
"website setup",
|
||||||
|
"smart delay",
|
||||||
|
"smart promise",
|
||||||
|
"tag management"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"release": {
|
||||||
|
"registries": [
|
||||||
|
"https://verdaccio.lossless.digital",
|
||||||
|
"https://registry.npmjs.org"
|
||||||
|
],
|
||||||
|
"accessLevel": "public"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
"@git.zone/tsdoc": {
|
||||||
|
"legal": "\n## License and Legal Information\n\nThis repository contains open-source code that is licensed under the MIT License. A copy of the MIT License can be found in the [license](license) file within this repository. \n\n**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.\n\n### Trademarks\n\nThis project is owned and maintained by Task Venture Capital GmbH. The names and logos associated with Task Venture Capital GmbH and any related products or services are trademarks of Task Venture Capital GmbH and are not included within the scope of the MIT license granted herein. Use of these trademarks must comply with Task Venture Capital GmbH's Trademark Guidelines, and any usage must be approved in writing by Task Venture Capital GmbH.\n\n### Company Information\n\nTask Venture Capital GmbH \nRegistered at District court Bremen HRB 35230 HB, Germany\n\nFor any legal inquiries or if you require further information, please contact us via email at hello@task.vc.\n\nBy using this repository, you acknowledge that you have read this section, agree to comply with its terms, and understand that the licensing of the code does not imply endorsement by Task Venture Capital GmbH of any derivative works.\n"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Generated
-11198
File diff suppressed because it is too large
Load Diff
+37
-17
@@ -1,31 +1,43 @@
|
|||||||
{
|
{
|
||||||
"name": "@pushrocks/websetup",
|
"name": "@push.rocks/websetup",
|
||||||
"version": "3.0.9",
|
"version": "3.0.20",
|
||||||
"private": false,
|
"private": false,
|
||||||
"description": "setup basic page properties",
|
"description": "A library for setting up basic properties of a web page including meta tags, OpenGraph tags, JSON-LD structured data, with support for dynamic content.",
|
||||||
|
"exports": {
|
||||||
|
".": "./dist_ts/index.js"
|
||||||
|
},
|
||||||
"main": "dist_ts/index.js",
|
"main": "dist_ts/index.js",
|
||||||
"typings": "dist_ts/index.d.ts",
|
"typings": "dist_ts/index.d.ts",
|
||||||
"author": "Lossless GmbH",
|
"author": "Task Venture Capital GmbH <hello@task.vc>",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "(tstest test/)",
|
"test": "tstest test/",
|
||||||
"build": "(tsbuild --web && tsbundle npm)"
|
"build": "tsbuild --web && tsbundle npm",
|
||||||
|
"buildDocs": "tsdoc"
|
||||||
},
|
},
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"lossless",
|
"web development",
|
||||||
"websafe"
|
"SEO",
|
||||||
|
"OpenGraph",
|
||||||
|
"JSON-LD",
|
||||||
|
"meta tags",
|
||||||
|
"structured data",
|
||||||
|
"TypeScript",
|
||||||
|
"dynamic content",
|
||||||
|
"website setup",
|
||||||
|
"smart delay",
|
||||||
|
"smart promise",
|
||||||
|
"tag management"
|
||||||
],
|
],
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@gitzone/tsbuild": "^2.1.25",
|
"@git.zone/tsbuild": "^4.4.0",
|
||||||
"@gitzone/tsbundle": "^1.0.78",
|
"@git.zone/tsbundle": "^2.10.1",
|
||||||
"@gitzone/tstest": "^1.0.52",
|
"@git.zone/tstest": "^3.6.3",
|
||||||
"@pushrocks/tapbundle": "^3.2.9",
|
"@types/node": "^25.6.0"
|
||||||
"tslint": "^6.1.3",
|
|
||||||
"tslint-config-prettier": "^1.15.0"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@pushrocks/smartpromise": "^3.1.3",
|
"@push.rocks/smartpromise": "^4.2.4",
|
||||||
"@tsclass/tsclass": "^3.0.29"
|
"@tsclass/tsclass": "^9.5.1"
|
||||||
},
|
},
|
||||||
"files": [
|
"files": [
|
||||||
"ts/**/*",
|
"ts/**/*",
|
||||||
@@ -36,10 +48,18 @@
|
|||||||
"dist_ts_web/**/*",
|
"dist_ts_web/**/*",
|
||||||
"assets/**/*",
|
"assets/**/*",
|
||||||
"cli.js",
|
"cli.js",
|
||||||
|
".smartconfig.json",
|
||||||
|
"license",
|
||||||
"npmextra.json",
|
"npmextra.json",
|
||||||
"readme.md"
|
"readme.md"
|
||||||
],
|
],
|
||||||
"browserslist": [
|
"browserslist": [
|
||||||
"last 1 chrome versions"
|
"last 1 chrome versions"
|
||||||
]
|
],
|
||||||
|
"type": "module",
|
||||||
|
"homepage": "https://code.foss.global/push.rocks/websetup",
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://code.foss.global/push.rocks/websetup.git"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Generated
+7573
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1 @@
|
|||||||
|
|
||||||
@@ -1,39 +1,151 @@
|
|||||||
# @pushrocks/websetup
|
# @push.rocks/websetup
|
||||||
setup basic page properties
|
setup basic page properties
|
||||||
|
|
||||||
## Availabililty and Links
|
## Install
|
||||||
* [npmjs.org (npm package)](https://www.npmjs.com/package/@pushrocks/websetup)
|
To install @push.rocks/websetup, you can use npm (Node Package Manager). Simply run the following command in your terminal:
|
||||||
* [gitlab.com (source)](https://gitlab.com/pushrocks/websetup)
|
|
||||||
* [github.com (source mirror)](https://github.com/pushrocks/websetup)
|
|
||||||
* [docs (typedoc)](https://pushrocks.gitlab.io/websetup/)
|
|
||||||
|
|
||||||
## Status for master
|
```bash
|
||||||
|
npm install @push.rocks/websetup --save
|
||||||
|
```
|
||||||
|
|
||||||
Status Category | Status Badge
|
This will download the package and add it to your project's `node_modules` directory, as well as save it as a dependency in your project's `package.json` file.
|
||||||
-- | --
|
|
||||||
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
|
## Usage
|
||||||
|
|
||||||
Use TypeScript for best in class intellisense.
|
To use @push.rocks/websetup in your web applications to set up basic page properties efficiently, follow these steps and guidelines. The examples are provided using ECMAScript modules (ESM) syntax along with TypeScript for type safety and better tooling support.
|
||||||
|
|
||||||
## Contribution
|
First, ensure you import the necessary modules from @push.rocks/websetup in your TypeScript files:
|
||||||
|
|
||||||
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). :)
|
```typescript
|
||||||
|
// Import the main class `WebSetup` from the package
|
||||||
|
import { WebSetup } from '@push.rocks/websetup';
|
||||||
|
```
|
||||||
|
|
||||||
For further information read the linked docs at the top of this readme.
|
### Basic Setup
|
||||||
|
|
||||||
> MIT licensed | **©** [Lossless GmbH](https://lossless.gmbh)
|
Begin by creating an instance of `WebSetup` with basic page properties. This example demonstrates setting up page title, description, and canonical URL.
|
||||||
| By using this npm module you agree to our [privacy policy](https://lossless.gmbH/privacy)
|
|
||||||
|
|
||||||
[](https://maintainedby.lossless.com)
|
```typescript
|
||||||
|
// Create a WebSetup instance with basic meta information
|
||||||
|
const webSetup = new WebSetup({
|
||||||
|
metaObject: {
|
||||||
|
title: 'Example Page Title',
|
||||||
|
description: 'This is a description of the example page.',
|
||||||
|
canonicalDomain: 'https://www.example.com',
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Wait for the setup to complete
|
||||||
|
webSetup.readyPromise.then(() => {
|
||||||
|
console.log('WebSetup is ready.');
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### Advanced Usage
|
||||||
|
|
||||||
|
#### Setting up Structured Data with JSON-LD
|
||||||
|
|
||||||
|
Structured data is crucial for SEO and enhancing your page's appearance in search results. @push.rocks/websetup allows you to easily setup company, product, or news article information using JSON-LD.
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// Define company information
|
||||||
|
const companyInfo = {
|
||||||
|
name: 'Example Company Inc.',
|
||||||
|
contact: {
|
||||||
|
website: 'https://www.example.com',
|
||||||
|
logoUrl: 'https://www.example.com/logo.png',
|
||||||
|
phone: '+1234567890',
|
||||||
|
facebookUrl: 'https://facebook.com/example',
|
||||||
|
twitterUrl: 'https://twitter.com/example',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
// Pass the company information to WebSetup
|
||||||
|
const webSetupWithCompanyInfo = new WebSetup({
|
||||||
|
metaObject: {
|
||||||
|
title: 'Example Page Title',
|
||||||
|
ldCompany: companyInfo,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// For products
|
||||||
|
const productInfo = {
|
||||||
|
name: 'Example Product',
|
||||||
|
description: 'A detailed description of the example product.',
|
||||||
|
os: 'Web',
|
||||||
|
category: 'SaaS',
|
||||||
|
logoLink: 'https://www.example.com/product-logo.png',
|
||||||
|
};
|
||||||
|
|
||||||
|
// Pass the product information along with company information for structured data setup
|
||||||
|
const webSetupWithProductInfo = new WebSetup({
|
||||||
|
metaObject: {
|
||||||
|
title: 'Product Page Title',
|
||||||
|
ldProduct: productInfo,
|
||||||
|
ldCompany: companyInfo,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
// Wait for setup completion
|
||||||
|
webSetupWithProductInfo.readyPromise.then(() => {
|
||||||
|
console.log('WebSetup with product info is ready.');
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
#### Dynamic Subpage Levels
|
||||||
|
|
||||||
|
You might have a web application where different "subpages" or sections require different meta tags (e.g., title, description). You can dynamically set these properties without recreating the WebSetup instance.
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// Assume `webSetup` is an existing instance of WebSetup
|
||||||
|
|
||||||
|
// Define meta object for a new subpage
|
||||||
|
const subPageMeta = {
|
||||||
|
title: 'Subpage Title',
|
||||||
|
description: 'Description for the subpage.',
|
||||||
|
};
|
||||||
|
|
||||||
|
// Dynamically set the subpage level
|
||||||
|
webSetup.setSubLevel(subPageMeta).then(() => {
|
||||||
|
console.log('Subpage meta tags are set.');
|
||||||
|
});
|
||||||
|
|
||||||
|
// Revert to base level when leaving the subpage
|
||||||
|
webSetup.revertToBaseLevel();
|
||||||
|
```
|
||||||
|
|
||||||
|
This approach allows developers to manage site-wide and subpage-specific properties efficiently, enhancing user experience and SEO.
|
||||||
|
|
||||||
|
### Handling Ready for Server-Side Rendering (SSR)
|
||||||
|
|
||||||
|
For projects using server-side rendering (SSR), it is essential to signal when the page is ready to be captured. This is especially useful when using SSR solutions like smartSSR that wait for a signal from the client.
|
||||||
|
|
||||||
|
```typescript
|
||||||
|
// Inform that the page is ready for SSR capture
|
||||||
|
webSetup.informReadyForSmartssr();
|
||||||
|
```
|
||||||
|
|
||||||
|
Note: This feature should be used if you have `smartssrWaitForReadySignal` option enabled during the `WebSetup` initialization.
|
||||||
|
|
||||||
|
### Conclusion
|
||||||
|
|
||||||
|
The `@push.rocks/websetup` package provides a streamlined way to manage basic page properties, structured data using JSON-LD for SEO, and dynamic settings for different page sections or states. By following the examples above and integrating @push.rocks/websetup into your projects, you can improve your web application's SEO, maintainability, and developer experience.
|
||||||
|
|
||||||
|
## License and Legal Information
|
||||||
|
|
||||||
|
This repository contains open-source code that is licensed under the MIT License. A copy of the MIT License can be found in the [license](license) file within this repository.
|
||||||
|
|
||||||
|
**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.
|
||||||
|
|
||||||
|
### Trademarks
|
||||||
|
|
||||||
|
This project is owned and maintained by Task Venture Capital GmbH. The names and logos associated with Task Venture Capital GmbH and any related products or services are trademarks of Task Venture Capital GmbH and are not included within the scope of the MIT license granted herein. Use of these trademarks must comply with Task Venture Capital GmbH's Trademark Guidelines, and any usage must be approved in writing by Task Venture Capital GmbH.
|
||||||
|
|
||||||
|
### Company Information
|
||||||
|
|
||||||
|
Task Venture Capital GmbH
|
||||||
|
Registered at District court Bremen HRB 35230 HB, Germany
|
||||||
|
|
||||||
|
For any legal inquiries or if you require further information, please contact us via email at hello@task.vc.
|
||||||
|
|
||||||
|
By using this repository, you acknowledge that you have read this section, agree to comply with its terms, and understand that the licensing of the code does not imply endorsement by Task Venture Capital GmbH of any derivative works.
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import { expect, tap } from '@pushrocks/tapbundle';
|
import { expect, tap } from '@git.zone/tstest/tapbundle';
|
||||||
import * as websetup from '../ts/index';
|
|
||||||
|
import * as websetup from '../ts/index.js';
|
||||||
|
|
||||||
tap.test('first test', async () => {
|
tap.test('first test', async () => {
|
||||||
const websetupInstance = new websetup.WebSetup({
|
const websetupInstance = new websetup.WebSetup({
|
||||||
@@ -10,7 +11,7 @@ tap.test('first test', async () => {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
await websetupInstance.readyPromise;
|
await websetupInstance.readyPromise;
|
||||||
expect(document.title).to.equal('mytitle');
|
expect(document.title).toEqual('mytitle');
|
||||||
});
|
});
|
||||||
|
|
||||||
tap.start();
|
export default tap.start();
|
||||||
@@ -0,0 +1,8 @@
|
|||||||
|
/**
|
||||||
|
* autocreated commitinfo by @push.rocks/commitinfo
|
||||||
|
*/
|
||||||
|
export const commitinfo = {
|
||||||
|
name: '@push.rocks/websetup',
|
||||||
|
version: '3.0.20',
|
||||||
|
description: 'A library for setting up basic properties of a web page including meta tags, OpenGraph tags, JSON-LD structured data, with support for dynamic content.'
|
||||||
|
}
|
||||||
+5
-4
@@ -1,4 +1,5 @@
|
|||||||
export * from './websetup.classes.websetup';
|
export * from './websetup.classes.websetup.js';
|
||||||
export * from './websetup.classes.tag.metatag';
|
export * from './websetup.classes.tag.metatag.js';
|
||||||
export * from './websetup.classes.tag.opengraphtag';
|
export * from './websetup.classes.tag.opengraphtag.js';
|
||||||
export * from './websetup.classes.tag.jsonldtag';
|
export * from './websetup.classes.tag.jsonldtag.js';
|
||||||
|
export * from './websetup.classes.title.js';
|
||||||
|
|||||||
+14
-4
@@ -1,9 +1,19 @@
|
|||||||
import * as plugins from '../websetup.plugins';
|
import * as plugins from '../websetup.plugins.js';
|
||||||
|
|
||||||
export interface IMetaObject {
|
export interface IMetaObject {
|
||||||
title: string;
|
title: string;
|
||||||
description?: string;
|
description?: string;
|
||||||
canonicalDomain?: string;
|
canonicalDomain?: string;
|
||||||
ldCompany?: plugins.tsclass.business.ICompany;
|
ldCompany?: plugins.tsclass.business.TCompany;
|
||||||
ldProduct?: any;
|
ldProduct?: plugins.tsclass.saas.IProduct;
|
||||||
|
|
||||||
|
// handles
|
||||||
|
twitterHandle?: string;
|
||||||
|
facebookHandle?: string;
|
||||||
|
|
||||||
|
// links
|
||||||
|
companyWebsiteLink?: string;
|
||||||
|
googleNewsLink?: string;
|
||||||
|
mediumLink?: string;
|
||||||
|
slackLink?: string;
|
||||||
|
airmeetLink?: string;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,77 +1,108 @@
|
|||||||
import * as plugins from './websetup.plugins';
|
import * as plugins from './websetup.plugins.js';
|
||||||
import * as interfaces from './interfaces';
|
import * as interfaces from './interfaces/index.js';
|
||||||
|
|
||||||
import { Tag } from './websetup.classes.tag';
|
import { Tag } from './websetup.classes.tag.js';
|
||||||
|
|
||||||
export class JsonLdTag extends Tag {
|
export class JsonLdTag extends Tag {
|
||||||
public static createCompanyLd(companyDataArg: plugins.tsclass.business.ICompany) {
|
public static createCompanyJsonLd(companyDataArg: plugins.tsclass.business.TCompany) {
|
||||||
|
// STATIC
|
||||||
// lets care about linked data
|
// lets care about linked data
|
||||||
const companyLd = {
|
const companyLd = {
|
||||||
'@context': 'https://schema.org',
|
'@context': 'https://schema.org',
|
||||||
'@type': 'Corporation',
|
'@type': 'Corporation',
|
||||||
name: companyDataArg.name,
|
name: companyDataArg.name,
|
||||||
alternateName: companyDataArg.name.replace(' GmbH', ''),
|
alternateName: companyDataArg.name.replace(' GmbH', ''),
|
||||||
url: companyDataArg.contact.website,
|
url: companyDataArg.website,
|
||||||
logo: companyDataArg.contact.logoUrl,
|
logo: companyDataArg.logoUrl,
|
||||||
contactPoint: {
|
contactPoint: {
|
||||||
'@type': 'ContactPoint',
|
'@type': 'ContactPoint',
|
||||||
telephone: companyDataArg.contact.phone,
|
telephone: companyDataArg.phone,
|
||||||
contactType: 'customer service',
|
contactType: 'customer service',
|
||||||
areaServed: 'DE',
|
areaServed: 'DE',
|
||||||
availableLanguage: ['en', 'German'],
|
availableLanguage: ['en', 'German'],
|
||||||
},
|
},
|
||||||
sameAs: [],
|
sameAs: [] as string[],
|
||||||
};
|
};
|
||||||
|
|
||||||
if (companyDataArg.contact.facebookUrl) {
|
const facebookUrl = companyDataArg.socials?.find((socialArg) => socialArg.type === 'facebook')?.url;
|
||||||
companyLd.sameAs.push(companyDataArg.contact.facebookUrl);
|
if (facebookUrl) {
|
||||||
|
companyLd.sameAs.push(facebookUrl);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (companyDataArg.contact.twitterUrl) {
|
const twitterUrl = companyDataArg.socials?.find((socialArg) => socialArg.type === 'twitter')?.url;
|
||||||
companyLd.sameAs.push(companyDataArg.contact.twitterUrl);
|
if (twitterUrl) {
|
||||||
|
companyLd.sameAs.push(twitterUrl);
|
||||||
}
|
}
|
||||||
|
|
||||||
const ldTag = new JsonLdTag(companyLd);
|
const ldTag = new JsonLdTag(companyLd);
|
||||||
return ldTag;
|
return ldTag;
|
||||||
}
|
}
|
||||||
|
|
||||||
public static createNewsArticleLd (newsArticleArg: plugins.tsclass.content.IArticle) {
|
public static createNewsArticleJsonLd(newsArticleArg: plugins.tsclass.content.IArticle) {
|
||||||
const newsArticleLd = {
|
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;
|
||||||
|
}
|
||||||
|
public static createProductJsonLd(
|
||||||
|
productArg: plugins.tsclass.saas.IProduct,
|
||||||
|
publisherArg?: plugins.tsclass.business.TCompany
|
||||||
|
) {
|
||||||
|
const productLd = {
|
||||||
|
'@context': 'https://schema.org',
|
||||||
|
'@type': 'SoftwareApplication',
|
||||||
|
name: productArg.name,
|
||||||
|
description: productArg.description,
|
||||||
|
operatingSystem: productArg.os,
|
||||||
|
applicationCategory: productArg.category,
|
||||||
|
offers: {
|
||||||
|
'@type': 'Offer',
|
||||||
|
name: 'User-based Plan',
|
||||||
|
priceSpecification: {
|
||||||
|
'@type': 'PropertyValueSpecification',
|
||||||
|
valueName: 'Number of Users',
|
||||||
|
valueRequired: true,
|
||||||
|
price: '4.99',
|
||||||
|
priceCurrency: 'EUR',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
publisher: publisherArg ? this.createCompanyJsonLd(publisherArg).elementRef.textContent : undefined,
|
||||||
|
screenshot: 'https://www.social.io/screenshot.png',
|
||||||
|
url: 'https://www.social.io/',
|
||||||
|
};
|
||||||
|
const ldTag = new JsonLdTag(productLd);
|
||||||
return ldTag;
|
return ldTag;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// INSTANCE
|
||||||
constructor(ldObjectArg: any) {
|
constructor(ldObjectArg: any) {
|
||||||
super();
|
super();
|
||||||
const jsonLdElement = document.createElement('script');
|
const jsonLdElement = document.createElement('script');
|
||||||
jsonLdElement.type = 'application/ld+json';
|
jsonLdElement.type = 'application/ld+json';
|
||||||
jsonLdElement.text = JSON.stringify(JSON.stringify(ldObjectArg));
|
jsonLdElement.text = JSON.stringify(ldObjectArg);
|
||||||
this.elementRef = jsonLdElement;
|
this.elementRef = jsonLdElement;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,11 +1,9 @@
|
|||||||
import { Tag } from './websetup.classes.tag';
|
import { Tag } from './websetup.classes.tag.js';
|
||||||
|
|
||||||
export class LinkTag extends Tag {
|
export class LinkTag extends Tag {
|
||||||
constructor(relArg: string, hrefArg: string) {
|
constructor(relArg: string, hrefArg: string) {
|
||||||
super();
|
super();
|
||||||
const linkElement = !!document.querySelector("link[rel='canonical']")
|
const linkElement = document.querySelector("link[rel='canonical']") ?? document.createElement('link');
|
||||||
? document.querySelector("link[rel='canonical']")
|
|
||||||
: document.createElement('link');
|
|
||||||
linkElement.setAttribute('rel', relArg);
|
linkElement.setAttribute('rel', relArg);
|
||||||
linkElement.setAttribute('href', hrefArg);
|
linkElement.setAttribute('href', hrefArg);
|
||||||
this.elementRef = linkElement;
|
this.elementRef = linkElement;
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { Tag } from './websetup.classes.tag';
|
import { Tag } from './websetup.classes.tag.js';
|
||||||
|
|
||||||
export class MetaTag extends Tag {
|
export class MetaTag extends Tag {
|
||||||
constructor(metaNameArg: string, contentArg: string) {
|
constructor(metaNameArg: string, contentArg: string) {
|
||||||
|
|||||||
@@ -1,6 +1,38 @@
|
|||||||
import { Tag } from './websetup.classes.tag';
|
import * as plugins from './websetup.plugins.js';
|
||||||
|
import { Tag } from './websetup.classes.tag.js';
|
||||||
|
|
||||||
export class OpengraphTag extends 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 ?? globalThis.location.href));
|
||||||
|
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;
|
||||||
|
}
|
||||||
|
|
||||||
|
public static createProductOgTags(productArg: plugins.tsclass.saas.IProduct) {
|
||||||
|
const tagArray: OpengraphTag[] = [];
|
||||||
|
tagArray.push(new OpengraphTag('og:type', 'product'));
|
||||||
|
tagArray.push(new OpengraphTag('og:url', globalThis.location.href));
|
||||||
|
tagArray.push(new OpengraphTag('og:title', `${productArg.name} - ${productArg.slogan}`));
|
||||||
|
tagArray.push(new OpengraphTag('og:site_name', productArg.name));
|
||||||
|
tagArray.push(new OpengraphTag('og:description', productArg.description));
|
||||||
|
tagArray.push(new OpengraphTag('og:image', productArg.logoLink));
|
||||||
|
return tagArray;
|
||||||
|
}
|
||||||
|
|
||||||
|
public static createCompanyOgTags(companyArg: plugins.tsclass.business.TCompany) {
|
||||||
|
const tagArray: OpengraphTag[] = [];
|
||||||
|
tagArray.push(new OpengraphTag('og:type', 'company'));
|
||||||
|
tagArray.push(new OpengraphTag('og:url', globalThis.location.href));
|
||||||
|
tagArray.push(new OpengraphTag('og:title', companyArg.name));
|
||||||
|
tagArray.push(new OpengraphTag('og:site_name', companyArg.name));
|
||||||
|
tagArray.push(new OpengraphTag('og:description', companyArg.description));
|
||||||
|
tagArray.push(new OpengraphTag('og:image', companyArg.logoUrl ?? ''));
|
||||||
|
return tagArray;
|
||||||
|
}
|
||||||
|
|
||||||
constructor(propertyNameArg: string, contentArg: string) {
|
constructor(propertyNameArg: string, contentArg: string) {
|
||||||
super();
|
super();
|
||||||
const openGraphElement = document.createElement('meta');
|
const openGraphElement = document.createElement('meta');
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
import * as plugins from './websetup.plugins';
|
import * as plugins from './websetup.plugins.js';
|
||||||
|
|
||||||
export class Tag {
|
export class Tag {
|
||||||
public elementRef: Element;
|
public elementRef!: Element;
|
||||||
|
|
||||||
public tagLevel: 'global' | 'levelbound';
|
public tagLevel: 'global' | 'levelbound' = 'levelbound';
|
||||||
|
|
||||||
public appendToDom() {
|
public appendToDom() {
|
||||||
if (!this.elementRef.parentElement && !this.elementRef.parentNode) {
|
if (!this.elementRef.parentElement && !this.elementRef.parentNode) {
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
import { Tag } from './websetup.classes.tag';
|
import { Tag } from './websetup.classes.tag.js';
|
||||||
import { JsonLdTag } from './websetup.classes.tag.jsonldtag';
|
import { JsonLdTag } from './websetup.classes.tag.jsonldtag.js';
|
||||||
import { OpengraphTag } from './websetup.classes.tag.opengraphtag';
|
import { OpengraphTag } from './websetup.classes.tag.opengraphtag.js';
|
||||||
import { TagManager } from './websetup.classes.tagmanager';
|
import { TagManager } from './websetup.classes.tagmanager.js';
|
||||||
import * as plugins from './websetup.plugins';
|
import * as plugins from './websetup.plugins.js';
|
||||||
|
|
||||||
export type TBaseLevelType = 'global' | 'base' | 'subpage';
|
export type TBaseLevelType = 'global' | 'base' | 'subpage';
|
||||||
|
|
||||||
@@ -11,14 +11,14 @@ export type TLevelState = 'enabled' | 'disabled';
|
|||||||
export class TagLevel {
|
export class TagLevel {
|
||||||
public tagManagerRef: TagManager;
|
public tagManagerRef: TagManager;
|
||||||
|
|
||||||
private titleStore: string;
|
private titleStore?: string;
|
||||||
public set title(titleArg: string) {
|
public set title(titleArg: string) {
|
||||||
this.titleStore = titleArg;
|
this.titleStore = titleArg;
|
||||||
if (this.state === 'enabled') {
|
if (this.state === 'enabled') {
|
||||||
document.title = this.titleStore;
|
document.title = this.titleStore;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
public get title() {
|
public get title(): string | undefined {
|
||||||
return this.titleStore;
|
return this.titleStore;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -29,48 +29,61 @@ export class TagLevel {
|
|||||||
|
|
||||||
constructor(tagManagerRefArg: TagManager, levelType: TBaseLevelType) {
|
constructor(tagManagerRefArg: TagManager, levelType: TBaseLevelType) {
|
||||||
this.tagManagerRef = tagManagerRefArg;
|
this.tagManagerRef = tagManagerRefArg;
|
||||||
|
this.type = levelType;
|
||||||
}
|
}
|
||||||
|
|
||||||
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();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public async addCompanyInfo(companyDataArg: plugins.tsclass.business.ICompany) {
|
public async addCompanyInfo(companyDataArg: plugins.tsclass.business.TCompany) {
|
||||||
this.addTag(JsonLdTag.createCompanyLd(companyDataArg));
|
this.addTag(JsonLdTag.createCompanyJsonLd(companyDataArg));
|
||||||
|
|
||||||
// lets care about open graph
|
// lets care about open graph
|
||||||
this.addTag(new OpengraphTag('og:type', 'business.business'));
|
this.addTag(new OpengraphTag('og:type', 'business.business'));
|
||||||
this.addTag(new OpengraphTag('og:title', companyDataArg.name));
|
this.addTag(new OpengraphTag('og:title', companyDataArg.name));
|
||||||
this.addTag(new OpengraphTag('og:url', companyDataArg.contact.website));
|
this.addTag(new OpengraphTag('og:url', companyDataArg.website ?? ''));
|
||||||
this.addTag(new OpengraphTag('og:image', companyDataArg.contact.logoUrl));
|
this.addTag(new OpengraphTag('og:image', companyDataArg.logoUrl ?? ''));
|
||||||
this.addTag(
|
this.addTag(
|
||||||
new OpengraphTag(
|
new OpengraphTag(
|
||||||
'business:contact_data:street_address',
|
'business:contact_data:street_address',
|
||||||
`${companyDataArg.contact.address.streetName} ${companyDataArg.contact.address.houseNumber}`
|
`${companyDataArg.address.streetName} ${companyDataArg.address.houseNumber}`
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
this.addTag(
|
this.addTag(
|
||||||
new OpengraphTag('business:contact_data:locality', companyDataArg.contact.address.postalCode)
|
new OpengraphTag('business:contact_data:locality', companyDataArg.address.postalCode)
|
||||||
);
|
);
|
||||||
this.addTag(
|
this.addTag(
|
||||||
new OpengraphTag('business:contact_data:region', companyDataArg.contact.address.city)
|
new OpengraphTag('business:contact_data:region', companyDataArg.address.city)
|
||||||
);
|
);
|
||||||
this.addTag(
|
this.addTag(
|
||||||
new OpengraphTag(
|
new OpengraphTag(
|
||||||
'business:contact_data:postal_code',
|
'business:contact_data:postal_code',
|
||||||
companyDataArg.contact.address.postalCode
|
companyDataArg.address.postalCode
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
this.addTag(
|
this.addTag(
|
||||||
new OpengraphTag('business:contact_data:country_name', companyDataArg.contact.address.country)
|
new OpengraphTag('business:contact_data:country_name', companyDataArg.address.country)
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
public addNewsArticleInfo(articleArg: plugins.tsclass.content.IArticle) {
|
public addNewsArticleInfo(articleArg: plugins.tsclass.content.IArticle) {
|
||||||
this.addTag(JsonLdTag.createNewsArticleLd(articleArg));
|
this.addTag(JsonLdTag.createNewsArticleJsonLd(articleArg));
|
||||||
|
this.addTag(OpengraphTag.createNewsArticleOgTags(articleArg));
|
||||||
|
}
|
||||||
|
|
||||||
|
public addProductInfo(productArg: plugins.tsclass.saas.IProduct, companyArg?: plugins.tsclass.business.TCompany) {
|
||||||
|
this.addTag(JsonLdTag.createProductJsonLd(productArg, companyArg));
|
||||||
|
this.addTag(OpengraphTag.createProductOgTags(productArg));
|
||||||
}
|
}
|
||||||
|
|
||||||
public async enable() {
|
public async enable() {
|
||||||
|
|||||||
@@ -1,22 +1,28 @@
|
|||||||
import { TagLevel } from './websetup.classes.taglevel';
|
import { TagLevel } from './websetup.classes.taglevel.js';
|
||||||
import * as plugins from './websetup.plugins';
|
import * as plugins from './websetup.plugins.js';
|
||||||
import * as interfaces from './interfaces';
|
import * as interfaces from './interfaces/index.js';
|
||||||
import { MetaTag } from './websetup.classes.tag.metatag';
|
import { MetaTag } from './websetup.classes.tag.metatag.js';
|
||||||
import { JsonLdTag } from './websetup.classes.tag.jsonldtag';
|
import { JsonLdTag } from './websetup.classes.tag.jsonldtag.js';
|
||||||
import { OpengraphTag } from './websetup.classes.tag.opengraphtag';
|
import { OpengraphTag } from './websetup.classes.tag.opengraphtag.js';
|
||||||
|
|
||||||
export class TagManager {
|
export class TagManager {
|
||||||
public globalLevel: TagLevel = new TagLevel(this, 'global');
|
public globalLevel: TagLevel = new TagLevel(this, 'global');
|
||||||
|
|
||||||
public baseLevel: TagLevel = new TagLevel(this, 'base');
|
public baseLevel: TagLevel = new TagLevel(this, 'base');
|
||||||
|
|
||||||
public activeLevel: TagLevel;
|
public activeLevel!: TagLevel;
|
||||||
|
|
||||||
public async setup(metaObjectArg: interfaces.IMetaObject) {
|
public async setup(metaObjectArg: interfaces.IMetaObject) {
|
||||||
// global tag level
|
// global tag level
|
||||||
this.globalLevel.addTag(new MetaTag('google', 'notranslate'));
|
this.globalLevel.addTag(new MetaTag('google', 'notranslate'));
|
||||||
this.globalLevel.addTag(new MetaTag('revisit-after', '1 days'));
|
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
|
// base tag level
|
||||||
this.baseLevel.title = metaObjectArg.title;
|
this.baseLevel.title = metaObjectArg.title;
|
||||||
if (metaObjectArg.description) {
|
if (metaObjectArg.description) {
|
||||||
@@ -27,9 +33,17 @@ export class TagManager {
|
|||||||
this.baseLevel.addTag(new MetaTag('canonical', metaObjectArg.canonicalDomain));
|
this.baseLevel.addTag(new MetaTag('canonical', metaObjectArg.canonicalDomain));
|
||||||
}
|
}
|
||||||
|
|
||||||
if (metaObjectArg.ldCompany) {
|
|
||||||
this.baseLevel.addCompanyInfo(metaObjectArg.ldCompany);
|
// json ld
|
||||||
|
switch (true) {
|
||||||
|
case metaObjectArg.ldCompany && !metaObjectArg.ldProduct:
|
||||||
|
this.baseLevel.addCompanyInfo(metaObjectArg.ldCompany);
|
||||||
|
break;
|
||||||
|
case !!metaObjectArg.ldProduct:
|
||||||
|
this.baseLevel.addProductInfo(metaObjectArg.ldProduct, metaObjectArg.ldCompany);
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
await this.globalLevel.enable();
|
await this.globalLevel.enable();
|
||||||
this.activeLevel = this.baseLevel;
|
this.activeLevel = this.baseLevel;
|
||||||
await this.activeLevel.enable();
|
await this.activeLevel.enable();
|
||||||
@@ -39,7 +53,7 @@ export class TagManager {
|
|||||||
const subPageLevel = new TagLevel(this, 'subpage');
|
const subPageLevel = new TagLevel(this, 'subpage');
|
||||||
subPageLevel.title = metaObjectArg.title;
|
subPageLevel.title = metaObjectArg.title;
|
||||||
if (metaObjectArg.description) {
|
if (metaObjectArg.description) {
|
||||||
this.baseLevel.addTag(new MetaTag('description', metaObjectArg.description));
|
subPageLevel.addTag(new MetaTag('description', metaObjectArg.description));
|
||||||
}
|
}
|
||||||
await this.activeLevel.disable();
|
await this.activeLevel.disable();
|
||||||
this.activeLevel = subPageLevel;
|
this.activeLevel = subPageLevel;
|
||||||
|
|||||||
@@ -0,0 +1,7 @@
|
|||||||
|
import * as plugins from './websetup.plugins.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* a title proxy class
|
||||||
|
* --> to be used in the future when flashing titles is supported
|
||||||
|
*/
|
||||||
|
export class Title {}
|
||||||
@@ -1,10 +1,11 @@
|
|||||||
import * as plugins from './websetup.plugins';
|
import * as plugins from './websetup.plugins.js';
|
||||||
import * as interfaces from './interfaces';
|
import * as interfaces from './interfaces/index.js';
|
||||||
import { TagManager } from './websetup.classes.tagmanager';
|
import { TagManager } from './websetup.classes.tagmanager.js';
|
||||||
import { TagLevel } from './websetup.classes.taglevel';
|
import { TagLevel } from './websetup.classes.taglevel.js';
|
||||||
|
|
||||||
export interface IWebSetupConstructorOptions {
|
export interface IWebSetupConstructorOptions {
|
||||||
metaObject: interfaces.IMetaObject;
|
metaObject: interfaces.IMetaObject;
|
||||||
|
smartssrWaitForReadySignal?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@@ -13,12 +14,21 @@ export interface IWebSetupConstructorOptions {
|
|||||||
export class WebSetup {
|
export class WebSetup {
|
||||||
public tagManager: TagManager = new TagManager();
|
public tagManager: TagManager = new TagManager();
|
||||||
public options: IWebSetupConstructorOptions;
|
public options: IWebSetupConstructorOptions;
|
||||||
|
|
||||||
|
// private deferreds
|
||||||
private readyDeferred = plugins.smartpromise.defer();
|
private readyDeferred = plugins.smartpromise.defer();
|
||||||
|
private readyForSmartssrDeferred = plugins.smartpromise.defer();
|
||||||
|
|
||||||
|
// public promises
|
||||||
public readyPromise = this.readyDeferred.promise;
|
public readyPromise = this.readyDeferred.promise;
|
||||||
|
public readyForSmartssrPromise = this.readyForSmartssrDeferred.promise;
|
||||||
constructor(optionsArg: IWebSetupConstructorOptions) {
|
constructor(optionsArg: IWebSetupConstructorOptions) {
|
||||||
this.options = optionsArg;
|
this.options = optionsArg;
|
||||||
this.setup().then(() => {
|
this.setup().then(() => {
|
||||||
this.readyDeferred.resolve();
|
this.readyDeferred.resolve();
|
||||||
|
if (!this.options.smartssrWaitForReadySignal) {
|
||||||
|
this.readyForSmartssrDeferred.resolve();
|
||||||
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -47,4 +57,22 @@ export class WebSetup {
|
|||||||
const subLevel = await this.tagManager.setSubPageLevel(metaObjectArg);
|
const subLevel = await this.tagManager.setSubPageLevel(metaObjectArg);
|
||||||
return subLevel;
|
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,5 +1,5 @@
|
|||||||
// pushrocks scope
|
// pushrocks scope
|
||||||
import * as smartpromise from '@pushrocks/smartpromise';
|
import * as smartpromise from '@push.rocks/smartpromise';
|
||||||
|
|
||||||
export { smartpromise };
|
export { smartpromise };
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,16 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"experimentalDecorators": true,
|
||||||
|
"useDefineForClassFields": false,
|
||||||
|
"target": "ES2022",
|
||||||
|
"module": "NodeNext",
|
||||||
|
"moduleResolution": "NodeNext",
|
||||||
|
"noImplicitAny": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"verbatimModuleSyntax": true,
|
||||||
|
"types": ["node"]
|
||||||
|
},
|
||||||
|
"exclude": [
|
||||||
|
"dist_*/**/*.d.ts"
|
||||||
|
]
|
||||||
|
}
|
||||||
-17
@@ -1,17 +0,0 @@
|
|||||||
{
|
|
||||||
"extends": ["tslint:latest", "tslint-config-prettier"],
|
|
||||||
"rules": {
|
|
||||||
"semicolon": [true, "always"],
|
|
||||||
"no-console": false,
|
|
||||||
"ordered-imports": false,
|
|
||||||
"object-literal-sort-keys": false,
|
|
||||||
"member-ordering": {
|
|
||||||
"options":{
|
|
||||||
"order": [
|
|
||||||
"static-method"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"defaultSeverity": "warning"
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user