123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162 |
- import { h } from '@stencil/core';
- export class PWACameraModal {
- constructor() {
- this.handlePhoto = async (photo) => {
- this.onPhoto.emit(photo);
- };
- this.handleNoDeviceError = async (photo) => {
- this.noDeviceError.emit(photo);
- };
- this.facingMode = 'user';
- this.hidePicker = false;
- this.noDevicesText = 'No camera found';
- this.noDevicesButtonText = 'Choose image';
- }
- handleBackdropClick(e) {
- if (e.target !== this.el) {
- this.onPhoto.emit(null);
- }
- }
- handleComponentClick(e) {
- e.stopPropagation();
- }
- handleBackdropKeyUp(e) {
- if (e.key === "Escape") {
- this.onPhoto.emit(null);
- }
- }
- render() {
- return (h("div", { class: "wrapper", onClick: e => this.handleBackdropClick(e) }, h("div", { class: "content" }, h("pwa-camera", { onClick: e => this.handleComponentClick(e), facingMode: this.facingMode, hidePicker: this.hidePicker, handlePhoto: this.handlePhoto, handleNoDeviceError: this.handleNoDeviceError, noDevicesButtonText: this.noDevicesButtonText, noDevicesText: this.noDevicesText }))));
- }
- static get is() { return "pwa-camera-modal-instance"; }
- static get encapsulation() { return "shadow"; }
- static get originalStyleUrls() {
- return {
- "$": ["camera-modal-instance.css"]
- };
- }
- static get styleUrls() {
- return {
- "$": ["camera-modal-instance.css"]
- };
- }
- static get properties() {
- return {
- "facingMode": {
- "type": "string",
- "mutable": false,
- "complexType": {
- "original": "string",
- "resolved": "string",
- "references": {}
- },
- "required": false,
- "optional": false,
- "docs": {
- "tags": [],
- "text": ""
- },
- "attribute": "facing-mode",
- "reflect": false,
- "defaultValue": "'user'"
- },
- "hidePicker": {
- "type": "boolean",
- "mutable": false,
- "complexType": {
- "original": "boolean",
- "resolved": "boolean",
- "references": {}
- },
- "required": false,
- "optional": false,
- "docs": {
- "tags": [],
- "text": ""
- },
- "attribute": "hide-picker",
- "reflect": false,
- "defaultValue": "false"
- },
- "noDevicesText": {
- "type": "string",
- "mutable": false,
- "complexType": {
- "original": "string",
- "resolved": "string",
- "references": {}
- },
- "required": false,
- "optional": false,
- "docs": {
- "tags": [],
- "text": ""
- },
- "attribute": "no-devices-text",
- "reflect": false,
- "defaultValue": "'No camera found'"
- },
- "noDevicesButtonText": {
- "type": "string",
- "mutable": false,
- "complexType": {
- "original": "string",
- "resolved": "string",
- "references": {}
- },
- "required": false,
- "optional": false,
- "docs": {
- "tags": [],
- "text": ""
- },
- "attribute": "no-devices-button-text",
- "reflect": false,
- "defaultValue": "'Choose image'"
- }
- };
- }
- static get events() {
- return [{
- "method": "onPhoto",
- "name": "onPhoto",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": {
- "tags": [],
- "text": ""
- },
- "complexType": {
- "original": "any",
- "resolved": "any",
- "references": {}
- }
- }, {
- "method": "noDeviceError",
- "name": "noDeviceError",
- "bubbles": true,
- "cancelable": true,
- "composed": true,
- "docs": {
- "tags": [],
- "text": ""
- },
- "complexType": {
- "original": "any",
- "resolved": "any",
- "references": {}
- }
- }];
- }
- static get elementRef() { return "el"; }
- static get listeners() {
- return [{
- "name": "keyup",
- "method": "handleBackdropKeyUp",
- "target": "body",
- "capture": false,
- "passive": false
- }];
- }
- }
|