{"version":3,"sources":["components/molecules/visualisation/assets/simulation/main-lp1-entries/2.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/3.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/4.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/5.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/6.png","fonts/VAGRounded-Light.eot","components/molecules/simulation-button/button-down.gif","components/molecules/visualisation/assets/simulation/main-standard/10.png","fonts/VAGRounded-Light.ttf","fonts/VAGRounded-Light.svg","fonts/VAGRounded-Light.woff","fonts/VAGRounded-Light.woff2","fonts/VAGRounded-Light.otf","components/molecules/visualisation/assets/full.png","components/molecules/visualisation/assets/overview.png","components/molecules/visualisation/assets/overview-pressed.png","components/molecules/visualisation/assets/simulation.png","components/molecules/visualisation/assets/simulation-pressed.png","components/molecules/visualisation/assets/animations/full-to-overview.mp4","components/molecules/visualisation/assets/animations/overview-to-full.mp4","components/molecules/visualisation/assets/animations/overview-to-simulation.mp4","components/molecules/visualisation/assets/animations/simulation-to-overview.mp4","components/molecules/visualisation/assets/animations/simulation-to-full.mp4","components/molecules/visualisation/assets/simulation/main/1.png","components/molecules/visualisation/assets/simulation/main/2.png","components/molecules/visualisation/assets/simulation/main/3.png","components/molecules/visualisation/assets/simulation/main/4.png","components/molecules/visualisation/assets/simulation/main/5.png","components/molecules/visualisation/assets/simulation/main/6.png","components/molecules/visualisation/assets/simulation/main-standard/1.png","components/molecules/visualisation/assets/simulation/main-standard/2.png","components/molecules/visualisation/assets/simulation/main-standard/3.png","components/molecules/visualisation/assets/simulation/main-standard/4.png","components/molecules/visualisation/assets/simulation/main-standard/5.png","components/molecules/visualisation/assets/simulation/main-standard/6.png","components/molecules/visualisation/assets/simulation/main-standard/7.png","components/molecules/visualisation/assets/simulation/main-standard/8.png","components/molecules/visualisation/assets/simulation/main-standard/9.png","components/molecules/visualisation/assets/simulation/main-standard/11.png","components/molecules/visualisation/assets/simulation/main-extended/1.png","components/molecules/visualisation/assets/simulation/main-extended/2.png","components/molecules/visualisation/assets/simulation/main-extended/3.png","components/molecules/visualisation/assets/simulation/main-extended/4.png","components/molecules/visualisation/assets/simulation/main-extended/5.png","components/molecules/visualisation/assets/simulation/main-extended/6.png","components/molecules/visualisation/assets/simulation/main-extended/7.png","components/molecules/visualisation/assets/simulation/main-extended/8.png","components/molecules/visualisation/assets/simulation/main-extended/9.png","components/molecules/visualisation/assets/simulation/main-extended/10.png","components/molecules/visualisation/assets/simulation/main-extended/11.png","components/molecules/visualisation/assets/simulation/main-extended/12.png","components/molecules/visualisation/assets/simulation/main-extended/13.png","components/molecules/visualisation/assets/simulation/main-extended/14.png","components/molecules/visualisation/assets/simulation/main-extended/15.png","components/molecules/visualisation/assets/simulation/main-extended/16.png","components/molecules/visualisation/assets/simulation/main-extended/17.png","components/molecules/visualisation/assets/simulation/main-extended/18.png","components/molecules/visualisation/assets/simulation/main-reserves/1.png","components/molecules/visualisation/assets/simulation/main-reserves/2.png","components/molecules/visualisation/assets/simulation/main-reserves/3.png","components/molecules/visualisation/assets/simulation/main-reserves/4.png","components/molecules/visualisation/assets/simulation/main-reserves/5.png","components/molecules/visualisation/assets/simulation/main-reserves/6.png","components/molecules/visualisation/assets/simulation/main-reserves/7.png","components/molecules/visualisation/assets/simulation/main-reserves/8.png","components/molecules/visualisation/assets/simulation/main-reserves/9.png","components/molecules/visualisation/assets/simulation/main-reserves/10.png","components/molecules/visualisation/assets/simulation/main-reserves/11.png","components/molecules/visualisation/assets/simulation/main-reserves/12.png","components/molecules/visualisation/assets/simulation/main-reserves/13.png","components/molecules/visualisation/assets/simulation/main-reserves/14.png","components/molecules/visualisation/assets/simulation/main-reserves/15.png","components/molecules/visualisation/assets/simulation/main-reserves/16.png","components/molecules/visualisation/assets/simulation/main-reserves/17.png","components/molecules/visualisation/assets/simulation/main-lp1/1.png","components/molecules/visualisation/assets/simulation/main-lp1/2.png","components/molecules/visualisation/assets/simulation/main-lp1/3.png","components/molecules/visualisation/assets/simulation/main-lp1/4.png","components/molecules/visualisation/assets/simulation/main-lp1/5.png","components/molecules/visualisation/assets/simulation/main-lp1/6.png","components/molecules/visualisation/assets/simulation/main-lp1/7.png","components/molecules/visualisation/assets/simulation/main-lp1/8.png","components/molecules/visualisation/assets/simulation/main-lp1/9.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/1.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/2.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/3.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/4.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/5.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/6.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/7.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/8.png","components/molecules/visualisation/assets/simulation/main-lp1-entries/intervals/9.png","components/molecules/visualisation/assets/simulation/main-lp2/1.png","components/molecules/visualisation/assets/simulation/main-lp2/2.png","components/molecules/visualisation/assets/simulation/main-lp2/3.png","components/molecules/visualisation/assets/simulation/main-lp2/4.png","components/molecules/visualisation/assets/simulation/main-lp2/5.png","components/molecules/visualisation/assets/simulation/main-lp2/6.png","components/molecules/visualisation/assets/simulation/main-lp2/7.png","components/molecules/visualisation/assets/simulation/main-lp2/8.png","components/molecules/visualisation/assets/simulation/main-lp2/9.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/1.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/2.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/3.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/4.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/5.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/6.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/7.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/8.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/9.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/10.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/11.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/12.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/13.png","components/molecules/visualisation/assets/simulation/main-lp2-entries/14.png","styles/constants.js","styles/global.js","components/atoms/absolute-box/absolute-box.js","components/atoms/aspect-ratio-box/aspect-ratio-box.js","components/atoms/highlight-button/highlight-button.js","components/molecules/simulation-button/simulation-button.js","components/molecules/visualisation/visualisation.js","components/atoms/text/text.js","styles/breakpoints.js","styles/media-queries.js","styles/layout.js","utils/use-window-size.js","components/templates/landing-page/landing-page.js","components/atoms/title/title.js","components/atoms/subtitle/subtitle.js","components/molecules/header/header.js","components/atoms/button/button.js","components/atoms/button/link-button.js","components/pages/landing-page/landing-page.js","components/templates/general/general.js","components/molecules/nav/nav.js","components/atoms/button-sprite/button-sprite.js","components/atoms/heading/heading.js","components/molecules/button-instruction/button-instruction.js","components/organisms/button-details/button-details.js","components/atoms/chevron/chevron.js","components/molecules/exit-link/exit-link.js","components/pages/overview/overview.js","components/molecules/breadcrumbs/breadcrumbs.js","components/molecules/chevrons/chevrons.js","components/molecules/simulation-instruction/simulation-instruction.js","components/organisms/simulation-instructions/simulation-instructions.js","components/organisms/simulation-menu/simulation-menu.js","components/organisms/simulation-display/simulation-display.js","components/pages/simulation/simulation.js","App.js","serviceWorker.js","index.js"],"names":["module","exports","primary","Color","secondary","colors","primaryDarker","darken","hex","primaryDark","primaryLight","lighten","primaryLighter","secondaryDarker","secondaryDark","secondaryLight","secondaryLighter","letterSpacing","md","lg","lineSpacings","fontSizes","root","sm","styles","css","emotionNormalize","font1","font6","font2","font","font4","font5","styleConstants","Box","props","y","x","width","height","minHeight","minWidth","centered","forwardRef","ref","children","Outer","padding","Inner","ratio","outerProps","innerProps","Button","active","transparent","aspectRatio","onClick","Animation","onMouseDown","onMouseUp","onNext","onEnter","onExit","useState","mouseDownTime","setMouseDownTime","mouseDownDuration","setMouseDownDuration","mouseDown","animationRef","useRef","useEffect","current","src","buttonDownGif","Math","random","handle","setTimeout","Date","getTime","clearTimeout","handleMouseDown","e","preventDefault","stopPropagation","handleMouseUp","onMouseLeave","onTouchStart","onTouchCancel","onTouchEnd","onSelect","Image","DisplayImage","Video","ElementHighlightButton","path","history","useHistory","location","pathname","push","placeholderRect","routeMatch","useRouteMatch","newAsset","params","mode","useLocation","asset","setAsset","simulationButtonDown","setSimulationButtonDown","loading","setLoading","images","full","overview","overviewPressed","simulation","simulationPressed","animations","fullToOverview","overviewToFull","overviewToSimulation","simulationToOverview","simulationToFull","animationMatch","match","image","animation","simulationRouteMatch","simulationItemRouteMatch","alt","Fragment","mainStandard10Display","menu","display","parseInt","item","displays","main","main1Display","enter","main2Display","main3Display","main4Display","main5Display","main6Display","mainStandard1Display","exit","mainStandard2Display","mainStandard3Display","mainStandard4Display","mainStandard5Display","mainStandard6Display","mainStandard7Display","mainStandard8Display","mainStandard9Display","mainStandard11Display","mainExtended1Display","mainExtended2Display","mainExtended3Display","mainExtended4Display","mainExtended5Display","mainExtended6Display","mainExtended7Display","mainExtended8Display","mainExtended9Display","mainExtended10Display","mainExtended11Display","mainExtended12Display","mainExtended13Display","mainExtended14Display","mainExtended15Display","mainExtended16Display","mainExtended17Display","mainExtended18Display","mainReserves1Display","mainReserves2Display","mainReserves3Display","mainReserves4Display","mainReserves5Display","mainReserves6Display","mainReserves7Display","mainReserves8Display","mainReserves9Display","mainReserves10Display","mainReserves11Display","mainReserves12Display","mainReserves13Display","mainReserves14Display","mainReserves15Display","mainReserves16Display","mainReserves17Display","mainLP11Display","mainLP12Display","mainLP13Display","mainLP14Display","mainLP15Display","mainLP16Display","mainLP17Display","mainLP18Display","mainLP19Display","mainLP1Entries1_1Display","mainLP1Entries2Display","mainLP1Entries3Display","mainLP1Entries4Display","mainLP1Entries5Display","mainLP1Entries6Display","mainLP1Entries1_2Display","mainLP1Entries1_3Display","mainLP1Entries1_4Display","mainLP1Entries1_5Display","mainLP1Entries1_6Display","mainLP1Entries1_7Display","mainLP1Entries1_8Display","mainLP1Entries1_9Display","mainLP21Display","mainLP22Display","mainLP23Display","mainLP24Display","mainLP25Display","mainLP26Display","mainLP27Display","mainLP28Display","mainLP29Display","mainLP2Entries1Display","mainLP2Entries2Display","mainLP2Entries3Display","mainLP2Entries4Display","mainLP2Entries5Display","mainLP2Entries6Display","mainLP2Entries7Display","mainLP2Entries8Display","mainLP2Entries9Display","mainLP2Entries10Display","mainLP2Entries11Display","mainLP2Entries12Display","mainLP2Entries13Display","mainLP2Entries14Display","nextDisplay","length","renderRegisterDisplayHighlights","obisWidth","dataWidth","Array","from","v","i","flat","search","indexOf","renderSimulationElements","autoPlay","onLoadedData","onEnded","type","Wrapper","fontSize","lineSpacing","align","color","undefined","otherProps","breakpoints","array","xl","map","breakpoint","container","mq","isClient","window","getSize","useCallback","innerWidth","innerHeight","windowSize","setWindowSize","handleResize","addEventListener","removeEventListener","layout","Main","Visualisation","mQ","Content","Buttons","header","text","buttons","setVisualisationPlaceholderRect","visualisationPlaceholderRef","useWindowSize","visualisationRect","getBoundingClientRect","newVisualisationRect","left","pageXOffset","top","pageYOffset","b","key","subtitle","fluid","withRouter","to","event","HeaderWrapper","ExitLinkWrapper","NavigationWrapper","DetailsWrapper","exitLink","navigation","details","visualisationPlaceholderClearPercent","mainElementRef","visualisationPlaceholderOffset","setVisualisationPlaceholderOffset","mainRect","offset","LabelWrapper","label","spriteLabel","title","description","InstructionsWrapper","InstructionWrapper","icon","faChevronRight","routeElement","element","setElement","displayedElement","button","diodes","data","registers","serial","certification","vendor","badge","plc","as","isArray","reduce","p","c","count","rest","chevrons","IconWrapper","heading","instructions","displayRouteMatch","routePath","setPath","activePath","createDisplayTitles","titles","createLoadProfileTitles","createLoadProfile1EntryTitles","energySupplyDescription","energyReceiptDescription","displayDetails","obis","quadrant","tariff","headings","descriptions","phase","profile","relais","mid","pc","enterable","elementDetails","renderDisplayDetails","RoutesWrapper","PageWrapper","transitionDuration","enterDelay","App","visualisationPlaceholderRect","Router","MemoryRouter","exact","CSSTransition","in","timeout","classNames","unmountOnExit","rect","Boolean","hostname","ReactDOM","render","document","getElementById","navigator","serviceWorker","ready","then","registration","unregister"],"mappings":"kHAAAA,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,sGCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,yC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,qFCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,+C,gBCA3CD,EAAOC,QAAU,IAA0B,gD,gBCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,kC,gBCA3CD,EAAOC,QAAU,IAA0B,sC,gBCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,wC,gBCA3CD,EAAOC,QAAU,IAA0B,gD,gBCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,8C,gBCA3CD,EAAOC,QAAU,IAA0B,oD,gBCA3CD,EAAOC,QAAU,IAA0B,oD,gBCA3CD,EAAOC,QAAU,IAA0B,gD,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,gC,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IAA0B,+B,gBCA3CD,EAAOC,QAAU,IA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IAEb,cAAC,GAAD,CACE0C,KAAI,sBAAiBwC,EAAjB,YAAyBC,EAAzB,QACJnG,MAAM,OACNC,OAAO,KACPH,EAAE,QACFC,EAAE,MACFK,UAAQ,EACRY,aAAW,IAEb,cAAC,GAAD,CACE0C,KAAI,sBAAiBwC,EAAjB,YAAyBC,EAAzB,OACJnG,MAAM,OACNC,OAAO,KACPH,EAAE,QACFC,EAAE,QACFK,UAAQ,EACRY,aAAW,MAMnB,OACE,cAAC,IAAMgF,SAAP,KACE,cAAC,EAAD,CAAahG,MAAM,QAAQC,OAAO,MAAMF,EAAE,SAASD,EAAE,SAASM,UAAQ,GACpE,cAACmD,GAAD,CACEpB,IAAKmE,EAASJ,GAAMC,GAASA,QAC7BJ,IAAI,gCAIN,CACEQ,KAAM,GACN,gBAAiB,CACf,KACAsG,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,QAGJ,gBAAiB,CACfA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,QAGJ,gBAAiB,CACfA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,IACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,OAEFA,EACE,gBACA,KACA,MACA,QAGJ,WAAYG,MAAMC,KAAK,CAAEL,OAAQ,IAAK,SAACM,EAAGC,GAAJ,OACpCN,EAAgC,WAAYM,EAAI,EAAG,MAAO,UAE5D,mBAAoBH,MAAMC,KAAK,CAAEL,OAAQ,IAAK,SAACM,EAAGC,GAAJ,MAAU,CACtDN,EACE,mBACI,EAAJM,EAAQ,EACR,MACA,OAEFN,EACE,mBACI,EAAJM,EAAQ,EACR,MACA,OAEFN,EACE,mBACI,EAAJM,EAAQ,EACR,MACA,OAEFN,EACE,mBACI,EAAJM,EAAQ,EACR,MACA,OAEFN,EACE,mBACI,EAAJM,EAAQ,EACR,MACA,OAEFN,EACE,mBACI,EAAJM,EAAQ,EACR,MACA,WAEDC,OACH,WAAYJ,MAAMC,KAAK,CAAEL,OAAQ,IAAK,SAACM,EAAGC,GAAJ,OACpCN,EAAgC,WAAYM,EAAI,EAAG,MAAO,UAE5D,mBAAoB,CAClBN,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBACA,IACA,MACA,OAEFA,EACE,mBAC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","file":"static/js/main.35ab6db7.chunk.js","sourcesContent":["module.exports = __webpack_public_path__ + \"static/media/2.4012bdb5.png\";","module.exports = __webpack_public_path__ + \"static/media/3.f7f2bf9f.png\";","module.exports = __webpack_public_path__ + \"static/media/4.f2c47f31.png\";","module.exports = __webpack_public_path__ + \"static/media/5.f896fcbc.png\";","module.exports = __webpack_public_path__ + \"static/media/6.d638d2ad.png\";","module.exports = __webpack_public_path__ + \"static/media/VAGRounded-Light.2775984f.eot\";","module.exports = __webpack_public_path__ + \"static/media/button-down.53965886.gif\";","module.exports = __webpack_public_path__ + \"static/media/10.94c40c9a.png\";","module.exports = __webpack_public_path__ + \"static/media/VAGRounded-Light.e44b942b.ttf\";","module.exports = __webpack_public_path__ + \"static/media/VAGRounded-Light.41f0a7a6.svg\";","module.exports = __webpack_public_path__ + \"static/media/VAGRounded-Light.d99ce0d3.woff\";","module.exports = __webpack_public_path__ + \"static/media/VAGRounded-Light.514a6c41.woff2\";","module.exports = __webpack_public_path__ + \"static/media/VAGRounded-Light.374b223c.otf\";","module.exports = __webpack_public_path__ + \"static/media/full.4b2f9d13.png\";","module.exports = __webpack_public_path__ + \"static/media/overview.249dba5d.png\";","module.exports = __webpack_public_path__ + \"static/media/overview-pressed.c5562d5d.png\";","module.exports = __webpack_public_path__ + \"static/media/simulation.17db3f0e.png\";","module.exports = __webpack_public_path__ + \"static/media/simulation-pressed.e232844d.png\";","module.exports = __webpack_public_path__ + \"static/media/full-to-overview.a6c814a3.mp4\";","module.exports = __webpack_public_path__ + \"static/media/overview-to-full.d1a0cbc8.mp4\";","module.exports = __webpack_public_path__ + \"static/media/overview-to-simulation.92bb9500.mp4\";","module.exports = __webpack_public_path__ + \"static/media/simulation-to-overview.87ac56cb.mp4\";","module.exports = __webpack_public_path__ + \"static/media/simulation-to-full.1b8a94f8.mp4\";","module.exports = __webpack_public_path__ + \"static/media/1.64a387b4.png\";","module.exports = __webpack_public_path__ + \"static/media/2.9c950e9b.png\";","module.exports = __webpack_public_path__ + \"static/media/3.0184f266.png\";","module.exports = __webpack_public_path__ + \"static/media/4.3e3828aa.png\";","module.exports = __webpack_public_path__ + \"static/media/5.91d41cd0.png\";","module.exports = __webpack_public_path__ + \"static/media/6.a7473061.png\";","module.exports = __webpack_public_path__ + \"static/media/1.01fcf9f3.png\";","module.exports = __webpack_public_path__ + \"static/media/2.bdca1961.png\";","module.exports = __webpack_public_path__ + \"static/media/3.f2ae686d.png\";","module.exports = __webpack_public_path__ + \"static/media/4.7be9a871.png\";","module.exports = __webpack_public_path__ + \"static/media/5.d42868cb.png\";","module.exports = __webpack_public_path__ + \"static/media/6.45349b57.png\";","module.exports = __webpack_public_path__ + \"static/media/7.dd42c047.png\";","module.exports = __webpack_public_path__ + \"static/media/8.b8914934.png\";","module.exports = __webpack_public_path__ + \"static/media/9.89369c01.png\";","module.exports = __webpack_public_path__ + \"static/media/11.29dc526e.png\";","module.exports = __webpack_public_path__ + \"static/media/1.c3d57f85.png\";","module.exports = __webpack_public_path__ + \"static/media/2.86df473c.png\";","module.exports = __webpack_public_path__ + \"static/media/3.acb926f1.png\";","module.exports = __webpack_public_path__ + \"static/media/4.0c35caa5.png\";","module.exports = __webpack_public_path__ + \"static/media/5.d73987c4.png\";","module.exports = __webpack_public_path__ + \"static/media/6.147cd298.png\";","module.exports = __webpack_public_path__ + \"static/media/7.36d3a3ab.png\";","module.exports = __webpack_public_path__ + \"static/media/8.71ac26ab.png\";","module.exports = __webpack_public_path__ + \"static/media/9.685f9611.png\";","module.exports = __webpack_public_path__ + \"static/media/10.21c5f915.png\";","module.exports = __webpack_public_path__ + \"static/media/11.41cc8adf.png\";","module.exports = __webpack_public_path__ + \"static/media/12.165ec568.png\";","module.exports = __webpack_public_path__ + \"static/media/13.514961ce.png\";","module.exports = __webpack_public_path__ + \"static/media/14.5d149142.png\";","module.exports = __webpack_public_path__ + \"static/media/15.0a52e743.png\";","module.exports = __webpack_public_path__ + \"static/media/16.bd235763.png\";","module.exports = __webpack_public_path__ + \"static/media/17.3d73fee8.png\";","module.exports = __webpack_public_path__ + \"static/media/18.143fddcb.png\";","module.exports = __webpack_public_path__ + \"static/media/1.1127185a.png\";","module.exports = __webpack_public_path__ + \"static/media/2.ab992cd2.png\";","module.exports = __webpack_public_path__ + \"static/media/3.6ff6f672.png\";","module.exports = __webpack_public_path__ + \"static/media/4.231967b8.png\";","module.exports = __webpack_public_path__ + \"static/media/5.ef76bf3e.png\";","module.exports = __webpack_public_path__ + \"static/media/6.6f562d92.png\";","module.exports = __webpack_public_path__ + \"static/media/7.dc5d08a9.png\";","module.exports = __webpack_public_path__ + \"static/media/8.e5562dc8.png\";","module.exports = __webpack_public_path__ + \"static/media/9.93e70377.png\";","module.exports = __webpack_public_path__ + \"static/media/10.2b6619c8.png\";","module.exports = __webpack_public_path__ + \"static/media/11.f83fa4c9.png\";","module.exports = __webpack_public_path__ + \"static/media/12.3a5c6697.png\";","module.exports = __webpack_public_path__ + \"static/media/13.7d8de872.png\";","module.exports = __webpack_public_path__ + \"static/media/14.52f6009f.png\";","module.exports = __webpack_public_path__ + \"static/media/15.c6ea3176.png\";","module.exports = __webpack_public_path__ + \"static/media/16.be8cab07.png\";","module.exports = __webpack_public_path__ + \"static/media/17.7755daeb.png\";","module.exports = __webpack_public_path__ + \"static/media/1.35dcf77a.png\";","module.exports = __webpack_public_path__ + \"static/media/2.d4df7ff8.png\";","module.exports = __webpack_public_path__ + \"static/media/3.2a2a73b0.png\";","module.exports = __webpack_public_path__ + \"static/media/4.1f268370.png\";","module.exports = __webpack_public_path__ + \"static/media/5.ee2bc300.png\";","module.exports = __webpack_public_path__ + \"static/media/6.a8c909ef.png\";","module.exports = __webpack_public_path__ + \"static/media/7.7da90643.png\";","module.exports = __webpack_public_path__ + \"static/media/8.a867c717.png\";","module.exports = __webpack_public_path__ + \"static/media/9.7cd8c72a.png\";","module.exports = __webpack_public_path__ + \"static/media/1.53b986ee.png\";","module.exports = __webpack_public_path__ + \"static/media/2.eb24f6fe.png\";","module.exports = __webpack_public_path__ + \"static/media/3.ea7b981a.png\";","module.exports = __webpack_public_path__ + \"static/media/4.df26ea0f.png\";","module.exports = __webpack_public_path__ + \"static/media/5.bc2338c1.png\";","module.exports = __webpack_public_path__ + \"static/media/6.6e5cfd35.png\";","module.exports = __webpack_public_path__ + \"static/media/7.a09f7e16.png\";","module.exports = __webpack_public_path__ + \"static/media/8.c1d117ce.png\";","module.exports = __webpack_public_path__ + \"static/media/9.ec4af09a.png\";","module.exports = __webpack_public_path__ + \"static/media/1.35dcf77a.png\";","module.exports = __webpack_public_path__ + \"static/media/2.d4df7ff8.png\";","module.exports = __webpack_public_path__ + \"static/media/3.2a2a73b0.png\";","module.exports = __webpack_public_path__ + \"static/media/4.1f268370.png\";","module.exports = __webpack_public_path__ + \"static/media/5.ee2bc300.png\";","module.exports = __webpack_public_path__ + \"static/media/6.a8c909ef.png\";","module.exports = __webpack_public_path__ + \"static/media/7.7da90643.png\";","module.exports = __webpack_public_path__ + \"static/media/8.a867c717.png\";","module.exports = __webpack_public_path__ + \"static/media/9.7cd8c72a.png\";","module.exports = __webpack_public_path__ + \"static/media/1.7f2f3a1d.png\";","module.exports = __webpack_public_path__ + \"static/media/2.ffee8d28.png\";","module.exports = __webpack_public_path__ + \"static/media/3.f7f2bf9f.png\";","module.exports = __webpack_public_path__ + \"static/media/4.86df473c.png\";","module.exports = __webpack_public_path__ + \"static/media/5.acb926f1.png\";","module.exports = __webpack_public_path__ + \"static/media/6.0c35caa5.png\";","module.exports = __webpack_public_path__ + \"static/media/7.d73987c4.png\";","module.exports = __webpack_public_path__ + \"static/media/8.147cd298.png\";","module.exports = __webpack_public_path__ + \"static/media/9.36d3a3ab.png\";","module.exports = __webpack_public_path__ + \"static/media/10.71ac26ab.png\";","module.exports = __webpack_public_path__ + \"static/media/11.685f9611.png\";","module.exports = __webpack_public_path__ + \"static/media/12.21c5f915.png\";","module.exports = __webpack_public_path__ + \"static/media/13.41cc8adf.png\";","module.exports = __webpack_public_path__ + \"static/media/14.165ec568.png\";","import Color from \"color\";\r\n\r\nconst primary = Color(\"#80c826\");\r\nconst secondary = Color(\"#F2F2F2\");\r\nconst darkerPercent = 0.15;\r\nconst darkPercent = 0.05;\r\nconst lightPercent = 0.05;\r\nconst lighterPercent = 0.15;\r\n\r\nexport default {\r\n  colors: {\r\n    primaryDarker: primary.darken(darkerPercent).hex(),\r\n    primaryDark: primary.darken(darkPercent).hex(),\r\n    primary: primary.hex(),\r\n    primaryLight: primary.lighten(lightPercent).hex(),\r\n    primaryLighter: primary.lighten(lighterPercent).hex(),\r\n\r\n    secondaryDarker: secondary.darken(darkerPercent).hex(),\r\n    secondaryDark: secondary.darken(darkPercent).hex(),\r\n    secondary: secondary.hex(),\r\n    secondaryLight: secondary.lighten(lightPercent).hex(),\r\n    secondaryLighter: secondary.lighten(lighterPercent).hex()\r\n  },\r\n\r\n  letterSpacing: {\r\n    md: \"0\",\r\n    lg: \"0.025em\"\r\n  },\r\n\r\n  lineSpacings: {\r\n    md: \"1.15\",\r\n    lg: \"1.44444\"\r\n  },\r\n\r\n  fontSizes: {\r\n    root: 16, // in px\r\n    sm: \"0.75rem\",\r\n    md: \"0.9375rem\",\r\n    lg: \"1.125rem\"\r\n  }\r\n};\r\n","import React from \"react\";\r\nimport { Global, css } from \"@emotion/core\";\r\nimport emotionNormalize from \"emotion-normalize\";\r\nimport styleConstants from \"styles/constants\";\r\nimport font from \"../fonts/VAGRounded-Light.ttf\";\r\nimport font1 from \"../fonts/VAGRounded-Light.eot\";\r\nimport font2 from \"../fonts/VAGRounded-Light.svg\";\r\nimport font4 from \"../fonts/VAGRounded-Light.woff\";\r\nimport font5 from \"../fonts/VAGRounded-Light.woff2\";\r\nimport font6 from \"../fonts/VAGRounded-Light.otf\";\r\n\r\nexport default () => (\r\n  <Global\r\n    styles={css`\r\n      ${emotionNormalize}\r\n\r\n      @font-face {\r\n        font-family: \"VAG Rounded Light\";\r\n        src: url(\"${font1}\"); \r\n        src: url(\"${font1}?#iefix\") format(\"embedded-opentype\"), /* IE6-IE8 */\r\n              url(\"${font6}\") format(\"opentype\"), /* Open Type Font */\r\n              url(\"${font2}\") format(\"svg\"), /* Legacy iOS */\r\n              url(\"${font}\") format(\"truetype\"), /* Safari, Android, iOS */\r\n              url(\"${font4}\") format(\"woff\"), /* Modern Browsers */\r\n              url(\"${font5}\") format(\"woff2\"); /* Modern Browsers */\r\n      }\r\n\r\n      html {\r\n        line-height: ${styleConstants.lineSpacings.md};\r\n      }\r\n\r\n      body {\r\n        overflow-x: hidden;\r\n        padding-bottom: 2rem;\r\n        font-family: \"VAG Rounded Light\";\r\n      }\r\n\r\n      h1,\r\n      h2,\r\n      h3,\r\n      h4,\r\n      h5,\r\n      h6,\r\n      h7,\r\n      p,\r\n      ol,\r\n      ul,\r\n      li {\r\n        font-weight:normal;\r\n        margin: 0;\r\n        padding: 0;\r\n        letter-spacing: 0.05em;\r\n      }\r\n\r\n      ol,\r\n      ul {\r\n        padding-left: 0.5rem;\r\n        list-style-position: inside;\r\n      }\r\n\r\n      button:focus {\r\n        outline: 0;\r\n      }\r\n\r\n      * {\r\n        user-select: none;\r\n      }\r\n    `}\r\n  />\r\n);\r\n","import React, { forwardRef } from \"react\";\r\nimport styled from \"@emotion/styled\";\r\n\r\nconst Box = styled.div`\r\nposition: absolute;\r\n${props => props.y && `top: ${props.y};`}\r\n${props => props.x && `left: ${props.x};`}\r\n${props => props.width && `width: ${props.width};`}\r\n${props => props.height && `height: ${props.height};`}\r\n${props => props.minHeight && `min-height: ${props.minHeight};`}\r\n${props => props.minWidth && `min-width: ${props.minWidth};`}\r\n${props => props.centered && `transform: translateX(-50%) translateY(-50%);`}\r\n`;\r\n\r\nexport default forwardRef(({ children, ...props }, ref) => (\r\n  <Box {...props} ref={ref}>\r\n    {children}\r\n  </Box>\r\n));\r\n","import React, { forwardRef } from \"react\";\r\nimport styled from \"@emotion/styled\";\r\n\r\nconst Outer = styled.div`\r\n  position: relative;\r\n  padding-top: ${props => props.padding};\r\n`;\r\n\r\nconst Inner = styled.div`\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  height: 100%;\r\n  width: 100%;\r\n`;\r\n\r\nexport default forwardRef(({ ratio = 16 / 9, children, outerProps, innerProps }, ref) => (\r\n  <Outer padding={`${(1 / ratio) * 100}%`} {...outerProps}>\r\n    <Inner ref={ref} {...innerProps}>{children}</Inner>\r\n  </Outer>\r\n));\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport AbsoluteBox from \"../absolute-box/absolute-box\";\r\nimport AspectRatioBox from \"../aspect-ratio-box/aspect-ratio-box\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\n// TODO: could use AbsoluteBox atom here\r\n\r\nconst Button = styled.button`\r\n  padding: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  display: block;\r\n  background-color: ${props =>\r\n    !props.active\r\n      ? styleConstants.colors.primaryLighter\r\n      : props.transparent\r\n      ? \"#00000000\"\r\n      : styleConstants.colors.primary};\r\n  border-radius: 10px;\r\n  opacity: ${props => (props.active ? 0.4 : 0.3)};\r\n  transition: all 0.25s;\r\n  :hover {\r\n    background-color: ${({ active, transparent }) =>\r\n      !active || !transparent ? styleConstants.colors.primary : \"#00000000\"};\r\n    opacity: 0.4;\r\n  }\r\n`;\r\n\r\nexport default ({\r\n  x,\r\n  y,\r\n  width,\r\n  height,\r\n  centered,\r\n  aspectRatio,\r\n  active = false,\r\n  transparent = false,\r\n  onClick\r\n}) => (\r\n  <AbsoluteBox x={x} y={y} width={width} height={height} centered={centered}>\r\n    <Button active={active} transparent={transparent} onClick={onClick}>\r\n      {aspectRatio && <AspectRatioBox ratio={aspectRatio} />}\r\n    </Button>\r\n  </AbsoluteBox>\r\n);\r\n","import React, { useState, useEffect, useRef } from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport { css } from \"@emotion/core\";\r\nimport AspectRatioBox from \"../../atoms/aspect-ratio-box/aspect-ratio-box\";\r\nimport buttonDownGif from \"./button-down.gif\";\r\n\r\nconst Button = styled.button`\r\n  width: 100%;\r\n  height: 100%;\r\n  border-radius: 50%;\r\n  background-color: transparent;\r\n  /* background-color: #0000ffaa; */\r\n  border-width: 0;\r\n`;\r\n\r\nconst Animation = styled.img`\r\n  position: absolute;\r\n  width: 200%;\r\n  height: 200%;\r\n  left: -50%;\r\n  top: -50%;\r\n  pointer-events: none;\r\n`;\r\n\r\nexport default ({ onMouseDown, onMouseUp, onNext, onEnter, onExit }) => {\r\n  const [mouseDownTime, setMouseDownTime] = useState(0);\r\n  const [mouseDownDuration, setMouseDownDuration] = useState(0);\r\n  const mouseDown = mouseDownTime > 0;\r\n  const animationRef = useRef();\r\n\r\n  useEffect(() => {\r\n    if (!mouseDown) return;\r\n    if (mouseDownDuration <= 0) {\r\n      animationRef.current.src = \"\";\r\n      animationRef.current.src = buttonDownGif + '?a=\"+' + Math.random();\r\n    }\r\n    const handle = setTimeout(() => {\r\n      setMouseDownDuration(new Date().getTime() - mouseDownTime);\r\n    }, 100);\r\n    return () => {\r\n      clearTimeout(handle);\r\n    };\r\n  }, [mouseDown, mouseDownTime, mouseDownDuration]);\r\n\r\n  const handleMouseDown = e => {\r\n    e.preventDefault();\r\n    e.stopPropagation();\r\n    setMouseDownTime(new Date().getTime());\r\n    onMouseDown && onMouseDown();\r\n  };\r\n\r\n  const handleMouseUp = e => {\r\n    e.preventDefault();\r\n    e.stopPropagation();\r\n    if (!mouseDown) return;\r\n    setMouseDownTime(0);\r\n    setMouseDownDuration(0);\r\n    if (mouseDownDuration < 1900) {\r\n      onNext && onNext();\r\n    } else if (mouseDownDuration < 4900) {\r\n      onEnter && onEnter();\r\n    } else {\r\n      onExit && onExit();\r\n    }\r\n    onMouseUp && onMouseUp();\r\n  };\r\n\r\n  return (\r\n    <AspectRatioBox\r\n      ratio={1}\r\n      outerProps={{\r\n        css: css`\r\n          overflow: visible;\r\n          border-radius: 50%;\r\n        `\r\n      }}\r\n      innerProps={{\r\n        css: css`\r\n          border-radius: 50%;\r\n        `\r\n      }}\r\n    >\r\n      {mouseDown && <Animation src={buttonDownGif} ref={animationRef} />}\r\n      <Button\r\n        onMouseDown={handleMouseDown}\r\n        onMouseLeave={handleMouseUp}\r\n        onMouseUp={handleMouseUp}\r\n        onTouchStart={handleMouseDown}\r\n        onTouchCancel={handleMouseUp}\r\n        onTouchEnd={handleMouseUp}\r\n        onSelect={e => {\r\n          return false;\r\n        }}\r\n      ></Button>\r\n    </AspectRatioBox>\r\n  );\r\n};\r\n","import React, { useState, useEffect } from 'react';\r\nimport styled from '@emotion/styled';\r\nimport { css } from '@emotion/core';\r\nimport { useHistory, useRouteMatch, useLocation } from 'react-router-dom';\r\nimport AbsoluteBox from '../../atoms/absolute-box/absolute-box';\r\nimport HighlightButton from '../../atoms/highlight-button/highlight-button';\r\nimport SimulationButton from '../../molecules/simulation-button/simulation-button';\r\nimport full from './assets/full.png';\r\nimport overview from './assets/overview.png';\r\nimport overviewPressed from './assets/overview-pressed.png';\r\nimport simulation from './assets/simulation.png';\r\nimport simulationPressed from './assets/simulation-pressed.png';\r\nimport fullToOverview from './assets/animations/full-to-overview.mp4';\r\nimport overviewToFull from './assets/animations/overview-to-full.mp4';\r\nimport overviewToSimulation from './assets/animations/overview-to-simulation.mp4';\r\nimport simulationToOverview from './assets/animations/simulation-to-overview.mp4';\r\nimport simulationToFull from './assets/animations/simulation-to-full.mp4';\r\nimport main1Display from './assets/simulation/main/1.png';\r\nimport main2Display from './assets/simulation/main/2.png';\r\nimport main3Display from './assets/simulation/main/3.png';\r\nimport main4Display from './assets/simulation/main/4.png';\r\nimport main5Display from './assets/simulation/main/5.png';\r\nimport main6Display from './assets/simulation/main/6.png';\r\nimport mainStandard1Display from './assets/simulation/main-standard/1.png';\r\nimport mainStandard2Display from './assets/simulation/main-standard/2.png';\r\nimport mainStandard3Display from './assets/simulation/main-standard/3.png';\r\nimport mainStandard4Display from './assets/simulation/main-standard/4.png';\r\nimport mainStandard5Display from './assets/simulation/main-standard/5.png';\r\nimport mainStandard6Display from './assets/simulation/main-standard/6.png';\r\nimport mainStandard7Display from './assets/simulation/main-standard/7.png';\r\nimport mainStandard8Display from './assets/simulation/main-standard/8.png';\r\nimport mainStandard9Display from './assets/simulation/main-standard/9.png';\r\nimport mainStandard10Display from './assets/simulation/main-standard/10.png';\r\nimport mainStandard11Display from './assets/simulation/main-standard/11.png';\r\nimport mainExtended1Display from './assets/simulation/main-extended/1.png';\r\nimport mainExtended2Display from './assets/simulation/main-extended/2.png';\r\nimport mainExtended3Display from './assets/simulation/main-extended/3.png';\r\nimport mainExtended4Display from './assets/simulation/main-extended/4.png';\r\nimport mainExtended5Display from './assets/simulation/main-extended/5.png';\r\nimport mainExtended6Display from './assets/simulation/main-extended/6.png';\r\nimport mainExtended7Display from './assets/simulation/main-extended/7.png';\r\nimport mainExtended8Display from './assets/simulation/main-extended/8.png';\r\nimport mainExtended9Display from './assets/simulation/main-extended/9.png';\r\nimport mainExtended10Display from './assets/simulation/main-extended/10.png';\r\nimport mainExtended11Display from './assets/simulation/main-extended/11.png';\r\nimport mainExtended12Display from './assets/simulation/main-extended/12.png';\r\nimport mainExtended13Display from './assets/simulation/main-extended/13.png';\r\nimport mainExtended14Display from './assets/simulation/main-extended/14.png';\r\nimport mainExtended15Display from './assets/simulation/main-extended/15.png';\r\nimport mainExtended16Display from './assets/simulation/main-extended/16.png';\r\nimport mainExtended17Display from './assets/simulation/main-extended/17.png';\r\nimport mainExtended18Display from './assets/simulation/main-extended/18.png';\r\nimport mainReserves1Display from './assets/simulation/main-reserves/1.png';\r\nimport mainReserves2Display from './assets/simulation/main-reserves/2.png';\r\nimport mainReserves3Display from './assets/simulation/main-reserves/3.png';\r\nimport mainReserves4Display from './assets/simulation/main-reserves/4.png';\r\nimport mainReserves5Display from './assets/simulation/main-reserves/5.png';\r\nimport mainReserves6Display from './assets/simulation/main-reserves/6.png';\r\nimport mainReserves7Display from './assets/simulation/main-reserves/7.png';\r\nimport mainReserves8Display from './assets/simulation/main-reserves/8.png';\r\nimport mainReserves9Display from './assets/simulation/main-reserves/9.png';\r\nimport mainReserves10Display from './assets/simulation/main-reserves/10.png';\r\nimport mainReserves11Display from './assets/simulation/main-reserves/11.png';\r\nimport mainReserves12Display from './assets/simulation/main-reserves/12.png';\r\nimport mainReserves13Display from './assets/simulation/main-reserves/13.png';\r\nimport mainReserves14Display from './assets/simulation/main-reserves/14.png';\r\nimport mainReserves15Display from './assets/simulation/main-reserves/15.png';\r\nimport mainReserves16Display from './assets/simulation/main-reserves/16.png';\r\nimport mainReserves17Display from './assets/simulation/main-reserves/17.png';\r\nimport mainLP11Display from './assets/simulation/main-lp1/1.png';\r\nimport mainLP12Display from './assets/simulation/main-lp1/2.png';\r\nimport mainLP13Display from './assets/simulation/main-lp1/3.png';\r\nimport mainLP14Display from './assets/simulation/main-lp1/4.png';\r\nimport mainLP15Display from './assets/simulation/main-lp1/5.png';\r\nimport mainLP16Display from './assets/simulation/main-lp1/6.png';\r\nimport mainLP17Display from './assets/simulation/main-lp1/7.png';\r\nimport mainLP18Display from './assets/simulation/main-lp1/8.png';\r\nimport mainLP19Display from './assets/simulation/main-lp1/9.png';\r\nimport mainLP1Entries1_1Display from './assets/simulation/main-lp1-entries/intervals/1.png';\r\nimport mainLP1Entries1_2Display from './assets/simulation/main-lp1-entries/intervals/2.png';\r\nimport mainLP1Entries1_3Display from './assets/simulation/main-lp1-entries/intervals/3.png';\r\nimport mainLP1Entries1_4Display from './assets/simulation/main-lp1-entries/intervals/4.png';\r\nimport mainLP1Entries1_5Display from './assets/simulation/main-lp1-entries/intervals/5.png';\r\nimport mainLP1Entries1_6Display from './assets/simulation/main-lp1-entries/intervals/6.png';\r\nimport mainLP1Entries1_7Display from './assets/simulation/main-lp1-entries/intervals/7.png';\r\nimport mainLP1Entries1_8Display from './assets/simulation/main-lp1-entries/intervals/8.png';\r\nimport mainLP1Entries1_9Display from './assets/simulation/main-lp1-entries/intervals/9.png';\r\nimport mainLP1Entries2Display from './assets/simulation/main-lp1-entries/2.png';\r\nimport mainLP1Entries3Display from './assets/simulation/main-lp1-entries/3.png';\r\nimport mainLP1Entries4Display from './assets/simulation/main-lp1-entries/4.png';\r\nimport mainLP1Entries5Display from './assets/simulation/main-lp1-entries/5.png';\r\nimport mainLP1Entries6Display from './assets/simulation/main-lp1-entries/6.png';\r\nimport mainLP21Display from './assets/simulation/main-lp2/1.png';\r\nimport mainLP22Display from './assets/simulation/main-lp2/2.png';\r\nimport mainLP23Display from './assets/simulation/main-lp2/3.png';\r\nimport mainLP24Display from './assets/simulation/main-lp2/4.png';\r\nimport mainLP25Display from './assets/simulation/main-lp2/5.png';\r\nimport mainLP26Display from './assets/simulation/main-lp2/6.png';\r\nimport mainLP27Display from './assets/simulation/main-lp2/7.png';\r\nimport mainLP28Display from './assets/simulation/main-lp2/8.png';\r\nimport mainLP29Display from './assets/simulation/main-lp2/9.png';\r\nimport mainLP2Entries1Display from './assets/simulation/main-lp2-entries/1.png';\r\nimport mainLP2Entries2Display from './assets/simulation/main-lp2-entries/2.png';\r\nimport mainLP2Entries3Display from './assets/simulation/main-lp2-entries/3.png';\r\nimport mainLP2Entries4Display from './assets/simulation/main-lp2-entries/4.png';\r\nimport mainLP2Entries5Display from './assets/simulation/main-lp2-entries/5.png';\r\nimport mainLP2Entries6Display from './assets/simulation/main-lp2-entries/6.png';\r\nimport mainLP2Entries7Display from './assets/simulation/main-lp2-entries/7.png';\r\nimport mainLP2Entries8Display from './assets/simulation/main-lp2-entries/8.png';\r\nimport mainLP2Entries9Display from './assets/simulation/main-lp2-entries/9.png';\r\nimport mainLP2Entries10Display from './assets/simulation/main-lp2-entries/10.png';\r\nimport mainLP2Entries11Display from './assets/simulation/main-lp2-entries/11.png';\r\nimport mainLP2Entries12Display from './assets/simulation/main-lp2-entries/12.png';\r\nimport mainLP2Entries13Display from './assets/simulation/main-lp2-entries/13.png';\r\nimport mainLP2Entries14Display from './assets/simulation/main-lp2-entries/14.png';\r\n\r\nconst Image = styled.img`\r\n  width: 100%;\r\n  user-select: none;\r\n  pointer-events: none;\r\n`;\r\n\r\nconst DisplayImage = styled.img`\r\n  width: 100%;\r\n  height: 100%;\r\n  border-radius: 5px;\r\n  user-select: none;\r\n  pointer-events: none;\r\n`;\r\n\r\nconst Video = styled.video`\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  user-select: none;\r\n  pointer-events: none;\r\n`;\r\n\r\nconst altText = 'Visualisation of the Smart Meter';\r\n\r\nconst ElementHighlightButton = ({ path, ...props }) => {\r\n  const history = useHistory();\r\n  const active = history.location.pathname === path;\r\n  return (\r\n    <HighlightButton\r\n      {...props}\r\n      {...(!active && {\r\n        onClick: () => history.push(path),\r\n      })}\r\n      active={active}\r\n    />\r\n  );\r\n};\r\n\r\nexport default ({ placeholderRect }) => {\r\n  if (!placeholderRect) {\r\n    return null; // no need to render without a placeholder to position at\r\n  }\r\n\r\n  const history = useHistory();\r\n  const routeMatch = useRouteMatch('/:mode');\r\n  const newAsset = routeMatch ? routeMatch.params.mode : 'full';\r\n  const location = useLocation();\r\n\r\n  const [asset, setAsset] = useState(newAsset);\r\n  const [simulationButtonDown, setSimulationButtonDown] = useState(false);\r\n  const [loading, setLoading] = useState(false);\r\n\r\n  const images = {\r\n    full: full,\r\n    overview: overview,\r\n    'overview-pressed': overviewPressed,\r\n    simulation: simulation,\r\n    'simulation-pressed': simulationPressed,\r\n  };\r\n\r\n  const animations = {\r\n    'full-to-overview': fullToOverview,\r\n    'overview-to-full': overviewToFull,\r\n    'overview-to-simulation': overviewToSimulation,\r\n    'simulation-to-overview': simulationToOverview,\r\n    'simulation-to-full': simulationToFull,\r\n  };\r\n\r\n  const animationMatch = asset.match(/([a-z]+)-to-([a-z]+)/);\r\n  const imageKey = `${\r\n    !animationMatch ? asset : loading ? animationMatch[1] : animationMatch[2]\r\n  }${simulationButtonDown ? '-pressed' : ''}`;\r\n  const image = images[imageKey];\r\n  const animation = animationMatch ? animations[asset] : '';\r\n\r\n  useEffect(() => {\r\n    if (animationMatch) {\r\n      return;\r\n    }\r\n\r\n    if (newAsset !== asset) {\r\n      setAsset(`${asset}-to-${newAsset}`);\r\n      setLoading(true);\r\n    }\r\n  }, [animationMatch, asset, newAsset]);\r\n\r\n  const renderOverviewElements = () => (\r\n    <React.Fragment>\r\n      <AbsoluteBox width=\"33%\" height=\"15.5%\" x=\"50%\" y=\"66.5%\" centered>\r\n        <DisplayImage\r\n          src={mainStandard10Display}\r\n          alt=\"Display of the Smart Meter\"\r\n        />\r\n      </AbsoluteBox>\r\n\r\n      <ElementHighlightButton\r\n        path=\"/overview/button\"\r\n        y=\"67.25%\"\r\n        x=\"22.5%\"\r\n        width=\"13%\"\r\n        centered\r\n        aspectRatio={1}\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/diodes\"\r\n        y=\"66%\"\r\n        x=\"78.5%\"\r\n        width=\"18%\"\r\n        height=\"7%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/display\"\r\n        y=\"66.5%\"\r\n        x=\"50%\"\r\n        width=\"35%\"\r\n        height=\"17%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/registers\"\r\n        y=\"89%\"\r\n        x=\"48%\"\r\n        width=\"35%\"\r\n        height=\"20%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/vendor\"\r\n        y=\"92%\"\r\n        x=\"14%\"\r\n        width=\"27%\"\r\n        height=\"8.5%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/type\"\r\n        y=\"46.5%\"\r\n        x=\"13.5%\"\r\n        width=\"25%\"\r\n        height=\"6%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/data\"\r\n        y=\"54.25%\"\r\n        x=\"13.5%\"\r\n        width=\"25%\"\r\n        height=\"10%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/serial\"\r\n        y=\"47.75%\"\r\n        x=\"49.75%\"\r\n        width=\"43%\"\r\n        height=\"8%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/certification\"\r\n        y=\"50.75%\"\r\n        x=\"85%\"\r\n        width=\"23%\"\r\n        height=\"14%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/plc\"\r\n        y=\"77%\"\r\n        x=\"62.5%\"\r\n        width=\"4%\"\r\n        height=\"3%\"\r\n        centered\r\n      />\r\n      <ElementHighlightButton\r\n        path=\"/overview/badge\"\r\n        y=\"86.25%\"\r\n        x=\"60.25%\"\r\n        width=\"7%\"\r\n        height=\"10%\"\r\n        centered\r\n      />\r\n      <AbsoluteBox\r\n        width={simulationButtonDown ? '9%' : '10%'}\r\n        x={simulationButtonDown ? '18.25%' : '17.5%'}\r\n        y={simulationButtonDown ? '62.8%' : '62.5%'}\r\n        css={css`\r\n          border-radius: 50%;\r\n        `}\r\n      >\r\n        <SimulationButton\r\n          onMouseDown={() => setSimulationButtonDown(true)}\r\n          onMouseUp={() => setSimulationButtonDown(false)}\r\n          onNext={() => history.push('/simulation/main/1')}\r\n        />\r\n      </AbsoluteBox>\r\n    </React.Fragment>\r\n  );\r\n\r\n  const simulationRouteMatch = useRouteMatch('/simulation/:menu/:display');\r\n  const simulationItemRouteMatch = useRouteMatch(\r\n    '/simulation/:menu/:display/:item'\r\n  );\r\n  const renderSimulationElements = () => {\r\n    if (!simulationRouteMatch) {\r\n      return null;\r\n    }\r\n    const menu = simulationRouteMatch.params.menu;\r\n    const display = parseInt(simulationRouteMatch.params.display, 10) - 1;\r\n    const item = simulationItemRouteMatch?.params?.item;\r\n\r\n    const displays = {\r\n      main: [\r\n        { display: main1Display, enter: 'main-standard' },\r\n        { display: main2Display, enter: 'main-extended' },\r\n        { display: main3Display, enter: 'main-reserves' },\r\n        { display: main4Display, enter: 'main-lp1' },\r\n        { display: main5Display, enter: 'main-lp2' },\r\n        { display: main6Display },\r\n      ],\r\n      'main-standard': [\r\n        { display: mainStandard1Display, exit: 'main' },\r\n        { display: mainStandard2Display, exit: 'main' },\r\n        { display: mainStandard3Display, exit: 'main' },\r\n        { display: mainStandard4Display, exit: 'main' },\r\n        { display: mainStandard5Display, exit: 'main' },\r\n        { display: mainStandard6Display, exit: 'main' },\r\n        { display: mainStandard7Display, exit: 'main' },\r\n        { display: mainStandard8Display, exit: 'main' },\r\n        { display: mainStandard9Display, exit: 'main' },\r\n        { display: mainStandard10Display, exit: 'main' },\r\n        { display: mainStandard11Display, exit: 'main' },\r\n      ],\r\n      'main-extended': [\r\n        { display: mainExtended1Display, exit: 'main' },\r\n        { display: mainExtended2Display, exit: 'main' },\r\n        { display: mainExtended3Display, exit: 'main' },\r\n        { display: mainExtended4Display, exit: 'main' },\r\n        { display: mainExtended5Display, exit: 'main' },\r\n        { display: mainExtended6Display, exit: 'main' },\r\n        { display: mainExtended7Display, exit: 'main' },\r\n        { display: mainExtended8Display, exit: 'main' },\r\n        { display: mainExtended9Display, exit: 'main' },\r\n        { display: mainExtended10Display, exit: 'main' },\r\n        { display: mainExtended11Display, exit: 'main' },\r\n        { display: mainExtended12Display, exit: 'main' },\r\n        { display: mainExtended13Display, exit: 'main' },\r\n        { display: mainExtended14Display, exit: 'main' },\r\n        { display: mainExtended15Display, exit: 'main' },\r\n        { display: mainExtended16Display, exit: 'main' },\r\n        { display: mainExtended17Display, exit: 'main' },\r\n        { display: mainExtended18Display, exit: 'main' },\r\n      ],\r\n      'main-reserves': [\r\n        { display: mainReserves1Display, exit: 'main' },\r\n        { display: mainReserves2Display, exit: 'main' },\r\n        { display: mainReserves3Display, exit: 'main' },\r\n        { display: mainReserves4Display, exit: 'main' },\r\n        { display: mainReserves5Display, exit: 'main' },\r\n        { display: mainReserves6Display, exit: 'main' },\r\n        { display: mainReserves7Display, exit: 'main' },\r\n        { display: mainReserves8Display, exit: 'main' },\r\n        { display: mainReserves9Display, exit: 'main' },\r\n        { display: mainReserves10Display, exit: 'main' },\r\n        { display: mainReserves11Display, exit: 'main' },\r\n        { display: mainReserves12Display, exit: 'main' },\r\n        { display: mainReserves13Display, exit: 'main' },\r\n        { display: mainReserves14Display, exit: 'main' },\r\n        { display: mainReserves15Display, exit: 'main' },\r\n        { display: mainReserves16Display, exit: 'main' },\r\n        { display: mainReserves17Display, exit: 'main' },\r\n      ],\r\n      'main-lp1': [\r\n        { display: mainLP11Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP12Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP13Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP14Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP15Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP16Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP17Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP18Display, enter: 'main-lp1-entries', exit: 'main' },\r\n        { display: mainLP19Display, enter: 'main-lp1-entries', exit: 'main' },\r\n      ],\r\n      'main-lp1-entries': [\r\n        { display: mainLP1Entries1_1Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_7Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_8Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries1_9Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries2Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries3Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries4Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries5Display, exit: 'main-lp1' },\r\n        { display: mainLP1Entries6Display, exit: 'main-lp1' },\r\n      ],\r\n      'main-lp2': [\r\n        { display: mainLP21Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP22Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP23Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP24Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP25Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP26Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP27Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP28Display, enter: 'main-lp2-entries', exit: 'main' },\r\n        { display: mainLP29Display, enter: 'main-lp2-entries', exit: 'main' },\r\n      ],\r\n      'main-lp2-entries': [\r\n        { display: mainLP2Entries1Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries2Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries3Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries4Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries5Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries6Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries7Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries8Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries9Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries10Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries11Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries12Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries13Display, exit: 'main-lp2' },\r\n        { display: mainLP2Entries14Display, exit: 'main-lp2' },\r\n      ],\r\n    };\r\n\r\n    const nextDisplay = (display + 1) % displays[menu].length;\r\n\r\n    const renderRegisterDisplayHighlights = (\r\n      menu,\r\n      display,\r\n      obisWidth,\r\n      dataWidth\r\n    ) => {\r\n      return (\r\n        <React.Fragment>\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/obis`}\r\n            width={obisWidth}\r\n            height=\"6%\"\r\n            y=\"53%\"\r\n            x=\"32%\"\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/tariff`}\r\n            width=\"8%\"\r\n            height=\"6%\"\r\n            y=\"55.75%\"\r\n            x=\"82.5%\"\r\n            centered\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/data`}\r\n            width={dataWidth}\r\n            height=\"8%\"\r\n            y=\"64.75%\"\r\n            x=\"58.5%\"\r\n            centered\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/phase`}\r\n            width=\"11%\"\r\n            height=\"7%\"\r\n            y=\"74.5%\"\r\n            x=\"37.25%\"\r\n            centered\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/profile`}\r\n            width=\"8.5%\"\r\n            height=\"7%\"\r\n            y=\"74.5%\"\r\n            x=\"50%\"\r\n            centered\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/relais`}\r\n            width=\"10.5%\"\r\n            height=\"7%\"\r\n            y=\"74.5%\"\r\n            x=\"63.5%\"\r\n            centered\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/mid`}\r\n            width=\"6.5%\"\r\n            height=\"7%\"\r\n            y=\"74.5%\"\r\n            x=\"73%\"\r\n            centered\r\n            transparent\r\n          />\r\n          <ElementHighlightButton\r\n            path={`/simulation/${menu}/${display}/pc`}\r\n            width=\"8.5%\"\r\n            height=\"7%\"\r\n            y=\"74.5%\"\r\n            x=\"82.5%\"\r\n            centered\r\n            transparent\r\n          />\r\n        </React.Fragment>\r\n      );\r\n    };\r\n\r\n    return (\r\n      <React.Fragment>\r\n        <AbsoluteBox width=\"55.6%\" height=\"26%\" x=\"58.65%\" y=\"64.85%\" centered>\r\n          <DisplayImage\r\n            src={displays[menu][display].display}\r\n            alt=\"Display of the Smart Meter\"\r\n          />\r\n        </AbsoluteBox>\r\n        {\r\n          {\r\n            main: [],\r\n            'main-standard': [\r\n              null,\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '2',\r\n                '17%',\r\n                '38%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '3',\r\n                '17%',\r\n                '38%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '4',\r\n                '17%',\r\n                '38%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '5',\r\n                '17%',\r\n                '38%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '6',\r\n                '17%',\r\n                '38%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '7',\r\n                '17%',\r\n                '38%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '8',\r\n                '17%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '9',\r\n                '17%',\r\n                '32%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '10',\r\n                '23%',\r\n                '40%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-standard',\r\n                '11',\r\n                '12%',\r\n                '30%'\r\n              ),\r\n            ],\r\n            'main-extended': [\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '1',\r\n                '17%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '2',\r\n                '17%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '3',\r\n                '17%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '4',\r\n                '17%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '5',\r\n                '17%',\r\n                '25%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '6',\r\n                '17%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '7',\r\n                '17%',\r\n                '35%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '8',\r\n                '17%',\r\n                '27%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '9',\r\n                '18%',\r\n                '35%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '10',\r\n                '18%',\r\n                '35%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '11',\r\n                '18%',\r\n                '27%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '12',\r\n                '18%',\r\n                '35%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '13',\r\n                '18%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '14',\r\n                '18%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '15',\r\n                '25%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '16',\r\n                '25%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '17',\r\n                '25%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-extended',\r\n                '18',\r\n                '25%',\r\n                '30%'\r\n              ),\r\n            ],\r\n            'main-reserves': [\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '1',\r\n                '26%',\r\n                '50%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '2',\r\n                '26%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '3',\r\n                '26%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '4',\r\n                '26%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '5',\r\n                '26%',\r\n                '25%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '6',\r\n                '26%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '7',\r\n                '26%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '8',\r\n                '26%',\r\n                '32%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '9',\r\n                '26%',\r\n                '31%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '10',\r\n                '26%',\r\n                '31%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '11',\r\n                '26%',\r\n                '31%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '12',\r\n                '26%',\r\n                '31%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '13',\r\n                '26%',\r\n                '32%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '14',\r\n                '26%',\r\n                '23%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '15',\r\n                '27%',\r\n                '50%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '16',\r\n                '26%',\r\n                '22%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-reserves',\r\n                '17',\r\n                '26%',\r\n                '50%'\r\n              ),\r\n            ],\r\n            'main-lp1': Array.from({ length: 9 }, (v, i) =>\r\n              renderRegisterDisplayHighlights('main-lp1', i + 1, '15%', '50%')\r\n            ),\r\n            'main-lp1-entries': Array.from({ length: 9 }, (v, i) => [\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp1-entries',\r\n                i * 6 + 1,\r\n                '15%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp1-entries',\r\n                i * 6 + 2,\r\n                '15%',\r\n                '15%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp1-entries',\r\n                i * 6 + 3,\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp1-entries',\r\n                i * 6 + 4,\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp1-entries',\r\n                i * 6 + 5,\r\n                '20%',\r\n                '32%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp1-entries',\r\n                i * 6 + 6,\r\n                '20%',\r\n                '35%'\r\n              ),\r\n            ]).flat(),\r\n            'main-lp2': Array.from({ length: 9 }, (v, i) =>\r\n              renderRegisterDisplayHighlights('main-lp2', i + 1, '15%', '50%')\r\n            ),\r\n            'main-lp2-entries': [\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '1',\r\n                '15%',\r\n                '50%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '2',\r\n                '15%',\r\n                '20%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '3',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '4',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '5',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '6',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '7',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '8',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '9',\r\n                '20%',\r\n                '35%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '10',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '11',\r\n                '20%',\r\n                '35%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '12',\r\n                '20%',\r\n                '32%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '13',\r\n                '20%',\r\n                '30%'\r\n              ),\r\n              renderRegisterDisplayHighlights(\r\n                'main-lp2-entries',\r\n                '14',\r\n                '20%',\r\n                '35%'\r\n              ),\r\n            ],\r\n          }[menu][display]\r\n        }\r\n        <AbsoluteBox\r\n          width={simulationButtonDown ? '14.5%' : '16%'}\r\n          x={simulationButtonDown ? '6.4%' : '4.75%'}\r\n          y={simulationButtonDown ? '58.75%' : '58.25%'}\r\n        >\r\n          <SimulationButton\r\n            onMouseDown={() => setSimulationButtonDown(true)}\r\n            onMouseUp={() => setSimulationButtonDown(false)}\r\n            onNext={() => {\r\n              if (location.search.indexOf('nextIsExit=true') >= 0) {\r\n                history.push(\r\n                  `/simulation/${displays[menu][display].exit}/1${\r\n                    displays[menu][display].exit !== 'main' ? '/data' : ''\r\n                  }`\r\n                );\r\n                return;\r\n              }\r\n              if (item) {\r\n                history.push(`/simulation/${menu}/${nextDisplay + 1}/${item}`);\r\n              } else {\r\n                history.push(`/simulation/${menu}/${nextDisplay + 1}`);\r\n              }\r\n            }}\r\n            {...(displays[menu][display].enter\r\n              ? {\r\n                  onEnter: () =>\r\n                    history.push(\r\n                      `/simulation/${displays[menu][display].enter}/1${\r\n                        displays[menu][display].enter !== 'main' ? '/data' : ''\r\n                      }`\r\n                    ),\r\n                }\r\n              : menu === 'main-lp1-entries' || menu === 'main-lp2-entries'\r\n              ? {\r\n                  onEnter: () =>\r\n                    history.push(\r\n                      `/simulation/${displays[menu][display].exit}/1/data`\r\n                    ),\r\n                }\r\n              : null)}\r\n            {...(menu === 'main-lp1-entries' || menu === 'main-lp2-entries'\r\n              ? {\r\n                  onExit: () =>\r\n                    history.push(\r\n                      `/simulation/${displays[menu][display].exit}/1/data?nextIsExit=true`\r\n                    ),\r\n                }\r\n              : displays[menu][display].exit\r\n              ? {\r\n                  onExit: () =>\r\n                    history.push(\r\n                      `/simulation/${displays[menu][display].exit}/1${\r\n                        displays[menu][display].exit !== 'main' ? '/data' : ''\r\n                      }`\r\n                    ),\r\n                }\r\n              : null)}\r\n          />\r\n        </AbsoluteBox>\r\n      </React.Fragment>\r\n    );\r\n  };\r\n\r\n  return (\r\n    <AbsoluteBox\r\n      x={`${placeholderRect.x}px`}\r\n      y={`${placeholderRect.y}px`}\r\n      width={`${placeholderRect.width}px`}\r\n      height={`${placeholderRect.height}px`}\r\n      css={css`\r\n        z-index: -1;\r\n        transition: all 0.2s ease-out;\r\n      `}\r\n    >\r\n      <Image src={image} alt={altText} />\r\n\r\n      {!animationMatch && asset === 'overview' && renderOverviewElements()}\r\n      {!animationMatch && asset === 'simulation' && renderSimulationElements()}\r\n\r\n      {animationMatch && (\r\n        <Video\r\n          autoPlay\r\n          onLoadedData={() => setLoading(false)}\r\n          onEnded={() => setAsset(animationMatch[2])}\r\n        >\r\n          <source src={animation} type=\"video/mp4\" />\r\n        </Video>\r\n      )}\r\n    </AbsoluteBox>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.p`\r\n  font-size: ${props => styleConstants.fontSizes[props.fontSize]};\r\n  line-height: ${props => styleConstants.lineSpacings[props.lineSpacing]};\r\n  ${props => props.align && `text-align: ${props.align};`}\r\n  ${props => props.color && `color: ${props.color};`}\r\n`;\r\n\r\n/**\r\n * @param {{\r\n *  fontSize: \"sm\" | \"md\" | \"lg\",\r\n *  lineSpacing: \"md\" | \"lg\",\r\n *  align: undefined | \"start\" | \"end\" | \"center\" | \"left\" | \"right\" | \"inherit\" | \"initial\" | \"justify\" | \"unset\",\r\n *  color: string\r\n * }} Props\r\n */\r\nexport default ({\r\n  fontSize = \"md\",\r\n  lineSpacing = \"md\",\r\n  color = \"#000\",\r\n  align = undefined,\r\n  children,\r\n  ...otherProps\r\n}) => (\r\n  <Wrapper\r\n    fontSize={fontSize}\r\n    lineSpacing={lineSpacing}\r\n    color={color}\r\n    align={align}\r\n    {...otherProps}\r\n  >\r\n    {children}\r\n  </Wrapper>\r\n);\r\n","const breakpoints = [36, 50, 62, 75]; // in rem\r\n\r\nexport default {\r\n  array: breakpoints,\r\n  sm: breakpoints[0],\r\n  md: breakpoints[1],\r\n  lg: breakpoints[2],\r\n  xl: breakpoints[3]\r\n};\r\n","import breakpoints from \"./breakpoints\";\r\n\r\nconst map = breakpoint => `@media (min-width: ${breakpoint}rem)`;\r\n\r\nexport default {\r\n  sm: map(breakpoints.sm),\r\n  md: map(breakpoints.md),\r\n  lg: map(breakpoints.lg),\r\n  xl: map(breakpoints.xl)\r\n};\r\n","import { css } from \"@emotion/core\";\r\nimport mq from \"./media-queries\";\r\n\r\nexport default {\r\n  container: css`\r\n    margin: 0 auto;\r\n    padding: 0 1rem;\r\n    box-sizing: border-box;\r\n    width: 100%;\r\n    ${mq.md} {\r\n      width: 50rem;\r\n    }\r\n  `\r\n};\r\n","import { useState, useEffect, useCallback } from \"react\";\r\n\r\nexport default () => {\r\n  const isClient = typeof window === \"object\";\r\n\r\n  const getSize = useCallback(() => {\r\n    return {\r\n      width: isClient ? window.innerWidth : undefined,\r\n      height: isClient ? window.innerHeight : undefined\r\n    };\r\n  }, [isClient]);\r\n\r\n  const [windowSize, setWindowSize] = useState(getSize());\r\n\r\n  useEffect(() => {\r\n    if (!isClient) {\r\n      return false;\r\n    }\r\n\r\n    function handleResize() {\r\n      setWindowSize(getSize());\r\n    }\r\n\r\n    window.addEventListener(\"resize\", handleResize);\r\n    return () => window.removeEventListener(\"resize\", handleResize);\r\n  }, [getSize, isClient]); // Empty array ensures that effect is only run on mount and unmount\r\n\r\n  return windowSize;\r\n};\r\n","import React, { useRef, useEffect } from \"react\";\r\nimport { css } from \"@emotion/core\";\r\nimport styled from \"@emotion/styled\";\r\nimport AspectRatioBox from \"../../atoms/aspect-ratio-box/aspect-ratio-box\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport layout from \"styles/layout\";\r\nimport mQ from \"styles/media-queries\";\r\nimport useWindowSize from \"utils/use-window-size\";\r\n\r\nconst Wrapper = styled.div`\r\n  ${layout.container};\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst Main = styled.main`\r\n  position: relative;\r\n  margin-bottom: 2rem;\r\n`;\r\n\r\nconst Visualisation = styled.div`\r\n  position: relative;\r\n  width: 100%;\r\n  z-index: -2;\r\n  padding-left: 25%;\r\n  ${mQ.sm} {\r\n    position: absolute;\r\n    padding-left: 0;\r\n  }\r\n`;\r\n\r\nconst Content = styled.div`\r\n  z-index: 5;\r\n  width: 100%;\r\n  transition: all 0.25s ease-in-out;\r\n  ${mQ.sm} {\r\n    box-sizing: border-box;\r\n    width: 50%;\r\n    padding: 6rem 2rem;\r\n    float: right;\r\n  }\r\n  ${mQ.md} {\r\n    padding: 10rem 2rem;\r\n  }\r\n`;\r\n\r\nconst Buttons = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  margin: -0.5rem 0;\r\n`;\r\n\r\nconst Button = styled.div`\r\n  padding: 0.5rem 0;\r\n`;\r\n\r\nexport default ({ header, text, buttons, setVisualisationPlaceholderRect }) => {\r\n  const visualisationPlaceholderRef = useRef();\r\n  const windowSize = useWindowSize();\r\n  useEffect(() => {\r\n    const visualisationRect = visualisationPlaceholderRef.current.getBoundingClientRect();\r\n    const newVisualisationRect = {\r\n      x: visualisationRect.left + window.pageXOffset,\r\n      y: visualisationRect.top + window.pageYOffset,\r\n      width: visualisationRect.width,\r\n      height: visualisationRect.height\r\n    };\r\n    setVisualisationPlaceholderRect(newVisualisationRect);\r\n  }, [\r\n    setVisualisationPlaceholderRect,\r\n    visualisationPlaceholderRef,\r\n    windowSize\r\n  ]);\r\n\r\n  return (\r\n    <Wrapper>\r\n      <div>{header}</div>\r\n      <Main>\r\n        <Visualisation>\r\n          <AspectRatioBox ratio={1} ref={visualisationPlaceholderRef} />\r\n        </Visualisation>\r\n        <Content>\r\n          <Text\r\n            fontSize=\"lg\"\r\n            lineSpacing=\"lg\"\r\n            align=\"center\"\r\n            css={css`\r\n              margin-bottom: 2rem;\r\n            `}\r\n          >\r\n            {text}\r\n          </Text>\r\n          <Buttons>\r\n            {buttons.map((b, i) => (\r\n              <Button key={i}>{b}</Button>\r\n            ))}\r\n          </Buttons>\r\n        </Content>\r\n      </Main>\r\n    </Wrapper>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.h1`\r\n  color: ${styleConstants.colors.primary};\r\n  text-align: center;\r\n  font-size: 4rem;\r\n  margin-bottom: 0.1em;\r\n`;\r\n\r\nexport default ({ children = \"Smart Meter\" }) => <Wrapper>{children}</Wrapper>;\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.h2`\r\n  color: ${styleConstants.colors.primary};\r\n  text-align: center;\r\n  font-size: 2rem;\r\n  :empty::after {\r\n    /* normal line height when empty text */\r\n    content: \".\";\r\n    visibility: hidden;\r\n  }\r\n`;\r\n\r\nexport default ({ children }) => <Wrapper>{children}</Wrapper>;\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport Title from \"../../atoms/title/title\";\r\nimport Subtitle from \"../../atoms/subtitle/subtitle\";\r\n\r\nconst Wrapper = styled.header`\r\n  padding: 2rem 0;\r\n`;\r\n\r\nexport default ({ subtitle = \"\" }) => (\r\n  <Wrapper>\r\n    <Title />\r\n    <Subtitle>{subtitle}</Subtitle>\r\n  </Wrapper>\r\n);\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.button`\r\n  background-color: ${props =>\r\n    props.primary\r\n      ? styleConstants.colors.primary\r\n      : styleConstants.colors.secondary};\r\n  color: ${props => (props.primary ? \"#fff\" : styleConstants.colors.primary)};\r\n  border-width: 0;\r\n  border-radius: 2em;\r\n  padding: 1em 2em;\r\n  letter-spacing: ${styleConstants.letterSpacing.lg};\r\n  text-align: center;\r\n  text-transform: uppercase;\r\n  font-weight: bold;\r\n\r\n  width: ${props => (props.fluid ? \"100%\" : \"auto\")};\r\n\r\n  :hover {\r\n    background-color: ${props =>\r\n      props.primary\r\n        ? styleConstants.colors.primaryDark\r\n        : styleConstants.colors.secondaryDark};\r\n  }\r\n\r\n  :active {\r\n    background-color: ${props =>\r\n      props.primary\r\n        ? styleConstants.colors.primaryDarker\r\n        : styleConstants.colors.secondaryDarker};\r\n  }\r\n`;\r\n\r\nexport default ({ primary = false, fluid = false, onClick, children }) => (\r\n  <Wrapper primary={primary} onClick={onClick} fluid={fluid}>\r\n    {children}\r\n  </Wrapper>\r\n);\r\n","import React from \"react\";\r\nimport Button from \"./button\";\r\nimport { withRouter } from \"react-router\";\r\n\r\nexport default withRouter(\r\n  ({ primary = false, fluid = false, onClick, history, to, children }) => (\r\n    <Button\r\n      primary={primary}\r\n      fluid={fluid}\r\n      onClick={event => {\r\n        onClick && onClick();\r\n        history.push(to);\r\n      }}\r\n    >\r\n      {children}\r\n    </Button>\r\n  )\r\n);\r\n","import React from \"react\";\r\nimport Template from \"../../templates/landing-page/landing-page\";\r\nimport Header from \"../../molecules/header/header\";\r\nimport LinkButton from \"../../atoms/button/link-button\";\r\n\r\nexport default ({ setVisualisationPlaceholderRect }) => {\r\n  return (\r\n    <Template\r\n      header={<Header />}\r\n      setVisualisationPlaceholderRect={setVisualisationPlaceholderRect}\r\n      text={\r\n        \"Der Smart Meter ist ein elektronischer Zähler, der Ihren alten Stromzähler ersetzt. Er misst, wie viel Strom Sie verbrauchen oder auch erzeugen, verschlüsselt diese Daten und sendet sie einmal täglich an den Netzbetreiber.\"\r\n      }\r\n      buttons={[\r\n        <LinkButton to=\"/overview/button\" primary fluid>\r\n          Interaktive Anleitung\r\n        </LinkButton>\r\n        // <LinkButton to=\"/menu\" fluid>\r\n        //   Zur Menü-Übersicht\r\n        // </LinkButton>\r\n      ]}\r\n    />\r\n  );\r\n};\r\n","import React, { useRef, useEffect, useState } from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport { css } from \"@emotion/core\";\r\nimport { useHistory } from \"react-router-dom\";\r\nimport AbsoluteBox from \"../../atoms/absolute-box/absolute-box\";\r\nimport AspectRatioBox from \"../../atoms/aspect-ratio-box/aspect-ratio-box\";\r\nimport layout from \"styles/layout\";\r\nimport useWindowSize from \"utils/use-window-size\";\r\n\r\nconst Wrapper = styled.div`\r\n  ${layout.container};\r\n  display: flex;\r\n  flex-direction: column;\r\n`;\r\n\r\nconst HeaderWrapper = styled.div`\r\n  padding-top: 1rem;\r\n  padding-bottom: 1rem;\r\n`;\r\n\r\nconst ExitLinkWrapper = styled.div`\r\n  text-align: right;\r\n  padding-bottom: 0.25rem;\r\n`;\r\n\r\nconst NavigationWrapper = styled.div`\r\n  padding-bottom: 1.5rem;\r\n`;\r\n\r\nconst Main = styled.main`\r\n  display: flex;\r\n  flex-direction: column;\r\n  position: relative;\r\n`;\r\n\r\nconst DetailsWrapper = styled.section`\r\n  margin-top: 0;\r\n`;\r\n\r\nexport default ({\r\n  exitLink,\r\n  header,\r\n  navigation,\r\n  details,\r\n  visualisationPlaceholderClearPercent,\r\n  setVisualisationPlaceholderRect\r\n}) => {\r\n  const mainElementRef = useRef();\r\n  const visualisationPlaceholderRef = useRef();\r\n  const windowSize = useWindowSize(); // rerender when the window size changes\r\n  const history = useHistory();\r\n  const [\r\n    visualisationPlaceholderOffset,\r\n    setVisualisationPlaceholderOffset\r\n  ] = useState(0);\r\n\r\n  useEffect(() => {\r\n    const mainRect = mainElementRef.current.getBoundingClientRect();\r\n    const visualisationRect = visualisationPlaceholderRef.current.getBoundingClientRect();\r\n    const offset =\r\n      mainRect.height -\r\n      visualisationPlaceholderClearPercent * visualisationRect.height;\r\n    offset !== visualisationPlaceholderOffset &&\r\n      setVisualisationPlaceholderOffset(offset);\r\n    const newVisualisationRect = {\r\n      x: visualisationRect.left + window.pageXOffset,\r\n      y: mainRect.top + offset + window.pageYOffset,\r\n      width: visualisationRect.width,\r\n      height: visualisationRect.height\r\n    };\r\n    setVisualisationPlaceholderRect &&\r\n      setVisualisationPlaceholderRect(newVisualisationRect);\r\n  }, [\r\n    mainElementRef,\r\n    visualisationPlaceholderRef,\r\n    setVisualisationPlaceholderRect,\r\n    windowSize,\r\n    history.location.pathname,\r\n    visualisationPlaceholderClearPercent,\r\n    visualisationPlaceholderOffset\r\n  ]);\r\n\r\n  return (\r\n    <Wrapper>\r\n      <HeaderWrapper>{header}</HeaderWrapper>\r\n      <Main ref={mainElementRef}>\r\n        <ExitLinkWrapper>{exitLink}</ExitLinkWrapper>\r\n        <NavigationWrapper>{navigation}</NavigationWrapper>\r\n        <DetailsWrapper>{details}</DetailsWrapper>\r\n        <AbsoluteBox\r\n          width=\"100%\"\r\n          css={css`\r\n            z-index: -2;\r\n          `}\r\n          ref={visualisationPlaceholderRef}\r\n        >\r\n          <AspectRatioBox ratio={1}>\r\n            <AbsoluteBox\r\n              width=\"100%\"\r\n              height=\"100%\"\r\n              y={`${visualisationPlaceholderOffset}px`}\r\n              css={css`\r\n                margin-bottom: 3rem;\r\n              `}\r\n            />\r\n          </AspectRatioBox>\r\n        </AbsoluteBox>\r\n      </Main>\r\n    </Wrapper>\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.nav`\r\n  padding: 1.125rem 0;\r\n  background-color: ${styleConstants.colors.secondary};\r\n  text-align: center;\r\n  color: ${styleConstants.colors.primary};\r\n  text-transform: uppercase;\r\n  font-size: ${styleConstants.fontSizes.lg};\r\n`;\r\n\r\nexport default ({ children }) => (\r\n  <Wrapper>{children}</Wrapper>\r\n);\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport Text from \"../text/text\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.div`\r\n  width: 3rem;\r\n  height: 3rem;\r\n  background-color: ${styleConstants.colors.primary};\r\n  border-radius: 50%;\r\n  position: relative;\r\n`;\r\n\r\nconst LabelWrapper = styled.span`\r\n  position: absolute;\r\n  top: 50%;\r\n  transform: translateY(-50%);\r\n  width: 100%;\r\n  text-align: center;\r\n  display: inline-block;\r\n`;\r\n\r\nexport default ({ label, ...otherProps }) => (\r\n  <Wrapper {...otherProps}>\r\n    <LabelWrapper>\r\n      <Text fontSize=\"lg\" color=\"#fff\">\r\n        {label}\r\n      </Text>\r\n    </LabelWrapper>\r\n  </Wrapper>\r\n);\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nconst Wrapper = styled.h3`\r\n  color: ${styleConstants.colors.primary};\r\n  font-size: ${styleConstants.fontSizes.lg};\r\n  margin-bottom: 0.5em;\r\n`;\r\n\r\nexport default ({ children, ...otherProps }) => (\r\n  <Wrapper {...otherProps}>{children}</Wrapper>\r\n);\r\n","import React from \"react\";\r\nimport { css } from \"@emotion/core\";\r\nimport { Fragment } from \"react\";\r\nimport ButtonSprite from \"../../atoms/button-sprite/button-sprite\";\r\nimport Heading from \"../../atoms/heading/heading\";\r\nimport Text from \"../../atoms/text/text\";\r\n\r\nexport default ({ spriteLabel = \"\", title, description }) => (\r\n  <Fragment>\r\n    <ButtonSprite\r\n      label={spriteLabel}\r\n      css={css`\r\n        margin: 0 auto 0.5rem;\r\n      `}\r\n    />\r\n    <Heading\r\n      css={css`\r\n        text-align: center;\r\n      `}\r\n    >\r\n      {title}\r\n    </Heading>\r\n    <Text>{description}</Text>\r\n  </Fragment>\r\n);\r\n","import React from \"react\";\r\nimport { css } from \"@emotion/core\";\r\nimport styled from \"@emotion/styled\";\r\nimport { Fragment } from \"react\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport ButtonInstruction from \"../../molecules/button-instruction/button-instruction\";\r\nimport mQ from \"styles/media-queries\";\r\n\r\nconst InstructionsWrapper = styled.div`\r\n  margin: 1rem -0.5rem 0;\r\n  ${mQ.md} {\r\n    width: 75%;\r\n    margin: 0 -0.5rem 0 0;\r\n    float: right;\r\n  }\r\n`;\r\n\r\nconst InstructionWrapper = styled.div`\r\n  width: 33.333%;\r\n  padding: 0 0.5rem;\r\n  box-sizing: border-box;\r\n  float: left;\r\n  ${mQ.md} {\r\n  }\r\n`;\r\n\r\nexport default () => (\r\n  <Fragment>\r\n    <Text\r\n      css={css`\r\n        ${mQ.md} {\r\n          display: inline-block;\r\n          width: 25%;\r\n        }\r\n      `}\r\n    >\r\n      Der Druckknopf dient zur manuellen Bedienung des Zählers. Der Kunde kann\r\n      so durch das Menü scrollen und einen Menüpunkt auswählen oder wieder\r\n      verlassen. Die Länge der Haltedauer bestimmt die Funktion.\r\n    </Text>\r\n    <InstructionsWrapper>\r\n      <InstructionWrapper>\r\n        <ButtonInstruction\r\n          title=\"Knopf kurz drücken\"\r\n          description={\r\n            <Fragment>\r\n              - Menü-Ansicht\r\n              <br />- Navigation im Menü\r\n            </Fragment>\r\n          }\r\n        />\r\n      </InstructionWrapper>\r\n      <InstructionWrapper>\r\n        <ButtonInstruction\r\n          spriteLabel=\"2-5s\"\r\n          title=\"Knopf 2-5 Sekunden gedrückt halten\"\r\n          description=\"Menüpunkt auswählen\"\r\n        />\r\n      </InstructionWrapper>\r\n      <InstructionWrapper>\r\n        <ButtonInstruction\r\n          spriteLabel=\">5s\"\r\n          title=\"Knopf über 5 Sekunden gedrückt halten\"\r\n          description=\"Zurück zum Startbildschirm\"\r\n        />\r\n      </InstructionWrapper>\r\n    </InstructionsWrapper>\r\n  </Fragment>\r\n);\r\n","import React from \"react\";\r\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\r\nimport { faChevronRight } from \"@fortawesome/free-solid-svg-icons\";\r\n\r\nexport default props => <FontAwesomeIcon icon={faChevronRight} {...props} />;\r\n","import React from \"react\";\r\nimport { css } from \"@emotion/core\";\r\nimport { Link } from \"react-router-dom\";\r\nimport Chevron from \"../../atoms/chevron/chevron\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport styleConstants from \"styles/constants\";\r\n\r\nexport default ({ text, to }) => (\r\n  <Link\r\n    css={css`\r\n      text-decoration: none;\r\n      color: ${styleConstants.colors.primary};\r\n    `}\r\n    to={to}\r\n  >\r\n    <Text color={styleConstants.colors.primary}>\r\n      {text}\r\n      <Chevron\r\n        css={css`\r\n          padding-left: 0.5em;\r\n          vertical-align: middle;\r\n          font-size: 1.5em;\r\n        `}\r\n      />\r\n    </Text>\r\n  </Link>\r\n);\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useRouteMatch } from \"react-router-dom\";\r\nimport Template from \"../../templates/general/general\";\r\nimport Header from \"../../molecules/header/header\";\r\nimport Navigation from \"../../molecules/nav/nav\";\r\nimport ButtonDetails from \"../../organisms/button-details/button-details\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport ExitLink from \"../../molecules/exit-link/exit-link\";\r\n\r\nexport default ({ setVisualisationPlaceholderRect }) => {\r\n  const match = useRouteMatch(\"/overview/:element\");\r\n  const routeElement = match?.params?.element;\r\n\r\n  const [element, setElement] = useState(routeElement);\r\n  useEffect(() => {\r\n    if (routeElement && routeElement !== element) {\r\n      setElement(routeElement);\r\n    }\r\n  }, [routeElement, element]);\r\n\r\n  const displayedElement = routeElement || element;\r\n\r\n  return (\r\n    <Template\r\n      exitLink={<ExitLink text=\"Beenden\" to=\"/\" />}\r\n      header={<Header subtitle=\"Geräte-Übersicht\" />}\r\n      navigation={\r\n        <Navigation>\r\n          {\r\n            {\r\n              button: \"Druckknopf\",\r\n              diodes: \"Leuchtdioden\",\r\n              data: \"Technische Daten\",\r\n              registers: \"Registerübersicht\",\r\n              type: \"Zählertyp\",\r\n              serial: \"Zählernummer\",\r\n              certification: \"Zählerzulassungen\",\r\n              vendor: \"Lieferfirma/-standort\",\r\n              badge: \"Eichplakette\",\r\n              display: \"Display\",\r\n              plc: \"Art der Datenübertragung\"\r\n            }[displayedElement]\r\n          }\r\n        </Navigation>\r\n      }\r\n      details={\r\n        {\r\n          button: <ButtonDetails />,\r\n          diodes: (\r\n            <Text>\r\n              Die Dioden blinken entsprechend dem Energieverbrauch. Beim\r\n              Wechselstromzähler ist nur die linke Leuchtdiode aktiv. Je höher\r\n              der Energieverbrauch ist, umso rascher blinken die Dioden.\r\n            </Text>\r\n          ),\r\n          data: (\r\n            <Text>\r\n              Angabe zu den technischen Voraussetzungen und Einsatzbedingungen\r\n              für die Nutzung des Zählers\r\n            </Text>\r\n          ),\r\n          registers: (\r\n            <Text>\r\n              Die für die Zulassung relevanten Register sind unter dem Display\r\n              beschrieben. Im Display werden jedoch nur jene angezeigt, die für\r\n              den jeweiligen Tarif des Kunden relevant sind.\r\n            </Text>\r\n          ),\r\n          badge: (\r\n            <Text>\r\n              Diese Plakette wird von einer Eichstelle, die vom österreichischen\r\n              Bundesamt für Eich- und Vermessungswesen dazu ermächtigt ist, nach\r\n              erfolgreicher Überprüfung der Messgenauigkeit vergeben. Darauf\r\n              ersichtlich ist u.a. das Kalenderjahr der Ausstellung.\r\n            </Text>\r\n          ),\r\n          type: (\r\n            <Text as=\"div\">\r\n              <p>Gibt an, um welche Zählerart es sich handelt, z.B.:</p>\r\n              <ul>\r\n                <li>T210-D Drehstromzähler</li>\r\n                <li>T210-D 2G/4G Drehstromzähler Point to Point Funkzähler</li>\r\n                <li>S210 Wechselstromzähler</li>\r\n                <li>S210 2G/4G Wechselstromzähler Point to Point Funkzähler</li>\r\n                <li>T210-CT Wandlerzähler</li>\r\n                <li>T210-CT 2G/4G Wandlerzähler Point to Point Funkzähler</li>\r\n                <li>T210-D-i Hochamperezähler</li>\r\n                <li>\r\n                  T210-D-i 2G/4G Hochamperezähler Point to Point Funkzähler\r\n                </li>\r\n              </ul>\r\n            </Text>\r\n          ),\r\n          vendor: <Text>Angaben zum Hersteller des Zählers.</Text>,\r\n          serial: (\r\n            <Text>\r\n              Eindeutige Identifikationsnummer (Seriennummer) vom Hersteller,\r\n              wodurch die Zuordnung des Geräts ermöglicht wird.\r\n            </Text>\r\n          ),\r\n          display: (\r\n            <Text>\r\n              Auf dem Display sind unterschiedliche Anzeigen zu Leistung, Bezug,\r\n              Lieferung und der Parametrierung ersichtlich. Wenn der Zahler zum\r\n              Einschalten bereit ist, wird am Display „EINSCHALTBEREIT“\r\n              angezeigt. Dem derzeit angezeigten Display können beispielsweise\r\n              Verbraucherinformationen zum Konfigurationstypen des Zählers\r\n              entnommen werden.\r\n            </Text>\r\n          ),\r\n          certification: (\r\n            <Text>\r\n              Kennzeichnung, dass der Zähler den europäischen und\r\n              österreichischen Richtlinien (u.a. BEV) entspricht.\r\n            </Text>\r\n          ),\r\n          plc: (\r\n            <Text>\r\n              Kennzeichnung, ob der Zähler mittels PLC (Powerline Communication)\r\n              oder P2P (Funknetz) verbunden ist. PLC bedeutet, dass die\r\n              Zählerdaten mittels Stromleitung zur nächsten Trafostation\r\n              übertragen werden. P2P Zähler sind nach aktuellem Stand noch nicht\r\n              im Einsatz.\r\n            </Text>\r\n          )\r\n        }[displayedElement]\r\n      }\r\n      setVisualisationPlaceholderRect={\r\n        routeElement && setVisualisationPlaceholderRect\r\n      }\r\n      visualisationPlaceholderClearPercent={0.4}\r\n    />\r\n  );\r\n};\r\n","import React from \"react\";\r\nimport Chevron from \"../../atoms/chevron/chevron\";\r\nimport { css } from \"@emotion/core\";\r\n\r\nexport default ({ path }) => (\r\n  <React.Fragment>\r\n    {path &&\r\n      Array.isArray(path) &&\r\n      path.reduce((p, c) => (\r\n        <React.Fragment>\r\n          {p}\r\n          <Chevron\r\n            css={css`\r\n              padding: 0 0.25em;\r\n            `}\r\n          />\r\n          {c}\r\n        </React.Fragment>\r\n      ))}\r\n  </React.Fragment>\r\n);\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport { css } from \"@emotion/core\";\r\nimport Chevron from \"../../atoms/chevron/chevron\";\r\n\r\nconst Wrapper = styled.span`\r\n  margin: 0 0.1em;\r\n`;\r\n\r\nexport default ({ count, ...rest }) => {\r\n  const chevrons = [];\r\n  for (let i = 0; i < count; ++i) {\r\n    chevrons.push(\r\n      <Chevron\r\n        key={i}\r\n        css={css`\r\n          margin: 0 -0.1em;\r\n        `}\r\n        {...rest}\r\n      />\r\n    );\r\n  }\r\n\r\n  return <Wrapper>{chevrons}</Wrapper>;\r\n};\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport Heading from \"../../atoms/heading/heading\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport Chevrons from \"../chevrons/chevrons\";\r\nimport mQ from \"styles/media-queries\";\r\n\r\nconst Wrapper = styled.div`\r\n  display: flex;\r\n  margin: 0 -0.25rem;\r\n  padding-left: 0.5rem;\r\n  ${mQ.md} {\r\n    margin: 0 -0.5rem;\r\n    padding-left: 1rem;\r\n  }\r\n`;\r\n\r\nconst IconWrapper = styled.div`\r\n  flex: 0 0 auto;\r\n  padding: 0 0.25rem;\r\n  ${mQ.md} {\r\n    padding: 0 0.5rem;\r\n  }\r\n`;\r\n\r\nconst InstructionWrapper = styled.div`\r\n  flex-grow: 1;\r\n  padding: 0 0.25rem;\r\n  ${mQ.md} {\r\n    padding: 0 0.5rem;\r\n  }\r\n`;\r\n\r\nexport default ({ title, description }) => (\r\n  <Wrapper>\r\n    <IconWrapper>\r\n      <Heading>\r\n        <Chevrons count={3} />\r\n      </Heading>\r\n    </IconWrapper>\r\n    <InstructionWrapper>\r\n      <Heading>{title}</Heading>\r\n      <Text fontSize=\"sm\">{description}</Text>\r\n    </InstructionWrapper>\r\n  </Wrapper>\r\n);\r\n","import React from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport Instruction from \"../../molecules/simulation-instruction/simulation-instruction\";\r\nimport mQ from \"styles/media-queries\";\r\n\r\nconst InstructionsWrapper = styled.div`\r\n  margin: 1rem 0 0;\r\n  ${mQ.sm} {\r\n    margin: 1rem -0.5rem 0;\r\n  }\r\n  ${mQ.md} {\r\n    margin: 1rem -1rem 0;\r\n  }\r\n`;\r\n\r\nconst InstructionWrapper = styled.div`\r\n  display: inline-block;\r\n  box-sizing: border-box;\r\n  padding: 0.5rem 0;\r\n  ${mQ.sm} {\r\n    width: 50%;\r\n    padding: 0.5 0.5rem;\r\n  }\r\n  ${mQ.md} {\r\n    width: 33.333333%;\r\n    padding: 0 1rem;\r\n  }\r\n`;\r\n\r\nexport default ({ data }) => (\r\n  <InstructionsWrapper>\r\n    {data &&\r\n      Array.isArray(data) &&\r\n      data.map((v, i) => (\r\n        <InstructionWrapper>\r\n          <Instruction title={v.title} description={v.description} />\r\n        </InstructionWrapper>\r\n      ))}\r\n  </InstructionsWrapper>\r\n);\r\n","import React from \"react\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport Instructions from \"../../organisms/simulation-instructions/simulation-instructions\";\r\n\r\nexport default ({ description }) => (\r\n  <React.Fragment>\r\n    <Text fontSize=\"lg\" lineSpacing=\"lg\">\r\n      {description}\r\n    </Text>\r\n    <Instructions\r\n      data={[\r\n        {\r\n          title: \"Zum nächsten Menüpunkt\",\r\n          description:\r\n            \"Um zum nächsten Punkt des Menüs zu navigieren, muss der Druckknopf kurz betätigt werden.\"\r\n        },\r\n        {\r\n          title: \"Menüpunkt auswählen\",\r\n          description:\r\n            \"Wird der Knopf 2-5 Sekunden gedrückt, kommt man in das Untermenü des gerade ausgewählten Menüpunktes.\"\r\n        }\r\n      ]}\r\n    />\r\n  </React.Fragment>\r\n);\r\n","import React from \"react\";\r\nimport Text from \"../../atoms/text/text\";\r\nimport Heading from \"../../atoms/heading/heading\";\r\n\r\nexport default ({ heading, description, instructions }) => (\r\n  <React.Fragment>\r\n    <Heading>{heading}</Heading>\r\n    <Text\r\n      fontSize=\"lg\"\r\n      lineSpacing=\"lg\"\r\n      {...(typeof description !== \"string\" && { as: \"div\" })}\r\n    >\r\n      {description}\r\n    </Text>\r\n    {instructions}\r\n  </React.Fragment>\r\n);\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { useRouteMatch, useLocation } from \"react-router-dom\";\r\nimport Template from \"../../templates/general/general\";\r\nimport Header from \"../../molecules/header/header\";\r\nimport Navigation from \"../../molecules/nav/nav\";\r\nimport ExitLink from \"../../molecules/exit-link/exit-link\";\r\nimport Breadcrumbs from \"../../molecules/breadcrumbs/breadcrumbs\";\r\nimport MenuDetails from \"../../organisms/simulation-menu/simulation-menu\";\r\nimport DisplayDetails from \"../../organisms/simulation-display/simulation-display\";\r\nimport Instructions from \"../../organisms/simulation-instructions/simulation-instructions\";\r\n\r\nexport default ({ setVisualisationPlaceholderRect }) => {\r\n  const routeMatch = useRouteMatch(\"/simulation/:menu/:display\");\r\n  const displayRouteMatch = useRouteMatch(\r\n    \"/simulation/:menu/:display/:element\"\r\n  );\r\n  const location = useLocation();\r\n\r\n  const routePath = [\r\n    routeMatch?.params?.menu,\r\n    routeMatch?.params?.display &&\r\n      parseInt(routeMatch?.params?.display, 10) - 1,\r\n    displayRouteMatch?.params?.element\r\n  ];\r\n\r\n  const [path, setPath] = useState([\"main\", 0, undefined]);\r\n\r\n  useEffect(() => {\r\n    if (\r\n      (routePath[0] && routePath[0] !== path[0]) ||\r\n      (routePath[1] && routePath[1] !== path[1]) ||\r\n      (routePath[2] && routePath[2] !== path[2])\r\n    ) {\r\n      setPath(routePath);\r\n    }\r\n  }, [path, routePath]);\r\n\r\n  const activePath = [\r\n    routePath[0] != null ? routePath[0] : path[0],\r\n    routePath[1] != null ? routePath[1] : path[1],\r\n    routePath[2] != null ? routePath[2] : path[2]\r\n  ];\r\n\r\n  const renderDisplayDetails = () => {\r\n    const energySupplyDescription =\r\n      \"Energielieferung bedeutet, dass der Energieversorger die Energie an den Kunden liefert. \";\r\n    const energyReceiptDescription =\r\n      \"Energiebezug bedeutet, dass KundInnen an den Energieversorger liefern. \";\r\n\r\n    const displayDetails = {\r\n      obis: {\r\n        heading: \"OBIS Code\",\r\n        description:\r\n          \"Links oben am Display befindet sich der ID Bereich, dieser zeigt den OBIS-Code oder einen anderen Identifikator an. OBIS Codes werden in der elektronischen Datenverarbeitung eingesetzt, um Messwerte (Energiemengen, Zählerstände) eindeutig zu kennzeichnen.\"\r\n      },\r\n      quadrant: {\r\n        heading: \"Quadrantenbereich\",\r\n        description:\r\n          \"Der Quadrantenbereich zeigt den Energiefluss Lieferung/Bezug sowie Blind- und Wirkenergie an.\"\r\n      },\r\n      tariff: {\r\n        heading: \"Tarif\",\r\n        description:\r\n          \"Die Tarifanzeige zeigt den aktuellen aktiven Tarifindex an. Die Anzeige erfolgt immer unabhängig von der gewählten Menüführung. Die möglichen Anzeigen sind: T1 oder T2. Dies ist von der aktuellen Uhrzeit abhängig ist. Bspw. T1 = 6:00-22:00 Uhr und T2 = 22:00-6:00 Uhr.\"\r\n      },\r\n      data: {\r\n        headings: {\r\n          \"main-standard\": [\r\n            \"Testbildschirm\",\r\n            \"Wirkenergie Lieferung (+A)\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 1\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 2\",\r\n            \"Wirkenergie Bezug (-A)\",\r\n            \"Wirkenergie Bezug (-A) Tarif 1\",\r\n            \"Wirkenergie Bezug (-A) Tarif 2\",\r\n            \"Ortszeit\",\r\n            \"Datum\",\r\n            \"Benutzernachrichtentext\",\r\n            \"Fehlerregister\"\r\n          ],\r\n          \"main-extended\": [\r\n            \"Wirkenergie Lieferung (+A)\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 1\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 2\",\r\n            \"Wirkenergie Bezug (-A)\",\r\n            \"Wirkenergie Bezug (-A) Tarif 1\",\r\n            \"Wirkenergie Bezug (-A) Tarif 2\",\r\n            \"Blindenergie Lieferung (+A)\",\r\n            \"Blindenergie Lieferung (+A) Tarif 1\",\r\n            \"Blindenergie Lieferung (+A) Tarif 2\",\r\n            \"Blindenergie Bezug (-A)\",\r\n            \"Blindenergie Bezug (-A) Tarif 1\",\r\n            \"Blindenergie Bezug (-A) Tarif 2\",\r\n            \"Active Firmware-Version\",\r\n            \"Active Firmware-Signatur\",\r\n            \"Aktiver Firmware-Identifikator 6\",\r\n            \"Aktive Firmware-Signatur 6\",\r\n            \"Aktive Firmware-Signatur 1\",\r\n            \"Aktive Firmware-Signatur 1\"\r\n          ],\r\n          \"main-reserves\": [\r\n            \"Zeitstempel – Abrechnungswert\",\r\n            \"Wirkenergie Lieferung (+A) Abrechnungswert\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 1 Abrechnungswert\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 2 Abrechnungswert\",\r\n            \"Wirkenergie Bezug (-A) Abrechnungswert\",\r\n            \"Wirkenergie Bezug (-A) Tarif 1 Abrechnungswert\",\r\n            \"Wirkenergie Bezug (-A) Tarif 2 Abrechnungswert\",\r\n            \"Blindenergie Lieferung (+A) Abrechnungswert\",\r\n            \"Blindenergie Lieferung (+A) Tarif 1 Abrechnungswert\",\r\n            \"Blindenergie Lieferung (+A) Tarif 2 Abrechnungswert\",\r\n            \"Blindenergie Bezug (-A) Abrechnungswert\",\r\n            \"Blindenergie Bezug (-A) Tarif 1 Abrechnungswert\",\r\n            \"Blindenergie Bezug (-A) Tarif 2 Abrechnungswert\",\r\n            \"Maximum Demand Register 1 - Wirkenergie Lieferung (+A) Wert - Abrechnungswert\",\r\n            \"Maximum Demand Register 1 - Wirkenergie Lieferung (+A) Zeitstempel - Abrechnungswert\",\r\n            \"Maximum Demand Register 6 - Wirkenergie Bezug (-A) Wert - Abrechnungswert\",\r\n            \"Maximum Demand Register 6 - Wirkenergie Bezug (-A) Zeitstempel - Abrechnungswert\"\r\n          ],\r\n          \"main-lp1\": \"Zeitstempel des Eintrages\",\r\n          \"main-lp1-entries\": Array.from({ length: 9 }, (v, i) => [\r\n            \"Zeitstempel\",\r\n            \"Status\",\r\n            \"Wirkenergie Lieferung (+A)\",\r\n            \"Wirkenergie Bezug (-A)\",\r\n            \"Blindenergie Lieferung (+A)\",\r\n            \"Blindenergie Bezug (-A)\"\r\n          ]).flat(),\r\n          \"main-lp2\": \"Zeitstempel des Eintrages\",\r\n          \"main-lp2-entries\": [\r\n            \"Zeitstempel\",\r\n            \"Status\",\r\n            \"Wirkenergie Lieferung (+A)\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 1\",\r\n            \"Wirkenergie Lieferung (+A) Tarif 2\",\r\n            \"Wirkenergie Bezug (-A)\",\r\n            \"Wirkenergie Bezug (-A) Tarif 1\",\r\n            \"Wirkenergie Bezug (-A) Tarif 2\",\r\n            \"Blindenergie Lieferung (+A)\",\r\n            \"Blindenergie Lieferung (+A) Tarif 1\",\r\n            \"Blindenergie Lieferung (+A) Tarif 2\",\r\n            \"Blindenergie Bezug (-A)\",\r\n            \"Blindenergie Bezug (-A) Tarif 1\",\r\n            \"Blindenergie Bezug (-A) Tarif 2\"\r\n          ]\r\n        },\r\n        descriptions: {\r\n          \"main-standard\": Array.from({ length: 11 }, (v, i) =>\r\n            i === 0 ? (\r\n              \"Testbildschirm der Standard-Anzeige. Für die Anzeige der Register bitte kurz weiterdrücken.\"\r\n            ) : i >= 1 && i <= 3 ? (\r\n              energySupplyDescription\r\n            ) : i >= 4 && i <= 6 ? (\r\n              energyReceiptDescription\r\n            ) : i === 9 ? (\r\n              <div>\r\n                <p>\r\n                  Verbraucherinformationen zum Konfigurationstypen des Zählers.\r\n                  Folgende Anzeigen sind möglich:\r\n                </p>\r\n                <ul>\r\n                  <li>\r\n                    <em>IME – Opt In:</em> 15-Minuten-Werte bis zum Vortag,\r\n                    Tages-, Wochen- und Monatswerte sowie Werte aus der\r\n                    Einspeisung bei einer vorhandenen Photovoltaikanlage, 60\r\n                    Tage Speicherung im Zähler\r\n                  </li>\r\n                  <li>\r\n                    <em>IMS – Standard:</em> Täglicher Gesamtverbrauchswert, 60\r\n                    Tage Speicherung im Zähler, Tagesverbrauchsdaten über das\r\n                    Serviceportal abrufbar\r\n                  </li>\r\n                  <li>\r\n                    <em> DSZ – Opt Out:</em> Keine Datenübertragung, keine\r\n                    Speicherung im Zähler, Jahreswert über das Serviceportal\r\n                    abrufbar\r\n                  </li>\r\n                </ul>\r\n              </div>\r\n            ) : null\r\n          ),\r\n          \"main-extended\": Array.from({ length: 18 }, (v, i) =>\r\n            (i >= 0 && i <= 2) || (i >= 6 && i <= 8)\r\n              ? energySupplyDescription\r\n              : (i >= 3 && i <= 5) || (i >= 9 && i <= 11)\r\n              ? energyReceiptDescription\r\n              : null\r\n          ),\r\n          \"main-reserves\": Array.from({ length: 17 }, (v, i) =>\r\n            (i >= 1 && i <= 3) || (i >= 7 && i <= 9) || i === 13 || i === 14\r\n              ? energySupplyDescription\r\n              : (i >= 4 && i <= 6) ||\r\n                (i >= 10 && i <= 12) ||\r\n                i === 15 ||\r\n                i === 16\r\n              ? energyReceiptDescription\r\n              : null\r\n          ),\r\n          \"main-lp1\":\r\n            \"Bei einem realen Smart Meter werden die Einträge der letzten 60 Tage angezeigt, sofern ein Wert enthalten ist. Mit einem 2-5 Sekunden langen Druck können die 15 Minuten Intervalle für das ausgewählte Datum angezeigt werden.\",\r\n          \"main-lp1-entries\": Array.from(\r\n            { length: 6 * 9 },\r\n            (v, i) =>\r\n              (i % 6 === 2 || i % 6 === 4\r\n                ? energySupplyDescription\r\n                : i % 6 === 3 || i % 6 === 5\r\n                ? energyReceiptDescription\r\n                : \"\") +\r\n              \"Eintrag des gewählten Lastprofil 1 Intervalls. Bei einem realen Smart Meter ändern sich diese Werte abhängig vom gewählten Intervall.\"\r\n          ),\r\n          \"main-lp2\":\r\n            \"Bei einem realen Smart Meter werden die Einträge der letzten 60 Tage angezeigt, sofern ein Wert enthalten ist. Mit einem 2-5 Sekunden langen Druck können die Registerstände im 24h Intervall angezeigt werden.\",\r\n          \"main-lp2-entries\": Array.from(\r\n            { length: 14 },\r\n            (v, i) =>\r\n              ((i >= 2 && i <= 4) || (i >= 8 && i <= 10)\r\n                ? energySupplyDescription\r\n                : (i >= 5 && i <= 7) || (i >= 11 && i <= 13)\r\n                ? energyReceiptDescription\r\n                : \"\") +\r\n              \"Eintrag des gewählten Lastprofil 2 Intervalls. Bei einem realen Smart Meter ändern sich diese Werte abhängig vom gewählten Intervall.\"\r\n          )\r\n        }\r\n      },\r\n      phase: {\r\n        heading: \"Phasenanzeige\",\r\n        description:\r\n          \"Je nach Zählerart gibt es bis zu drei Phasenpräsenzindikatoren, einer pro Phase. Diese Indikatoren werden in den Positionen 1, 2 und 3 angezeigt. Für jede Phase wird die entsprechende Phasenanzeige dargestellt.\"\r\n      },\r\n      profile: {\r\n        heading: \"Profilanzeige\",\r\n        description: (\r\n          <div>\r\n            <p>Aktivierungsindikatoren:</p>\r\n            <ul>\r\n              <li>\r\n                <em>MR:</em> Rückstellungsregister\r\n              </li>\r\n              <li>\r\n                <em>P1:</em> 1/4h Register\r\n              </li>\r\n              <li>\r\n                <em>P2:</em> Tagesregister\r\n              </li>\r\n              <li>\r\n                <em>Kein Indikator:</em> Profile sind deaktiviert\r\n              </li>\r\n            </ul>\r\n          </div>\r\n        )\r\n      },\r\n      relais: {\r\n        heading: \"Anzeige für Relais und Breaker\",\r\n        description: (\r\n          <div>\r\n            <ul>\r\n              <li>\r\n                <em>R1:</em> Ein/Aus Relais 1 für Steuerungen\r\n              </li>\r\n              <li>\r\n                <em>R2:</em> Ein/Aus Relais 2 für Steuerungen\r\n              </li>\r\n              <li>\r\n                <em>BR:</em> Anzeige Breaker Status (bei Wechselstromzähler nur\r\n                1 Relais verfügbar)\r\n              </li>\r\n            </ul>\r\n          </div>\r\n        )\r\n      },\r\n      mid: {\r\n        heading: \"MID Indikator\",\r\n        description:\r\n          \"Dieser Indikator zeigt an, dass der aktuell angezeigte Bildschirm rechtlich relevant ist und für die MID-Zertifizierung verwendet wird.\"\r\n      },\r\n      pc: {\r\n        heading: \"Verbindungstyp\",\r\n        description:\r\n          \"Der Indikator des Verbindungstyps zeigt an, ob der Zähler eine PLC - Kommunikation verwendet. P für PLC Typ, C für Kommunikationsbereitschaft.\"\r\n      }\r\n    };\r\n\r\n    const enterable =\r\n      activePath[0] === \"main-lp1\" || activePath[0] === \"main-lp2\";\r\n\r\n    const instructions = (\r\n      <Instructions\r\n        data={[\r\n          ...(location.search.indexOf(\"nextIsExit=true\") < 0\r\n            ? [\r\n                {\r\n                  title: \"Zum nächsten Display\",\r\n                  description:\r\n                    \"Um zum nächsten Display des Untermenüs zu navigieren, muss der Druckknopf kurz betätigt werden.\"\r\n                }\r\n              ]\r\n            : []),\r\n          ...(enterable\r\n            ? [\r\n                {\r\n                  title: \"Menüpunkt auswählen\",\r\n                  description:\r\n                    \"Wird der Knopf 2-5 Sekunden gedrückt, kommt man in das Untermenü des gerade ausgewählten Menüpunktes.\"\r\n                }\r\n              ]\r\n            : []),\r\n          ...(activePath[0] === \"main-lp1-entries\" ||\r\n          activePath[0] === \"main-lp2-entries\"\r\n            ? [\r\n                {\r\n                  title: \"Zurück zum 60-Tage Menü\",\r\n                  description:\r\n                    \"Wird der Knopf 2-5 Sekunden gedrückt, kehrt man zurück zur Datumsauswahl des Lastprofils.\"\r\n                }\r\n              ]\r\n            : []),\r\n          {\r\n            title: \"Zurück zum Startbildschirm\",\r\n            description:\r\n              location.search.indexOf(\"nextIsExit=true\") < 0\r\n                ? \"Um zum Startbildschirm zurück zu kommen, muss der Druckknopf länger als fünf Sekunden gehalten werden.\"\r\n                : \"Um zum Startbildschirm zurück zu kommen, muss der Druckknopf kurz gedrückt oder länger als fünf Sekunden gehalten werden.\"\r\n          }\r\n        ]}\r\n      />\r\n    );\r\n\r\n    if (!activePath[2]) {\r\n      return <DisplayDetails instructions={instructions} />;\r\n    }\r\n\r\n    const elementDetails = displayDetails[activePath[2]];\r\n    let heading = elementDetails.heading;\r\n    if (!heading) {\r\n      const headings = elementDetails.headings[activePath[0]];\r\n      heading = Array.isArray(headings) ? headings[activePath[1]] : headings;\r\n    }\r\n\r\n    let description = elementDetails.description;\r\n    if (!description) {\r\n      const descriptions = elementDetails.descriptions[activePath[0]];\r\n      description = Array.isArray(descriptions)\r\n        ? descriptions[activePath[1]]\r\n        : descriptions;\r\n    }\r\n\r\n    return (\r\n      <DisplayDetails\r\n        {...{\r\n          heading: heading,\r\n          description: description\r\n        }}\r\n        instructions={instructions}\r\n      />\r\n    );\r\n  };\r\n\r\n  const createDisplayTitles = count => {\r\n    const titles = [];\r\n    for (let i = 0; i < count; ++i) {\r\n      titles.push(`Display ${i + 1}/${count}`);\r\n    }\r\n    return titles;\r\n  };\r\n\r\n  const createLoadProfileTitles = () => {\r\n    const titles = [];\r\n    let i = 0;\r\n    for (; i < 4; ++i) {\r\n      titles.push(`Display ${i + 1}/60`);\r\n    }\r\n    ++i;\r\n    titles.push(`Displays 5-56/60`);\r\n    for (; i < 9; ++i) {\r\n      titles.push(`Display ${60 - 9 + i + 1}/60`);\r\n    }\r\n\r\n    return titles;\r\n  };\r\n\r\n  const createLoadProfile1EntryTitles = () => {\r\n    const titles = [];\r\n    let i = 0;\r\n    for (; i < 4 * 6; ++i) {\r\n      titles.push(`Display ${i + 1}/576`);\r\n    }\r\n    for (; i < 5 * 6; ++i) {\r\n      titles.push(`Displays ${4 * 6 + 1}-${576 - 5 * 6}/576`);\r\n    }\r\n    for (; i < 9 * 6; ++i) {\r\n      titles.push(`Display ${576 - 9 * 6 + i + 1}/576`);\r\n    }\r\n\r\n    return titles;\r\n  };\r\n\r\n  return (\r\n    <Template\r\n      exitLink={\r\n        <ExitLink text=\"Zurück zur Geräte-Übersicht\" to=\"/overview/button\" />\r\n      }\r\n      header={<Header subtitle=\"Simulation\" />}\r\n      navigation={\r\n        <Navigation>\r\n          <Breadcrumbs\r\n            path={[\r\n              ...{\r\n                main: [\"Hauptmenü\"],\r\n                \"main-standard\": [\"Hauptmenü\", \"Standard-Anzeige\"],\r\n                \"main-extended\": [\"Hauptmenü\", \"Erweiterte Anzeige\"],\r\n                \"main-reserves\": [\"Hauptmenü\", \"Rückstellungen\"],\r\n                \"main-lp1\": [\"Hauptmenü\", \"Lastprofil 1\"],\r\n                \"main-lp1-entries\": [\"Hauptmenü\", \"Lastprofil 1\", \"dd.mm.yyyy\"],\r\n                \"main-lp2\": [\"Hauptmenü\", \"Lastprofil 2\"],\r\n                \"main-lp2-entries\": [\"Hauptmenü\", \"Lastprofil 2\", \"dd.mm.yyyy\"]\r\n              }[activePath[0]],\r\n              {\r\n                main: [\r\n                  \"Standard-Anzeige\",\r\n                  \"Erweiterte Anzeige\",\r\n                  \"Rückstellungen\",\r\n                  \"Lastprofil 1\",\r\n                  \"Lastprofil 2\",\r\n                  \"BEV Logbuch\"\r\n                ],\r\n                \"main-standard\": createDisplayTitles(11),\r\n                \"main-extended\": createDisplayTitles(18),\r\n                \"main-reserves\": createDisplayTitles(17),\r\n                \"main-lp1\": createLoadProfileTitles(),\r\n                \"main-lp1-entries\": createLoadProfile1EntryTitles(),\r\n                \"main-lp2\": createLoadProfileTitles(),\r\n                \"main-lp2-entries\": createDisplayTitles(14)\r\n              }[activePath[0]][activePath[1]]\r\n            ]}\r\n          />\r\n        </Navigation>\r\n      }\r\n      details={\r\n        activePath[0] === \"main\" ? (\r\n          <MenuDetails\r\n            description={\r\n              [\r\n                \"Dieses Menü ermöglicht den Zugriff auf den Normalmodus. Die Daten sind ähnlich denen im Ruhezustand (Energieregister, Zeitdaten, Kundenmeldungen, Fehlermeldungen).\",\r\n                \"Zeigt zusätzlich jene Register, die aufgrund gesetzlicher Vorgaben angezeigt werden müssen, aber teilweise für die Verrechnung des Kunden nicht relevant sind.\",\r\n                \"Im Untermenü Rückstellungen können, wenn es der aktuelle Tarif erfordert, bis zu 15 Werte angezeigt werden. Die Anzeige muss auf Anfrage des Kunden vom Netzbetreiber freigeschalten werden.\",\r\n                \"Das Lastprofil 1 zeigt die 15 Minuten-Werte der letzten 60 Tage an. Die Anzeige muss auf Anfrage des Kunden vom Netzbetreiber freigeschalten werden.\",\r\n                \"Das Lastprofil 2 zeigt die Werte der letzten 60 Tage an. Die Anzeige muss auf Anfrage des Kunden vom Netzbetreiber freigeschalten werden.\",\r\n                \"Der Menüpunkt BEV Logbuch enthält gesetzesrelevante Daten, die für den Kunden nicht zugänglich sind.\"\r\n              ][activePath[1]]\r\n            }\r\n          />\r\n        ) : (\r\n          renderDisplayDetails()\r\n        )\r\n      }\r\n      setVisualisationPlaceholderRect={\r\n        routeMatch && setVisualisationPlaceholderRect\r\n      }\r\n      visualisationPlaceholderClearPercent={0.22}\r\n    />\r\n  );\r\n};\r\n","import React, { useState } from \"react\";\r\nimport styled from \"@emotion/styled\";\r\nimport GlobalStyle from \"styles/global\";\r\nimport { BrowserRouter, MemoryRouter, Route } from \"react-router-dom\";\r\nimport { CSSTransition } from \"react-transition-group\";\r\n\r\nimport Visualisation from \"./components/molecules/visualisation/visualisation\";\r\n\r\nimport LandingPage from \"./components/pages/landing-page/landing-page\";\r\nimport OverviewPage from \"./components/pages/overview/overview\";\r\nimport SimulationPage from \"./components/pages/simulation/simulation\";\r\n\r\nconst RoutesWrapper = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nconst PageWrapper = styled.div`\r\n  position: absolute;\r\n  left: 0;\r\n  top: 0;\r\n  width: 100%;\r\n  height: 100%;\r\n  transition: opacity\r\n    ${({ transitionDuration }) => `${transitionDuration || 0}ms`} ease-in-out;\r\n\r\n  &.fade-enter {\r\n    opacity: 0;\r\n  }\r\n  &.fade-enter-active {\r\n    opacity: 1;\r\n    transition-delay: ${({ enterDelay }) => `${enterDelay || 0}ms`};\r\n  }\r\n  &.fade-exit {\r\n    opacity: 1;\r\n  }\r\n  &.fade-exit-active {\r\n    opacity: 0;\r\n  }\r\n`;\r\n\r\nfunction App() {\r\n  const [\r\n    visualisationPlaceholderRect,\r\n    setVisualisationPlaceholderRect\r\n  ] = useState();\r\n\r\n  let Router = MemoryRouter;\r\n  if (!process.env.NODE_ENV || process.env.NODE_ENV === \"development\") {\r\n    Router = BrowserRouter;\r\n  }\r\n\r\n  return (\r\n    <React.Fragment>\r\n      <GlobalStyle />\r\n      <Router>\r\n        <Visualisation placeholderRect={visualisationPlaceholderRect} />\r\n        <RoutesWrapper>\r\n          <Route path=\"/\" exact>\r\n            {({ match }) => (\r\n              <CSSTransition\r\n                in={!!match}\r\n                timeout={{ enter: 1500, exit: 350 }}\r\n                classNames=\"fade\"\r\n                unmountOnExit\r\n              >\r\n                <PageWrapper transitionDuration={350} enterDelay={1150}>\r\n                  <LandingPage\r\n                    setVisualisationPlaceholderRect={\r\n                      match ? setVisualisationPlaceholderRect : rect => {}\r\n                    }\r\n                  />\r\n                </PageWrapper>\r\n              </CSSTransition>\r\n            )}\r\n          </Route>\r\n          <Route path=\"/overview\">\r\n            {({ match }) => (\r\n              <CSSTransition\r\n                in={!!match}\r\n                timeout={{ enter: 1750, exit: 350 }}\r\n                classNames=\"fade\"\r\n                unmountOnExit\r\n              >\r\n                <PageWrapper transitionDuration={350} enterDelay={1400}>\r\n                  <OverviewPage\r\n                    setVisualisationPlaceholderRect={\r\n                      setVisualisationPlaceholderRect\r\n                    }\r\n                  />\r\n                </PageWrapper>\r\n              </CSSTransition>\r\n            )}\r\n          </Route>\r\n          <Route path=\"/simulation\">\r\n            {({ match }) => (\r\n              <CSSTransition\r\n                in={!!match}\r\n                timeout={{ enter: 1350, exit: 350 }}\r\n                classNames=\"fade\"\r\n                unmountOnExit\r\n              >\r\n                <PageWrapper transitionDuration={350} enterDelay={1000}>\r\n                  <SimulationPage\r\n                    setVisualisationPlaceholderRect={\r\n                      setVisualisationPlaceholderRect\r\n                    }\r\n                  />\r\n                </PageWrapper>\r\n              </CSSTransition>\r\n            )}\r\n          </Route>\r\n        </RoutesWrapper>\r\n      </Router>\r\n    </React.Fragment>\r\n  );\r\n}\r\n\r\nexport default App;\r\n","// This optional code is used to register a service worker.\r\n// register() is not called by default.\r\n\r\n// This lets the app load faster on subsequent visits in production, and gives\r\n// it offline capabilities. However, it also means that developers (and users)\r\n// will only see deployed updates on subsequent visits to a page, after all the\r\n// existing tabs open on the page have been closed, since previously cached\r\n// resources are updated in the background.\r\n\r\n// To learn more about the benefits of this model and instructions on how to\r\n// opt-in, read https://bit.ly/CRA-PWA\r\n\r\nconst isLocalhost = Boolean(\r\n  window.location.hostname === 'localhost' ||\r\n    // [::1] is the IPv6 localhost address.\r\n    window.location.hostname === '[::1]' ||\r\n    // 127.0.0.0/8 are considered localhost for IPv4.\r\n    window.location.hostname.match(\r\n      /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\r\n    )\r\n);\r\n\r\nexport function register(config) {\r\n  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\r\n    // The URL constructor is available in all browsers that support SW.\r\n    const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\r\n    if (publicUrl.origin !== window.location.origin) {\r\n      // Our service worker won't work if PUBLIC_URL is on a different origin\r\n      // from what our page is served on. This might happen if a CDN is used to\r\n      // serve assets; see https://github.com/facebook/create-react-app/issues/2374\r\n      return;\r\n    }\r\n\r\n    window.addEventListener('load', () => {\r\n      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\r\n\r\n      if (isLocalhost) {\r\n        // This is running on localhost. Let's check if a service worker still exists or not.\r\n        checkValidServiceWorker(swUrl, config);\r\n\r\n        // Add some additional logging to localhost, pointing developers to the\r\n        // service worker/PWA documentation.\r\n        navigator.serviceWorker.ready.then(() => {\r\n          console.log(\r\n            'This web app is being served cache-first by a service ' +\r\n              'worker. To learn more, visit https://bit.ly/CRA-PWA'\r\n          );\r\n        });\r\n      } else {\r\n        // Is not localhost. Just register service worker\r\n        registerValidSW(swUrl, config);\r\n      }\r\n    });\r\n  }\r\n}\r\n\r\nfunction registerValidSW(swUrl, config) {\r\n  navigator.serviceWorker\r\n    .register(swUrl)\r\n    .then(registration => {\r\n      registration.onupdatefound = () => {\r\n        const installingWorker = registration.installing;\r\n        if (installingWorker == null) {\r\n          return;\r\n        }\r\n        installingWorker.onstatechange = () => {\r\n          if (installingWorker.state === 'installed') {\r\n            if (navigator.serviceWorker.controller) {\r\n              // At this point, the updated precached content has been fetched,\r\n              // but the previous service worker will still serve the older\r\n              // content until all client tabs are closed.\r\n              console.log(\r\n                'New content is available and will be used when all ' +\r\n                  'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\r\n              );\r\n\r\n              // Execute callback\r\n              if (config && config.onUpdate) {\r\n                config.onUpdate(registration);\r\n              }\r\n            } else {\r\n              // At this point, everything has been precached.\r\n              // It's the perfect time to display a\r\n              // \"Content is cached for offline use.\" message.\r\n              console.log('Content is cached for offline use.');\r\n\r\n              // Execute callback\r\n              if (config && config.onSuccess) {\r\n                config.onSuccess(registration);\r\n              }\r\n            }\r\n          }\r\n        };\r\n      };\r\n    })\r\n    .catch(error => {\r\n      console.error('Error during service worker registration:', error);\r\n    });\r\n}\r\n\r\nfunction checkValidServiceWorker(swUrl, config) {\r\n  // Check if the service worker can be found. If it can't reload the page.\r\n  fetch(swUrl, {\r\n    headers: { 'Service-Worker': 'script' }\r\n  })\r\n    .then(response => {\r\n      // Ensure service worker exists, and that we really are getting a JS file.\r\n      const contentType = response.headers.get('content-type');\r\n      if (\r\n        response.status === 404 ||\r\n        (contentType != null && contentType.indexOf('javascript') === -1)\r\n      ) {\r\n        // No service worker found. Probably a different app. Reload the page.\r\n        navigator.serviceWorker.ready.then(registration => {\r\n          registration.unregister().then(() => {\r\n            window.location.reload();\r\n          });\r\n        });\r\n      } else {\r\n        // Service worker found. Proceed as normal.\r\n        registerValidSW(swUrl, config);\r\n      }\r\n    })\r\n    .catch(() => {\r\n      console.log(\r\n        'No internet connection found. App is running in offline mode.'\r\n      );\r\n    });\r\n}\r\n\r\nexport function unregister() {\r\n  if ('serviceWorker' in navigator) {\r\n    navigator.serviceWorker.ready.then(registration => {\r\n      registration.unregister();\r\n    });\r\n  }\r\n}\r\n","import 'react-app-polyfill/ie11';\r\nimport 'react-app-polyfill/stable';\r\n\r\nimport React from \"react\";\r\nimport ReactDOM from \"react-dom\";\r\nimport App from \"./App\";\r\nimport * as serviceWorker from \"./serviceWorker\";\r\n\r\nReactDOM.render(<App />, document.getElementById(\"root\"));\r\n\r\n// If you want your app to work offline and load faster, you can change\r\n// unregister() to register() below. Note this comes with some pitfalls.\r\n// Learn more about service workers: https://bit.ly/CRA-PWA\r\nserviceWorker.unregister();\r\n"],"sourceRoot":""}