{"version":3,"sources":["webpack:///./app/javascript/mastodon/containers/media_container.jsx"],"names":["MEDIA_COMPONENTS","MediaGallery","Video","Card","Poll","Hashtag","Audio","MediaContainer","PureComponent","constructor","arguments","state","media","index","lang","time","backgroundColor","options","handleOpenMedia","document","body","classList","add","documentElement","style","marginRight","getScrollbarWidth","this","setState","handleOpenVideo","components","props","JSON","parse","componentIndex","getAttribute","mediaList","fromJS","handleCloseMedia","remove","setBackgroundColor","color","render","_this$state$options","_this$state$options2","_this$state$options3","window","self","top","_jsx","IntlProvider","_jsxs","_Fragment","children","map","call","component","i","componentName","Component","card","poll","hashtag","Object","assign","onOpenVideo","onOpenMedia","createPortal","_createElement","key","ModalRoot","onClose","MediaModal","currentTime","startTime","autoPlay","volume","defaultVolume","onChangeBackgroundColor"],"mappings":"4QAiBA,MAAMA,EAAmB,CAAEC,uBAAcC,gBAAOC,SAAMC,SAAMC,YAASC,iBAEtD,MAAMC,UAAuBC,gBAAcC,cAAA,SAAAC,WAAA,KAMxDC,MAAQ,CACNC,MAAO,KACPC,MAAO,KACPC,KAAM,KACNC,KAAM,KACNC,gBAAiB,KACjBC,QAAS,MACT,KAEFC,gBAAkB,CAACN,EAAOC,EAAOC,KAC/BK,SAASC,KAAKC,UAAUC,IAAI,uBAC5BH,SAASI,gBAAgBC,MAAMC,YAAe,GAAEC,kBAEhDC,KAAKC,SAAS,CAAEhB,QAAOC,QAAOC,QAAO,EACrC,KAEFe,gBAAkB,CAACf,EAAMG,KACvB,MAAM,WAAEa,GAAeH,KAAKI,OACtB,MAAEnB,GAAUoB,KAAKC,MAAMH,EAAWb,EAAQiB,gBAAgBC,aAAa,eACvEC,EAAYC,iBAAOzB,GAEzBO,SAASC,KAAKC,UAAUC,IAAI,uBAC5BH,SAASI,gBAAgBC,MAAMC,YAAe,GAAEC,kBAEhDC,KAAKC,SAAS,CAAEhB,MAAOwB,EAAWtB,OAAMG,WAAU,EAClD,KAEFqB,iBAAmB,KACjBnB,SAASC,KAAKC,UAAUkB,OAAO,uBAC/BpB,SAASI,gBAAgBC,MAAMC,YAAc,IAE7CE,KAAKC,SAAS,CACZhB,MAAO,KACPC,MAAO,KACPE,KAAM,KACNC,gBAAiB,KACjBC,QAAS,MACT,EACF,KAEFuB,mBAAqBC,IACnBd,KAAKC,SAAS,CAAEZ,gBAAiByB,GAAQ,CACzC,CAEFC,SAAW,IAADC,EAAAC,EAAAC,EACR,MAAM,WAAEf,GAAeH,KAAKI,MAE5B,IAAIF,EAOJ,OAJIiB,OAAOC,OAASD,OAAOE,MACzBnB,EAAkBF,KAAKE,iBAIvBoB,YAACC,IAAY,UACXC,eAAAC,WAAA,CAAAC,SAAA,CACG,GAAGC,IAAIC,KAAKzB,GAAY,CAAC0B,EAAWC,KACnC,MAAMC,EAAgBF,EAAUrB,aAAa,kBACvCwB,EAAY3D,EAAiB0D,IAC7B,MAAE9C,EAAK,KAAEgD,EAAI,KAAEC,EAAI,QAAEC,KAAY/B,GAAUC,KAAKC,MAAMuB,EAAUrB,aAAa,eAgBnF,OAdA4B,OAAOC,OAAOjC,EAAO,IACfnB,EAAU,CAAEA,MAASyB,iBAAOzB,IAAa,CAAC,KAC1CgD,EAAU,CAAEA,KAASvB,iBAAOuB,IAAa,CAAC,KAC1CC,EAAU,CAAEA,KAASxB,iBAAOwB,IAAa,CAAC,KAC1CC,EAAU,CAAEA,QAASzB,iBAAOyB,IAAa,CAAC,KAExB,UAAlBJ,EAA4B,CAC9BxB,eAAgBuB,EAChBQ,YAAapC,GACX,CACFqC,YAAavC,KAAKT,mBAIfiD,uBACLC,wBAACT,EAAS,IAAK5B,EAAOsC,IAAM,SAAQZ,MACpCD,EACD,IAGHP,YAACqB,IAAS,CAACtD,gBAAiBW,KAAKhB,MAAMK,gBAAiBuD,QAAS5C,KAAKW,uBAAiB,EACpFX,KAAKhB,MAAMC,OACVqC,YAACuB,IAAU,CACT5D,MAAOe,KAAKhB,MAAMC,MAClBC,MAAOc,KAAKhB,MAAME,OAAS,EAC3BC,KAAMa,KAAKhB,MAAMG,KACjB2D,YAA+B,OAApB9B,EAAEhB,KAAKhB,MAAMM,cAAO,EAAlB0B,EAAoB+B,UACjCC,SAA4B,OAApB/B,EAAEjB,KAAKhB,MAAMM,cAAO,EAAlB2B,EAAoB+B,SAC9BC,OAA0B,OAApB/B,EAAElB,KAAKhB,MAAMM,cAAO,EAAlB4B,EAAoBgC,cAC5BN,QAAS5C,KAAKW,iBACdwC,wBAAyBnD,KAAKa,yBAO5C,E","file":"js/containers/media_container-41fdbbdcbce910937d84.chunk.js","sourcesContent":["import PropTypes from 'prop-types';\nimport { PureComponent } from 'react';\nimport { createPortal } from 'react-dom';\n\nimport { fromJS } from 'immutable';\n\nimport { ImmutableHashtag as Hashtag } from 'mastodon/components/hashtag';\nimport MediaGallery from 'mastodon/components/media_gallery';\nimport ModalRoot from 'mastodon/components/modal_root';\nimport Poll from 'mastodon/components/poll';\nimport Audio from 'mastodon/features/audio';\nimport Card from 'mastodon/features/status/components/card';\nimport MediaModal from 'mastodon/features/ui/components/media_modal';\nimport Video from 'mastodon/features/video';\nimport { IntlProvider } from 'mastodon/locales';\nimport { getScrollbarWidth } from 'mastodon/utils/scrollbar';\n\nconst MEDIA_COMPONENTS = { MediaGallery, Video, Card, Poll, Hashtag, Audio };\n\nexport default class MediaContainer extends PureComponent {\n\n  static propTypes = {\n    components: PropTypes.object.isRequired,\n  };\n\n  state = {\n    media: null,\n    index: null,\n    lang: null,\n    time: null,\n    backgroundColor: null,\n    options: null,\n  };\n\n  handleOpenMedia = (media, index, lang) => {\n    document.body.classList.add('with-modals--active');\n    document.documentElement.style.marginRight = `${getScrollbarWidth()}px`;\n\n    this.setState({ media, index, lang });\n  };\n\n  handleOpenVideo = (lang, options) => {\n    const { components } = this.props;\n    const { media } = JSON.parse(components[options.componentIndex].getAttribute('data-props'));\n    const mediaList = fromJS(media);\n\n    document.body.classList.add('with-modals--active');\n    document.documentElement.style.marginRight = `${getScrollbarWidth()}px`;\n\n    this.setState({ media: mediaList, lang, options });\n  };\n\n  handleCloseMedia = () => {\n    document.body.classList.remove('with-modals--active');\n    document.documentElement.style.marginRight = '0';\n\n    this.setState({\n      media: null,\n      index: null,\n      time: null,\n      backgroundColor: null,\n      options: null,\n    });\n  };\n\n  setBackgroundColor = color => {\n    this.setState({ backgroundColor: color });\n  };\n\n  render () {\n    const { components } = this.props;\n\n    let handleOpenVideo;\n\n    // Don't offer to expand the video in a lightbox if we're in a frame\n    if (window.self === window.top) {\n      handleOpenVideo = this.handleOpenVideo;\n    }\n\n    return (\n      <IntlProvider>\n        <>\n          {[].map.call(components, (component, i) => {\n            const componentName = component.getAttribute('data-component');\n            const Component = MEDIA_COMPONENTS[componentName];\n            const { media, card, poll, hashtag, ...props } = JSON.parse(component.getAttribute('data-props'));\n\n            Object.assign(props, {\n              ...(media   ? { media:   fromJS(media)   } : {}),\n              ...(card    ? { card:    fromJS(card)    } : {}),\n              ...(poll    ? { poll:    fromJS(poll)    } : {}),\n              ...(hashtag ? { hashtag: fromJS(hashtag) } : {}),\n\n              ...(componentName === 'Video' ? {\n                componentIndex: i,\n                onOpenVideo: handleOpenVideo,\n              } : {\n                onOpenMedia: this.handleOpenMedia,\n              }),\n            });\n\n            return createPortal(\n              <Component {...props} key={`media-${i}`} />,\n              component,\n            );\n          })}\n\n          <ModalRoot backgroundColor={this.state.backgroundColor} onClose={this.handleCloseMedia}>\n            {this.state.media && (\n              <MediaModal\n                media={this.state.media}\n                index={this.state.index || 0}\n                lang={this.state.lang}\n                currentTime={this.state.options?.startTime}\n                autoPlay={this.state.options?.autoPlay}\n                volume={this.state.options?.defaultVolume}\n                onClose={this.handleCloseMedia}\n                onChangeBackgroundColor={this.setBackgroundColor}\n              />\n            )}\n          </ModalRoot>\n        </>\n      </IntlProvider>\n    );\n  }\n\n}\n"],"sourceRoot":""}