Skip to content
Snippets Groups Projects
Select Git revision
  • 8357054a484ab4085af0f67a6691c4c5b3fe787c
  • main default protected
  • renovate/lock-file-maintenance
  • demo protected
  • person-select-custom
  • dbp-translation-component
  • icon-set-mapping
  • port-i18next-parser
  • remove-sentry
  • favorites-and-recent-files
  • revert-6c632dc6
  • lit2
  • advertisement
  • wc-part
  • automagic
  • publish
  • wip-cleanup
  • demo-file-handling
18 results

source-sans-pro-base-ext-700-italic.woff2

Blame
    • Reiter, Christoph's avatar
      03de6486
      Add font-source-sans-pro package · 03de6486
      Reiter, Christoph authored
      This contains a subsetted version of OTF Source Sans Pro 2.x
      (the only version that looks good on low DPI Windows with font-weight 300)
      
      Since there is no package on npm for this and ideally we don't
      want to copy around font files this makes it reusable.
      03de6486
      History
      Add font-source-sans-pro package
      Reiter, Christoph authored
      This contains a subsetted version of OTF Source Sans Pro 2.x
      (the only version that looks good on low DPI Windows with font-weight 300)
      
      Since there is no package on npm for this and ideally we don't
      want to copy around font files this makes it reusable.
    dbp-person-select-demo.js 4.88 KiB
    import {createInstance} from './i18n.js';
    import {css, html} from 'lit';
    import {ScopedElementsMixin} from '@open-wc/scoped-elements';
    import {PersonSelect} from './person-select.js';
    import {AuthKeycloak, LoginButton} from '@dbp-toolkit/auth';
    import * as commonUtils from '@dbp-toolkit/common/utils';
    import * as commonStyles from '@dbp-toolkit/common/styles';
    import DBPLitElement from '@dbp-toolkit/common/dbp-lit-element';
    
    export class PersonSelectDemo extends ScopedElementsMixin(DBPLitElement) {
        constructor() {
            super();
            this._i18n = createInstance();
            this.lang = this._i18n.language;
            this.entryPointUrl = '';
            this.noAuth = false;
        }
    
        static get scopedElements() {
            return {
                'dbp-auth-keycloak': AuthKeycloak,
                'dbp-login-button': LoginButton,
                'dbp-person-select': PersonSelect,
            };
        }
    
        static get properties() {
            return {
                ...super.properties,
                lang: {type: String},
                entryPointUrl: {type: String, attribute: 'entry-point-url'},
                noAuth: {type: Boolean, attribute: 'no-auth'},
            };
        }
    
        static get styles() {
            // language=css
            return [
                commonStyles.getThemeCSS(),
                commonStyles.getGeneralCSS(),
                css`
                    h1.title {
                        margin-bottom: 1em;
                    }
                    div.container {
                        margin-bottom: 1.5em;
                    }
                `,
            ];
        }
    
        update(changedProperties) {
            if (changedProperties.has('lang')) {
                this._i18n.changeLanguage(this.lang);
            }
            super.update(changedProperties);
        }
    
        getAuthComponentHtml() {
            return this.noAuth
                ? html`
                      <dbp-login-button subscribe="auth" lang="${this.lang}"></dbp-login-button>
                  `
                : html`
                      <div class="container">
                          <dbp-auth-keycloak
                              subscribe="requested-login-status"
                              lang="${this.lang}"
                              entry-point-url="${this.entryPointUrl}"
                              silent-check-sso-redirect-uri="/dist/silent-check-sso.html"
                              url="https://auth-dev.tugraz.at/auth"
                              realm="tugraz-vpu"
                              client-id="auth-dev-mw-frontend-local"
                              try-login></dbp-auth-keycloak>
                          <dbp-login-button subscribe="auth" lang="${this.lang}"></dbp-login-button>
                      </div>
                  `;
        }
    
        render() {
            return html`
                <section class="section">
                    <div class="container">
                        <h1 class="title">Person-Select-Demo</h1>
                    </div>
                    ${this.getAuthComponentHtml()}
                    <div class="container">
                        <form>
                            <div class="field">
                                <label class="label">Person 1</label>
                                <div class="control">
                                    <dbp-person-select
                                        subscribe="auth"
                                        lang="${this.lang}"
                                        entry-point-url="${this.entryPointUrl}"></dbp-person-select>
                                </div>
                            </div>
                            <div class="field">
                                <label class="label">Person 2</label>
                                <div class="control">
                                    <dbp-person-select
                                        subscribe="auth"
                                        lang="${this.lang}"
                                        entry-point-url="${this.entryPointUrl}"
                                        show-reload-button
                                        reload-button-title="Click me"></dbp-person-select>
                                </div>
                            </div>
                            <div class="field">
                                <label class="label">Person 3 unsubscribed</label>
                                <div class="control">
                                    <dbp-person-select
                                        lang="${this.lang}"
                                        entry-point-url="${this.entryPointUrl}"
                                        show-reload-button
                                        reload-button-title="Click me"></dbp-person-select>
                                </div>
                                <p>
                                    This component doesn't get any notification about user's login and
                                    will become active.
                                </p>
                            </div>
                        </form>
                    </div>
                </section>
            `;
        }
    }
    
    commonUtils.defineCustomElement('dbp-person-select-demo', PersonSelectDemo);