OwlCyberSecurity - MANAGER
Edit File: presto-cta-overlay-ui.cjs.entry.js.map
{"file":"presto-cta-overlay-ui.entry.cjs.js","mappings":"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","names":["fitText","h"],"sources":["src/components/core/features/presto-cta-overlay/ui/presto-cta-overlay-ui.scss?tag=presto-cta-overlay-ui&encapsulation=shadow","src/components/core/features/presto-cta-overlay/ui/presto-cta-overlay-ui.tsx"],"sourcesContent":[":host {\n display: block;\n font-size: 16px;\n width: 100%;\n height: 100%;\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n width: 100%;\n height: 100%;\n z-index: 99999;\n user-select: none;\n}\n\n* {\n box-sizing: border-box;\n}\n\n$family: 'San Francisco', -apple-system, BlinkMacSystemFont, '.SFNSText-Regular', Avenir, 'Avenir Next', 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif;\n\na {\n color: #fff;\n}\n\n.wrapper {\n height: 100%;\n position: relative;\n color: #fff;\n font-family: var(--plyr-font-family, $family);\n}\n.overlay {\n position: relative;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 48px;\n height: 100%;\n\n &.has-link {\n cursor: pointer;\n }\n\n &:before {\n content: '';\n border-radius: var(--presto-player-border-radius, 0);\n opacity: var(--presto-player-cta-background-opacity, 0.75);\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n background-color: var(--presto-player-cta-background, #000);\n z-index: -1;\n box-shadow: inset 0 0 100px black;\n }\n}\n\n.content {\n width: 80%;\n max-width: 600px;\n\n & * ~ * {\n margin-top: 22px;\n }\n}\n\nbutton {\n background: var(--plyr-color-main, #000);\n appearance: none;\n padding: 6px 12px;\n align-items: center;\n display: inline-flex;\n border-width: 1px;\n border-color: transparent;\n color: #fff;\n border-radius: 0;\n cursor: pointer;\n font-size: 0.8em;\n border-radius: 0 var(--presto-player-cta-border-radius, 0) var(--presto-player-cta-border-radius) 0;\n\n @media screen and (min-width: 700px) {\n padding: 10px 18px;\n }\n\n &:focus {\n box-shadow: rgb(255, 255, 255) 0px 0px 0px 2px, var(--plyr-color-main, #000) 0px 0px 0px 4px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;\n z-index: 1;\n }\n &:focus,\n &:hover {\n outline: none;\n }\n}\n\nh1 {\n font-size: 1.5em;\n font-weight: 500;\n margin: 0;\n line-height: 1.1em;\n}\n\n.skip,\n.rewatch {\n font-size: 0.8em;\n font-weight: 600;\n position: absolute;\n top: 0;\n right: 0;\n padding: 4%;\n cursor: pointer;\n}\n\n.rewatch {\n display: inline-flex;\n align-items: center;\n right: auto;\n left: 0;\n\n .icon {\n margin-right: 5px;\n }\n}\n\np {\n font-size: 0.85em;\n margin: 0;\n margin-top: 1.5em;\n line-height: 1.4em;\n opacity: 0.75;\n\n &.is-small {\n font-size: 0.85em;\n margin: 1.5em 0px 0px;\n line-height: 0.1em;\n opacity: 0.75;\n }\n}\n\n.is-centered {\n text-align: center;\n}\n","import { Component, Event, EventEmitter, h, Prop, State } from '@stencil/core';\nimport { ButtonLinkObject, i18nConfig } from '../../../../../interfaces';\nimport fitText from '../../../../../library/fittext.js';\n\n@Component({\n tag: 'presto-cta-overlay-ui',\n styleUrl: 'presto-cta-overlay-ui.scss',\n shadow: true,\n})\nexport class CTAOverlayUI {\n private textInput?: HTMLInputElement;\n\n /**\n * Props\n */\n @Prop() headline: string;\n @Prop() defaultHeadline: string;\n @Prop() bottomText: string;\n @Prop() showButton: boolean;\n @Prop() buttonText: string;\n @Prop() buttonType: 'link' | 'time';\n @Prop() buttonLink: ButtonLinkObject;\n @Prop() allowRewatch: boolean;\n @Prop() allowSkip: boolean;\n @Prop() direction?: 'rtl';\n @Prop() i18n: i18nConfig;\n @Prop() provider: string;\n @Prop() type: string;\n\n /**\n * State\n */\n @State() isAudioProvider: boolean;\n\n /**\n * Events\n */\n @Event() skip: EventEmitter<void>;\n @Event() rewatch: EventEmitter<void>;\n\n /**\n * Shrink text.\n */\n componentDidLoad() {\n let currentType = this.type || this.provider;\n this.isAudioProvider = currentType === 'audio' ? true : false;\n fitText(this.textInput, 3, {\n maxFontSize: this.isAudioProvider === true ? 15 : 20,\n minFontSize: 8,\n });\n }\n\n handleCTAClick(e) {\n if (!this.buttonLink?.url) {\n return;\n }\n e.preventDefault();\n e.stopPropagation();\n this.handleLink();\n }\n\n handleLink() {\n if (this.buttonLink?.opensInNewTab) {\n window.open(this.buttonLink?.url, '_blank');\n } else {\n window.location.href = this.buttonLink?.url;\n }\n }\n\n render() {\n return (\n <div class=\"wrapper\" ref={el => (this.textInput = el as HTMLInputElement)}>\n <div onClick={e => this.handleCTAClick(e)} class={`overlay ${this.direction === 'rtl' ? 'rtl' : ''} ${this.buttonLink?.url ? 'has-link' : ''}`}>\n <div class={this.isAudioProvider ? 'content is-centered' : 'content'}>\n <h1 part=\"cta-headline\">{this.headline || this.defaultHeadline}</h1>\n {this.bottomText && <p class={this.isAudioProvider && 'is-small'} part=\"cta-bottom-text\" innerHTML={this.bottomText}></p>}\n {this.showButton && (\n <presto-player-button\n full\n onClick={e => this.handleCTAClick(e)}\n part=\"cta-button\"\n href={this?.buttonLink?.url}\n target={this?.buttonLink?.opensInNewTab ? '_blank' : '_self'}\n class=\"button\"\n type=\"primary\"\n >\n {this.buttonText}\n </presto-player-button>\n )}\n </div>\n </div>\n {!!this.allowRewatch && (\n <div\n class=\"rewatch\"\n onClick={e => {\n e.preventDefault();\n e.stopImmediatePropagation();\n this.rewatch.emit();\n }}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"currentColor\"\n stroke-width=\"3\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n class=\"icon icon-corner-up-left\"\n >\n <polyline points=\"9 14 4 9 9 4\"></polyline>\n <path d=\"M20 20v-7a4 4 0 0 0-4-4H4\"></path>\n </svg>\n {this?.i18n?.rewatch}\n </div>\n )}\n {!!this.allowSkip && (\n <div\n class=\"skip\"\n onClick={e => {\n e.preventDefault();\n this.skip.emit();\n }}\n >\n {this?.i18n?.skip} →\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}