@larva.io/webcomponents
Version:
Fentrica SmartUnits WebComponents package
573 lines (572 loc) • 20.2 kB
JavaScript
/*!
* (C) Fentrica http://fentrica.com - Seee LICENSE.md
*/
import { h, getAssetPath } from "@stencil/core";
import { has } from "lodash";
import { getAssetsCacheMap } from "../../utils/assets-helper";
export class LarvaIntercom {
constructor() {
/////// LarvaNode base properties
/**
* Component main icon
*/
this.icon = 'intercom';
/**
* The color to use from your application's color palette.
* Detrouble options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
*/
this.color = 'primary';
/**
* Disable quck actions
*/
this.disableQuickActions = false;
/**
* Is logging for this component enabled (lar-log subcomponent loaded)
*/
this.log = false;
/**
* Try to play ring sound if ringing
* Please note that you may get DOMException: play() failed because the user didn't interact with the document first
* in webkit audio must be handled externally or user interaction policy needs to be disabled
*/
this.playSound = false;
/**
* Node size
*/
this.nodeSize = 'default';
/////// LarvaNode base properties and events - end
/**
* Use upstream proxy for cameras
*/
this.useUplinkProxy = true;
this.loading = true;
this.buttons = [];
this.ring = false;
}
async componentDidRender() {
if (this.ring === true) {
const modal = await this.node.getModalComponent();
if (modal) {
return;
}
if (this.playSound) {
try {
const cachedFile = getAssetsCacheMap().get(`doorbell.mp3`);
const file = cachedFile ? cachedFile : getAssetPath(`./assets/doorbell.mp3`);
const player = new Audio(file);
await player.play();
}
catch (err) {
console.error(err);
}
}
await this.node.openModal();
}
}
componentWillLoad() {
this.output.emit();
}
componentDidLoad() {
const el = this.el.shadowRoot || this.el;
this.node = el.querySelector('lar-node');
}
/**
* Larva error input
*/
async error(data) {
if (this.node) {
this.node.error(data);
}
this.loading = false;
}
/**
* Larva input message
*/
async input(data) {
this.loading = false;
// config data
if (has(data, 'camera')) {
this.camera = data.camera;
}
// we have upstream ready
// notify component that it can start streaming
if (has(data, 'upstream')) {
const modalComponent = await this.node.getModalComponent();
if (modalComponent === null || modalComponent === void 0 ? void 0 : modalComponent.element) {
await modalComponent.element.open();
}
}
if (has(data, 'sip')) {
this.sip = data.sip;
}
if (has(data, 'buttons') && Array.isArray(data.buttons)) {
this.buttons = data.buttons;
}
// somebody has pressed ring button?
this.ring = has(data, 'ring') && data.ring === true;
}
handleOutoput(data) {
this.output.emit(data);
}
render() {
const componentProps = {
onOutput: (data) => this.handleOutoput(data.detail),
onLoading: (data) => this.loading = data.detail,
disabled: this.loading,
camera: this.camera,
useUplinkProxy: this.useUplinkProxy,
buttons: this.buttons,
sip: this.sip,
server: this.server,
ring: this.ring,
colorInputs: this.colorInputs || this.color,
};
return [
h("lar-node", { key: '02049bc5382fccb05da5cfb2ba91afd362082cca', icon: this.icon, hideTitles: this.hideTitles, color: this.color, supTitle: this.supTitle, mainTitle: this.mainTitle, subTitle: this.subTitle, colorModal: this.colorModal, colorInputs: this.colorInputs, colorIconSmall: this.colorIconSmall, nodeSize: this.nodeSize, loading: this.loading, headerSizeModal: this.camera ? 'small' : 'default', log: this.log, component: "lar-intercom-content", componentProps: componentProps }, h("slot", { key: 'a8e20bae3f747ab31b371805770c3a064a3bad75' }))
];
}
static get is() { return "lar-intercom"; }
static get encapsulation() { return "shadow"; }
static get originalStyleUrls() {
return {
"$": ["intercom.scss"]
};
}
static get styleUrls() {
return {
"$": ["intercom.css"]
};
}
static get assetsDirs() { return ["assets"]; }
static get properties() {
return {
"icon": {
"type": "string",
"mutable": true,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Component main icon"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "icon",
"defaultValue": "'intercom'"
},
"color": {
"type": "string",
"mutable": true,
"complexType": {
"original": "Color",
"resolved": "string",
"references": {
"Color": {
"location": "import",
"path": "../../interface",
"id": "src/interface.d.ts::Color"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "The color to use from your application's color palette.\nDetrouble options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "color",
"defaultValue": "'primary'"
},
"colorModal": {
"type": "string",
"mutable": true,
"complexType": {
"original": "Color",
"resolved": "string",
"references": {
"Color": {
"location": "import",
"path": "../../interface",
"id": "src/interface.d.ts::Color"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "The color to use from your application's color palette for Components modal window."
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "color-modal"
},
"colorInputs": {
"type": "string",
"mutable": true,
"complexType": {
"original": "Color",
"resolved": "string",
"references": {
"Color": {
"location": "import",
"path": "../../interface",
"id": "src/interface.d.ts::Color"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "The color to use from your application's color palette for inputs"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "color-inputs"
},
"colorIconSmall": {
"type": "string",
"mutable": false,
"complexType": {
"original": "Color",
"resolved": "string",
"references": {
"Color": {
"location": "import",
"path": "../../interface",
"id": "src/interface.d.ts::Color"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "The color to use from your application's color palette for indication icon"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "color-icon-small"
},
"disableQuickActions": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "Disable quck actions"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "disable-quick-actions",
"defaultValue": "false"
},
"hideTitles": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Hide node titles"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "hide-titles"
},
"supTitle": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Component superscript title"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "sup-title"
},
"subTitle": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Component subtitle"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "sub-title"
},
"log": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "Is logging for this component enabled (lar-log subcomponent loaded)"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "log",
"defaultValue": "false"
},
"playSound": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "Try to play ring sound if ringing\nPlease note that you may get DOMException: play() failed because the user didn't interact with the document first\nin webkit audio must be handled externally or user interaction policy needs to be disabled"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "play-sound",
"defaultValue": "false"
},
"mainTitle": {
"type": "string",
"mutable": false,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": true,
"optional": false,
"docs": {
"tags": [],
"text": "Component main title"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "main-title"
},
"nodeSize": {
"type": "string",
"mutable": false,
"complexType": {
"original": "Size",
"resolved": "\"default\" | \"small\"",
"references": {
"Size": {
"location": "import",
"path": "../../interface",
"id": "src/interface.d.ts::Size"
}
}
},
"required": false,
"optional": true,
"docs": {
"tags": [],
"text": "Node size"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "node-size",
"defaultValue": "'default'"
},
"useUplinkProxy": {
"type": "boolean",
"mutable": false,
"complexType": {
"original": "boolean",
"resolved": "boolean",
"references": {}
},
"required": false,
"optional": false,
"docs": {
"tags": [],
"text": "Use upstream proxy for cameras"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "use-uplink-proxy",
"defaultValue": "true"
},
"server": {
"type": "string",
"mutable": true,
"complexType": {
"original": "string",
"resolved": "string",
"references": {}
},
"required": true,
"optional": false,
"docs": {
"tags": [],
"text": "server for cameras"
},
"getter": false,
"setter": false,
"reflect": false,
"attribute": "server"
}
};
}
static get states() {
return {
"loading": {},
"camera": {},
"sip": {},
"buttons": {},
"ring": {}
};
}
static get events() {
return [{
"method": "output",
"name": "output",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [{
"name": "see",
"text": "{@link ../readme.md} chapter \"Components input and output\" for further information."
}],
"text": ""
},
"complexType": {
"original": "any",
"resolved": "any",
"references": {}
}
}, {
"method": "request",
"name": "request",
"bubbles": true,
"cancelable": true,
"composed": true,
"docs": {
"tags": [{
"name": "see",
"text": "{@link ../readme.md} chapter \"Sub-Components requests and responses\" for further information."
}],
"text": ""
},
"complexType": {
"original": "any",
"resolved": "any",
"references": {}
}
}];
}
static get methods() {
return {
"error": {
"complexType": {
"signature": "(data: any) => Promise<void>",
"parameters": [{
"name": "data",
"type": "any",
"docs": ""
}],
"references": {
"Promise": {
"location": "global",
"id": "global::Promise"
}
},
"return": "Promise<void>"
},
"docs": {
"text": "Larva error input",
"tags": []
}
},
"input": {
"complexType": {
"signature": "(data: DataIn) => Promise<void>",
"parameters": [{
"name": "data",
"type": "DataIn",
"docs": ""
}],
"references": {
"Promise": {
"location": "global",
"id": "global::Promise"
},
"DataIn": {
"location": "import",
"path": "./intercom-interface",
"id": "src/components/intercom/intercom-interface.tsx::DataIn"
},
"HTMLLarIntercomContentElement": {
"location": "global",
"id": "global::HTMLLarIntercomContentElement"
}
},
"return": "Promise<void>"
},
"docs": {
"text": "Larva input message",
"tags": []
}
}
};
}
static get elementRef() { return "el"; }
}
//# sourceMappingURL=intercom.js.map