{"version":3,"sources":["webpack:///../WCC.UI/App/components/attachments/video/video.html?5e0f","webpack:///../WCC.UI/App/components/attachments/video/video.scss?94cb","webpack:///../WCC.UI/App/components/attachments/video/video.ts","webpack:///../WCC.UI/App/managers/videoOverlay.ts","webpack:///../WCC.UI/App/webpack/runtime/htmlExposer.js","webpack:///../WCC.UI/App/components/attachments/video/video.scss","webpack:///../WCC.UI/App/components/attachments/video/video.html"],"names":["content","expose","__esModule","default","api","module","i","options","exports","locals","components","preload","videoFileTypes","enums","UserFileTypes","OriginalVideo","value","LQVideo","HQVideo","WCCVideoVM","constructor","videoOrConfig","info","effects","video","cover","labels","thumbnailIcon","iconScale","isThumbnailLoaded","ko","observable","WCCVideo","width","height","NodeTracker","node","element","this","isCompact","pureComputed","isTiny","flattenComputed","thumbnail","pluck","v","thumbnailURL","th","link","icon","hasContent","hasThumbnail","isNotNull","undefined","hqFile","ratio","AttachmentsHelpers","getRatio","unwrap","applyBindingsToNode","click","showVideo","not","system","toPercents","invokeNotNull","register","async","stage","videoOverlayManager","show","close","videoFiles","files","filter","file","includes","type","length","videoFile","preview","FilesHelpers","getVideoPreview","blob","loadAsBlob","name","src","__decorate","injectable","__param","inject","wccModules","componentConfig","componentInfo","overlayManager","toOverlay","data","buttons","SystemHelpers","html","getTemplatesAndResources","forEach","document","head","appendChild","___CSS_LOADER_API_IMPORT___","push"],"mappings":"2IAAA,UAAO,CACC,2GACA,wDAIC,KAJ4C,EAAF,SAAYA,EAASC,GAG5D,OADAA,EADAD,EAAUA,EAAQE,WAAaF,EAAQG,QAAUH,GAE1CA,GACV,4B,wECNT,IAAII,EAAM,EAAQ,gFACFJ,EAAU,EAAQ,sJAIC,iBAFvBA,EAAUA,EAAQE,WAAaF,EAAQG,QAAUH,KAG/CA,EAAU,CAAC,CAACK,EAAOC,EAAIN,EAAS,MAG9C,IAAIO,EAAU,CAEd,OAAiB,OACjB,WAAoB,GAEPH,EAAIJ,EAASO,GAI1BF,EAAOG,QAAUR,EAAQS,QAAU,I,8iCCNnCC,EAAWC,QAAQ,iBAAkB,aAErC,MAAMC,EAAiB,CACnBC,EAAMC,cAAcC,cAAcC,MAClCH,EAAMC,cAAcG,QAAQD,MAC5BH,EAAMC,cAAcI,QAAQF,OAShC,IAAqBG,EAArB,MAkBIC,YACwCC,EACFC,EACEC,GAEpC,IAAIC,EACAC,EAHgC,KAAAF,UAlBxC,KAAAG,OAASA,EACT,KAAAC,cAAgB,cAChB,KAAAC,UAAY,IAEZ,KAAAC,kBAAoBC,EAAGC,YAAW,GAmB1BV,aAAyBW,IACzBR,EAAQH,GAERG,EAAQH,EAAcG,MACtBC,EAAQJ,EAAcI,OAG1B,MAAM,MAAEQ,EAAK,OAAEC,GAAW,IAAIC,cAAY,CAAEC,KAAmBd,EAAKe,UACpEC,KAAKC,UAAYT,EAAGU,aAAa,IAAMP,IAAU,KAAOC,IAAW,KACnEI,KAAKG,OAASX,EAAGU,aAAa,IAAMP,IAAU,KAAOC,IAAW,KAEhEI,KAAKd,MAAQM,EAAGY,gBAAgBlB,GAChCc,KAAKb,MAAQA,EAEb,MAAMkB,EAAYL,KAAKd,MAAMoB,MAAMC,GAAKA,EAAEF,WAC1CL,KAAKQ,aAAeH,EAAUC,MAAMG,GAAMA,EAAGC,MAC7CV,KAAKW,KAAOnB,EAAGU,aAAqB,IAAMF,KAAKY,aAAe,cAAgB,gBAE9EZ,KAAKa,aAAeb,KAAKQ,aAAaM,YACtCd,KAAKY,WAAaZ,KAAKd,MAAMoB,MAAMpB,GAA2B6B,MAAlB7B,EAAM8B,UAAuB,GAEzE,MAAMC,EAAQzB,EAAGU,aAAa,IAAMgB,qBAAmBC,SAAS,EAAG,EAAG3B,EAAG4B,OAAOjC,KAEhFK,EAAG6B,oBAAoBrC,EAAKe,QAAS,CACjC,MAASuB,IAAMtB,KAAKuB,YAEpB,IAAO,CACH,aAAa,EACb,0BAA2BvB,KAAKY,WAChC,qBAAsBZ,KAAKC,UAC3B,kBAAmBD,KAAKG,OACxB,qBAAsBH,KAAKa,aAAaW,OAG5C,MAAS,CACL,cAAehC,EAAGU,aAAa,IAAMF,KAAKT,yBAAsBwB,EAAYU,EAAOC,WAAWT,SAKlGM,YACAvB,KAAKY,cACLZ,KAAKd,MAAMyC,cAAczC,IACrBc,KAAKf,QAAQ2C,SAASC,UAClB,MAAMC,QAAcC,IAAoBC,KAAK9C,GAE7C,MAAO,IAAM4C,EAAMG,YAM3B,4BAA4B/C,GAChC,MAAMgD,EAAahD,EAAMiD,QAAQC,OAAOC,GAAQ/D,EAAegE,SAAiBD,EAAKE,SAErF,GAAIL,EAAWM,OAAS,EAAG,CACvB,MAAMC,EAAYP,EAAW,GACvBQ,QAAgBC,eAAaC,gBAAgB,CAC/CC,WAAYF,eAAaG,WAAmBL,EAAU/B,QACtDqC,KAAcN,EAAUM,SAG5B,GAAehC,MAAX2B,EACA,OAAOA,EAAQM,OAzFVnE,EAAUoE,EAAA,CAD9BC,cAoBQC,EAAA,EAAAC,YAAOC,IAAWC,kBAClBH,EAAA,EAAAC,YAAOC,IAAWE,gBAClBJ,EAAA,EAAAC,YAAOC,IAAWpE,WArBNJ,gB,gUC1BrB,yDAGAT,EAAWC,QAAQ,uBAanB,MAAM0D,EAAsB,IAXtB,MACFjD,eAEA,WAAWI,GACP,aAAasE,UAAeC,UAAU,oEAAqE,CACvGC,KAAMxE,EACNyE,QAAS,CAAC,aAOP5B,Q,iJClBf,WAOC,KAPD,aACI,MAAMN,EAAS,EAAQ,mCAAkBmC,cAEzC,OAAO,SAAUC,GACbpC,EAAOqC,yBAAyBD,GAC3BE,SAAQ,SAAUjE,GAAQkE,SAASC,KAAKC,YAAYpE,QAEhE,+B,sKCLD5B,EADkC,EAAQ,wDAChCiG,EAA4B,IAE9BC,KAAK,CAACrG,EAAOC,EAAI,stGAAutG,KAEhvGD,EAAOG,QAAUA,G,sHCHjBH,EAAOG,QAFI","file":"234.e21f2e356991b16117f0.js","sourcesContent":["define([\n        \"!!../../../../node_modules/html-loader/dist/cjs.js??ref--26-1!./video.html\", \n        \"!../../../webpack/runtime/htmlExposer.js\"], function (content, expose) {\n            content = content.__esModule ? content.default : content;\n            expose(content);\n            return content;\n        });","var api = require(\"!../../../../node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js\");\n            var content = require(\"!!../../../../node_modules/css-loader/dist/cjs.js!../../../../node_modules/sass-loader/dist/cjs.js!./video.scss\");\n\n            content = content.__esModule ? content.default : content;\n\n            if (typeof content === 'string') {\n              content = [[module.id, content, '']];\n            }\n\nvar options = {};\n\noptions.insert = \"head\";\noptions.singleton = false;\n\nvar update = api(content, options);\n\n\n\nmodule.exports = content.locals || {};","import { wccModules } from 'enums/wccModules';\r\nimport { AttachmentsHelpers } from 'helpers/attachments';\r\nimport { FilesHelpers } from 'helpers/files';\r\nimport { inject, injectable } from 'inversify';\r\nimport { Subscribable, SubscribableOrNullableValue } from 'knockout';\r\nimport { NodeTracker } from 'managers/nodes/tracker';\r\nimport videoOverlayManager from 'managers/videoOverlay';\r\nimport { EffectsContainer } from 'mixins/withEffects';\r\nimport WCCVideo from 'models/attachments/video';\r\nimport './video.html';\r\nimport './video.scss';\r\n\r\ncomponents.preload('wcc-fluid-icon', 'wcc-image');\r\n\r\nconst videoFileTypes = [\r\n    enums.UserFileTypes.OriginalVideo.value,\r\n    enums.UserFileTypes.LQVideo.value,\r\n    enums.UserFileTypes.HQVideo.value\r\n]\r\n\r\ninterface WCCVideoConfig {\r\n    video: SubscribableOrNullableValue<WCCVideo>\r\n    cover: SubscribableOrNullableValue<boolean | number>\r\n}\r\n\r\n@injectable()\r\nexport default class WCCVideoVM {\r\n    private video: Subscribable<WCCVideo | undefined>\r\n\r\n    labels = labels;\r\n    thumbnailIcon = 'fal fa-film';\r\n    iconScale = 0.15;\r\n\r\n    isThumbnailLoaded = ko.observable(false);\r\n\r\n    thumbnailURL: Subscribable<string | undefined>\r\n    icon: Subscribable<string>\r\n    cover: SubscribableOrNullableValue<boolean | number>\r\n\r\n    hasThumbnail: Subscribable<boolean>\r\n    hasContent: Subscribable<boolean>\r\n    isCompact: Subscribable<boolean>\r\n    isTiny: Subscribable<boolean>\r\n    \r\n    constructor(\r\n        @inject(wccModules.componentConfig) videoOrConfig: WCCVideo | WCCVideoConfig,\r\n        @inject(wccModules.componentInfo) info: ko.components.ComponentInfo,\r\n        @inject(wccModules.effects) private effects: EffectsContainer\r\n    ) {\r\n        let video: SubscribableOrNullableValue<WCCVideo>\r\n        let cover: SubscribableOrNullableValue<boolean | number>\r\n\r\n        if (videoOrConfig instanceof WCCVideo) {\r\n            video = videoOrConfig;\r\n        } else {\r\n            video = videoOrConfig.video;\r\n            cover = videoOrConfig.cover;\r\n        }\r\n\r\n        const { width, height } = new NodeTracker({ node: <HTMLElement>info.element });\r\n        this.isCompact = ko.pureComputed(() => width() < 150 || height() < 150);\r\n        this.isTiny = ko.pureComputed(() => width() < 100 || height() < 100);\r\n\r\n        this.video = ko.flattenComputed(video);\r\n        this.cover = cover;\r\n\r\n        const thumbnail = this.video.pluck(v => v.thumbnail);\r\n        this.thumbnailURL = thumbnail.pluck(th => th.link);\r\n        this.icon = ko.pureComputed<string>(() => this.hasContent() ? 'fal fa-play' : 'far fa-clock');\r\n\r\n        this.hasThumbnail = this.thumbnailURL.isNotNull();\r\n        this.hasContent = this.video.pluck(video => video.hqFile() != undefined, false);\r\n\r\n        const ratio = ko.pureComputed(() => AttachmentsHelpers.getRatio(0, 0, ko.unwrap(cover)));\r\n\r\n        ko.applyBindingsToNode(info.element, {\r\n            'click': () => this.showVideo(),\r\n\r\n            'css': {\r\n                'wcc-video': true,\r\n                'wcc-video--with-content': this.hasContent,\r\n                'wcc-video--compact': this.isCompact,\r\n                'wcc-video--tiny': this.isTiny,\r\n                'wcc-video--pending': this.hasThumbnail.not()\r\n            },\r\n\r\n            'style': {\r\n                'padding-top': ko.pureComputed(() => this.isThumbnailLoaded() ? undefined : system.toPercents(ratio()))\r\n            }\r\n        });\r\n    }\r\n\r\n    private showVideo() {\r\n        if (this.hasContent()) {\r\n            this.video.invokeNotNull(video => {\r\n                this.effects.register(async () => {\r\n                    const stage = await videoOverlayManager.show(video);\r\n\r\n                    return () => stage.close();\r\n                });\r\n            });\r\n        }\r\n    }\r\n\r\n    private async generateThumbnailLink(video: WCCVideo) {\r\n        const videoFiles = video.files().filter(file => videoFileTypes.includes(<number>file.type()));\r\n\r\n        if (videoFiles.length > 0) {\r\n            const videoFile = videoFiles[0];\r\n            const preview = await FilesHelpers.getVideoPreview({\r\n                blob: await FilesHelpers.loadAsBlob(<string>videoFile.link()),\r\n                name: <string>videoFile.name()\r\n            });\r\n\r\n            if (preview != undefined)\r\n                return preview.src;            \r\n        }\r\n    }\r\n}","import overlayManager from 'managers/overlay';\r\nimport WCCVideo from 'models/attachments/video';\r\n\r\ncomponents.preload('video-overlay-stage');\r\n\r\nexport class VideoOverlayManager {\r\n    constructor() { }\r\n\r\n    async show(video: WCCVideo) {\r\n        return await overlayManager.toOverlay('<video-overlay-stage params=\"model: $data\"></video-overlay-stage>', {\r\n            data: video,\r\n            buttons: ['close']\r\n        });\r\n    }\r\n}\r\n\r\nconst videoOverlayManager = new VideoOverlayManager();\r\n\r\nexport default videoOverlayManager;","define(function () {\r\n    const system = require('helpers/system').SystemHelpers;\r\n\r\n    return function (html) {\r\n        system.getTemplatesAndResources(html)\r\n            .forEach(function (node) { document.head.appendChild(node) });\r\n    }\r\n});","// Imports\nvar ___CSS_LOADER_API_IMPORT___ = require(\"../../../../node_modules/css-loader/dist/runtime/api.js\");\nexports = ___CSS_LOADER_API_IMPORT___(false);\n// Module\nexports.push([module.id, \".wcc-video{display:block;border-radius:4px;overflow:hidden;position:relative}.wcc-video .wcc-image,.wcc-video .wcc-attachment-box-layout,.wcc-video .wcc-attachment-panel-layout,.wcc-video .wcc-attachment-row-layout,.wcc-video .attachment-caption{transform:scale(1) !important}.wcc-video .wcc-fluid-icon{position:absolute;top:0;right:0;bottom:0;left:0}.wcc-video.wcc-video--compact .wcc-video__uploaded-message{display:block !important}.wcc-video.wcc-video--compact .wcc-video__uploaded-message .wcc-video__uploaded-message-container{padding:10px}.wcc-video.wcc-video--compact .wcc-video__uploaded-message .wcc-video__uploaded-message-container span{font-size:11px !important}.wcc-video.wcc-video--compact .wcc-video__uploaded-message .wcc-video__uploaded-message-container .fa{font-size:15px}.wcc-video.wcc-video--compact .wcs-spinner{display:none}.wcc-video.wcc-video--compact .wcc-video__processing-message{display:none}.wcc-video.wcc-video--compact .wcc-video__icon{display:none}.wcc-video.wcc-video--compact .wcc-video__pending-cover__content{font-size:12px;text-align:center}.wcc-video.wcc-video--tiny .wcc-video__processing-message,.wcc-video.wcc-video--tiny .wcc-video__uploaded-message{display:none !important}.wcc-video.wcc-video--tiny .wcs-spinner{height:13px}.wcc-video--with-content{cursor:pointer}.wcc-video--with-content:hover .wcc-video__icon{color:#5ca2dd}.wcc-video__body{position:relative}.wcc-video__body .wcc-image__content{border-radius:4px}.wcc-video__image{width:100%}.wcc-video__icon-container{position:relative;padding-top:56.25%}.wcc-video__icon{position:absolute;bottom:10px;left:10px;display:flex;justify-content:center;align-items:center;width:70px;height:46px;border-radius:15%;background-color:rgba(64,64,64,.85);color:rgba(248,248,247,.85);transition:color 250ms ease-in-out;font-size:26px;padding-left:1%}.wcc-video__processing-message,.wcc-video__uploaded-message{position:absolute;top:50%;width:100%;text-align:center;color:#fff}.wcc-video__processing-message .wcc-video__processing-message-container,.wcc-video__processing-message .wcc-video__uploaded-message-container,.wcc-video__uploaded-message .wcc-video__processing-message-container,.wcc-video__uploaded-message .wcc-video__uploaded-message-container{background:#000;border-radius:10px;opacity:.6;display:inline-block;padding:10px 40px}.wcc-video__processing-message .wcc-video__processing-message-container span,.wcc-video__processing-message .wcc-video__uploaded-message-container span,.wcc-video__uploaded-message .wcc-video__processing-message-container span,.wcc-video__uploaded-message .wcc-video__uploaded-message-container span{font-size:12px}.wcc-video__processing-message .wcc-video__processing-message-container .fa,.wcc-video__processing-message .wcc-video__uploaded-message-container .fa,.wcc-video__uploaded-message .wcc-video__processing-message-container .fa,.wcc-video__uploaded-message .wcc-video__uploaded-message-container .fa{font-size:25px}.wcc-video__pending-cover{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,.65)}.wcc-video__pending-cover__body{padding:5px}.wcc-video__pending-cover__content{color:#fff;text-align:center}.wcc-video__pending-cover__content .fas.fa-check{font-size:50px}\", \"\"]);\n// Exports\nmodule.exports = exports;\n","// Module\nvar code = \"<script id=\\\"wcc-components-wcc-video\\\" type=\\\"text/template\\\">\\r\\n    <!-- ko ifnot: isThumbnailLoaded -->\\r\\n    <wcc-fluid-icon style=\\\"opacity: 0.2;\\\" params=\\\"icon: thumbnailIcon, showLoading: true\\\"></wcc-fluid-icon>\\r\\n\\r\\n    <span class=\\\"wcc-video__icon\\\">\\r\\n        <span data-bind=\\\"css: icon\\\"></span>\\r\\n    </span>\\r\\n\\r\\n    <!-- ko ifnot: hasThumbnail -->\\r\\n    <div class=\\\"wcc-video__uploaded-message\\\" style=\\\"display: none\\\">\\r\\n        <div class=\\\"wcc-video__uploaded-message-container\\\">\\r\\n            <i class=\\\"fa fa-check\\\"></i><br />\\r\\n            <span data-bind=\\\"text: WCC.Labels.UploadedSuccessfully\\\"></span>\\r\\n        </div>\\r\\n    </div>\\r\\n    <div class=\\\"wcc-video__processing-message\\\">\\r\\n        <div class=\\\"wcc-video__processing-message-container\\\">\\r\\n            <span data-bind=\\\"text: WCC.Labels.ProcessingVideo\\\"></span>\\r\\n        </div>\\r\\n    </div>\\r\\n    <!-- /ko -->\\r\\n    <!-- /ko -->\\r\\n\\r\\n    <!-- ko if: hasThumbnail -->\\r\\n    <div class=\\\"wcc-video__body\\\" data-bind=\\\"visible: isThumbnailLoaded\\\">\\r\\n        <wcc-image params=\\\"src: thumbnailURL, cover: cover, loaded: isThumbnailLoaded\\\"></wcc-image>\\r\\n\\r\\n        <span class=\\\"wcc-video__icon\\\">\\r\\n            <span data-bind=\\\"css: icon\\\"></span>\\r\\n        </span>\\r\\n    </div>\\r\\n    <!-- /ko -->\\r\\n\\r\\n    <!-- ko ifnot: hasContent -->\\r\\n    <div class=\\\"wcc-video__pending-cover\\\">\\r\\n        <div class=\\\"wcc-video__pending-cover__body\\\">\\r\\n            <!--<wcs-spinner params=\\\"small: isCompact, tiny: isTiny\\\"></wcs-spinner>-->\\r\\n            <div class=\\\"wcc-video__pending-cover__content\\\">\\r\\n                <i class=\\\"fas fa-check\\\"></i>\\r\\n                <div data-bind=\\\"text: labels.VideoUploaded\\\"></div>\\r\\n            </div>\\r\\n        </div>\\r\\n    </div>\\r\\n    <!-- /ko -->\\r\\n</script>\";\n// Exports\nmodule.exports = code;"],"sourceRoot":""}