{"version":3,"sources":["webpack:///./src/constants.ts","webpack:///./src/components/primary-buttons/primary-buttons.tsx","webpack:///./src/components/share-buttons/share-buttons.tsx","webpack:///./src/components/share-modal/share-modal.tsx","webpack:///./src/components/pages/contribution/waves.svg","webpack:///./src/components/pages/contribution/mars-blue.svg","webpack:///./src/components/pages/contribution/pill.tsx","webpack:///./src/components/pages/contribution/report/report.tsx","webpack:///./src/components/pages/contribution/success.tsx","webpack:///./src/components/pages/contribution/wave.ts","webpack:///./src/components/pages/contribution/contribution.tsx","webpack:///./src/components/pages/contribution/report/success.svg"],"names":["DAILY_GOALS","Object","freeze","speak","listen","BENEFITS","WHATS_PUBLIC","PrimaryButton","_a","className","to","trackClass","props","React","disabled","getTrackClass","join","LocaleLink","type","RecordButton","status","MicIcon","StopIcon","RecordLink","URLS","SPEAK","Voice","PlayButton","isPlaying","OldPlayIcon","PlayLink","LISTEN","SHARE_URL","HTTP_ROOT","withLocalization","getString","shareTextId","locale","useLocale","addNotification","useAction","Notifications","actions","addPill","encodedShareText","encodeURIComponent","link","shareURLInputRef","useRef","id","onClick","current","select","document","execCommand","trackSharing","FontIcon","Localized","readOnly","value","ref","href","target","rel","title","text","Modal","innerClassName","src","alt","elems","bold","ShareButtons","module","exports","children","isOpen","num","openable","style","event","stopPropagation","CheckboxRow","Checkbox","ReportModal","kind","reasons","onSubmitted","api","useAPI","selectedReasons","setSelectedReasons","useState","otherText","setOtherText","submitStatus","setSubmitStatus","require","Button","outline","rounded","onRequestClose","map","reason","key","onChange","e","checked","attrs","placeholder","marginTop","trim","values","some","Boolean","report","entries","filter","concat","ArrowLeft","ReportButton","width","height","viewBox","d","fill","fillRule","xlinkHref","mask","GoalPercentage","final","onReset","account","useAccount","hasAccount","customGoal","custom_goals","find","g","goalValue","killAnimation","startedAt","contributionCount","setContributionCount","currentCount","setCurrentCount","countUp","time","newCount","Math","min","ceil","requestAnimationFrame","useEffect","fetchDailyClipsCount","fetchDailyVotesCount","then","SET_COUNT","performance","now","finalPercentage","goalPercentage","CheckIcon","vars","count","hours","language","LinkButton","GOALS","TextButton","PlayOutlineIcon","PROFILE_INFO","RATIO","window","devicePixelRatio","WIDTH","HEIGHT","Curve","constructor","args","assign","this","tick","respawn","amplitude","random","seed","openClass","equation","i","y","abs","sin","baseAmplitude","_draw","direction","speed","PI","ctx","beginPath","xBase","yBase","x","xInit","lineTo","h","gradient","createRadialGradient","addColorStop","color","fillStyle","closePath","draw","lastFPSCheckAt","lowFPSCount","framesInLastSecond","Wave","canvas","colors","shouldDraw","getContext","curves","reduce","arr","clear","globalCompositeOperation","fillRect","curve","bind","push","index","slice","reverse","findIndex","t","length","play","idle","Tooltip","AccountModal","sessionStorage","setItem","location","pathname","trackProfile","ContributionPage","state","selectedPill","showAccountModal","showReportModal","showShareModal","showShortcutsModal","canvasRef","startWaving","wave","toggleShareModal","setState","toggleShortcutsModal","trackListening","trackRecording","handleKeyDown","isSubmitted","onSubmit","ctrlKey","altKey","shiftKey","metaKey","isEnter","isDone","shortcut","shortcuts","toLowerCase","action","preventDefault","flags","user","showAccountConversionModal","JSON","parse","localStorage","getItem","componentDidMount","addEventListener","showAccountModalDefault","Image","componentDidUpdate","prevProps","activeIndex","stringify","skip_submission_feedback","componentWillUnmount","removeEventListener","sentences","isLoaded","onSkip","label","selectPill","render","errorContent","reportModalProps","ShareModal","toUpperCase","DASHBOARD","ROOT","LocaleNavLink","TEXTADMIN","renderClipCount","arrow","ShareIcon","renderContent","instruction","isFirstSubmit","pills","primaryButtons","Success","actionType","sentence","activeSentenceIndex","isActive","transform","dir","opacity","margin","taxonomy","StyledLink","blank","TARGET_SEGMENT_INFO","ExternalLinkIcon","pill","onShare","max","display","KeyboardIcon","SkipIcon","open","undefined","connect"],"mappings":"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","file":"2.js?id=d1025da9a27c751ef44e","sourcesContent":["export const DAILY_GOALS = Object.freeze({\n  speak: [120, 250],\n  listen: [240],\n});\n\nexport const BENEFITS = [\n  'rich-data',\n  'improve-audio',\n  'keep-track',\n  'compare-progress',\n  'view-goals',\n  'join-newsletter',\n];\n\nexport const WHATS_PUBLIC = [\n  'email-not-public',\n  'recordings-and-locale-public',\n  'username-optin-public',\n  'demographic-deidentified-clarity',\n  'username-email-not-demographic',\n];\n","import * as React from 'react';\nimport URLS from '../../urls';\nimport { LocaleLink } from '../locale-helpers';\nimport { getTrackClass } from '../../services/tracker';\nimport { MicIcon, OldPlayIcon, StopIcon } from '../ui/icons';\n\nimport './primary-buttons.css';\n\nexport const PrimaryButton = ({\n  className,\n  to,\n  trackClass,\n  ...props\n}: { to?: string; trackClass?: string } & React.ButtonHTMLAttributes<any>) => (\n  <div\n    className={[\n      'primary-button',\n      className,\n      props.disabled ? 'disabled' : '',\n      trackClass ? getTrackClass('fs', trackClass) : '',\n    ].join(' ')}>\n    {to ? (\n      <LocaleLink to={to} {...props} />\n    ) : (\n      <button type=\"button\" {...props} />\n    )}\n    <div className=\"background\" />\n  </div>\n);\n\nexport type RecordingStatus = null | 'waiting' | 'recording';\n\nexport const RecordButton = ({\n  status,\n  trackClass,\n  ...props\n}: {\n  status: RecordingStatus;\n  trackClass?: string;\n} & React.ButtonHTMLAttributes<any>) => (\n  <PrimaryButton\n    className={status === null ? 'stop' : 'record'}\n    {...props}\n    trackClass={trackClass}\n    disabled={status === 'waiting'}>\n    {status === null && <MicIcon />}\n    {status === 'recording' && <StopIcon />}\n  </PrimaryButton>\n);\n\nexport const RecordLink = (props: any) => (\n  <PrimaryButton className=\"stop\" to={URLS.SPEAK} {...props}>\n    <MicIcon />\n  </PrimaryButton>\n);\n\nexport const Voice = (props: any) => (\n  <PrimaryButton className=\"stop\" {...props} />\n);\n\nexport const PlayButton = ({\n  isPlaying,\n  trackClass,\n  ...props\n}: { isPlaying: boolean; trackClass?: string } & React.ButtonHTMLAttributes<\n  any\n>) => (\n  <PrimaryButton\n    className={isPlaying ? 'stop' : 'play'}\n    trackClass={trackClass}\n    {...props}>\n    {isPlaying ? <StopIcon /> : <OldPlayIcon />}\n  </PrimaryButton>\n);\n\nexport const PlayLink = (props: any) => (\n  <PrimaryButton className=\"play\" to={URLS.LISTEN} {...props}>\n    <OldPlayIcon />\n  </PrimaryButton>\n);\n","import {\n  Localized,\n  withLocalization,\n  WithLocalizationProps,\n} from '@fluent/react';\nimport * as React from 'react';\nimport { useRef } from 'react';\nimport { trackSharing } from '../../services/tracker';\nimport { Notifications } from '../../stores/notifications';\nimport { FontIcon } from '../ui/icons';\nimport { useLocale } from '../locale-helpers';\nimport URLS from '../../urls';\n\nimport './share-buttons.css';\nimport { useAction } from '../../hooks/store-hooks';\n\nconst SHARE_URL = URLS.HTTP_ROOT;\n\ninterface Props extends WithLocalizationProps {\n  shareTextId?: string;\n}\n\nfunction ShareButtons({ getString, shareTextId }: Props) {\n  const [locale] = useLocale();\n  const addNotification = useAction(Notifications.actions.addPill);\n  const encodedShareText = encodeURIComponent(\n    shareTextId\n      ? getString(shareTextId, { link: SHARE_URL })\n      : getString('share-text', { link: SHARE_URL })\n  );\n  const shareURLInputRef = useRef(null);\n\n  return (\n    <>\n      <button\n        id=\"link-copy\"\n        className=\"share-button\"\n        onClick={() => {\n          shareURLInputRef.current.select();\n          document.execCommand('copy');\n          trackSharing('link', locale);\n\n          addNotification(\n            <>\n              <FontIcon type=\"link\" className=\"icon\" />{' '}\n              <Localized id=\"link-copied\">\n                <span />\n              </Localized>\n            </>\n          );\n        }}>\n        <input type=\"text\" readOnly value={SHARE_URL} ref={shareURLInputRef} />\n        <FontIcon type=\"link\" />\n      </button>\n      <a\n        className=\"share-button\"\n        href={\n          'https://www.facebook.com/sharer/sharer.php?u=' +\n          encodeURIComponent(SHARE_URL)\n        }\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        onClick={() => trackSharing('facebook', locale)}>\n        <FontIcon type=\"facebook\" />\n      </a>\n      <a\n        className=\"share-button\"\n        href={'https://twitter.com/intent/tweet?text=' + encodedShareText}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        onClick={() => trackSharing('twitter', locale)}>\n        <FontIcon type=\"twitter\" />\n      </a>\n      <a\n        className=\"share-button\"\n        href={'https://de.linkedin.com/company/kenbun'}\n        target=\"_blank\"\n        rel=\"noopener noreferrer\"\n        onClick={() => trackSharing('linkedin', locale)}>\n        <FontIcon type=\"linkedin\" />\n      </a>\n    </>\n  );\n}\n\nexport default withLocalization(ShareButtons);\n","import { Localized } from '@fluent/react';\nimport * as React from 'react';\nimport Modal from '../modal/modal';\nimport ShareButtons from '../share-buttons/share-buttons';\n\nimport './share-modal.css';\n\nexport default ({\n  shareTextId,\n  title,\n  text,\n  ...props\n}: {\n  onRequestClose: () => any;\n  shareTextId?: string;\n  title?: React.ReactNode;\n  text?: React.ReactNode;\n}) => (\n  <Modal innerClassName=\"share-modal\" {...props}>\n    <div className=\"image-container\">\n      <img className=\"mars\" src=\"/img/mars.svg\" alt=\"Robot\" />\n    </div>\n    {title ? (\n      <h1>{title}</h1>\n    ) : (\n      <Localized id=\"share-title-new\" elems={{ bold: <b /> }}>\n        <h1 />\n      </Localized>\n    )}\n    {text && <p>{text}</p>}\n    <div className=\"share-buttons\">\n      <ShareButtons {...{ shareTextId }} />\n    </div>\n  </Modal>\n);\n","module.exports = __webpack_public_path__ + \"a997774a58d37a722ef16fa7cc0d6c14.svg\";","module.exports = __webpack_public_path__ + \"d9045f1485c51d73c64d437fc1a503af.svg\";","import * as React from 'react';\n\nimport './pill.css';\n\nexport type PillStatus = 'active' | 'done' | 'pending';\n\nexport default ({\n  className = '',\n  children,\n  isOpen,\n  num,\n  onClick,\n  openable = false,\n  status,\n  style,\n}: {\n  className?: string;\n  children: React.ReactNode;\n  isOpen: boolean;\n  num: number;\n  openable?: boolean;\n  onClick: () => any;\n  status: PillStatus;\n  style?: any;\n}) => (\n  <div\n    className={['pill', isOpen ? 'open' : '', status, className].join(' ')}\n    onClick={\n      openable\n        ? event => {\n            if (status === 'pending') return;\n            event.stopPropagation();\n            if (isOpen) return;\n            onClick();\n          }\n        : null\n    }\n    style={style}>\n    <div className=\"contents\">{children}</div>\n    <div className=\"num\">{num}</div>\n  </div>\n);\n","import { Localized } from '@fluent/react';\nimport * as React from 'react';\nimport { useState } from 'react';\nimport { useAPI } from '../../../../hooks/store-hooks';\nimport Modal, { ModalProps } from '../../../modal/modal';\nimport { ArrowLeft } from '../../../ui/icons';\nimport { Button, Checkbox } from '../../../ui/ui';\n\nimport './report.css';\n\nexport interface ReportModalProps extends ModalProps {\n  kind: 'clip' | 'sentence';\n  id: string;\n  reasons: string[];\n  onSubmitted: () => any;\n}\n\nconst CheckboxRow = ({ children, title, ...props }: any) => (\n  <div className=\"checkbox-row\">\n    <label>\n      <Localized id={title}>\n        <div className=\"reason-title\" />\n      </Localized>\n      <Checkbox {...(props as any)} />\n    </label>\n    <div className=\"detail\">{children}</div>\n  </div>\n);\n\nexport function ReportModal({\n  kind,\n  id,\n  reasons,\n  onSubmitted,\n  ...props\n}: ReportModalProps) {\n  const api = useAPI();\n  const [selectedReasons, setSelectedReasons] = useState<{\n    [key: string]: boolean;\n  }>({});\n  const [otherText, setOtherText] = useState<string>(null);\n  const [submitStatus, setSubmitStatus] = useState<\n    null | 'submitting' | 'submitted'\n  >(null);\n\n  if (submitStatus == 'submitted') {\n    return (\n      <Modal {...props} innerClassName=\"report-success-modal\">\n        <img className=\"check\" src={require('./success.svg')} alt=\"Success\" />\n        <Localized id=\"success\">\n          <h1 />\n        </Localized>\n        <Localized id=\"report-success\">\n          <h2 />\n        </Localized>\n        <Localized id=\"continue\">\n          <Button outline rounded onClick={props.onRequestClose} />\n        </Localized>\n      </Modal>\n    );\n  }\n\n  return (\n    <Modal {...props} innerClassName=\"report-modal\">\n      <Localized id=\"report-title\">\n        <h1 />\n      </Localized>\n      <Localized id=\"report-ask\">\n        <h2 />\n      </Localized>\n      <div>\n        {reasons.map(reason => (\n          <CheckboxRow\n            key={reason}\n            title={'report-' + reason}\n            value={selectedReasons[reason]}\n            onChange={(e: any) =>\n              setSelectedReasons({\n                ...selectedReasons,\n                [reason]: e.target.checked,\n              })\n            }>\n            <Localized id={['report', reason, 'detail'].join('-')}>\n              <p />\n            </Localized>\n          </CheckboxRow>\n        ))}\n        <CheckboxRow\n          title=\"other\"\n          onChange={(e: any) => setOtherText(e.target.checked ? '' : null)}\n          value={otherText != null}>\n          {otherText != null && (\n            <Localized id=\"report-other-comment\" attrs={{ placeholder: true }}>\n              <textarea\n                value={otherText}\n                onChange={(e: any) => setOtherText(e.target.value)}\n                style={{ marginTop: 8 }}\n              />\n            </Localized>\n          )}\n        </CheckboxRow>\n      </div>\n      <Button\n        rounded\n        disabled={\n          submitStatus == 'submitting' ||\n          (otherText && otherText.trim() == '') ||\n          (!Object.values(selectedReasons).some(Boolean) && otherText == null)\n        }\n        onClick={() => {\n          api.report({\n            kind,\n            id,\n            reasons: Object.entries(selectedReasons)\n              .filter(([key, value]) => value)\n              .map(([key]) => key)\n              .concat(otherText || []),\n          });\n          setSubmitStatus('submitted');\n          onSubmitted();\n        }}>\n        <Localized id=\"report\">\n          <span />\n        </Localized>\n        <ArrowLeft />\n      </Button>\n    </Modal>\n  );\n}\n\nexport const ReportButton = (props: React.HTMLProps<HTMLButtonElement>) => (\n  <Button outline rounded className=\"open-report-button\" {...props}>\n    <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\">\n      <defs>\n        <path\n          id=\"flag-a\"\n          d=\"M20.4 2.1c-.4-.2-.8-.1-1.1.2 0 0-.9.7-3.3.7-1.3 0-2.4-.5-3.6-.9C11.1 1.5 9.7 1 8 1 4.8 1 3.5 2.1 3.3 2.3c-.2.2-.3.4-.3.7v19c0 .6.4 1 1 1s1-.4 1-1v-6.5c.4-.2 1.4-.5 3-.5 1.3 0 2.4.5 3.6.9 1.3.5 2.7 1.1 4.4 1.1 3.2 0 4.5-1.1 4.7-1.3.2-.2.3-.4.3-.7V3c0-.4-.2-.7-.6-.9zM19 14.5c-.4.2-1.4.5-3 .5-1.3 0-2.4-.5-3.6-.9C11.1 13.5 9.7 13 8 13c-1.3 0-2.3.2-3 .4V3.5c.4-.2 1.4-.5 3-.5 1.3 0 2.4.5 3.6.9C12.9 4.5 14.3 5 16 5c1.3 0 2.3-.2 3-.4v9.9z\"\n        />\n      </defs>\n      <g fill=\"none\" fillRule=\"evenodd\">\n        <mask id=\"flag-b\" fill=\"#fff\">\n          <use xlinkHref=\"#flag-a\" />\n        </mask>\n        <use fill=\"#000\" fillRule=\"nonzero\" xlinkHref=\"#flag-a\" />\n        <g fill=\"#4A4A4A\" mask=\"url(#flag-b)\">\n          <path d=\"M0 0h24v24H0z\" />\n        </g>\n      </g>\n    </svg>\n\n    <Localized id=\"report\">\n      <span />\n    </Localized>\n  </Button>\n);\n","import {\n  Localized,\n  withLocalization,\n  WithLocalizationProps,\n} from '@fluent/react';\nimport * as React from 'react';\nimport { useEffect, useRef, useState } from 'react';\nimport { DAILY_GOALS } from '../../../constants';\nimport { useAccount, useAPI } from '../../../hooks/store-hooks';\nimport { useTypedSelector } from '../../../stores/tree';\nimport URLS from '../../../urls';\nimport { LocaleLink, useLocale } from '../../locale-helpers';\nimport { CheckIcon, MicIcon, PlayOutlineIcon } from '../../ui/icons';\nimport { Button, LinkButton, TextButton } from '../../ui/ui';\nimport { SET_COUNT } from './contribution';\nimport { getTrackClass } from '../../../services/tracker';\n\nimport './success.css';\n\nconst COUNT_UP_MS = 500; // should be kept in sync with .contribution-success .done transition duration\n\nconst GoalPercentage = ({\n  current,\n  final,\n}: {\n  current: number;\n  final: number;\n}) => (\n  <span className=\"goal-percentage\">\n    <span className=\"final\">{final}%</span>\n    <span className=\"current\">{current}%</span>\n  </span>\n);\n\nfunction Success({\n  getString,\n  onReset,\n  type,\n}: {\n  type: 'speak' | 'listen';\n  onReset: () => any;\n} & WithLocalizationProps) {\n  const api = useAPI();\n  const account = useAccount();\n\n  const [locale] = useLocale();\n\n  const hasAccount = Boolean(account);\n  const customGoal =\n    hasAccount && account.custom_goals?.find(g => g.locale == locale);\n  const goalValue = DAILY_GOALS[type][0];\n\n  const killAnimation = useRef(false);\n  const startedAt = useRef(null);\n\n  const [contributionCount, setContributionCount] = useState(null);\n  const [currentCount, setCurrentCount] = useState(null);\n\n  function countUp(time: number) {\n    if (killAnimation.current) return;\n    if (!startedAt.current) startedAt.current = time;\n    const newCount = Math.min(\n      Math.ceil((contributionCount * (time - startedAt.current)) / COUNT_UP_MS),\n      contributionCount\n    );\n    setCurrentCount(newCount);\n\n    if (newCount < contributionCount) {\n      requestAnimationFrame(countUp);\n    }\n  }\n\n  useEffect(() => {\n    (type === 'speak'\n      ? api.fetchDailyClipsCount()\n      : api.fetchDailyVotesCount()\n    ).then(value => {\n      setContributionCount(value + SET_COUNT);\n    });\n    return () => {\n      killAnimation.current = true;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (contributionCount != null) {\n      countUp(performance.now());\n    }\n  }, [contributionCount]);\n\n  const finalPercentage = Math.ceil(\n    (100 * (contributionCount || 0)) / goalValue\n  );\n\n  const ContributeMoreButton = (props: { children: React.ReactNode }) =>\n    hasAccount ? (\n      <Button\n        className=\"contribute-more-button\"\n        rounded\n        onClick={onReset}\n        {...props}\n      />\n    ) : (\n      <TextButton\n        className=\"contribute-more-button secondary\"\n        onClick={onReset}\n        {...props}\n      />\n    );\n\n  const goalPercentage = (\n    <GoalPercentage\n      current={Math.ceil(\n        (100 * (currentCount === null ? 0 : currentCount)) / goalValue\n      )}\n      final={finalPercentage}\n    />\n  );\n\n  return (\n    <div className=\"contribution-success\">\n      <div className=\"counter done\">\n        <CheckIcon />\n        <Localized\n          id=\"clips-with-count-pluralized\"\n          elems={{ bold: <b /> }}\n          vars={{ count: SET_COUNT + '/' + SET_COUNT }}>\n          <span className=\"text\" />\n        </Localized>\n      </div>\n\n      <Localized\n        id={type === 'speak' ? 'goal-help-recording' : 'goal-help-validation'}\n        elems={{ goalPercentage }}\n        vars={{ goalValue }}>\n        <h1 />\n      </Localized>\n\n      <div className=\"progress\">\n        <div\n          className=\"done\"\n          style={{\n            width: Math.min(finalPercentage, 100) + '%',\n          }}\n        />\n      </div>\n\n      {hasAccount ? (\n        !customGoal && (\n          <div className=\"info-card\">\n            <Localized\n              id=\"help-reach-hours-pluralized\"\n              vars={{ hours: 10000, language: getString(locale) }}>\n              <p />\n            </Localized>\n            <Localized id=\"get-started-goals\">\n              <LinkButton rounded href={URLS.GOALS} />\n            </Localized>\n          </div>\n        )\n      ) : (\n        <div className=\"info-card\">\n          <Localized id=\"profile-explanation\">\n            <p />\n          </Localized>\n          <Localized id=\"login-signup\">\n            <LinkButton\n              rounded\n              href=\"/login\"\n              className={getTrackClass('fs', `nudge-profile-on-succcess`)}\n            />\n          </Localized>\n        </div>\n      )}\n\n      <ContributeMoreButton>\n        {type === 'speak' ? <MicIcon /> : <PlayOutlineIcon />}\n        <Localized id=\"contribute-more\" vars={{ count: SET_COUNT }}>\n          <span />\n        </Localized>\n      </ContributeMoreButton>\n\n      {hasAccount && (\n        <Localized id=\"edit-profile\">\n          <LocaleLink className=\"secondary\" to={URLS.PROFILE_INFO} />\n        </Localized>\n      )}\n    </div>\n  );\n}\n\nexport default withLocalization(Success);\n","const RATIO = window.devicePixelRatio;\nconst WIDTH = RATIO * 320;\nconst HEIGHT = RATIO * 100;\nconst IDLE_AMPLITUDE = 0.1;\nconst PLAY_AMPLITUDE = 0.6;\n\nconst LOW_FPS = 30;\nconst DISABLE_ANIMATION_LOW_FPS_THRESHOLD = 3;\n\nclass Curve {\n  baseAmplitude: number;\n\n  private amplitude: number;\n  private color: number[];\n  private ctx: CanvasRenderingContext2D;\n  private openClass: number;\n  private speed: number;\n  private seed: number;\n  private tick: number;\n\n  constructor(args: {\n    color: number[];\n    ctx: CanvasRenderingContext2D;\n    speed: number;\n    baseAmplitude: number;\n  }) {\n    Object.assign(this, args);\n    this.tick = 0;\n\n    this.respawn();\n  }\n\n  respawn() {\n    this.amplitude = 0.3 + Math.random() * 0.7;\n    this.seed = Math.random();\n    this.openClass = (5 + Math.random() * 4) | 0;\n  }\n\n  private equation(i: number) {\n    const y =\n      ((-1 *\n        Math.abs(Math.sin(this.tick)) *\n        this.baseAmplitude *\n        this.amplitude *\n        HEIGHT) /\n        2) *\n      (1 / (1 + this.openClass * i ** 2) ** 2);\n    if (Math.abs(y) < 0.001) {\n      this.respawn();\n    }\n    return y;\n  }\n\n  private _draw(direction: 1 | -1) {\n    this.tick += this.speed * (1 - 0.5 * Math.sin(this.seed * Math.PI));\n\n    const ctx = this.ctx;\n    ctx.beginPath();\n\n    const xBase = WIDTH / 2 + (-WIDTH / 4 + this.seed * (WIDTH / 2));\n    const yBase = HEIGHT / 2;\n\n    let x;\n    let y;\n    let xInit;\n\n    let i = -3;\n    while (i <= 3) {\n      x = xBase + (i * WIDTH) / 4;\n      y = yBase + direction * this.equation(i);\n      xInit = xInit || x;\n      ctx.lineTo(x, y);\n      i += 0.01;\n    }\n\n    const h = Math.abs(this.equation(0));\n    const gradient = ctx.createRadialGradient(\n      xBase,\n      yBase,\n      h * 2,\n      xBase,\n      yBase,\n      h * 0.3\n    );\n    gradient.addColorStop(0, `rgba(${this.color.join(',')},0.1)`);\n    gradient.addColorStop(1, `rgba(${this.color.join(',')},0.05)`);\n\n    ctx.fillStyle = gradient;\n\n    ctx.lineTo(xInit, yBase);\n    ctx.closePath();\n\n    ctx.fill();\n  }\n\n  draw() {\n    this._draw(-1);\n    this._draw(1);\n  }\n}\n\nlet lastFPSCheckAt = 0;\nlet lowFPSCount = 0;\nlet framesInLastSecond: number[] = [];\n\nexport default class Wave {\n  private amplitude = IDLE_AMPLITUDE;\n  private colors = [\n    [89, 203, 183],\n    [177, 181, 229],\n    [248, 144, 150],\n  ];\n  private ctx: CanvasRenderingContext2D;\n  private curves: Curve[];\n  private shouldDraw = false;\n  private speed: number;\n\n  constructor(canvas: HTMLCanvasElement) {\n    this.speed = 0.1;\n\n    canvas.width = WIDTH;\n    canvas.height = HEIGHT;\n    canvas.style.width = `${WIDTH / RATIO}px`;\n    canvas.style.height = `${HEIGHT / RATIO}px`;\n\n    this.ctx = canvas.getContext('2d');\n\n    this.curves = this.colors\n      .reduce((arr, color) => [...arr, color, color], [])\n      .map(\n        color =>\n          new Curve({\n            color: color as any,\n            ctx: this.ctx,\n            speed: this.speed,\n            baseAmplitude: 2 * IDLE_AMPLITUDE,\n          })\n      );\n\n    this.draw();\n  }\n\n  private clear() {\n    this.ctx.globalCompositeOperation = 'destination-out';\n    this.ctx.fillRect(0, 0, WIDTH, HEIGHT);\n    this.ctx.globalCompositeOperation = 'lighter';\n  }\n\n  private draw() {\n    if (lowFPSCount >= DISABLE_ANIMATION_LOW_FPS_THRESHOLD) {\n      return;\n    }\n\n    this.clear();\n\n    const baseAmplitude =\n      this.curves[0].baseAmplitude * 0.9 + this.amplitude * 0.1;\n    for (const curve of this.curves) {\n      curve.baseAmplitude = baseAmplitude;\n      curve.draw();\n    }\n\n    if (this.shouldDraw || Math.abs(baseAmplitude - this.amplitude) > 0.01) {\n      requestAnimationFrame(this.draw.bind(this));\n    }\n\n    const now = performance.now();\n    framesInLastSecond.push(now);\n    if (now - lastFPSCheckAt < 1000) return;\n    lastFPSCheckAt = now;\n    const index = framesInLastSecond\n      .slice()\n      .reverse()\n      .findIndex(t => now - t > 1000);\n    if (index === -1) {\n      return;\n    }\n\n    framesInLastSecond = framesInLastSecond.slice(\n      framesInLastSecond.length - index - 1\n    );\n    if (framesInLastSecond.length < LOW_FPS) {\n      lowFPSCount++;\n    }\n  }\n\n  play() {\n    this.amplitude = PLAY_AMPLITUDE;\n    this.shouldDraw = true;\n    this.draw();\n  }\n\n  idle() {\n    this.shouldDraw = false;\n    this.amplitude = IDLE_AMPLITUDE;\n    framesInLastSecond = [];\n  }\n}\n","import {\n  Localized,\n  withLocalization,\n  WithLocalizationProps,\n} from '@fluent/react';\nimport * as React from 'react';\nimport { connect } from 'react-redux';\nconst { Tooltip } = require('react-tippy');\nimport { Flags } from '../../../stores/flags';\nimport { Locale } from '../../../stores/locale';\nimport StateTree from '../../../stores/tree';\nimport { User } from '../../../stores/user';\nimport { Sentence } from 'common';\nimport {\n  trackListening,\n  trackProfile,\n  trackRecording,\n  getTrackClass,\n} from '../../../services/tracker';\nimport URLS from '../../../urls';\nimport { LocaleLink, LocaleNavLink, useLocale } from '../../locale-helpers';\nimport Modal, { ModalProps } from '../../modal/modal';\nimport {\n  ArrowLeft,\n  CheckIcon,\n  KeyboardIcon,\n  ShareIcon,\n  SkipIcon,\n  ExternalLinkIcon,\n} from '../../ui/icons';\nimport { Button, StyledLink, LinkButton } from '../../ui/ui';\nimport { PrimaryButton } from '../../primary-buttons/primary-buttons';\nimport ShareModal from '../../share-modal/share-modal';\nimport { ReportButton, ReportModal, ReportModalProps } from './report/report';\nimport Success from './success';\nimport Wave from './wave';\n\nimport './contribution.css';\n\nconst HAS_SEEN_ACCOUNT_MODAL_KEY = 'hasSeenAccountModal2';\n\nconst AccountModal = (props: ModalProps) => {\n  const [locale] = useLocale();\n  return (\n    <Modal {...props} innerClassName=\"account-modal\">\n      <div className=\"images\">\n        <img src={require('./waves.svg')} alt=\"Waves\" className=\"bg\" />\n        <img\n          src={require('./mars-blue.svg')}\n          alt=\"Mars Robot\"\n          className=\"mars\"\n        />\n      </div>\n      <Localized id=\"keep-track-profile\">\n        <h1 />\n      </Localized>\n      <Localized id=\"login-to-get-started\">\n        <h2 />\n      </Localized>\n      <Localized id=\"login-signup\">\n        <LinkButton\n          rounded\n          href=\"/login\"\n          className={getTrackClass('fs', `nudge-profile-modal`)}\n          onClick={() => {\n            sessionStorage.setItem('redirectURL', location.pathname);\n            trackProfile('contribution-conversion-modal', locale);\n          }}\n        />\n      </Localized>\n    </Modal>\n  );\n};\n\nexport const SET_COUNT = 5;\n\nexport interface ContributionPillProps {\n  isOpen: boolean;\n  key: any;\n  num: number;\n  onClick: () => any;\n  onShare: () => any;\n  style?: any;\n}\n\ninterface PropsFromState {\n  flags: Flags.State;\n  locale: Locale.State;\n  user: User.State;\n}\n\ninterface Props extends WithLocalizationProps, PropsFromState {\n  activeIndex: number;\n  errorContent?: any;\n  reportModalProps: Omit<ReportModalProps, 'onSubmitted'>;\n  instruction: (props: {\n    vars: { actionType: string };\n    children: any;\n  }) => React.ReactNode;\n  isFirstSubmit?: boolean;\n  isPlaying: boolean;\n  isSubmitted: boolean;\n  onReset: () => any;\n  onSkip: () => any;\n  onSubmit?: () => any;\n  primaryButtons: React.ReactNode;\n  pills: ((props: ContributionPillProps) => React.ReactNode)[];\n  sentences: Sentence[];\n  shortcuts: {\n    key: string;\n    label: string;\n    action: () => any;\n  }[];\n  type: 'speak' | 'listen';\n}\n\ninterface State {\n  selectedPill: number;\n  showAccountModal: boolean;\n  showReportModal: boolean;\n  showShareModal: boolean;\n  showShortcutsModal: boolean;\n}\n\nclass ContributionPage extends React.Component<Props, State> {\n  static defaultProps = {\n    isFirstSubmit: false,\n  };\n\n  state: State = {\n    selectedPill: null,\n    showAccountModal: false,\n    showReportModal: false,\n    showShareModal: false,\n    showShortcutsModal: false,\n  };\n\n  private canvasRef: { current: HTMLCanvasElement | null } = React.createRef();\n  private wave: Wave;\n\n  private get showAccountModalDefault() {\n    const { flags, user } = this.props;\n    return (\n      flags.showAccountConversionModal &&\n      !user.account &&\n      !JSON.parse(localStorage.getItem(HAS_SEEN_ACCOUNT_MODAL_KEY))\n    );\n  }\n\n  componentDidMount() {\n    this.startWaving();\n    window.addEventListener('keydown', this.handleKeyDown);\n\n    // preload account modal images to prevent layout shifting\n    if (this.showAccountModalDefault) {\n      new Image().src = require('./waves.svg');\n      new Image().src = require('./mars-blue.svg');\n    }\n  }\n\n  componentDidUpdate(prevProps: Props) {\n    this.startWaving();\n\n    const { activeIndex, isPlaying, isSubmitted, onReset, user } = this.props;\n\n    if (activeIndex == 1 && prevProps.activeIndex != activeIndex) {\n      const showAccountModal = this.showAccountModalDefault;\n      this.setState({ showAccountModal });\n      if (showAccountModal) {\n        localStorage.setItem(HAS_SEEN_ACCOUNT_MODAL_KEY, JSON.stringify(true));\n      }\n    }\n\n    if (this.wave) {\n      isPlaying ? this.wave.play() : this.wave.idle();\n    }\n\n    if (isSubmitted && user.account?.skip_submission_feedback) {\n      onReset();\n    }\n  }\n\n  componentWillUnmount() {\n    window.removeEventListener('keydown', this.handleKeyDown);\n    if (this.wave) this.wave.idle();\n  }\n\n  private get isLoaded() {\n    return this.props.sentences.length > 0;\n  }\n\n  private get isDone() {\n    return this.isLoaded && this.props.activeIndex === -1;\n  }\n\n  private get shortcuts() {\n    const { onSkip, shortcuts } = this.props;\n    return shortcuts.concat({\n      key: 'shortcut-skip',\n      label: 'skip',\n      action: onSkip,\n    });\n  }\n\n  private startWaving = () => {\n    const canvas = this.canvasRef.current;\n\n    if (this.wave) {\n      if (!canvas) {\n        this.wave.idle();\n        this.wave = null;\n      }\n      return;\n    }\n\n    if (canvas) {\n      this.wave = new Wave(canvas);\n    }\n  };\n\n  private selectPill(i: number) {\n    this.setState({ selectedPill: i });\n  }\n\n  private toggleShareModal = () =>\n    this.setState({ showShareModal: !this.state.showShareModal });\n\n  private toggleShortcutsModal = () => {\n    const showShortcutsModal = !this.state.showShortcutsModal;\n    if (showShortcutsModal) {\n      const { locale, type } = this.props;\n      (type == 'listen' ? trackListening : (trackRecording as any))(\n        'view-shortcuts',\n        locale\n      );\n    }\n    return this.setState({ showShortcutsModal });\n  };\n\n  private handleKeyDown = (event: any) => {\n    const {\n      getString,\n      isSubmitted,\n      locale,\n      onReset,\n      onSubmit,\n      type,\n    } = this.props;\n\n    if (\n      event.ctrlKey ||\n      event.altKey ||\n      event.shiftKey ||\n      event.metaKey ||\n      this.state.showReportModal\n    ) {\n      return;\n    }\n\n    const isEnter = event.key === 'Enter';\n    if (isSubmitted && isEnter) {\n      onReset();\n      return;\n    }\n    if (this.isDone) {\n      if (isEnter && onSubmit) onSubmit();\n      return;\n    }\n\n    const shortcut = this.shortcuts.find(\n      ({ key }) => getString(key).toLowerCase() === event.key\n    );\n    if (!shortcut) return;\n\n    shortcut.action();\n    ((type === 'listen' ? trackListening : trackRecording) as any)(\n      'shortcut',\n      locale\n    );\n    event.preventDefault();\n  };\n\n  render() {\n    const {\n      errorContent,\n      flags,\n      getString,\n      isSubmitted,\n      onSkip,\n      reportModalProps,\n      type,\n      user,\n    } = this.props;\n    const {\n      showAccountModal,\n      showReportModal,\n      showShareModal,\n      showShortcutsModal,\n    } = this.state;\n\n    return (\n      <div\n        className=\"contribution-wrapper\"\n        onClick={() => this.selectPill(null)}>\n        {showShareModal && (\n          <ShareModal onRequestClose={this.toggleShareModal} />\n        )}\n        {showShortcutsModal && (\n          <Modal\n            innerClassName=\"shortcuts-modal\"\n            onRequestClose={this.toggleShortcutsModal}>\n            <Localized id=\"shortcuts\">\n              <h1 />\n            </Localized>\n            <div className=\"shortcuts\">\n              {this.shortcuts.map(({ key, label }) => (\n                <div key={key} className=\"shortcut\">\n                  <kbd>{getString(key).toUpperCase()}</kbd>\n                  <div className=\"label\">{getString(label)}</div>\n                </div>\n              ))}\n            </div>\n          </Modal>\n        )}\n        {showReportModal && (\n          <ReportModal\n            onRequestClose={() => this.setState({ showReportModal: false })}\n            onSubmitted={onSkip}\n            {...reportModalProps}\n          />\n        )}\n        {showAccountModal && (\n          <AccountModal\n            onRequestClose={() => this.setState({ showAccountModal: false })}\n          />\n        )}\n        <div\n          className={[\n            'contribution',\n            type,\n            this.isDone ? 'submittable' : '',\n          ].join(' ')}>\n          <div className=\"top\">\n            <LocaleLink\n              to={user.account ? URLS.DASHBOARD : URLS.ROOT}\n              className=\"back\">\n              <ArrowLeft />\n            </LocaleLink>\n\n            <div className=\"links\">\n              <Localized id=\"speak\">\n                <LocaleNavLink\n                  className={getTrackClass('fs', `toggle-speak`)}\n                  to={URLS.SPEAK}\n                />\n              </Localized>\n              <Localized id=\"listen\">\n                <LocaleNavLink\n                  className={getTrackClass('fs', `toggle-listen`)}\n                  to={URLS.LISTEN}\n                />\n              </Localized>\n\n              {user.account ? (\n                <Localized id=\"textadmin\">\n                  <LocaleNavLink to={URLS.TEXTADMIN} />\n                </Localized>\n              ) : (\n                ''\n              )}\n            </div>\n\n            {this.isLoaded && !errorContent ? (\n              <div className={'counter ' + (isSubmitted ? 'done' : '')}>\n                {isSubmitted && <CheckIcon />}\n                <Localized\n                  id=\"clips-with-count-pluralized\"\n                  elems={{ bold: <b /> }}\n                  vars={{ count: this.renderClipCount() }}>\n                  <span className=\"text\" />\n                </Localized>\n              </div>\n            ) : (\n              <div />\n            )}\n            {isSubmitted && (\n              <Tooltip arrow title={getString('share-common-voice')}>\n                <button className=\"open-share\" onClick={this.toggleShareModal}>\n                  <ShareIcon />\n                </button>\n              </Tooltip>\n            )}\n          </div>\n\n          {this.renderContent()}\n        </div>\n      </div>\n    );\n  }\n\n  renderClipCount() {\n    const { activeIndex, isSubmitted } = this.props;\n    return (\n      (isSubmitted ? SET_COUNT : activeIndex + 1 || SET_COUNT) + '/' + SET_COUNT\n    );\n  }\n\n  renderContent() {\n    const {\n      activeIndex,\n      errorContent,\n      getString,\n      instruction,\n      isFirstSubmit,\n      isSubmitted,\n      onReset,\n      onSkip,\n      onSubmit,\n      pills,\n      primaryButtons,\n      sentences,\n      type,\n    } = this.props;\n    const { selectedPill } = this.state;\n\n    return isSubmitted ? (\n      <Success onReset={onReset} type={type} />\n    ) : (\n      errorContent ||\n        (this.isLoaded && (\n          <>\n            <div className=\"cards-and-pills\">\n              <div />\n\n              <div className=\"cards-and-instruction\">\n                {instruction({\n                  vars: { actionType: getString('action-click') },\n                  children: <div className=\"instruction hidden-sm-down\" />,\n                }) || <div className=\"instruction hidden-sm-down\" />}\n\n                <div className=\"cards\">\n                  {sentences.map((sentence, i) => {\n                    const activeSentenceIndex = this.isDone\n                      ? SET_COUNT - 1\n                      : activeIndex;\n                    const isActive = i === activeSentenceIndex;\n                    return (\n                      <div\n                        key={sentence ? sentence.text : i}\n                        className={\n                          'card card-dimensions ' + (isActive ? '' : 'inactive')\n                        }\n                        style={{\n                          transform: [\n                            `scale(${isActive ? 1 : 0.9})`,\n                            `translateX(${\n                              (document.dir == 'rtl' ? -1 : 1) *\n                              (i - activeSentenceIndex) *\n                              -130\n                            }%)`,\n                          ].join(' '),\n                          opacity: i < activeSentenceIndex ? 0 : 1,\n                        }}>\n                        <div style={{ margin: 'auto', width: '100%' }}>\n                          {sentence?.text}\n                          {sentence?.taxonomy ? (\n                            <div className=\"sentence-taxonomy\">\n                              <Localized id=\"target-segment-first-card\">\n                                <span className=\"taxonomy-message\" />\n                              </Localized>\n                              <StyledLink\n                                className=\"taxonomy-link\"\n                                blank\n                                href={URLS.TARGET_SEGMENT_INFO}>\n                                <ExternalLinkIcon />\n                                <Localized id=\"target-segment-learn-more\">\n                                  <span />\n                                </Localized>\n                              </StyledLink>\n                            </div>\n                          ) : null}\n                        </div>\n                      </div>\n                    );\n                  })}\n                </div>\n              </div>\n\n              <div className=\"pills\">\n                <div className=\"inner\">\n                  {!errorContent && (\n                    <div className=\"counter\">\n                      <Localized\n                        id=\"clips-with-count-pluralized\"\n                        elems={{ bold: <b /> }}\n                        vars={{ count: this.renderClipCount() }}>\n                        <span className=\"text\" />\n                      </Localized>\n                    </div>\n                  )}\n                  {this.isDone && (\n                    <div className=\"review-instructions\">\n                      <Localized id=\"review-instruction\">\n                        <span />\n                      </Localized>\n                    </div>\n                  )}\n                  {pills.map((pill, i) =>\n                    pill({\n                      isOpen: this.isDone || selectedPill === i,\n                      key: i,\n                      num: i + 1,\n                      onClick: () => this.selectPill(i),\n                      onShare: this.toggleShareModal,\n                      style:\n                        selectedPill !== null &&\n                        Math.abs(\n                          Math.min(\n                            Math.max(selectedPill, 1),\n                            pills.length - 2\n                          ) - i\n                        ) > 1\n                          ? { display: 'none' }\n                          : {},\n                    })\n                  )}\n                </div>\n              </div>\n            </div>\n\n            {instruction({\n              vars: { actionType: getString('action-tap') },\n              children: <div className=\"instruction hidden-md-up\" />,\n            }) || <div className=\"instruction hidden-md-up\" />}\n\n            <div className=\"primary-buttons\">\n              <canvas ref={this.canvasRef} />\n              {primaryButtons}\n            </div>\n\n            <div className=\"buttons\">\n              <div>\n                <Button\n                  rounded\n                  outline\n                  className=\"hidden-sm-down\"\n                  onClick={this.toggleShortcutsModal}>\n                  <KeyboardIcon />\n                  <Localized id=\"shortcuts\">\n                    <span />\n                  </Localized>\n                </Button>\n                <div className=\"extra-button\">\n                  <ReportButton\n                    onClick={() => this.setState({ showReportModal: true })}\n                  />\n                </div>\n              </div>\n              <div>\n                <Button\n                  rounded\n                  outline\n                  className={[\n                    'skip',\n                    getTrackClass('fs', `skip-${type}`),\n                    'fs-ignore-rage-clicks',\n                  ].join(' ')}\n                  disabled={!this.isLoaded}\n                  onClick={onSkip}>\n                  <Localized id=\"skip\">\n                    <span />\n                  </Localized>{' '}\n                  <SkipIcon />\n                </Button>\n                {onSubmit && (\n                  <Tooltip\n                    arrow\n                    disabled={!this.isDone}\n                    open={isFirstSubmit || undefined}\n                    title={getString('record-submit-tooltip', {\n                      actionType: getString('action-tap'),\n                    })}>\n                    <Localized id=\"submit-form-action\">\n                      <PrimaryButton\n                        className={[\n                          'submit',\n                          getTrackClass('fs', `submit-${type}`),\n                        ].join(' ')}\n                        disabled={!this.isDone}\n                        onClick={onSubmit}\n                        type=\"submit\"\n                      />\n                    </Localized>\n                  </Tooltip>\n                )}\n              </div>\n            </div>\n          </>\n        ))\n    );\n  }\n}\n\nexport default connect<PropsFromState>(\n  ({ flags, locale, user }: StateTree) => ({\n    flags,\n    locale,\n    user,\n  })\n)(withLocalization(ContributionPage));\n","module.exports = __webpack_public_path__ + \"93c40243e5dfa5d2315e217e32beea14.svg\";"],"sourceRoot":""}