Skip to content
Snippets Groups Projects
Select Git revision
  • 82715f4f5ca52254188084cb72a001c139d86373
  • 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

dbp-qr-code-scanner-demo.js

Blame
  • dbp-qr-code-scanner-demo.js 1.82 KiB
    import {i18n} from './i18n';
    import {css, html, LitElement} from 'lit-element';
    import {ScopedElementsMixin} from '@open-wc/scoped-elements';
    import * as commonUtils from 'dbp-common/utils';
    import * as commonStyles from "dbp-common/styles";
    import {QrCodeScanner} from './qr-code-scanner.js';
    
    export class QrCodeScannerDemo extends ScopedElementsMixin(LitElement) {
        constructor() {
            super();
            this.lang = 'de';
        }
    
        static get scopedElements() {
            return {
                'dbp-qr-code-scanner': QrCodeScanner,
            };
          }
    
        static get properties() {
            return {
                lang: { type: String },
            };
        }
    
        connectedCallback() {
            super.connectedCallback();
            i18n.changeLanguage(this.lang);
    
            this.updateComplete.then(()=>{
            });
        }
    
        static get styles() {
            // language=css
            return css`        
                ${commonStyles.getThemeCSS()}
                ${commonStyles.getGeneralCSS()}
                ${commonStyles.getButtonCSS()}
                
                h1{
                    margin-bottom: 20px;
                }
                
                .section{
                    margin-bottom: 50px;
                }
            `;
        }
    
        render() {
            return html`
                 <section class="section">
                    <div class="container">
                        <h1 class="title">QR-Code-Scanner-Demo</h1>
                    </div>
                    <div class="container">
                        <div class="columns is-centered">
                            <div class="column">
                                <dbp-qr-code-scanner show-output lang="${this.lang}"></dbp-qr-code-scanner>
                            </div>
                        </div>
                    </div>
                </section>
            `;
        }
    }
    
    commonUtils.defineCustomElement('dbp-qr-code-scanner-demo', QrCodeScannerDemo);