import { h } from '@stencil/core';
import screenfull from 'screenfull';
import { _t } from '../i18n/i18n';
export class Fullscreen {
    constructor() {
        this.fullscreen = false;
    }
    componentDidLoad() {
        screenfull.on('change', () => this.fullscreen = screenfull.isFullscreen);
    }
    toggleFullscreen() {
        (screenfull.isFullscreen) ? screenfull.exit() : screenfull.request();
    }
    render() {
        let title = (this.fullscreen) ?
            _t('webmapgl.fullscreen.exit') : _t('webmapgl.fullscreen.enter');
        if (screenfull.enabled)
            return (h("ion-button", { onClick: this.toggleFullscreen.bind(this), title: title },
                h("ion-icon", { slot: "icon-only", name: (this.fullscreen) ? 'contract' : 'expand' })));
    }
    static get is() { return "gl-fullscreen"; }
    static get states() { return {
        "fullscreen": {}
    }; }
}
