Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found
Select Git revision
  • advertisement
  • automagic
  • dbp-translation-component
  • demo
  • demo-file-handling
  • favorites-and-recent-files
  • icon-set-mapping
  • lit2
  • main
  • person-select-custom
  • port-i18next-parser
  • publish
  • remove-sentry
  • renovate/lock-file-maintenance
  • revert-6c632dc6
  • wc-part
  • wip-cleanup
17 results

Target

Select target project
  • 987FCF504483CBC8/toolkit
1 result
Select Git revision
  • demo
  • demo-file-handling
  • master
  • publish
  • qr-perf
  • renovate/major-symfony
  • renovate/rollup-plugin-commonjs-17.x
  • renovate/rollup-plugin-md-1.x
  • renovate/rollup-plugin-node-resolve-11.x
  • renovate/rollup-plugin-postcss-4.x
  • renovate/rollup-plugin-url-6.x
  • renovate/source-sans-pro-3.x
  • update-deps
  • wip-cleanup
14 results
Show changes
Commits on Source (1492)
Showing
with 272 additions and 827 deletions
...@@ -2,3 +2,4 @@ node_modules ...@@ -2,3 +2,4 @@ node_modules
toolkit-showcase/dist toolkit-showcase/dist
.idea .idea
yarn-error.log yarn-error.log
package-lock.json
image: registry.gitlab.tugraz.at/dbp/web-components/toolkit/main:v1 image: registry.gitlab.tugraz.at/dbp/web-components/toolkit/main:v2
cache: cache:
key: ${CI_PROJECT_PATH} key: ${CI_PROJECT_PATH}
paths: paths:
- _yarn_cache - _yarn_cache
- _playwright_cache
variables:
PLAYWRIGHT_BROWSERS_PATH: "$CI_PROJECT_DIR/_playwright_cache"
before_script:
- yarn config set cache-folder "$CI_PROJECT_DIR/_yarn_cache"
stages: stages:
- test - test
...@@ -12,72 +19,46 @@ stages: ...@@ -12,72 +19,46 @@ stages:
test: test:
stage: test stage: test
script: script:
- yarn config set cache-folder "$CI_PROJECT_DIR/_yarn_cache" - yarn install --frozen-lockfile
- yarn install
- yarn run test - yarn run test
linting: linting:
stage: test stage: test
allow_failure: true
script: script:
- yarn config set cache-folder "$CI_PROJECT_DIR/_yarn_cache" - yarn install --frozen-lockfile
- yarn install
- yarn run lint - yarn run lint
publish: publish:
stage: deploy stage: deploy
environment:
name: deploy
url: https://www.npmjs.com/search?q=%40dbp-toolkit
only: only:
refs: refs:
- deploy - main
- master
script: script:
# https://www.npmjs.com/settings/dbp-deploy/tokens # https://www.npmjs.com/settings/dbp-deploy/tokens
# NPM_TOKEN needs to be a "Publish" token with 2FA disabled! # NPM_TOKEN needs to be a "Publish" token with 2FA disabled!
# "Automation" tokens don't work with lerna (even if they would work with "npm publish") # "Automation" tokens don't work with lerna (even if they would work with "npm publish")
- echo '//registry.npmjs.org/:_authToken=${NPM_TOKEN}' > ~/.npmrc - echo '//registry.npmjs.org/:_authToken=${NPM_TOKEN}' > ~/.npmrc
- yarn config set cache-folder "$CI_PROJECT_DIR/_yarn_cache" - yarn install --frozen-lockfile
- yarn install
- yarn run build - yarn run build
- yarn run publish - yarn run publish
.deploy_defaults: &deploy_defaults deploy:
stage: deploy
except: except:
- schedules - schedules
stage: deploy
script:
# Add ssh key
- mkdir -p ~/.ssh
- echo "${DEPLOY_KEY}" | tr -d '\r' > ~/.ssh/id_rsa
- chmod 700 ~/.ssh && chmod 600 ~/.ssh/id_rsa
- ssh-keyscan -t rsa "${DEPLOY_HOST}" >> ~/.ssh/known_hosts
# Deploy
- cd toolkit-showcase
- dep deploy "${CI_ENVIRONMENT_NAME}"
- echo "Deployed to ${CI_ENVIRONMENT_URL}"
# Simple health check
- curl --max-time 10 --retry 3 --output /dev/null --silent --show-error --fail --location "${CI_ENVIRONMENT_URL}"
deploy_demo:
only: only:
refs: refs:
- main
- demo - demo
environment: inherit:
name: demo variables: false
url: https://frontend-demo.tugraz.at/apps/demo
variables:
DEPLOY_HOST: mw01-dev.tugraz.at
DEPLOY_KEY: "$DEPLOY_SSH_KEY"
<<: *deploy_defaults
deploy_development:
only:
refs:
- master
environment:
name: development
url: https://mw-frontend-dev.tugraz.at/apps/demo
variables: variables:
DEPLOY_HOST: mw01-dev.tugraz.at UPSTREAM_PROJECT_PATH: ${CI_PROJECT_PATH}
DEPLOY_KEY: "$DEPLOY_SSH_KEY" UPSTREAM_COMMIT_BRANCH: ${CI_COMMIT_BRANCH}
<<: *deploy_defaults UPSTREAM_COMMIT_SHA: ${CI_COMMIT_SHA}
trigger:
project: dbp/deployer
strategy: depend
FROM debian:buster FROM debian:bullseye
ENV LANG C.UTF-8 ENV LANG C.UTF-8
ENV DEBIAN_FRONTEND noninteractive ENV DEBIAN_FRONTEND noninteractive
...@@ -11,7 +11,7 @@ RUN apt-get update && apt-get install -y \ ...@@ -11,7 +11,7 @@ RUN apt-get update && apt-get install -y \
curl \ curl \
&& rm -rf /var/lib/apt/lists/* && rm -rf /var/lib/apt/lists/*
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash - \ RUN curl -sL https://deb.nodesource.com/setup_14.x | bash - \
&& rm -rf /var/lib/apt/lists/* && rm -rf /var/lib/apt/lists/*
RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add - RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add -
...@@ -20,25 +20,20 @@ RUN echo "deb https://dl.yarnpkg.com/debian/ stable main" > /etc/apt/sources.lis ...@@ -20,25 +20,20 @@ RUN echo "deb https://dl.yarnpkg.com/debian/ stable main" > /etc/apt/sources.lis
RUN apt-get update && apt-get install -y \ RUN apt-get update && apt-get install -y \
nodejs \ nodejs \
yarn \ yarn \
chromium \
# libgbm1: newer chromium from puppeteer
libgbm1 \
firefox-esr \
composer \
php-zip \
rsync \ rsync \
sudo \ sudo \
&& rm -rf /var/lib/apt/lists/* && rm -rf /var/lib/apt/lists/*
# only get dependencies of chromium/firefox
RUN apt-get update && apt-get install --no-install-recommends -y \
chromium \
firefox-esr \
&& apt-get remove -y \
chromium \
firefox-esr \
&& rm -rf /var/lib/apt/lists/*
RUN useradd -u 1000 -ms /bin/bash user RUN useradd -u 1000 -ms /bin/bash user
RUN echo 'user ALL=(ALL) NOPASSWD:ALL' >> /etc/sudoers RUN echo 'user ALL=(ALL) NOPASSWD:ALL' >> /etc/sudoers
USER user USER user
WORKDIR /home/user WORKDIR /home/user
# Install deployer globally and add it to PATH
ENV COMPOSER_HOME="/home/user/.composer"
RUN mkdir -p "${COMPOSER_HOME}"
ADD composer.lock "${COMPOSER_HOME}"
ADD composer.json "${COMPOSER_HOME}"
RUN composer global install
ENV PATH "${COMPOSER_HOME}/vendor/bin:${PATH}"
\ No newline at end of file
* In case of an incompatible change increase the tag version number in build.sh
* ./build.sh
* (first time) sudo docker login registry.gitlab.tugraz.at
* sudo docker push registry.gitlab.tugraz.at/dbp/webcomponents/toolkit/main:v1
\ No newline at end of file
#!/bin/bash #!/bin/bash
set -e set -e
TAG="registry.gitlab.tugraz.at/dbp/web-components/toolkit/main:v1" TAG="registry.gitlab.tugraz.at/dbp/web-components/toolkit/main:v2"
sudo docker build --tag "${TAG}" --file "Dockerfile" . sudo docker build --tag "${TAG}" --file "Dockerfile" .
sudo docker run --rm \
--volume "$(pwd)/..:/home/user/app" --workdir "/home/user/app" \
--tty --interactive "${TAG}" bash
echo "Now run: sudo docker push '$TAG'" echo "Now run: sudo docker push '$TAG'"
{
"require": {
"symfony/process": " ^4.4",
"symfony/console": " ^4.4",
"symfony/yaml": " ^4.4",
"deployer/deployer": " ^6.4",
"deployer/recipes": " ^6.2"
}
}
This diff is collapsed.
{
"extends": [
"config:base",
"group:allNonMajor",
"schedule:weekends",
":automergePatch"
],
"ignorePresets": [":prHourlyLimit2"],
"rangeStrategy": "update-lockfile",
"lockFileMaintenance": {
"enabled": true
},
"composer": {
"enabled": false
},
"poetry": {
"enabled": false
},
"packageRules": [
{
"matchPackageNames": ["datatables.net", "datatables.net-dt"],
"allowedVersions": "<1.13"
},
{
"matchPackageNames": ["datatables.net-buttons", "datatables.net-buttons-dt"],
"allowedVersions": "<2.3"
},
{
"matchPackageNames": ["datatables.net-responsive", "datatables.net-responsive-dt"],
"allowedVersions": "<2.4"
}
]
}
\ No newline at end of file
...@@ -24,6 +24,28 @@ yarn install ...@@ -24,6 +24,28 @@ yarn install
## Publishing packages to npmjs.com ## Publishing packages to npmjs.com
There is an automatic publishing process initiated for each package if code is pushed There is an automatic publishing process initiated for each package if code is pushed
to the `master` branch, if the package isn't set to private in its `package.json` and to the `main` branch, if the package isn't set to private in its `package.json` and
the version number in its `package.json` is higher than the version number on npmjs.com. the version number in its `package.json` is higher than the version number on npmjs.com.
## Reserved attributes
| Attribute | Description |
| ----------------------------- | --------------------------------------------------------------------------------- |
| `subscribe` | Used in all components to subscribe to attributes set by a provider |
| `unsubscribe` | Reserved for future use |
| `auth` | Authentication information, set by the authentication component |
| `lang` | Currently selected language, set by the language selector |
| `lang-dir` | Location of the i18n language file where all required i18n translations are |
| `entry-point-url` | Entry point url for all api requests |
| `requested-login-status` | Used by the login buttons to trigger a login in auth components |
| `initial-file-handling-state` | Used by the file-handling component to sync file source/sink at first time open |
| `clipboard-files` | Used by the file-handling component to use the clipboard source and sink |
| `analytics-event` | Used to send analytics events to the Matomo component |
## Reserved events
| Event | Description |
| ------------------ | ---------------------------------------------------------------------------------- |
| `dbp-subscribe` | Event to tell a provider that the component wants to subscribe to an attribute |
| `dbp-unsubscribe` | Event to tell a provider that the component wants to unsubscribe from an attribute |
| `dbp-set-property` | Event to tell a provider that a property should be changed |
export default {
basePath: '/dist/',
entryPointURL: 'http://127.0.0.1:8000',
keyCloakBaseURL: 'https://auth-dev.tugraz.at/auth',
keyCloakRealm: 'tugraz-vpu',
keyCloakClientId: 'auth-dev-mw-frontend-local',
}
...@@ -9,9 +9,8 @@ ...@@ -9,9 +9,8 @@
"Atomics": "readonly", "Atomics": "readonly",
"SharedArrayBuffer": "readonly" "SharedArrayBuffer": "readonly"
}, },
"parser": "babel-eslint",
"parserOptions": { "parserOptions": {
"ecmaVersion": 2018, "ecmaVersion": 2020,
"sourceType": "module" "sourceType": "module"
}, },
"rules": { "rules": {
......
module.exports = function(config) { module.exports = async function(config) {
const { installBrowsersForNpmInstall, registry } = require('playwright-core/lib/server');
await installBrowsersForNpmInstall(["firefox", "chromium"]);
process.env.FIREFOX_BIN = registry.findExecutable("firefox").executablePath();
process.env.CHROMIUM_BIN = registry.findExecutable("chromium").executablePath();
config.set({ config.set({
basePath: 'dist', basePath: 'dist',
frameworks: ['mocha'], frameworks: ['mocha', 'source-map-support'],
client: { client: {
mocha: { mocha: {
ui: 'tdd', ui: 'tdd',
timeout: 2000 * (process.env.CI === undefined ? 1 : 10)
}, },
}, },
files: [ files: [
{pattern: './*.js', included: true, watched: true, served: true, type: 'module'}, {pattern: './*.js', included: true, watched: true, served: true, type: 'module'},
{pattern: './**/*', included: false, watched: true, served: true}, {pattern: './**/*', included: false, watched: true, served: true, nocache: true},
], ],
autoWatch: true, autoWatch: true,
browsers: [ browsers: [
......
{ {
"name": "dbp-toolkit", "name": "dbp-toolkit",
"version": "0.1.0", "version": "0.1.2",
"description": "", "description": "",
"main": "index.js", "main": "index.js",
"private": true, "private": true,
"workspaces": [ "workspaces": [
"packages/*" "packages/*",
"toolkit-showcase"
], ],
"scripts": { "scripts": {
"test": "lerna run test", "test": "lerna run test",
"format": "lerna run format",
"build": "lerna run build", "build": "lerna run build",
"i18next": "lerna run i18next",
"version-patch": "lerna version patch",
"version-minor": "lerna version minor",
"version": "lerna version",
"yarn-install": "for d in ./packages/*/ ; do (cd \"$d\" && yarn install); done;",
"rm-dist": "for d in ./packages/*/ ; do (cd \"$d\" && rm dist -Rf); done;",
"lint": "lerna run lint", "lint": "lerna run lint",
"publish": "lerna publish from-package --yes" "publish": "lerna publish from-package --yes"
}, },
"author": "", "author": "",
"license": "LGPL-2.1-or-later", "license": "LGPL-2.1-or-later",
"devDependencies": { "devDependencies": {
"lerna": "^3.22.1" "lerna": "^6.0.0"
} },
"dependencies": {}
} }
{ {
"root": true,
"extends": "./../../eslint.common.json" "extends": "./../../eslint.common.json"
} }
...@@ -5,3 +5,4 @@ npm-debug.log ...@@ -5,3 +5,4 @@ npm-debug.log
.vscode .vscode
.cert .cert
package-lock.json package-lock.json
yarn.lock
...@@ -3,3 +3,4 @@ node_modules ...@@ -3,3 +3,4 @@ node_modules
npm-debug.log npm-debug.log
package-lock.json package-lock.json
index.html index.html
yarn.lock
node_modules/
/dist
\ No newline at end of file
{
"bracketSpacing": false,
"singleQuote": true,
"tabWidth": 4,
"printWidth": 100,
"bracketSameLine": true,
"htmlWhitespaceSensitivity": "ignore",
"overrides": [
{
"files": "*.js",
"options": {
"semi": true
}
}
]
}
...@@ -12,14 +12,29 @@ npm i @dbp-toolkit/app-shell ...@@ -12,14 +12,29 @@ npm i @dbp-toolkit/app-shell
## Usage ## Usage
```html ```html
<dbp-app-shell src="/example.topic.metadata.json"></dbp-app-shell>
<script type="module" src="node_modules/@dbp-toolkit/app-shell/dist/dbp-app-shell.js"></script> <script type="module" src="node_modules/@dbp-toolkit/app-shell/dist/dbp-app-shell.js"></script>
<dbp-app-shell src="/example.topic.metadata.json"></dbp-app-shell>
```
Or directly via CDN:
```html
<script type="module" src="https://unpkg.com/@dbp-toolkit/app-shell@0.2.3/dist/dbp-app-shell.js"></script>
<dbp-app-shell src="/example.topic.metadata.json"></dbp-app-shell>
``` ```
You need Keycloak and other parts to be in place to really make full use of the AppShell.
Best take a look on examples like [index.html](https://gitlab.tugraz.at/dbp/esign/signature/-/blob/main/examples/dbp-signature/index.html)
for more explanation.
## Attributes ## Attributes
- `provider-root` (optional): You need to set the `provider-root` attribute for the app-shell to "terminate" all provider events
- If you don't want to set the app-shell as `provider-root` then you need to set the attributes `auth`,
`requested-login-status` and `analytics-event` as attribute for the app-shell or in a `dbp-provider` above it
- example `<dbp-app-shell provider-root></dbp-app-shell>`
- `lang` (optional, default: `de`): set to `de` or `en` for German or English - `lang` (optional, default: `de`): set to `de` or `en` for German or English
- example `<dbp-app-shell lang="de" </dbp-app-shell>` - example `<dbp-app-shell lang="de"></dbp-app-shell>`
- `src`: The path to a topic metadata file (json) - `src`: The path to a topic metadata file (json)
- `base-path` (optional, default: `/`): An absolute base path for routing - `base-path` (optional, default: `/`): An absolute base path for routing
- `entry-point-url`: Entry point URL to access the API - `entry-point-url`: Entry point URL to access the API
...@@ -28,6 +43,71 @@ npm i @dbp-toolkit/app-shell ...@@ -28,6 +43,71 @@ npm i @dbp-toolkit/app-shell
- example `<dbp-app-shell matomo-url="https://my-matomo.tld"></dbp-app-shell>` - example `<dbp-app-shell matomo-url="https://my-matomo.tld"></dbp-app-shell>`
- `matomo-site-id` (optional): set to your site id (required only for tracking) - `matomo-site-id` (optional): set to your site id (required only for tracking)
- example `<dbp-app-shell matomo-site-id="456789"></dbp-app-shell>` - example `<dbp-app-shell matomo-site-id="456789"></dbp-app-shell>`
- `no-welcome-page` (optional): skips the welcome page and welcome page isn't visible in menu
- example `<dbp-app-shell no-welcome-page></dbp-app-shell>`
### Emitted attributes
The component emits `dbp-set-property` events for these attributes:
- `lang` to propagate a language change (possible values `en`, `de`)
- `requested-login-status` (possible values `logged-in`, `logged-out`)
### Emitted events
#### dbp-lang
The component emits a `dbp-lang` event when the language is changed (for example in the language picker).
The `details` attribute of the event is the language (possible values `en`, `de`).
### Slots
You use template tags to inject slots into the web component.
These templates will be converted to div containers when the page is loaded and will not show up before that.
#### Unnamed slot
The unnamed slot will be removed when the application is loaded and can be filled with a loading-spinner.
Example: `<app-shell><dbp-loading-spinner></dbp-loading-spinner></app-shell>`
#### name
The content of this slot will be shown left in the header and can be used to set a name (e.g. the name of the institution).
Example: `<app-shell><template slot="name">TU Graz<br />Graz University of Technology</template></app-shell>`
#### title
The content of this slot will be shown as big h1 headline instead of the `name` in the topic manifest file.
Example: `<app-shell><template slot="title">TU Graz Greenlight</template></app-shell>`
#### logo
The content of this slot will be shown right in the header and can be used to override the logo image.
Example: `<app-shell><template slot="logo"><img alt="logo" src="/path/to/logo.png" /></template></app-shell>`
#### header
The content of this slot will override the whole content of the header.
You will need to provide your own language selector and auth component.
Example: `<app-shell><template slot="header">My custom header</template></app-shell>`
#### footer-links
The content of this slot will override the whole content of the footer link section, for example to set custom links.
Example: `<app-shell><template slot="footer-links"><a target="_blank" rel="noopener" class="int-link-external" href="https://my-webpage.com">Link text</a></template></app-shell>`
#### footer
The content of this slot will override the whole content of the footer, for example to set custom links
and also overwrite the `dbp-build-info` tag.
Example: `<app-shell><template slot="footer"><a target="_blank" rel="noopener" class="int-link-external" href="https://my-webpage.com">Link text</a></template></app-shell>`
## Topic Metadata ## Topic Metadata
......