\r\n
\r\n )\r\n}\r\n\r\nexport default VerticalBarChartNew;","export default __webpack_public_path__ + \"static/media/calendar.9ef60992.svg\";","export default __webpack_public_path__ + \"static/media/calendar-dark.1b2bc0e2.svg\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEgUlEQVR4nO2cy28NURzHRzwjIoqERVUinhEJG0sSauMPIBJdiOd/YEtiIR4LNlhJSIQSbGyEJmLDAgsLG0Q84lXaUq+FfuS4R1LTMzP39s7M+c38zifpqr3f853zved9plEUCAQCgUBAHMAC4Arwxf5cA5b59qU5jE+M5bP5nW9/6qDRMpLo9e1PHTS6qCSGfPtTBzCQEsigb3/qAPpSArnk258qgA3A74Qw+oFO3x7VAMwBXrvGDdMyQhglYyt9NCPA5rJ9BKK/Yex2tIxjoXI8ACx2THUfA9N8+FENMBm4HwvjB7DKtzeVAEcdXdVe375UAqx3THFvABN8e1MH0AG8jIXxDpjn25tKgN5YGKaldPv2pRJgr2PcOOrbl+Yp7tdYGA+BKZFmGHsidxnoKrjMKbbyR/MNWB5phuQTuf4iQ0mY4u6JtEP6idzFgsrsdkxxrxVRVt1O5PqBWTmXNxd4EyvH7OrOibRDY/7/i3TMid0B87c5lXk9pm9aysZIO8By4AnNY1rSYWB2G2Xuc+geibQDbAWGGR9fxxMMsMLOokbzQPUUF5hoZzfmsCfOM+C9nXFdNecPjjVC/OTuUDPBAFOBR7HPD6u+7EbjSPRmQuWecX1T7WfM+DGY0WJOpO07Accdn9uV8LdtEVUBYDXw3OH/Z1LFJAQz0EQw82Of3eSY4l5NKavegQA9wHeH91fA2ha1ZttuaigjmGO223MtOFOnuLUNBJhkB18Xd+Pf5Ba1ZwL7M1qMi8wpbi0DAeYBdxI8m25lco7rmIMZY8xo+prQrFcgphui0R3FMd1WT0FldjQxxhg+qwoE2GkH6jgvgDUllD8rY32TeReXNokkYLeyTyd4vGX2j0r0Yl6mGfdd3EoGAiwyO7F2IffeLurijNhF4MSSvXWlbOd31i4QYCHwIcPXsNkeKd3c/6H02ulxS3dxqxjI+QxPT6t8sawygQAz7J3XtP2lX3ltk/tCfCB22+NUxuq4Nm8UITEQYDqwA7jXop/Kv1GEpECAlcDJcWxJ1OaNInwHYq7ZA9vt/lIWH+3G3To7uL+r2xtFlBFI7N6TqcRztlKP2292GiP2xcdt5qAnqjkUHUjKvacsPtiF3dJIEZQQSNq9J1druG3PvKdW8oGl+8u49/QPs/1xBFhS+QeueCBmNrWlzJsXFP3A0v1l7H6eLfoBS39g6f7MVRf7r4Rc3VTpU1WKfuAq+LMzrX+7n2+BC2bXtuiHcxECEQahhciCEIgsCIHIghBIvQNBuJ54EF6BeeuJB+EVmLeeeBBegXnriQfhFZi3nngQXoF564UKbJEQSJuEFqKsAslZL3RZLRICaZPQQpRVIDnrhS6rRUIg2lqIdIMo0xNvEGV64g2iTE+8QZTpiTeIMj3xBlGmJ94gyvTEG0SZnniDKNMTbxBleuINokxPvEGU6Yk3iDI98QZRpifeIMr0xBtEmZ54gyjTE28QZXriDaJMT7xBlOmJN4gyPfEGUaYn3iDK9MQbRJmeeIMo0xNvEGV64g2iTE+8QZTo/QG63Mk9OzxTTAAAAABJRU5ErkJggg==\"","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEeklEQVR4nO2bu4sVSRTGf+ITEXEcQQNnBHHXFRE0mVDBR+IfoAgaiK7uf2CqsIH4CDRRI0FBfKEmJqKCmGigBhtsoiK7LjqujxkdX4FzpPVcuDTV3fPo231un/qgonvv11+d71bVqVPVEBEREREREWERfcBl4L22q8DyukV5NuMNIKn2Vj+LqBiXA2a02sWqxUTwY4rKMmQ4Bqh6vMsxZKgGPe5xO8eQC+6jUzHWA98yzHgNLK5akGf0As8z1o1kZEQzKsaFlBGjwOaqRUT8xO+BkXFEP4uoGMsCqe5fwKyqhUTAdOB+yozPwKoYnHpwODBV7a1Ji3usC6S414Ep7iNTA3qAf1JmvAQW1iEmgh9FwnYzkpGyMQamHuwNrBvJWhJRU4r7IWXGQ2AGztGXOpG7BPR3+JkzNPjtZnwEfsM5+jJO5F532JRQirung89rxInc+Q49c2MgxU3OySPIP5FLRsm8kqO0APgv9ZznWt11jx7ga44hoid2+3WvUAauBVLcDe6d4Ofi+XeBGe0tGUkHgfmTCN4fAd5D0QzYCoyMw4z29mGCxqzQLKqd64H3FHeqZjejgUA/AQY147qi5w/pPUL65O7PMRozE3iU+v2I98tuvcCNjOCeyvin9ur6MVQwYo4V1J2OBn63O+O7MsnWFVgNPA2I/5ITmJAx78ZgzKLUbzcFUtxkBOLVkB3Ap4Dwf4GBcXLN12lquMCYIxr00IazKMVtrCHTdPENib4b+CePB3OBfQUjJtTGkuI20pCFwJ0Mwcf0qLQMJHuTAwVrTHtLLr3hzZABnY7SQj/p9NUJ9IxhjWndWHdlyC5dqCXVngFrKnj+vIL9zZAXQ5KU9WSGwJtaP6oKVyd5F7crDVmqldhBbU8CwkZ1E5hsBqtEf045f3ETDVkCvCoQNaLlkbrQr+fkwxO4i9t1hpwtEPS4yy+WdY0hc/TOa1596WuJZfK6YN6QpOxxomB33KQ3isSiIbOBncC9cYppwhtFYsmQlcDxCZQkmvRGkdRtSHLNfrvWl4oe9r8W7tbq4v6ygW8USRWGtN97SoJ4RoN6VP/ZeQ8Y1RrQNj3oaTqk04Zk3Xsqaq90Y/crviCdNiTv3lNoNNzSTd3Mps7RdevLu/fUaoN6++IXOg+JhmQHIcmmtlR880K8G5JX/TxN9RDvhizXg5nQNFVHqireDWllWq3q5wvgnFZt64BEQ2xBoiG2INEQW5BoiC1INKTZhohxPvMQ4wGMhmArgNEQbAUwGoKtAEZDsBVA84ZY77AY5ysd1jssxvlKh/UOi3G+0mG9w2Kcr3RY77AY5ysd1jssxvlKh/UOi3G+0mG9w2Kcz7xAccZnXqA44zMvUJzxmRcozvjMCxRnfOYFijM+8wLFGZ95geKMz7xAccZnXqA44zMvUJzxmRcozvjMCxRnfOYFijM+8wLFGZ95geKMz7xAccZnXqA44zMvUJzxmRcozvjMCxRnfOYFijM+8wLFGZ95geKMz7xAccZnXqA44zMvUJzxmRcoHvi+A6tyT/jxXrrMAAAAAElFTkSuQmCC\"","//Treanslations\r\nimport i18n from 'i18next';\r\nimport Locize from 'i18next-locize-backend';\r\nimport LanguageDetector from 'i18next-browser-languagedetector';\r\nimport { initReactI18next } from 'react-i18next';\r\n\r\n//Config\r\nconst i18nextConfig = {\r\n backend: {\r\n projectId: '2c0a136a-e84b-4380-bbdd-8c7e033c41a3',\r\n apiKey: '5e9e1de2-bf79-4fbd-a74e-05772a0a1d12',\r\n referenceLng: 'en-US'\r\n },\r\n lng: 'nb-NO',\r\n fallbackLng: 'nb-NO',\r\n ns: [\r\n 'digitalSignage',\r\n 'admin',\r\n 'common',\r\n ],\r\n defaultNS: 'digitalSignage',\r\n saveMissing: false,\r\n debug: true,\r\n detection: {\r\n order: ['queryString', 'cookie'],\r\n cache: ['cookie']\r\n },\r\n interpolation: {\r\n escapeValue: false\r\n },\r\n missingKeyHandler: (lng, ns, key, fallbackValue) => {\r\n // eslint-disable-next-line\r\n // console.error('Missing key in translations', lng, ns, key, fallbackValue);\r\n },\r\n}\r\n\r\ni18n.use(Locize).use(LanguageDetector).use(initReactI18next)\r\n .init(i18nextConfig, error => {\r\n if (error) {\r\n throw error;\r\n }\r\n })\r\n\r\nexport default i18n;","//Components\r\nimport VerticalBarChartNew from '../charts/VerticalBarChartNew';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport EmptyChartWhite from '../../assets/images/empty-chart-white.png';\r\nimport EmptyChartBlack from '../../assets/images/empty-chart-black.png';\r\nimport i18n from \"../../i18n\";\r\nimport { Trans } from 'react-i18next';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { useEffect, useState } from 'react';\r\n\r\n//Redux\r\nimport {useSelector} from 'react-redux';\r\n\r\nconst HistoricProduction = ({title, subtitle, slideIndex}) => {\r\n //Redux\r\n const slide = useSelector(state => state.slideshow.slides[slideIndex]);\r\n const isLightTheme = useSelector(state => state.slideshow.lightTheme);\r\n\r\n const [current, setCurrent] = useState(undefined);\r\n const [compare, setCompare] = useState(undefined);\r\n const [diff, setDiff] = useState(undefined);\r\n const [historicSolarProduction, setHistoricSolarProduction] = useState(undefined);\r\n const [currentMonthSolarProduction, setCurrentMonthSolarProduction] = useState(undefined);\r\n\r\n\r\n useEffect(() => {\r\n setHistoricSolarProduction(getHistoricSolarProduction())\r\n setCurrentMonthSolarProduction(getCurrentMonthSolarProduction())\r\n setCurrentCopmare()\r\n }, []);\r\n\r\n const setCurrentCopmare = () => {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1m')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\")\r\n let currentTemp = 0;\r\n let compareTemp = 0;\r\n let currentYear = new Date().getFullYear() \r\n let currentMonth = new Date().getMonth()\r\n \r\n for (let i = 0; i < profiles.length; i++) {\r\n // eslint-disable-next-line no-loop-func\r\n console.log(profiles[i].data, 'profiles[i].data')\r\n profiles[i].data.forEach(p => {\r\n if (p.timestamp.includes(currentYear)){\r\n if (Number(p.timestamp.substring(5, 7)) === 1)\r\n compareTemp += 0 //p.value\r\n else\r\n currentTemp += p.value\r\n }\r\n else{\r\n if (Number(p.timestamp.substring(5, 7)) <= currentMonth+1)\r\n compareTemp += p.value\r\n else if (Number(p.timestamp.substring(5, 7)) == currentMonth+2)\r\n compareTemp += p.value * (new Date().getDate() / 30)\r\n }\r\n })\r\n }\r\n if(profiles.length && profiles[0].data.length === 0){\r\n currentTemp = 0\r\n let p1d = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1d')\r\n console.log(p1d, 'p1d')\r\n p1d.forEach(p => {\r\n if(p.data.length)\r\n p.data.forEach(d => {\r\n currentTemp += d.value\r\n })\r\n })\r\n }\r\n let cr = getCurrentMonthSolarProduction()\r\n if (cr){\r\n cr.forEach(day => {\r\n currentTemp += day.value;\r\n })\r\n }\r\n setCurrent(currentTemp)\r\n setCompare(compareTemp)\r\n if (currentTemp > compareTemp){\r\n let increasePerc = (currentTemp - compareTemp) / compareTemp * 100\r\n setDiff(increasePerc)\r\n } else {\r\n let decreasePerc = (compareTemp - currentTemp) / compareTemp * -100\r\n setDiff(decreasePerc)\r\n }\r\n }\r\n\r\n //Functions\r\n const getHistoricSolarProduction = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.energyProfile1Y) {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1m')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\")\r\n let longest = {data: []};\r\n let id = undefined;\r\n\r\n for (let i = 0; i < profiles.length; i++) {\r\n if (profiles[i].data.length > longest.data.length) {\r\n longest = JSON.parse(JSON.stringify(profiles[i]));\r\n id = profiles[i].id;\r\n }\r\n }\r\n if (longest && longest.data) {\r\n longest.data.forEach(l => {\r\n profiles.forEach(p => {\r\n if (p.id !== id) {\r\n let f = p.data.find(x => x.timestamp === l.timestamp)\r\n if (f)\r\n l.value += f.value\r\n }\r\n })\r\n\r\n })\r\n return longest.data\r\n }\r\n return null\r\n }\r\n return []\r\n }\r\n\r\n const getCurrentMonthSolarProduction = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2) {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1d')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\")\r\n let longest = [];\r\n let id = undefined;\r\n for (let i = 0; i < profiles.length; i++) {\r\n if (profiles[i].data.length > longest.length) {\r\n longest = JSON.parse(JSON.stringify(profiles[i]));\r\n id = profiles[i].id;\r\n }\r\n }\r\n if (longest && longest.data) {\r\n longest.data.forEach(l => {\r\n profiles.forEach(p => {\r\n if (p.id !== id) {\r\n let f = p.data.find(x => x.timestamp === l.timestamp)\r\n if (f)\r\n l.value += f.value\r\n }\r\n })\r\n\r\n })\r\n return longest.data\r\n }\r\n return null\r\n }\r\n return []\r\n }\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n return date.getFullYear() - 1 + '-' + date.getFullYear()\r\n }\r\n\r\n return (\r\n \r\n \r\n
\r\n )}\r\n \r\n )\r\n}\r\n\r\nexport default HistoricProduction;","//Components\r\nimport VerticalBarChartNew from '../charts/VerticalBarChartNew';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport EmptyChartWhite from '../../assets/images/empty-chart-white.png';\r\nimport EmptyChartBlack from '../../assets/images/empty-chart-black.png';\r\nimport i18n from \"../../i18n\";\r\nimport { Trans } from 'react-i18next';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { useEffect, useState } from 'react';\r\n\r\n//Redux\r\nimport {useSelector} from 'react-redux';\r\n\r\nconst EnergyPurchased12M = ({title, subtitle, slideIndex}) => {\r\n //Redux\r\n const slide = useSelector(state => state.slideshow.slides[slideIndex]);\r\n const isLightTheme = useSelector(state => state.slideshow.lightTheme);\r\n\r\n const [current, setCurrent] = useState(undefined);\r\n const [compare, setCompare] = useState(undefined);\r\n const [diff, setDiff] = useState(undefined);\r\n const [historicConsumption, setHistoricConsumption] = useState(undefined);\r\n const [currentMonthConsumption, setCurrentMonthConsumption] = useState(undefined);\r\n\r\n\r\n useEffect(() => {\r\n setHistoricConsumption(getHistoricConsumption())\r\n setCurrentMonthConsumption(getCurrentMonthConsumption())\r\n setCurrentCopmare()\r\n }, []);\r\n\r\n const setCurrentCopmare = () => {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1m')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"EXTERNALLY_IN\")\r\n let currentTemp = 0;\r\n let compareTemp = 0;\r\n let currentYear = new Date().getFullYear() \r\n let currentMonth = new Date().getMonth()\r\n \r\n for (let i = 0; i < profiles.length; i++) {\r\n // eslint-disable-next-line no-loop-func\r\n console.log(profiles[i].data, 'profiles[i].data')\r\n profiles[i].data.forEach(p => {\r\n if (p.timestamp.includes(currentYear)){\r\n if (Number(p.timestamp.substring(5, 7)) === 1)\r\n compareTemp += 0 //p.value\r\n else\r\n currentTemp += p.value\r\n }\r\n else{\r\n if (Number(p.timestamp.substring(5, 7)) <= currentMonth+1)\r\n compareTemp += p.value\r\n else if (Number(p.timestamp.substring(5, 7)) == currentMonth+2)\r\n compareTemp += p.value * (new Date().getDate() / 30)\r\n }\r\n })\r\n }\r\n if(profiles.length && profiles[0].data.length === 0){\r\n currentTemp = 0\r\n let p1d = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1d')\r\n console.log(p1d, 'p1d')\r\n p1d.forEach(p => {\r\n if(p.data.length)\r\n p.data.forEach(d => {\r\n currentTemp += d.value\r\n })\r\n })\r\n }\r\n let cr = getCurrentMonthConsumption()\r\n if (cr){\r\n cr.forEach(day => {\r\n currentTemp += day.value;\r\n })\r\n }\r\n setCurrent(currentTemp)\r\n setCompare(compareTemp)\r\n if (currentTemp > compareTemp){\r\n let increasePerc = (currentTemp - compareTemp) / compareTemp * 100\r\n setDiff(increasePerc)\r\n } else {\r\n let decreasePerc = (compareTemp - currentTemp) / compareTemp * -100\r\n setDiff(decreasePerc)\r\n }\r\n }\r\n\r\n //Functions\r\n const getHistoricConsumption = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.energyProfile1Y) {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1m')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"EXTERNALLY_IN\")\r\n console.log(profiles, '###profiles')\r\n let longest = {data: []};\r\n let id = undefined;\r\n\r\n for (let i = 0; i < profiles.length; i++) {\r\n if (profiles[i].data.length > longest.data.length) {\r\n longest = JSON.parse(JSON.stringify(profiles[i]));\r\n id = profiles[i].id;\r\n }\r\n }\r\n if (longest && longest.data) {\r\n longest.data.forEach(l => {\r\n profiles.forEach(p => {\r\n if (p.id !== id) {\r\n let f = p.data.find(x => x.timestamp === l.timestamp)\r\n if (f)\r\n l.value += f.value\r\n }\r\n })\r\n\r\n })\r\n return longest.data\r\n }\r\n return null\r\n }\r\n return []\r\n }\r\n\r\n const getCurrentMonthConsumption = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2) {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1d')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"EXTERNALLY_IN\")\r\n let longest = [];\r\n let id = undefined;\r\n for (let i = 0; i < profiles.length; i++) {\r\n if (profiles[i].data.length > longest.length) {\r\n longest = JSON.parse(JSON.stringify(profiles[i]));\r\n id = profiles[i].id;\r\n }\r\n }\r\n if (longest && longest.data) {\r\n longest.data.forEach(l => {\r\n profiles.forEach(p => {\r\n if (p.id !== id) {\r\n let f = p.data.find(x => x.timestamp === l.timestamp)\r\n if (f)\r\n l.value += f.value\r\n }\r\n })\r\n\r\n })\r\n return longest.data\r\n }\r\n return null\r\n }\r\n return []\r\n }\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n return date.getFullYear() - 1 + '-' + date.getFullYear()\r\n }\r\n\r\n return (\r\n \r\n
\r\n\r\n {historicSolarProduction || currentMonthSolarProduction ? (\r\n \r\n {subtitle}\r\n
\r\n {/* \r\n\r\n
\r\n */}\r\n\r\n\r\n
\r\n\r\n \r\n {title}\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n {formatNumber(current)}\r\n kWh\r\n
\r\n \r\n {Current Year }\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(compare)}\r\n kWh\r\n
\r\n \r\n {Last Year }\r\n
\r\n \r\n
\r\n \r\n
\r\n 0 ? 'mt-2 mr-3 up' : 'mt-2 mr-3 down'}>
\r\n \r\n
\r\n \r\n {compare !== 0 ? diff > 0 ? '+' + formatNumber(diff, 1) : formatNumber(diff, 1) : '-'}\r\n %\r\n
\r\n \r\n {Change }\r\n
\r\n \r\n
\r\n ) : (\r\n \r\n 
\r\n
\r\n {i18n.t(\"digitalSignage:waitingData\")}
\r\n\r\n \r\n
\r\n )}\r\n \r\n )\r\n}\r\n\r\nexport default EnergyPurchased12M;","//Components\r\nimport VerticalBarChartNew from '../charts/VerticalBarChartNew';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport EmptyChartWhite from '../../assets/images/empty-chart-white.png';\r\nimport EmptyChartBlack from '../../assets/images/empty-chart-black.png';\r\nimport i18n from \"../../i18n\";\r\nimport { Trans } from 'react-i18next';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { useEffect, useState } from 'react';\r\n\r\n//Redux\r\nimport {useSelector} from 'react-redux';\r\n\r\nconst EnergySold12M = ({title, subtitle, slideIndex}) => {\r\n //Redux\r\n const slide = useSelector(state => state.slideshow.slides[slideIndex]);\r\n const isLightTheme = useSelector(state => state.slideshow.lightTheme);\r\n\r\n const [current, setCurrent] = useState(undefined);\r\n const [compare, setCompare] = useState(undefined);\r\n const [diff, setDiff] = useState(undefined);\r\n const [historicSold, setHistoricSold] = useState(undefined);\r\n const [currentMonthSold, setCurrentMonthSold] = useState(undefined);\r\n\r\n\r\n useEffect(() => {\r\n setHistoricSold(getHistoricSold())\r\n setCurrentMonthSold(getCurrentMonthSold())\r\n setCurrentCopmare()\r\n }, []);\r\n\r\n const setCurrentCopmare = () => {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1m')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"EXTERNALLY_OUT\")\r\n let currentTemp = 0;\r\n let compareTemp = 0;\r\n let currentYear = new Date().getFullYear() \r\n let currentMonth = new Date().getMonth()\r\n \r\n for (let i = 0; i < profiles.length; i++) {\r\n // eslint-disable-next-line no-loop-func\r\n console.log(profiles[i].data, 'profiles[i].data')\r\n profiles[i].data.forEach(p => {\r\n if (p.timestamp.includes(currentYear)){\r\n if (Number(p.timestamp.substring(5, 7)) === 1)\r\n compareTemp += 0 //p.value\r\n else\r\n currentTemp += p.value\r\n }\r\n else{\r\n if (Number(p.timestamp.substring(5, 7)) <= currentMonth+1)\r\n compareTemp += p.value\r\n else if (Number(p.timestamp.substring(5, 7)) == currentMonth+2)\r\n compareTemp += p.value * (new Date().getDate() / 30)\r\n }\r\n })\r\n }\r\n if(profiles.length && profiles[0].data.length === 0){\r\n currentTemp = 0\r\n let p1d = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1d')\r\n console.log(p1d, 'p1d')\r\n p1d.forEach(p => {\r\n if(p.data.length)\r\n p.data.forEach(d => {\r\n currentTemp += d.value\r\n })\r\n })\r\n }\r\n let cr = getCurrentMonthSold()\r\n if (cr){\r\n cr.forEach(day => {\r\n currentTemp += day.value;\r\n })\r\n }\r\n setCurrent(currentTemp)\r\n setCompare(compareTemp)\r\n if (currentTemp > compareTemp){\r\n let increasePerc = (currentTemp - compareTemp) / compareTemp * 100\r\n setDiff(increasePerc)\r\n } else {\r\n let decreasePerc = (compareTemp - currentTemp) / compareTemp * -100\r\n setDiff(decreasePerc)\r\n }\r\n }\r\n\r\n //Functions\r\n const getHistoricSold = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.energyProfile1Y) {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1m')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"EXTERNALLY_OUT\")\r\n console.log(profiles, '###profiles')\r\n let longest = {data: []};\r\n let id = undefined;\r\n\r\n for (let i = 0; i < profiles.length; i++) {\r\n if (profiles[i].data.length > longest.data.length) {\r\n longest = JSON.parse(JSON.stringify(profiles[i]));\r\n id = profiles[i].id;\r\n }\r\n }\r\n if (longest && longest.data) {\r\n longest.data.forEach(l => {\r\n profiles.forEach(p => {\r\n if (p.id !== id) {\r\n let f = p.data.find(x => x.timestamp === l.timestamp)\r\n if (f)\r\n l.value += f.value\r\n }\r\n })\r\n\r\n })\r\n return longest.data\r\n }\r\n return null\r\n }\r\n return []\r\n }\r\n\r\n const getCurrentMonthSold = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2) {\r\n let profiles = slide.slideEnergy2.energyProfile1Y.filter(x => x.resolution === 'p1d')\r\n profiles.forEach(x => x.meterConfiguration = slide.slideEnergy2.tags.find(a => a.id === x.id).meterConfiguration)\r\n profiles = profiles.filter(x => x.meterConfiguration.meterType === \"EXTERNALLY_OUT\")\r\n let longest = [];\r\n let id = undefined;\r\n for (let i = 0; i < profiles.length; i++) {\r\n if (profiles[i].data.length > longest.length) {\r\n longest = JSON.parse(JSON.stringify(profiles[i]));\r\n id = profiles[i].id;\r\n }\r\n }\r\n if (longest && longest.data) {\r\n longest.data.forEach(l => {\r\n profiles.forEach(p => {\r\n if (p.id !== id) {\r\n let f = p.data.find(x => x.timestamp === l.timestamp)\r\n if (f)\r\n l.value += f.value\r\n }\r\n })\r\n\r\n })\r\n return longest.data\r\n }\r\n return null\r\n }\r\n return []\r\n }\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n return date.getFullYear() - 1 + '-' + date.getFullYear()\r\n }\r\n\r\n return (\r\n \r\n
\r\n\r\n {historicConsumption || currentMonthConsumption ? (\r\n \r\n {subtitle}\r\n
\r\n {/* \r\n\r\n
\r\n */}\r\n\r\n\r\n
\r\n\r\n \r\n {title}\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n {formatNumber(current)}\r\n kWh\r\n
\r\n \r\n {Current Year }\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(compare)}\r\n kWh\r\n
\r\n \r\n {Last Year }\r\n
\r\n \r\n
\r\n \r\n
\r\n 0 ? 'mt-2 mr-3 up' : 'mt-2 mr-3 down'}>
\r\n \r\n
\r\n \r\n {compare !== 0 ? diff > 0 ? '+' + formatNumber(diff, 1) : formatNumber(diff, 1) : '-'}\r\n %\r\n
\r\n \r\n {Change }\r\n
\r\n \r\n
\r\n ) : (\r\n \r\n \r\n
\r\n {i18n.t(\"digitalSignage:waitingData\")}
\r\n\r\n \r\n
\r\n )}\r\n \r\n )\r\n}\r\n\r\nexport default EnergySold12M;","export default __webpack_public_path__ + \"static/media/solarInstallation.2d73466c.jpg\";","import SolarInstallationImg from '../../assets/images/solarInstallation.jpg';\r\n\r\nconst SolarInstallations = ({ solarInstalation }) => {\r\n return (\r\n solarInstalation && solarInstalation.image && solarInstalation.image.url ?\r\n \r\n
\r\n\r\n {historicSold || currentMonthSold ? (\r\n \r\n {subtitle}\r\n
\r\n {/* \r\n\r\n
\r\n */}\r\n\r\n\r\n
\r\n\r\n \r\n {title}\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n {formatNumber(current)}\r\n kWh\r\n
\r\n \r\n {Current Year }\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(compare)}\r\n kWh\r\n
\r\n \r\n {Last Year }\r\n
\r\n \r\n
\r\n \r\n
\r\n 0 ? 'mt-2 mr-3 up' : 'mt-2 mr-3 down'}>
\r\n \r\n
\r\n \r\n {compare !== 0 ? diff > 0 ? '+' + formatNumber(diff, 1) : formatNumber(diff, 1) : '-'}\r\n %\r\n
\r\n \r\n {Change }\r\n
\r\n \r\n
\r\n ) : (\r\n \r\n \r\n
\r\n {i18n.t(\"digitalSignage:waitingData\")}
\r\n\r\n
\r\n :\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default SolarInstallations;","import moment from 'moment';\r\nimport 'moment/locale/en-gb';\r\nimport 'moment/locale/nb';\r\n\r\nexport const BAR_CHART_OPTIONS = {\r\n chart: {\r\n type: 'bar'\r\n },\r\n title: {\r\n text: ''\r\n },\r\n subtitle: {\r\n text: ''\r\n },\r\n xAxis: {\r\n visible: false,\r\n categories: ['', '', '', 'Marnar ungdomsskole', ''],\r\n title: {\r\n text: null\r\n }\r\n },\r\n yAxis: {\r\n visible: false,\r\n min: 0,\r\n title: {\r\n text: 'Usage (kWh)',\r\n align: 'middle'\r\n },\r\n labels: {\r\n overflow: 'justify',\r\n }\r\n },\r\n tooltip: {\r\n enabled: false\r\n },\r\n plotOptions: {\r\n bar: {\r\n dataLabels: {\r\n enabled: true,\r\n inside: true,\r\n style: {\r\n fontWeight: 'bold',\r\n border: 'none',\r\n color: '#C8CBCF',\r\n textOutline: 'none',\r\n }\r\n }\r\n },\r\n series: {\r\n dataLabels: {\r\n enabled: true,\r\n inside: true,\r\n style: {\r\n fontWeight: 'normal'\r\n }\r\n }, \r\n marker: {\r\n enabled: false,\r\n }\r\n }\r\n },\r\n legend: {\r\n enabled: false\r\n }\r\n}\r\n\r\nexport const COLUMN_COMPARISON_CHART_OPTIONS = {\r\n chart: {\r\n type: 'column'\r\n },\r\n title: {\r\n text: ''\r\n },\r\n subtitle: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n grouping: false,\r\n borderWidth: 0\r\n }\r\n },\r\n legend: {\r\n enabled: false\r\n },\r\n tooltip: {\r\n enabled: false,\r\n shared: true,\r\n headerFormat: '{point.point.name}',\r\n pointFormat: '\\u25CF {series.name}: {point.y} medals
'\r\n },\r\n xAxis: {\r\n labels: {\r\n enabled: true\r\n },\r\n categories: [\r\n moment('1 Jan 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Feb 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Mar 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Apr 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 May 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Jun 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Jul 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Aug 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Sep 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Oct 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Nov 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Dec 2021').locale('nb').format('MMMM').slice(0, 3)\r\n ],\r\n crosshair: false\r\n },\r\n yAxis: [{\r\n title: {\r\n text: ''\r\n },\r\n endOnTick: false,\r\n maxPadding: 0,\r\n showFirstLabel: false\r\n }],\r\n series: [{\r\n color: 'rgb(158, 159, 163)',\r\n pointPlacement: -0.2,\r\n linkedTo: 'main',\r\n // data: dataPrev[2016].slice(),\r\n name: 'previousYear'\r\n }, {\r\n name: 'currentYear',\r\n id: 'main',\r\n // dataSorting: {\r\n // enabled: true,\r\n // matchByName: true\r\n // },\r\n dataLabels: [{\r\n enabled: true,\r\n inside: true,\r\n // style: {\r\n // fontSize: '16px'\r\n // }\r\n }],\r\n // data: getData(data[2016]).slice()\r\n }],\r\n exporting: {\r\n allowHTML: true\r\n }\r\n}\r\n\r\nexport const LINE_CHART_OPTIONS = {\r\n title: {\r\n text: ''\r\n },\r\n\r\n subtitle: {\r\n text: ''\r\n },\r\n\r\n xAxis: {\r\n labels: {\r\n enabled: true\r\n },\r\n categories: [\r\n moment('1 Jan 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Feb 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Mar 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Apr 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 May 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Jun 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Jul 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Aug 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Sep 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Oct 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Nov 2021').locale('nb').format('MMMM').slice(0, 3),\r\n moment('1 Dec 2021').locale('nb').format('MMMM').slice(0, 3)\r\n ],\r\n },\r\n\r\n yAxis: {\r\n endOnTick: false,\r\n maxPadding: 0,\r\n title: {\r\n text: ''\r\n }\r\n },\r\n\r\n legend: {\r\n layout: 'vertical',\r\n align: 'right',\r\n verticalAlign: 'middle',\r\n enabled: false\r\n },\r\n\r\n plotOptions: {\r\n series: {\r\n pointInterval: 1\r\n }\r\n },\r\n\r\n tooltip: {\r\n enabled: false\r\n },\r\n\r\n series: [{\r\n name: 'Installation',\r\n data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]\r\n }, {\r\n name: 'Manufacturing',\r\n data: [24916, 24064, 29742, 29851, 32490, 30282, 38121, 40434]\r\n }, {\r\n name: 'Sales & Distribution',\r\n data: [11744, 17722, 16005, 19771, 20185, 24377, 32147, 39387]\r\n }, {\r\n name: 'Project Development',\r\n data: [null, null, 7988, 12169, 15112, 22452, 34400, 34227]\r\n }, {\r\n name: 'Other',\r\n data: [12908, 5948, 8105, 11248, 8989, 11816, 18274, 18111]\r\n }],\r\n\r\n responsive: {\r\n rules: [{\r\n condition: {\r\n maxWidth: 500\r\n },\r\n chartOptions: {\r\n legend: {\r\n enabled: false,\r\n layout: 'horizontal',\r\n align: 'center',\r\n verticalAlign: 'bottom'\r\n }\r\n }\r\n }]\r\n }\r\n}","\r\nimport Highcharts from 'highcharts';\r\nimport HighchartsReact from 'highcharts-react-official';\r\nimport { useEffect, useState } from 'react';\r\nimport { LINE_CHART_OPTIONS } from '../charts/constants/chartOptions';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { Trans } from 'react-i18next';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport moment from 'moment';\r\n\r\n\r\nconst EnergyProduction = ({ slide }) => {\r\n const [current, setCurrent] = useState(undefined);\r\n const [today, setToday] = useState(0);\r\n const [categories24H, setCategories24H] = useState([]);\r\n const [produceddPower, setProducedPower] = useState(0);\r\n\r\n useEffect(() => {\r\n calculateProducedPower()\r\n setCategories24H(getCategories24HSimple())\r\n }, []);\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n //let monthNames = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"];\r\n const monthNamesNo = [\"januar \", \"februar\", \"mars\", \"april\", \"mai\", \"juni\", \"juli\", \"august\", \"september\", \"oktober\", \"november\", \"desember\"];\r\n return moment().format('HH:mm') + ' ' + date.getUTCDate() + '. ' + monthNamesNo[date.getMonth()].toUpperCase() + ' ' + date.getFullYear()\r\n } \r\n\r\n let getCategories24HSimple = () => {\r\n let cat = []\r\n for (let hour = 0; hour < 24; hour=hour+2) {\r\n cat.push( (hour < 10 ? '0' + hour : hour) + ':00')\r\n }\r\n cat.push('00:00')\r\n console.log(cat)\r\n return cat\r\n }\r\n\r\n const calculateProducedPower = () => {\r\n //let prodicedTags = slide.slideEnergy2.tags.filter(x => x.meterConfiguration.meterType === 'EXTERNALLY_IN')\r\n let prodicedTags = slide.slideEnergy2.tags.filter(x => x.meterConfiguration.meterType === 'INTERNALLY_PRODUCED' && x.tagType === 'POWER')\r\n console.log(prodicedTags, 'prodicedTags')\r\n let producedData = [];\r\n if (prodicedTags && prodicedTags.length){\r\n prodicedTags.forEach(tag => {\r\n let found = slide.slideEnergy2.liveFlow.find(x => x.id === tag.id)\r\n if(found)\r\n producedData.push(found)\r\n });\r\n }\r\n\r\n let values = []\r\n let todayTemp = 0\r\n let categoriesSet = false\r\n const date = new Date();\r\n const hour = date.getHours();\r\n const min = date.getMinutes();\r\n let ts = 1;\r\n if (producedData && producedData.length && producedData[0] && producedData[0].data && producedData[0].data.length > 1){\r\n var start = new Date(producedData[0].data[0].timestamp).getTime();\r\n var end = new Date(producedData[0].data[1].timestamp).getTime();\r\n ts = (end - start) / 60000;\r\n console.log(ts, 'tsssss')\r\n }\r\n let diff = (-1*(hour * 60 + min)/ts)\r\n console.log(diff, diff)\r\n if (producedData && producedData.length) {\r\n \r\n console.log(diff)\r\n producedData.forEach(e => {\r\n e.data = e.data.slice(diff);\r\n })\r\n }\r\n if (producedData && producedData.length){\r\n producedData.forEach(e => {\r\n e.data.forEach((d, index) => {\r\n if (index+1 < e.data.length){\r\n var start = new Date(e.data[index].timestamp).getTime();\r\n var end = new Date(e.data[index + 1].timestamp).getTime();\r\n var timespan = (end - start) / 3600000;\r\n todayTemp += timespan * (e.data[index].value + e.data[index + 1].value) / 2\r\n }\r\n if(!categoriesSet){\r\n values.push(Math.round(d.value))\r\n console.log(Math.round(d.value))\r\n //categoriesTemp.push(moment(d.timestamp).format('HH:mm'))\r\n } else if (values && values[index] !== undefined) {\r\n values[index] += Math.round(d.value)\r\n }\r\n })\r\n categoriesSet = true\r\n })\r\n }\r\n\r\n setToday(todayTemp)\r\n //setCategories(categoriesTemp)\r\n setCurrent(values[values.length - 1])\r\n let len = values.length\r\n if (values.length < (1440/ts)){\r\n for (let i = 0; i < ((1440/ts)-len); i++) {\r\n values.push(null)\r\n }\r\n }\r\n \r\n setProducedPower(values)\r\n }\r\n\r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default EnergyProduction;","\r\nimport Highcharts from 'highcharts';\r\nimport HighchartsReact from 'highcharts-react-official';\r\nimport { useEffect, useState } from 'react';\r\nimport { LINE_CHART_OPTIONS } from '../charts/constants/chartOptions';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { Trans } from 'react-i18next';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport moment from 'moment';\r\n\r\n\r\nconst EnergyConsumption = ({ slide }) => {\r\n const [current, setCurrent] = useState(undefined);\r\n const [today, setToday] = useState(0);\r\n const [categories, setCategories] = useState([]);\r\n const [produceddPower, setPurchasedPower] = useState(0);\r\n\r\n useEffect(() => {\r\n calculatePurchasedPower()\r\n\r\n }, []);\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n //let monthNames = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"];\r\n const monthNamesNo = [\"januar \", \"februar\", \"mars\", \"april\", \"mai\", \"juni\", \"juli\", \"august\", \"september\", \"oktober\", \"november\", \"desember\"];\r\n return moment().format('HH:mm') + ' ' + date.getUTCDate() + '. ' + monthNamesNo[date.getMonth()].toUpperCase() + ' ' + date.getFullYear()\r\n } \r\n\r\n let getCategories = () => {\r\n return categories\r\n }\r\n\r\n const calculatePurchasedPower = () => {\r\n let purchasedTags = slide.slideEnergy2.tags.filter(x => x.meterConfiguration.meterType === 'EXTERNALLY_IN' && x.tagType === 'POWER')\r\n console.log(purchasedTags, 'purchasedTags')\r\n let producedData = [];\r\n if (purchasedTags && purchasedTags.length){\r\n purchasedTags.forEach(tag => {\r\n let found = slide.slideEnergy2.liveFlow.find(x => x.id === tag.id)\r\n if(found)\r\n producedData.push(found)\r\n });\r\n }\r\n\r\n let values = []\r\n let todayTemp = 0\r\n let categoriesSet = false\r\n let categoriesTemp = [] \r\n if (producedData && producedData.length){\r\n producedData.forEach(e => {\r\n e.data.forEach((d, index) => {\r\n todayTemp += d.value\r\n if(!categoriesSet){\r\n values.push(d.value)\r\n categoriesTemp.push(moment(d.timestamp).format('HH:mm'))\r\n } else if (values && values[index] !== undefined) {\r\n values[index] += d.value\r\n }\r\n })\r\n categoriesSet = true\r\n })\r\n }\r\n\r\n setToday(todayTemp)\r\n setCategories(categoriesTemp)\r\n\r\n console.log(producedData, 'producedData')\r\n setPurchasedPower(values)\r\n setCurrent(values[values.length-1])\r\n }\r\n\r\n return (\r\n \r\n \r\n {
\r\n
\r\n {produceddPower && produceddPower.length ?\r\n <>\r\n \r\n {Today }\r\n
\r\n \r\n
\r\n\r\n\r\n\r\n \r\n {Energy produced }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n {formatNumber(current)}\r\n kW\r\n \r\n
\r\n \r\n {Current }\r\n
\r\n \r\n
\r\n\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(today)}\r\n kWh\r\n
\r\n \r\n {Produced today }\r\n
\r\n \r\n
\r\n \r\n : ''}\r\n \r\n \r\n {\r\n categories24H && categories24H.length && categories24H.map((cat, index) => \r\n (
\r\n \r\n {cat}\r\n
)\r\n )\r\n }\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default EnergyConsumption;","export default __webpack_public_path__ + \"static/media/nodata.d17f8b37.svg\";","import NoDataIcon from '../../assets/icons/nodata.svg';\r\n\r\n//Translations\r\nimport { Trans } from 'react-i18next';\r\n\r\nconst ChartNoData = () => {\r\n\r\n return (\r\n \r\n \r\n {
\r\n
\r\n {produceddPower && produceddPower.length ?\r\n \r\n {Today }\r\n
\r\n \r\n
\r\n\r\n\r\n\r\n \r\n {Energy purchased }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n\r\n
\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n {formatNumber(current)}\r\n kW\r\n \r\n
\r\n \r\n {Current }\r\n
\r\n \r\n
\r\n\r\n\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(today)}\r\n kW\r\n
\r\n \r\n {Last 2 hours }\r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default ChartNoData;","\r\nimport Highcharts from 'highcharts';\r\nimport HighchartsReact from 'highcharts-react-official';\r\nimport { useEffect, useState } from 'react';\r\nimport { LINE_CHART_OPTIONS } from '../charts/constants/chartOptions';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { Trans } from 'react-i18next';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport moment from 'moment';\r\nimport ChartNoData from '../errors/ChartNoData';\r\n\r\n\r\nconst EnergyProduced7D = ({ slide, isLightTheme }) => {\r\n const [current, setCurrent] = useState(undefined);\r\n const [sum, setSum] = useState(0);\r\n const [categories, setCategories] = useState([]);\r\n const [producedPower, setProducedPower] = useState(0);\r\n\r\n useEffect(() => {\r\n console.log('EnergyProduced7D')\r\n calculateProducedEnergy()\r\n }, []);\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n let fromDate = new Date(); fromDate.setDate(fromDate.getDate() - 7);\r\n //let monthNames = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"];\r\n const monthNamesNo = [\"januar \", \"februar\", \"mars\", \"april\", \"mai\", \"juni\", \"juli\", \"august\", \"september\", \"oktober\", \"november\", \"desember\"];\r\n return fromDate.getUTCDate() + '. ' + monthNamesNo[fromDate.getMonth()].toUpperCase() + ' ' + fromDate.getFullYear()\r\n + ' - ' + date.getUTCDate() + '. ' + monthNamesNo[date.getMonth()].toUpperCase() + ' ' + date.getFullYear()\r\n } \r\n\r\n let getCategories = () => {\r\n return categories\r\n }\r\n\r\n const calculateProducedEnergy = () => {\r\n let producedTags = slide.slideEnergy2.tags.filter(x => x.meterConfiguration.meterType === 'INTERNALLY_PRODUCED' && x.tagType === 'ENERGYMETER')\r\n console.log(producedTags, 'producedTags')\r\n let producedData = [];\r\n if (producedTags && producedTags.length){\r\n producedTags.forEach(tag => {\r\n let found = slide.slideEnergy2.energyProfile7D.find(x => x.id === tag.id)\r\n if(found)\r\n producedData.push(found)\r\n });\r\n }\r\n\r\n let values = []\r\n let sumTemp = 0\r\n let categoriesSet = false\r\n let categoriesTemp = [] \r\n if (producedData && producedData.length){\r\n producedData.forEach(e => {\r\n e.data.forEach((d, index) => {\r\n sumTemp += d.value\r\n if(!categoriesSet){\r\n values.push(d.value)\r\n categoriesTemp.push(moment(d.timestamp).format('DD MMM'))\r\n } else if (values && values[index] !== undefined) {\r\n values[index] += d.value\r\n }\r\n })\r\n categoriesSet = true\r\n })\r\n }\r\n\r\n setSum(sumTemp)\r\n setCategories(categoriesTemp)\r\n\r\n console.log(values, 'producedLast7D values')\r\n setProducedPower(values)\r\n }\r\n\r\n return (\r\n \r\n 
\r\n {
\r\n
\r\n
\r\n {No data }
\r\n Pelase check you configuration
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default EnergyProduced7D;","\r\nimport Highcharts from 'highcharts';\r\nimport HighchartsReact from 'highcharts-react-official';\r\nimport { useEffect, useState } from 'react';\r\nimport { LINE_CHART_OPTIONS } from '../charts/constants/chartOptions';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { Trans } from 'react-i18next';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport moment from 'moment';\r\nimport ChartNoData from '../errors/ChartNoData';\r\n\r\n\r\nconst EnergyPurchased7D = ({ slide }) => {\r\n const [current, setCurrent] = useState(undefined);\r\n const [sum, setSum] = useState(0);\r\n const [categories, setCategories] = useState([]);\r\n const [produceddPower, setPurchasedPower] = useState(0);\r\n\r\n useEffect(() => {\r\n console.log('EnergyPurchased7D')\r\n calculatePurchasedEnergy()\r\n }, []);\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n let fromDate = new Date(); fromDate.setDate(fromDate.getDate() - 7);\r\n //let monthNames = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"];\r\n const monthNamesNo = [\"januar \", \"februar\", \"mars\", \"april\", \"mai\", \"juni\", \"juli\", \"august\", \"september\", \"oktober\", \"november\", \"desember\"];\r\n return fromDate.getUTCDate() + '. ' + monthNamesNo[fromDate.getMonth()].toUpperCase() + ' ' + fromDate.getFullYear()\r\n + ' - ' + date.getUTCDate() + '. ' + monthNamesNo[date.getMonth()].toUpperCase() + ' ' + date.getFullYear()\r\n } \r\n\r\n let getCategories = () => {\r\n return categories\r\n }\r\n\r\n const calculatePurchasedEnergy = () => {\r\n let purchasedTags = slide.slideEnergy2.tags.filter(x => x.meterConfiguration.meterType === 'EXTERNALLY_IN' && x.tagType === 'ENERGYMETER')\r\n console.log(purchasedTags, 'purchasedTags')\r\n let purchasedData = [];\r\n if (purchasedTags && purchasedTags.length){\r\n purchasedTags.forEach(tag => {\r\n let found = slide.slideEnergy2.energyProfile7D.find(x => x.id === tag.id)\r\n if(found)\r\n purchasedData.push(found)\r\n });\r\n }\r\n\r\n let values = []\r\n let sumTemp = 0\r\n let categoriesSet = false\r\n let categoriesTemp = [] \r\n if (purchasedData && purchasedData.length){\r\n purchasedData.forEach(e => {\r\n e.data.forEach((d, index) => {\r\n sumTemp += d.value\r\n if(!categoriesSet){\r\n values.push(d.value)\r\n categoriesTemp.push(moment(d.timestamp).format('DD MMM'))\r\n } else if (values && values[index] !== undefined) {\r\n values[index] += d.value\r\n }\r\n })\r\n categoriesSet = true\r\n })\r\n }\r\n\r\n setSum(sumTemp)\r\n setCategories(categoriesTemp)\r\n\r\n console.log(values, 'purchasedLast7D values')\r\n setPurchasedPower(values)\r\n }\r\n\r\n return (\r\n \r\n \r\n {
\r\n
\r\n\r\n\r\n {producedPower && producedPower.length ?\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n\r\n \r\n {Energy produced }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(sum)}\r\n kWh\r\n
\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default EnergyPurchased7D;","\r\nimport Highcharts from 'highcharts';\r\nimport HighchartsReact from 'highcharts-react-official';\r\nimport { useEffect, useState } from 'react';\r\nimport { LINE_CHART_OPTIONS } from '../charts/constants/chartOptions';\r\nimport { formatNumber } from '../../helpers/numeral'\r\nimport { Trans } from 'react-i18next';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport moment from 'moment';\r\nimport ChartNoData from '../errors/ChartNoData';\r\n\r\n\r\nconst EnergySold7D = ({ slide }) => {\r\n const [current, setCurrent] = useState(undefined);\r\n const [sum, setSum] = useState(0);\r\n const [categories, setCategories] = useState([]);\r\n const [solddPower, setSoldPower] = useState(0);\r\n\r\n useEffect(() => {\r\n console.log('EnergySold7D')\r\n calculateSoldEnergy()\r\n }, []);\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n let fromDate = new Date(); fromDate.setDate(fromDate.getDate() - 7);\r\n //let monthNames = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"];\r\n const monthNamesNo = [\"januar \", \"februar\", \"mars\", \"april\", \"mai\", \"juni\", \"juli\", \"august\", \"september\", \"oktober\", \"november\", \"desember\"];\r\n return fromDate.getUTCDate() + '. ' + monthNamesNo[fromDate.getMonth()].toUpperCase() + ' ' + fromDate.getFullYear()\r\n + ' - ' + date.getUTCDate() + '. ' + monthNamesNo[date.getMonth()].toUpperCase() + ' ' + date.getFullYear()\r\n } \r\n\r\n let getCategories = () => {\r\n return categories\r\n }\r\n\r\n const calculateSoldEnergy = () => {\r\n let soldTags = slide.slideEnergy2.tags.filter(x => x.meterConfiguration.meterType === 'EXTERNALLY_OUT' && x.tagType === 'ENERGYMETER')\r\n console.log(soldTags, 'soldTags')\r\n let soldData = [];\r\n if (soldTags && soldTags.length){\r\n soldTags.forEach(tag => {\r\n let found = slide.slideEnergy2.energyProfile7D.find(x => x.id === tag.id)\r\n if(found)\r\n soldData.push(found)\r\n });\r\n }\r\n\r\n let values = []\r\n let sumTemp = 0\r\n let categoriesSet = false\r\n let categoriesTemp = [] \r\n if (soldData && soldData.length){\r\n soldData.forEach(e => {\r\n e.data.forEach((d, index) => {\r\n sumTemp += d.value\r\n if(!categoriesSet){\r\n values.push(d.value)\r\n categoriesTemp.push(moment(d.timestamp).format('DD MMM'))\r\n } else if (values && values[index] !== undefined) {\r\n values[index] += d.value\r\n }\r\n })\r\n categoriesSet = true\r\n })\r\n }\r\n\r\n setSum(sumTemp)\r\n setCategories(categoriesTemp)\r\n\r\n console.log(values, 'soldLast7D values')\r\n setSoldPower(values)\r\n }\r\n\r\n return (\r\n \r\n \r\n {
\r\n
\r\n\r\n\r\n {produceddPower && produceddPower.length ?\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n\r\n \r\n {Energy purchased }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(sum)}\r\n kWh\r\n
\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default EnergySold7D;","export default __webpack_public_path__ + \"static/media/building-new.792e649e.svg\";","export default __webpack_public_path__ + \"static/media/battery.1615708c.svg\";","export default __webpack_public_path__ + \"static/media/solar-new.27a5b001.svg\";","export default __webpack_public_path__ + \"static/media/grid-new.aeee6a83.svg\";","export const getGaugePercentage = (val) => {\r\n let x = 68 * val / 100\r\n if (x>68)\r\n return 68\r\n return x\r\n}","import { useEffect, useState } from 'react';\r\nimport { Trans } from 'react-i18next';\r\nimport { formatNumber } from '../../helpers/numeral';\r\nimport BuildingIcon from '../../assets/icons/building-new.svg';\r\nimport BatteryIcon from '../../assets/icons/battery.svg';\r\nimport SolarIcon from '../../assets/icons/solar-new.svg';\r\nimport GridIcon from '../../assets/icons/grid-new.svg';\r\nimport CalendarIcon from '../../assets/icons/calendar.svg';\r\nimport CalendarDarkIcon from '../../assets/icons/calendar-dark.svg';\r\nimport {getGaugePercentage} from \"../../helpers/functions\";\r\n\r\n\r\nconst FlowChart = ({ fromGrid, totalConsumption, solarProduction, batteryCharge, batteryStatus, solarEnergyPercentage, solarEnergyCapacityPercentage }) => {\r\n\r\n let getDate = () => {\r\n let date = new Date();\r\n //let monthNames = [\"january\", \"february\", \"march\", \"april\", \"may\", \"june\", \"july\", \"august\", \"september\", \"october\", \"november\", \"december\"];\r\n const monthNamesNo = [\"januar \", \"februar\", \"mars\", \"april\", \"mai\", \"juni\", \"juli\", \"august\", \"september\", \"oktober\", \"november\", \"desember\"];\r\n return date.getUTCDate() + '. ' + monthNamesNo[date.getMonth()].toUpperCase() + ' ' + date.getFullYear()\r\n }\r\n\r\n\r\n\r\n const [flowChanged, setFlowChanged] = useState(true);\r\n\r\n useEffect(() => {\r\n resetFlow()\r\n console.log(solarProduction, 'solarProduction')\r\n }, [solarProduction]);\r\n\r\n function resetFlow(){ \r\n setFlowChanged(false)\r\n setFlowChanged(true)\r\n }\r\n\r\n function isBatteryShown(){ \r\n return batteryCharge !== null && batteryStatus !== null\r\n }\r\n \r\n return (\r\n \r\n \r\n {
\r\n
\r\n\r\n\r\n {solddPower && solddPower.length ?\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n\r\n \r\n {Energy sold }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n {formatNumber(sum)}\r\n kWh\r\n
\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default FlowChart;","import numeral from \"numeral\";\r\n\r\nexport const formatNumber = (value, numberOfDecimals) => {\r\n let result;\r\n let temp = parseFloat(value);\r\n let leftSide;\r\n let rightSide;\r\n\r\n temp = temp.toFixed(numberOfDecimals);\r\n\r\n result = temp.toString().replace('.', ',');\r\n leftSide = result.split(',')[0];\r\n rightSide = result.split(',')[1];\r\n\r\n return numberOfDecimals ? `${leftSide.replace(/(\\d)(?=(\\d{3})+(?!\\d))/g, '$1 ')},${rightSide}` : leftSide.replace(/(\\d)(?=(\\d{3})+(?!\\d))/g, '$1 ');\r\n}\r\n\r\nexport const formatNumber2 = (value, decimalPlaces = undefined, isDecimalFormatting = false) => {\r\n if (value !== null) {\r\n if (decimalPlaces === undefined || decimalPlaces <= 0) {\r\n \r\n if(isDecimalFormatting === true) {\r\n //if number is decimal, format it with decimal places\r\n let nOd = value.toString().split(\".\")[1].length;\r\n let nOdFormat = \"0,0.\";\r\n for (let i = 0; i < nOd; i++) {\r\n nOdFormat += '0';\r\n }\r\n return numeral(value).format(nOdFormat);\r\n }\r\n \r\n return numeral(value).format();\r\n }\r\n \r\n let format = \"0,0.\";\r\n for (let i = 0; i < decimalPlaces; i++) {\r\n format += '0';\r\n }\r\n return numeral(value).format(format);\r\n }\r\n \r\n return undefined;\r\n }","import React from \"react\";\r\nimport { formatNumber } from \"../helpers/numeralFormatter\";\r\nimport { Trans } from 'react-i18next';\r\n\r\nconst Rect = ({ startX, startY, suppliersSum, producedSum, consumersSum, soldSum, isLightTheme }) => {\r\n return \r\n
\r\n \r\n \r\n {
\r\n
\r\n \r\n {Last 7 days }\r\n
\r\n \r\n
\r\n \r\n {Energy flow chart }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n
\r\n \r\n \r\n\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {isNaN(solarEnergyPercentage) ? 0 : solarEnergyPercentage > 100 ? 100 : solarEnergyPercentage}%\r\n \r\n
\r\n
\r\n \r\n \r\n {isNaN(solarEnergyPercentage) ? 0 : solarEnergyPercentage > 100 ? 100 : solarEnergyPercentage}%\r\n \r\n
\r\n \r\n From solar \r\n \r\n
\r\n {formatNumber(solarProduction, 1)} kW
\r\n\r\n {
\r\n
\r\n {Solar }
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {isNaN(solarEnergyPercentage) ? 100 : solarEnergyPercentage > 100 ? 0 : 100 - solarEnergyPercentage}%\r\n \r\n
\r\n
\r\n \r\n \r\n {isNaN(solarEnergyPercentage) ? 100 : solarEnergyPercentage > 100 ? 0 : 100 - solarEnergyPercentage}%\r\n \r\n
\r\n \r\n From grid \r\n \r\n
\r\n {formatNumber(fromGrid, 1)} kW
\r\n\r\n {
\r\n
\r\n {Grid }
\r\n \r\n {flowChanged ? \r\n \r\n :\r\n ''\r\n }\r\n
\r\n\r\n\r\n \r\n
\r\n\r\n \r\n
\r\n {\r\n isBatteryShown() &&\r\n \r\n \r\n
\r\n \r\n
\r\n {formatNumber(batteryCharge ? totalConsumption + batteryCharge : totalConsumption, 1)} kW
\r\n\r\n {
\r\n
\r\n {Building }
\r\n \r\n
\r\n }\r\n \r\n \r\n
\r\n \r\n \r\n \r\n {formatNumber(batteryStatus*100, 1)}%\r\n \r\n
\r\n
\r\n \r\n \r\n {formatNumber(batteryStatus*100, 1)}%\r\n \r\n
\r\n \r\n Charged \r\n \r\n
\r\n {formatNumber(batteryCharge, 1)} kW
\r\n\r\n {
\r\n
\r\n {Battery }
\r\n \r\n
\r\n );\r\n}\r\n\r\nexport default SankeyChart;\r\n","export default __webpack_public_path__ + \"static/media/building-placeholder.695b65b0.png\";","export default __webpack_public_path__ + \"static/media/solar-bg.78f38abc.png\";","export default __webpack_public_path__ + \"static/media/weather-widget-background.7d3ac82d.png\";","export default __webpack_public_path__ + \"static/media/building-placeholder-dark.6bd1efdc.png\";","export const sleep = (ms = 0) =>\r\n new Promise((resolve) => setTimeout(resolve, ms));\r\n\r\nexport const clearAllSleeps = () => {\r\n let id = window.setTimeout(function () {}, 0);\r\n\r\n while (id--) {\r\n window.clearTimeout(id);\r\n }\r\n}","import { useState, useEffect } from \"react\";\r\nimport { formatNumber } from \"../helpers/numeral\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport {\r\n setAllLocations,\r\n setCurrentLocation,\r\n} from \"../redux/actions/slideshow\";\r\nimport { Trans } from \"react-i18next\";\r\nimport EmLogo from \"../assets/images/em_logo.svg\";\r\nimport EmLogoWhite from \"../assets/images/em_logo_all_white_twolines.svg\";\r\nimport SloganWhite from \"../assets/images/slogan_white.svg\";\r\nimport HistoricProduction from \"../components/cards/HistoricProduction\";\r\nimport EnergyPurchased12M from \"../components/cards/EnergyPurchased12M\";\r\nimport EnergySold12M from \"../components/cards/EnergySold12M\";\r\nimport SolarInstallations from \"../components/cards/SolarInstallations\";\r\nimport EnergyProduction from \"../components/cards/EnergyProduction\";\r\nimport EnergyConsumption from \"../components/cards/EnergyConsumption\";\r\nimport EnergyProduced7D from \"../components/cards/EnergyProduced7D\";\r\nimport EnergyPurchased7D from \"../components/cards/EnergyPurchased7D\";\r\nimport EnergySold7D from \"../components/cards/EnergySold7D\";\r\nimport NetZero from \"../components/cards/NetZero\";\r\nimport FlowChart from \"../components/charts/FlowChart\";\r\nimport SankeyChart from \"../components/charts/SankeyChart/SankeyChart\";\r\nimport Building from \"../assets/images/building-placeholder.png\";\r\nimport SolarBg from \"../assets/images/solar-bg.png\";\r\nimport WeatherWidgetBg from \"../assets/images/weather-widget-background.png\";\r\nimport NoDataIcon from \"../assets/icons/nodata.svg\";\r\nimport BuildingDark from \"../assets/images/building-placeholder-dark.png\";\r\nimport { getGaugePercentage } from \"../helpers/functions\";\r\nimport { sleep } from \"../helpers/promises\";\r\n\r\nconst BuildingDetails = ({\r\n slide,\r\n isLightTheme,\r\n language,\r\n slideIndex,\r\n tempIndex,\r\n isPaused,\r\n newTopForBuildingDetails,\r\n}) => {\r\n const dispatch = useDispatch();\r\n const allSlides = useSelector((state) => state.slideshow.slides);\r\n const lightTheme = useSelector((state) => state.slideshow.lightTheme);\r\n const organization = useSelector((state) => state.slideshow.organization);\r\n const organizationLogo = organization.logoFullSVG\r\n ? btoa(unescape(encodeURIComponent(organization.logoFullSVG)))\r\n : undefined;\r\n const partnerLogo = organization.partner?.imageBase64\r\n\r\n const [isSimpleCapacityBox, setIsSimpleCapacityBox] = useState(undefined);\r\n const [tempTop, setTempTop] = useState(0);\r\n const [capacity, setCapacity] = useState(1);\r\n const startTime = new Date().getTime();\r\n\r\n const getSolarProduction = () => {\r\n let res = 0;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.liveFlow) {\r\n slide.slideEnergy2.liveFlow.forEach((e) => {\r\n let meter = slide.slideEnergy2.tags.find((x) => x.id === e.id);\r\n if (\r\n meter &&\r\n meter.meterConfiguration &&\r\n meter.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\" &&\r\n meter.tagType === \"POWER\" &&\r\n e.data &&\r\n e.data.length\r\n )\r\n res += e.data[e.data.length - 1].value;\r\n });\r\n }\r\n return res;\r\n };\r\n\r\n const getBatteryCharge = () => {\r\n let res = 0;\r\n let found = false;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.liveFlow) {\r\n slide.slideEnergy2.liveFlow.forEach((e) => {\r\n let meter = slide.slideEnergy2.tags.find((x) => x.id === e.id);\r\n if (\r\n meter &&\r\n meter.meterConfiguration &&\r\n meter.meterConfiguration.meterType === \"CHARGE\" &&\r\n meter.tagType === \"POWER\" &&\r\n e.data &&\r\n e.data.length\r\n ) {\r\n res += e.data[e.data.length - 1].value;\r\n found = true;\r\n }\r\n });\r\n }\r\n if (!found) return null;\r\n return res;\r\n };\r\n\r\n const getBatteryStatus = () => {\r\n let res = 0;\r\n let found = false;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.liveFlow) {\r\n slide.slideEnergy2.liveFlow.forEach((e) => {\r\n let meter = slide.slideEnergy2.tags.find((x) => x.id === e.id);\r\n if (\r\n meter &&\r\n meter.meterConfiguration &&\r\n meter.meterConfiguration.meterType === \"BATTERYSTATUS\" &&\r\n meter.tagType === \"BATTERY\" &&\r\n e.data &&\r\n e.data.length\r\n ) {\r\n res += e.data[e.data.length - 1].value;\r\n found = true;\r\n }\r\n });\r\n }\r\n if (!found) return null;\r\n return res;\r\n };\r\n\r\n const getSolarEnergyPercentage = () => {\r\n return Math.abs(\r\n (\r\n (getSolarProduction() / (getGridConsumption() + getSolarProduction())) *\r\n 100\r\n ).toFixed(0)\r\n );\r\n };\r\n\r\n const getGridConsumption = () => {\r\n let res = 0;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.liveFlow) {\r\n slide.slideEnergy2.liveFlow.forEach((e) => {\r\n let meter = slide.slideEnergy2.tags.find((x) => x.id === e.id);\r\n if (\r\n meter &&\r\n meter.meterConfiguration &&\r\n meter.meterConfiguration.meterType === \"EXTERNALLY_IN\" &&\r\n e.data &&\r\n e.data.length\r\n )\r\n res += e.data[e.data.length - 1].value;\r\n });\r\n }\r\n return res;\r\n };\r\n\r\n const getWeatherTemperature = () => {\r\n let forecast = slide.slideEnergy2.asset.currentWeather.forecast;\r\n return forecast[forecast.length - 1].temperature;\r\n };\r\n\r\n const getWeatherIcon = () => {\r\n if (slide.slideEnergy2 && slide.slideEnergy2.asset) {\r\n let forecast = slide.slideEnergy2.asset.currentWeather.forecast;\r\n return forecast[forecast.length - 1].symbol;\r\n }\r\n return \"\";\r\n };\r\n\r\n useEffect(() => {\r\n if (allSlides && allSlides.length > 0) {\r\n let tempLocations = [];\r\n allSlides.map((item, index) => {\r\n if (\r\n item.slideType === \"ENERGY\" &&\r\n item.slideEnergy2 &&\r\n item.slideEnergy2.asset &&\r\n item.slideEnergy2.asset.location &&\r\n item.slideEnergy2.asset.location.location &&\r\n item.slideEnergy2.asset.location.location.coordinates\r\n ) {\r\n tempLocations.push({\r\n lat: item.slideEnergy2.asset.location.location.coordinates[1],\r\n lng: item.slideEnergy2.asset.location.location.coordinates[0],\r\n });\r\n }\r\n if (index === allSlides.length - 1) {\r\n dispatch(setAllLocations(tempLocations));\r\n tempLocations = [];\r\n }\r\n });\r\n }\r\n\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.asset &&\r\n slide.slideEnergy2.asset.location &&\r\n slide.slideEnergy2.asset.location.location &&\r\n slide.slideEnergy2.asset.location.location.coordinates\r\n ) {\r\n dispatch(\r\n setCurrentLocation(\r\n slide.slideEnergy2.asset.location.location.coordinates[1],\r\n slide.slideEnergy2.asset.location.location.coordinates[0]\r\n )\r\n );\r\n }\r\n }, [allSlides, slide]);\r\n\r\n useEffect(() => {\r\n if (tempIndex === slideIndex) {\r\n //startVerticalSliding(1)\r\n console.log(\"startVerticalSliding escaped\");\r\n } else {\r\n let buildingCharts = document.getElementById(\r\n \"buildingCharts\" + slideIndex\r\n );\r\n if (buildingCharts) {\r\n buildingCharts.setAttribute(\"style\", \"top: 100% !important\");\r\n buildingCharts.setAttribute(\"style\", \"top: 0% !important\");\r\n }\r\n }\r\n }, [tempIndex]);\r\n\r\n useEffect(() => {\r\n checkCapacityBox(newTopForBuildingDetails.value);\r\n }, [newTopForBuildingDetails]);\r\n useEffect(() => {\r\n if (tempIndex === slideIndex && getNumberOfSlides()) {\r\n startVerticalSliding(2);\r\n }\r\n }, [isPaused, tempIndex]);\r\n\r\n const startVerticalSliding = async (option) => {\r\n if (isPaused) return;\r\n await sleep(100);\r\n let buildingCharts = document.getElementById(\"buildingCharts\" + slideIndex);\r\n let slideDuration = Number(buildingCharts.getAttribute(\"slide-duration\"));\r\n let numberOfVerticalSliides = Number(\r\n buildingCharts.getAttribute(\"number-of-slides\")\r\n );\r\n if (buildingCharts) {\r\n let getSeconds = (new Date().getTime() - startTime) / 1000;\r\n console.log(\"Time passed: \" + getSeconds + \" seconds\");\r\n console.log(buildingCharts.style.top);\r\n let oldTop = buildingCharts.style.top;\r\n let newTop = 0;\r\n if (option === 1) {\r\n newTop = 0;\r\n } else if (oldTop && oldTop !== \"0%\") {\r\n newTop = Number(oldTop.substring(1, 4)) + 100;\r\n if (newTop >= numberOfVerticalSliides * 100) newTop = 0;\r\n } else {\r\n newTop = 100;\r\n }\r\n if (option !== 2) {\r\n buildingCharts.setAttribute(\r\n \"style\",\r\n \"top: -\" + newTop + \"% !important\"\r\n );\r\n checkCapacityBox(newTop);\r\n setTempTop(newTop / 100);\r\n }\r\n }\r\n await sleep((slideDuration / numberOfVerticalSliides) * 1000);\r\n startVerticalSliding();\r\n };\r\n\r\n const checkCapacityBox = (position) => {\r\n if (isSolarInstallationsShown() && isCapacity(position)) {\r\n let installation = slide.slideEnergy2.solarInstallations[position / 100];\r\n setCapacity(installation.installedSolarPanelCapacity);\r\n let tag = slide.slideEnergy2.liveFlow.find(\r\n (x) => x.id === installation.id\r\n );\r\n console.log(installation, \"cap usage\");\r\n console.log(slide.slideEnergy2.liveFlow, \"cap usage\");\r\n setIsSimpleCapacityBox(false);\r\n } else setIsSimpleCapacityBox(true);\r\n };\r\n\r\n const isCapacity = (position) => {\r\n return position <= (slide.slideEnergy2.solarInstallations.length - 1) * 100;\r\n };\r\n\r\n const isNetZeroChartShown = () => {\r\n return false;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.tags) {\r\n let EX_OUT_tags = slide.slideEnergy2.tags.find(\r\n (t) => t.meterConfiguration.meterType === \"EXTERNALLY_OUT\"\r\n );\r\n if (EX_OUT_tags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const getNumberOfSlides = () => {\r\n let numberOfSlides = 0;\r\n if (isSolarInstallationsShown())\r\n numberOfSlides += slide.slideEnergy2.solarInstallations.length;\r\n if (isNetZeroChartShown()) numberOfSlides++;\r\n if (isLiveShown()) numberOfSlides++;\r\n if (isLiveEnergyFlowShown()) numberOfSlides++;\r\n if (isProductionShown()) numberOfSlides++;\r\n if (isPurchaseShown()) numberOfSlides++;\r\n if (isEnergyPurchased7DShown()) numberOfSlides++;\r\n if (isEnergyProduced7DShown()) numberOfSlides++;\r\n if (isEnergySold7DShown()) numberOfSlides++;\r\n if (isEnergyFlow7DShown()) numberOfSlides++;\r\n if (isEnergyFlow1YShown()) numberOfSlides++;\r\n if (isProduction1YShown()) numberOfSlides++;\r\n if (isConsumption1YShown()) numberOfSlides++;\r\n if (isSold1YShown()) numberOfSlides++;\r\n return numberOfSlides;\r\n };\r\n\r\n const isLiveShown = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.liveFlow) {\r\n let INTERNALLY_PRODUCED_tags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\" &&\r\n t.tagType === \"POWER\"\r\n );\r\n let EXTERNALLY_IN_tags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"EXTERNALLY_IN\" &&\r\n t.tagType === \"POWER\"\r\n );\r\n if (INTERNALLY_PRODUCED_tags && EXTERNALLY_IN_tags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isLiveEnergyFlowShown = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.powerConsumedLive) {\r\n return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isProductionShown = () => {\r\n return false;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.flowChart) {\r\n let INTERNALLY_PRODUCED_tags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\" &&\r\n t.tagType === \"POWER\"\r\n );\r\n console.log(INTERNALLY_PRODUCED_tags, \"INTERNALLY_PRODUCED_tags\");\r\n if (INTERNALLY_PRODUCED_tags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isEnergyProduced7DShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.energyProfile7D &&\r\n slide.slideEnergy2.energyProfile7D.length\r\n ) {\r\n let foundTags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\" &&\r\n t.tagType === \"ENERGYMETER\"\r\n );\r\n if (foundTags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isEnergyPurchased7DShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.energyProfile7D &&\r\n slide.slideEnergy2.energyProfile7D.length\r\n ) {\r\n let foundTags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"EXTERNALLY_IN\" &&\r\n t.tagType === \"ENERGYMETER\"\r\n );\r\n if (foundTags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isEnergySold7DShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.energyProfile7D &&\r\n slide.slideEnergy2.energyProfile7D.length\r\n ) {\r\n let foundTags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"EXTERNALLY_OUT\" &&\r\n t.tagType === \"ENERGYMETER\"\r\n );\r\n if (foundTags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isEnergyFlow7DShown = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.energyFlow7D)\r\n return true;\r\n return false;\r\n };\r\n\r\n const isEnergyFlow1YShown = () => {\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.energyFlow1Y)\r\n return true;\r\n return false;\r\n };\r\n\r\n const isProduction1YShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.energyProfile1Y &&\r\n slide.slideEnergy2.energyProfile1Y.length\r\n ) {\r\n let foundTags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\" &&\r\n t.tagType === \"ENERGYMETER\"\r\n );\r\n if (foundTags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isConsumption1YShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.energyProfile1Y &&\r\n slide.slideEnergy2.energyProfile1Y.length\r\n ) {\r\n let foundTags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"EXTERNALLY_IN\" &&\r\n t.tagType === \"ENERGYMETER\"\r\n );\r\n if (foundTags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isSold1YShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.energyProfile1Y &&\r\n slide.slideEnergy2.energyProfile1Y.length\r\n ) {\r\n let foundTags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"EXTERNALLY_OUT\" &&\r\n t.tagType === \"ENERGYMETER\"\r\n );\r\n if (foundTags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isPurchaseShown = () => {\r\n return false;\r\n if (slide && slide.slideEnergy2 && slide.slideEnergy2.flowChart) {\r\n let INTERNALLY_PRODUCED_tags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"INTERNALLY_PRODUCED\" &&\r\n t.tagType === \"POWER\"\r\n );\r\n let EXTERNALLY_IN_tags = slide.slideEnergy2.tags.find(\r\n (t) =>\r\n t.meterConfiguration.meterType === \"EXTERNALLY_IN\" &&\r\n t.tagType === \"POWER\"\r\n );\r\n if (EXTERNALLY_IN_tags && !INTERNALLY_PRODUCED_tags) return true;\r\n }\r\n return false;\r\n };\r\n\r\n const isSolarInstallationsShown = () => {\r\n if (\r\n slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.solarInstallations &&\r\n slide.slideEnergy2.solarInstallations.length\r\n )\r\n return true;\r\n return false;\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n { \r\n isLive ?\r\n
\r\n
\r\n \r\n \r\n { \r\n isLive ?\r\n Live \r\n :\r\n is7days ?\r\n Last 7 days \r\n :\r\n Last 12 months \r\n }\r\n
\r\n \r\n
\r\n \r\n {Energy flow chart }\r\n
\r\n \r\n \r\n {getDate()}\r\n \r\n\r\n\r\n
\r\n \r\n {hasData && consumers.length && suppliers.length &&
\r\n 4 ? '30px' : (consumers.length === 1 && suppliers.length === 2) ? '70px' : '60px'\r\n }}>\r\n \r\n \r\n
}\r\n \r\n \r\n {/* BUILDING LOCATION SECTION*/}\r\n \r\n \r\n {organizationLogo ? (\r\n
\r\n \r\n
\r\n ) : (\r\n \r\n \r\n {organization.name}\r\n \r\n
\r\n )}\r\n \r\n {slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.asset &&\r\n slide.slideEnergy2.asset.name\r\n ? slide.slideEnergy2.asset.name\r\n : false}\r\n
\r\n\r\n {slide &&\r\n slide.slideEnergy2 &&\r\n slide.slideEnergy2.asset &&\r\n slide.slideEnergy2.asset.location\r\n ? slide.slideEnergy2.asset.location.streetAddress1\r\n ? slide.slideEnergy2.asset.location.streetAddress1\r\n : slide.slideEnergy2.asset.location.streetAddress2\r\n ? slide.slideEnergy2.asset.location.streetAddress2\r\n : false\r\n : false}\r\n
\r\n\r\n
\r\n\r\n \r\n {\" \"}\r\n \r\n {\r\n slide.slideEnergy2.asset.building\r\n .installedSolarPanelCapacity\r\n }\r\n {\" \"}\r\n kW\r\n
\r\n\r\n \r\n
\r\n \r\n )}\r\n \r\n\r\n \r\n \r\n
\r\n \r\n \r\n {((getSolarProduction() / capacity) * 100).toFixed(0)}\r\n \r\n %\r\n \r\n \r\n \r\n {\r\n \r\n of {capacity} kW installed power\r\n \r\n }\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n \r\n {formatNumber(getWeatherTemperature(), 1)}\r\n \r\n \r\n °C\r\n \r\n
\r\n \r\n \r\n\r\n {partnerLogo && \r\n \r\n
\r\n ) : (\r\n \r\n
\r\n \r\n
\r\n )}\r\n \r\n \r\n \r\n \r\n\r\n \r\n
\r\n \r\n
\r\n )}\r\n\r\n {isPurchaseShown() && (\r\n \r\n
\r\n )}\r\n\r\n {isLiveEnergyFlowShown() && (\r\n \r\n \r\n
\r\n )}\r\n\r\n {isEnergyPurchased7DShown() && (\r\n \r\n
\r\n )}\r\n\r\n {isEnergySold7DShown() && (\r\n \r\n
\r\n )}\r\n\r\n {isEnergyFlow7DShown() && (\r\n \r\n Production\r\n }\r\n subtitle={\r\n \r\n Year to date\r\n \r\n }\r\n slideIndex={slideIndex}\r\n />\r\n
\r\n )}\r\n\r\n {isConsumption1YShown() && (\r\n \r\n Purchased\r\n }\r\n subtitle={\r\n \r\n Year to date\r\n \r\n }\r\n slideIndex={slideIndex}\r\n />\r\n
\r\n )}\r\n\r\n {isSold1YShown() && (\r\n \r\n Sold\r\n }\r\n subtitle={\r\n \r\n Year to date\r\n \r\n }\r\n slideIndex={slideIndex}\r\n />\r\n
\r\n )}\r\n\r\n {isNetZeroChartShown() ? (\r\n \r\n \r\n Purchased sold net\r\n \r\n }\r\n subtitle={\r\n \r\n Year to date\r\n \r\n }\r\n purchased={\r\n Purchased \r\n }\r\n sold={Sold }\r\n net={\r\n \r\n Net\r\n \r\n }\r\n netTotals={slide.slideEnergy2.netTotals}\r\n netProfile={slide.slideEnergy2.netProfile}\r\n tags={slide.slideEnergy2.tags}\r\n />\r\n
\r\n ) : (\r\n \"\"\r\n )}\r\n \r\n ) : (\r\n \r\n \r\n
\r\n \r\n )}\r\n \r\n );\r\n};\r\n\r\nexport default BuildingDetails;\r\n","export default __webpack_public_path__ + \"static/media/em_logo_all_purple_twolines.206ff2c5.svg\";","export default __webpack_public_path__ + \"static/media/slogan.caee83e3.svg\";","export default __webpack_public_path__ + \"static/media/sunrise.4d239b0d.svg\";","export default __webpack_public_path__ + \"static/media/sunset.0bd53e17.svg\";","export default __webpack_public_path__ + \"static/media/sunny-day.a121e86d.svg\";","export default __webpack_public_path__ + \"static/media/wind-up.59acb56c.svg\";","export default __webpack_public_path__ + \"static/media/umbrella.99d4cd44.svg\";","export default __webpack_public_path__ + \"static/media/humidity.2c87ec2a.svg\";","export default \"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAGeklEQVR42u1bTWhUVxT+7n0zGX+DhCgurASR1FoojWYRwUaQ0l0LtRbcFYR2JS5K60K6ceXCZdBNV1JclS6Ku0qQZNEZYjtJNVUrRsVKiT+dWMnMy9x7z7ldzJs4mdz5ycx9mdb4wVvMe3PvO993f96955wrECPGx8fl0NDQziAIhgAMCCH2AOgDsB3AFgBd0V8VgOcAZgE8sNbeBjBJRJlMJvNweHiY47TTK3K5nDTGDBPRCDPPMLNt85ohohFjzHAul5Od5lcTSqleIjrNzPc9kK513Sei00qp3k7zrSZ+jpnzMRKvvvJEdK6jQszPzyeI6CQzz60i8eprjohOzs/PJ1rlIVopZIzZK6W8CGBwBcWeAJgCcMda+yeAZwAWomfrAPQKId4A0A/gXQDbVlD3L8z8WSKRuNl6kzYJIjrOzGETrUPMPEpEJ7TW/dlstukJLJvNSq11PxGdYObRqK5G7wuJ6HhsxAuFQoKIzjdhyFMiOqOU2uHr3UqpHUR0hpmfNno/EZ0vFAotDwknFhYWNjDz5SbG46lisbghrkYoFosbiOhUE/PO5YWFBT92ROSvNFD9ktZ6JWO2LWittxHRpQYiXGlbhEKhkGjQ8nPGmKOrRbwaxpijDXrD5baGQ4Mxf8sY098p8mVorfuZ+Va9OaFV8sfrkE8rpXo6Tb4MpVQPM6friLCyr4MxZm+dT11aKdXdjsHGmN1EdNizCN11RAiNMXubqiifzyeY+Vqtbu+j5YnoK2b+0acAkQg9dYbDtaZWjNHyttaE52XMM/NFZv7DtwDA4pwwV2MonGykYG+dwt5m+6iH6RcvXnS1X9tyRF8HZyPW3UBFuzrnd96XcbOzs7K8c9RaNzcuW0CtdQIRnXMWiFrftaWd87nIUUr1VRhzJC4BtNbbavTmfGUvWNygBEHwBYBlKydr7dlkMvnEl2FBEFS2+p64BEgmk0+stWcdjzZEXF8il8tJdntynvpe2xPRlxX1fxeXAEBp71BjA3W/7F6TANDd3X0QJWflElhrL6RSqYJPo4QQb1f8jK0HAEAqlSpYay84HvVFnEsCCCE+dfyJiejbGOyqJL1nZmYmVkdnxGGZV3mR8/j4uGS393Y0DoOY+e/K9xSLRW9+gzrvHHXwmxkbG5NLZuWqz8UJ34aEYdhb/R5jzPtxCxB5lpZxVEr1ySho4VLtJ9+GJJPJZWM+CpbEilpcgiAYkgD2O549mZ6evuvbECFEv+PeW3ELcOPGjbsoOWWrsV+6jAIwNTAwEEc46k3HvdhWg2Xs27ePUfJIL4EQol/C8fkDcCcOQ2qIHfsQqMOpT6IUqFyCyG8fB3Y77m0Pw3BL3OxrcNouUYrSVuOZbwMePXokawiArq6ur40xw2EYtuVoaQAXpy0SL0PUlViAZ2zdunU7ShGgZRBCnJZSjqVSqX+iNckPRPQNEX1ULBZ3TkxM+FgsuTh1+Q0g1EEQBLua/OsuALuEEEcAIJlMYnBwMMfMU9baKQC/MfNUGIa3u7u7Vbt2JVBKTqjuBetaqKsuhBDtbKl7ABwWQhyOxMSmTZsUEU0EQfBek3W4OKkESpkZ1cZ5Dztba58J0VIsdonBAKYBXLfWTlprJ1ZQ1sXpeQKltJQlAkRRWq8Iw/DnjRs3XgfwTpNFHkVEp1Hq9tfDMLzTarevwWk2AeCBwyjvAY/NmzcbrfWHQRBcAnCw4tFfAG4DuGmt/d1aO621nl6/fv1zzya4OD2o5Qd8PDk5Gcs29erVq1IptVNrvTefz2+K4x3VyGazkpkfO/2DRHTMtVPSWnc87OULkavcteM9Joko4yokpfyg04b7gpTSueUmoozMZDIPAdyrfiiE+LjThvuCEOITx+176XT6YVmJEUcXIZ9ZHp2CUmoHO1JsiGgEiHyC1trvHWVlEASfd5pAu4g4LJvQl3BeTbf4aqIZt/gioixP10x5qtNEWkWUT+TidHrZn1crNLZaaDY0Vq1Y7MHR1cKKg6NA/fB4J5OhVoqWw+ORcjUTJP4Pq0NjTOsJEsDqpMjEhUYpMvl8vjkHUNxJUjGR95MkVcaaTpOrEKFuouR/YU6Ixrz/REngdaosgDWeLF0lwtpMly9jTR+YqMSrdmTm9aGpVvGqHJtrG2v24GQNIdbe0dlq/N8OT7cdrayHsbExeeDAgfLx+f1RikwfGh+fvwPgVyLKpNPph4cOHYrt+Py/W1Z0gsEcPw8AAAAASUVORK5CYII=\"","//Assets\r\nimport WindUpIcon from '../../assets/icons/wind-up.svg';\r\nimport ClockIcon from '../../assets/icons/clock.png';\r\nimport { formatNumber } from '../../helpers/numeral';\r\n\r\nconst WeatherCard = ({ time, icon, temperature, windSpeed, windDirection }) => {\r\n return (\r\n No data for this slide
\r\nPelase check you configuration
\r\n\r\n
\r\n\r\n \r\n {time}\r\n
\r\n\r\n
\r\n \r\n
\r\n\r\n \r\n {formatNumber(temperature, 1)} °C\r\n
\r\n\r\n
\r\n \r\n )\r\n}\r\n\r\nexport default WeatherCard;","import { formatNumber } from '../../helpers/numeral';\r\n\r\nconst SmallWeatherCard = ({ icon, iconAlt, value, unit, windDirection }) => {\r\n return (\r\n \r\n \r\n {formatNumber(windSpeed, 1)} m/s\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n \r\n )\r\n}\r\n\r\nexport default WeatherSlide;","export default __webpack_public_path__ + \"static/media/message_bg.c2aa5295.svg\";","//Assets\r\nimport SlideBackground from '../assets/images/message_bg.svg';\r\nimport Logo from '../assets/images/em_logo_all_purple_twolines.svg';\r\nimport Slogan from '../assets/images/slogan.svg';\r\n\r\nconst MessageSlide = ({ slide, slideshow }) => {\r\n //Functions\r\n const svgToBase64 = (svg) => {\r\n if (svg)\r\n return (\"data:image/svg+xml;base64,\" + window.btoa(svg));\r\n\r\n return null\r\n }\r\n\r\n return (\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n \r\n \r\n
\r\n \r\n {place}\r\n
\r\n\r\n {date}\r\n
\r\n\r\n
\r\n \r\n {nextForecast ? moment(nextForecast.utcTime).tz('Europe/Oslo').format('HH:mm') : ''} - {nextForecast ? moment(nextForecast.utcTime).add(1, 'hours').tz('Europe/Oslo').format('HH:mm') : ''}\r\n
\r\n\r\n {nextForecast ? formatNumber(nextForecast.temperature, 1) : ''} °C\r\n
\r\n\r\n
\r\n \r\n
\r\n \r\n {sunrise}\r\n
\r\n\r\n {sunset}\r\n
\r\n\r\n
\r\n \r\n {forecast.length > 0\r\n ? forecast.slice(1, 8).map((weather, index) => (\r\n
\r\n\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n {credit}
\r\n\r\n
\r\n )\r\n}\r\n\r\nexport default MessageSlide;","const ImageSlide = ({ slide }) => {\r\n return (\r\n \r\n
\r\n \r\n \r\n \r\n {slide && slide.slideMessage && slide.slideMessage.icon && }\r\n {(\r\n slide &&\r\n slide.slideMessage &&\r\n slide.slideMessage.title\r\n )\r\n ? slide.slideMessage.title\r\n : false}\r\n
\r\n {slide && slide.slideMessage && slide.slideMessage.message &&\r\n \r\n }\r\n\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default ImageSlide;","import ReactPlayer from 'react-player'\r\n\r\n\r\nconst ViedoSlide = ({ slide, tempIndex, slideIndex, onVideoEnd }) => {\r\n\r\n const opts = {\r\n height: '1080',\r\n width: '1920',\r\n playerVars: {\r\n // https://developers.google.com/youtube/player_parameters\r\n autoplay: 1,\r\n controls: 0,\r\n showinfo: 0,\r\n mute: 1,\r\n },\r\n }\r\n\r\n const stateChange = (event) => {\r\n if(event.data === 0){\r\n onVideoEnd();\r\n }\r\n }\r\n\r\n return (\r\n \r\n {(\r\n slide &&\r\n slide.slideImage &&\r\n slide.slideImage.image &&\r\n slide.slideImage.image.url\r\n )\r\n ?
\r\n \r\n
\r\n )\r\n}\r\n\r\n\r\nconst getYoutubeUrl = (url) => {\r\n //let str = 'https://www.youtube.com/embed/' + url.split('/')[3] + '?autoplay=1&controls=0&showinfo=0' + '&mute=1'\r\n let str = url.split('/')[3] //+ '?autoplay=1&controls=0&showinfo=0' + '&mute=1'\r\n if(str.includes('watch?v=')){\r\n str = str.replace('watch?v=', '')\r\n }\r\n return str\r\n}\r\n\r\nexport default ViedoSlide;","import { useEffect, useState } from 'react';\r\n\r\nconst MessageSlide = ({ slide }) => {\r\n \r\n useEffect(() => {\r\n setSlideItteration(slideItteration + 1);\r\n }, [slide])\r\n\r\n const [slideItteration, setSlideItteration] = useState(0);\r\n\r\n return (\r\n \r\n {( \r\n tempIndex === slideIndex &&\r\n slide &&\r\n slide.slideVideo &&\r\n slide.slideVideo.url\r\n )\r\n ?\r\n /*\r\n
\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default MessageSlide;","export default __webpack_public_path__ + \"static/media/em_logo_all_white.f6b0a6c8.svg\";","import Logo from '../../assets/images/em_logo_all_white.svg';\r\n\r\n//Translations\r\nimport { Trans } from 'react-i18next';\r\n\r\nconst Error500 = () => {\r\n\r\n const logoCss = {\r\n display: 'flex',\r\n padding: '60px 80px',\r\n }\r\n const textCss = {\r\n display: 'flex',\r\n maxHeight: '100vh',\r\n justifyContent: 'center',\r\n alignItems: 'center',\r\n height: 'calc(100vh - 300px)',\r\n textAlign: 'center'\r\n }\r\n \r\n return (\r\n \r\n {(\r\n slide &&\r\n slide.slideUrl &&\r\n slide.slideUrl.url\r\n )\r\n ?
\r\n \r\n \r\n \r\n
\r\n )\r\n}\r\n\r\nexport default Error500;","export default __webpack_public_path__ + \"static/media/icon-top.02ba8486.svg\";","export default __webpack_public_path__ + \"static/media/icon-play.2f8d0899.svg\";","export default __webpack_public_path__ + \"static/media/icon-next.01b5e5f7.svg\";","export default __webpack_public_path__ + \"static/media/icon-pause.de805dcf.svg\";","export default __webpack_public_path__ + \"static/media/icon-bottom.f6291c05.svg\";","export default __webpack_public_path__ + \"static/media/icon-previous.0243a7ed.svg\";","import { useEffect, useState } from \"react\";\r\nimport { useEmblaCarousel } from \"embla-carousel/react\";\r\nimport { useLocation } from \"react-router-dom\";\r\nimport { useDispatch, useSelector } from \"react-redux\";\r\nimport { setSliderData } from \"../../redux/actions/slideshow\";\r\nimport { getSlideshow } from \"../../services/slideshow\";\r\nimport BuildingDetails from \"../../screens/BuildingDetails\";\r\nimport WeatherSlide from \"../../screens/WeatherSlide\";\r\nimport MessageSlide from \"../../screens/MessageSlide\";\r\nimport ImageSlide from \"../../screens/ImageSlide\";\r\nimport VideoSlide from \"../../screens/VideoSlide\";\r\nimport UrlSlide from \"../../screens/UrlSlide\";\r\nimport Error500 from \"../../components/errors/Error500\";\r\nimport TopIcon from \"../../assets/icons/icon-top.svg\";\r\nimport PlayIcon from \"../../assets/icons/icon-play.svg\";\r\nimport NextIcon from \"../../assets/icons/icon-next.svg\";\r\nimport PauseIcon from \"../../assets/icons/icon-pause.svg\";\r\nimport BottomIcon from \"../../assets/icons/icon-bottom.svg\";\r\nimport PreviousIcon from \"../../assets/icons/icon-previous.svg\";\r\nimport { sleep, clearAllSleeps } from \"../../helpers/promises\";\r\n\r\nconst viewportCss = { overflow: \"hidden\" };\r\nconst containerCss = { display: \"flex\", maxHeight: \"100vh\" };\r\n\r\nconst Slider = () => {\r\n const url = useLocation();\r\n const dispatch = useDispatch();\r\n const slides = useSelector((state) => state.slideshow.slides);\r\n const slideshow = useSelector((state) => state.slideshow.slideshow);\r\n const [isPaused, setIsPaused] = useState(false);\r\n const [pauseTime, setPauseTime] = useState(undefined);\r\n const [isError, setIsError] = useState(false);\r\n const [tempIndex_, setTempIndex_] = useState(false);\r\n const [updatedDate, setUpdatedDate] = useState(undefined);\r\n const [newTopForBuildingDetails, setNewTopForBuildingDetails] = useState({\r\n value: 0,\r\n });\r\n\r\n const [emblaRef, emblaApi] = useEmblaCarousel({\r\n loop: true,\r\n });\r\n\r\n useEffect(() => {\r\n document.addEventListener(\"plugin_web_update_notice\", displayNotification);\r\n return () =>\r\n document.removeEventListener(\r\n \"plugin_web_update_notice\",\r\n displayNotification\r\n );\r\n }, []);\r\n\r\n const displayNotification = () => {\r\n console.log(\"Reloading for new version in 5 seconds...\");\r\n window.location.reload(true);\r\n };\r\n\r\n useEffect(() => {\r\n if (slides.length > 0 && emblaApi) {\r\n checkIsYTVideoNext(0).then((res) => {\r\n delaySlide(res ? res : slides[0].durationInSeconds, 1);\r\n });\r\n }\r\n }, [slides, emblaApi]);\r\n\r\n useEffect(() => {\r\n if (updatedDate && emblaApi) {\r\n emblaApi.reInit({\r\n loop: true,\r\n });\r\n }\r\n }, [updatedDate]);\r\n\r\n useEffect(() => {\r\n getNewSlideshow();\r\n }, [dispatch]);\r\n\r\n const scrollNext = () => {\r\n if (emblaApi.canScrollNext()) {\r\n emblaApi.scrollNext();\r\n } else console.log(\"cannot scroll\");\r\n };\r\n\r\n const scrollPrevious = () => {\r\n if (emblaApi.canScrollPrev()) emblaApi.scrollPrev();\r\n else console.log(\"cannot scroll\");\r\n };\r\n\r\n async function delaySlide(duration, index) {\r\n let tempIndex = index;\r\n setTempIndex_(tempIndex - 1);\r\n if (index >= slides.length) {\r\n tempIndex = 0;\r\n }\r\n let customDelay = await checkIsYTVideoNext(tempIndex);\r\n\r\n await sleep(duration * 1000);\r\n if (tempIndex === 0) {\r\n console.log(\"get new slideshow\");\r\n getNewSlideshow();\r\n scrollNext();\r\n setIsPaused(false)\r\n } else {\r\n console.log(\"slide next\");\r\n clearAllSleeps();\r\n setIsPaused(true);\r\n scrollNext();\r\n delaySlide(\r\n customDelay ? customDelay : slides[tempIndex].durationInSeconds,\r\n tempIndex + 1\r\n );\r\n }\r\n }\r\n\r\n const pause = () => {\r\n clearAllSleeps();\r\n setIsPaused(true);\r\n setPauseTime(Date.now());\r\n };\r\n\r\n const play = () => {\r\n clearAllSleeps();\r\n setIsPaused(false);\r\n delaySlide(slides[tempIndex_].durationInSeconds, tempIndex_ + 1);\r\n setPauseTime(null);\r\n };\r\n\r\n const getNewSlideshow = () => {\r\n getSlideshow(url.pathname, url.search.slice(5)).then(async (result) => {\r\n if (result.status === 200) {\r\n if (\r\n result.data &&\r\n result.data.id &&\r\n result.data.name &&\r\n result.data.slides\r\n ) {\r\n dispatch(\r\n setSliderData(\r\n result.data.id,\r\n result.data.name,\r\n result.data.slides,\r\n result.data,\r\n result.data.lightTheme,\r\n result.data.organization\r\n )\r\n );\r\n if (updatedDate !== result.data.updatedDate) {\r\n setUpdatedDate(result.data.updatedDate);\r\n }\r\n }\r\n setIsError(false);\r\n } else {\r\n setIsError(true);\r\n await sleep(60000);\r\n getNewSlideshow();\r\n }\r\n });\r\n };\r\n\r\n const slideScrollDown = () => {\r\n pause();\r\n let buildingCharts = document.getElementById(\"buildingCharts\" + tempIndex_);\r\n if (buildingCharts) {\r\n let numberOfVerticalSliides = Number(\r\n buildingCharts.getAttribute(\"number-of-slides\")\r\n );\r\n console.log(buildingCharts.style.top);\r\n let oldTop = buildingCharts.style.top;\r\n let newTop = 0;\r\n if (oldTop && oldTop !== \"0%\") {\r\n newTop = Number(oldTop.substring(1, 4)) + 100;\r\n if (newTop >= numberOfVerticalSliides * 100) newTop = 0;\r\n } else {\r\n newTop = 100;\r\n }\r\n buildingCharts.setAttribute(\"style\", \"top: -\" + newTop + \"% !important\");\r\n setNewTopForBuildingDetails({ value: newTop });\r\n }\r\n };\r\n\r\n const slideScrollUp = () => {\r\n pause();\r\n let buildingCharts = document.getElementById(\"buildingCharts\" + tempIndex_);\r\n if (buildingCharts) {\r\n let numberOfVerticalSliides = Number(\r\n buildingCharts.getAttribute(\"number-of-slides\")\r\n );\r\n console.log(buildingCharts.style.top);\r\n let oldTop = buildingCharts.style.top;\r\n let newTop = 0;\r\n if (oldTop && oldTop !== \"0%\") {\r\n newTop = Number(oldTop.substring(1, 4)) - 100;\r\n if (newTop < 0) newTop = numberOfVerticalSliides * 100 - 100;\r\n } else {\r\n newTop = numberOfVerticalSliides * 100 - 100;\r\n }\r\n buildingCharts.setAttribute(\"style\", \"top: -\" + newTop + \"% !important\");\r\n setNewTopForBuildingDetails({ value: newTop });\r\n }\r\n };\r\n\r\n const slideScrollNext = () => {\r\n pause();\r\n scrollNext();\r\n let i = tempIndex_ + 1;\r\n if (i >= slides.length) setTempIndex_(0);\r\n else setTempIndex_(i);\r\n };\r\n\r\n const slideScrollPrevious = () => {\r\n pause();\r\n scrollPrevious();\r\n let i = tempIndex_ - 1;\r\n console.log(i, \"###!! i\");\r\n if (i < 0) setTempIndex_(slides.length - 1);\r\n else setTempIndex_(i);\r\n };\r\n\r\n const checkIsYTVideoNext = async (tempIndex) => {\r\n if (slides[tempIndex] && slides[tempIndex].slideType === \"VIDEO\") {\r\n return 99999;\r\n } else {\r\n return false;\r\n }\r\n };\r\n\r\n const onVideoEnd = () => {\r\n setIsPaused(false);\r\n clearAllSleeps();\r\n scrollNext();\r\n let i = tempIndex_ + 1;\r\n if (i >= slides.length) {\r\n i = 0;\r\n getNewSlideshow();\r\n }\r\n setTempIndex_(i);\r\n delaySlide(slides[i].durationInSeconds, i + 1);\r\n };\r\n\r\n return (\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n 
\r\n
\r\n \r\n \r\n
\r\n
\r\n\r\n\r\n \r\n Something is stuck... Please wait or try to restart the slideshow. \r\n
\r\n \r\n {slides.length > 0 ? (\r\n \r\n
\r\n ) : slide.slideType === \"URL\" ? (\r\n \r\n \r\n
\r\n ) : slide.slideType === \"WEATHER\" ? (\r\n \r\n \r\n {slides.map((slide, index) =>\r\n slide.slideType === \"ENERGY\" ? (\r\n \r\n
\r\n ) : slide.slideType === \"MESSAGE\" ? (\r\n \r\n \r\n \r\n {\" \"}\r\n 
{\" \"}\r\n \r\n
\r\n \r\n \r\n \r\n {\" \"}\r\n 
{\" \"}\r\n \r\n
\r\n {
}\r\n \r\n );\r\n};\r\n\r\nexport default Slider;\r\n","//Get slideshow data from API\r\nexport const getSlideshow = (key, apiKey) => {\r\n return new Promise((resolve) => {\r\n // fetch(process.env.REACT_APP_SLIDESHOW_API_LINK + key, {\r\n fetch(`https://em-public-api.azurewebsites.net/v1/DigitalSignage/slideshow/${key}`, {\r\n method: 'GET',\r\n headers: {\r\n 'x-api-key': apiKey\r\n }\r\n })\r\n .then(res => {\r\n const STATUS_CODE = res.status;\r\n res.json().then(json => {\r\n if (STATUS_CODE === 200) {\r\n resolve({\r\n status: STATUS_CODE,\r\n data: json\r\n })\r\n }\r\n else {\r\n resolve({\r\n status: STATUS_CODE,\r\n message: 'Something went wrong while fetching slideshow data from the API'\r\n })\r\n }\r\n })\r\n })\r\n })\r\n}\r\n\r\n//Get API key from porivisoning key\r\nexport const getApiKey = (provisioningKey) => {\r\n return new Promise((resolve) => {\r\n fetch(process.env.REACT_APP_API_LINK + process.env.REACT_APP_API_VERSION + '/APIKey/provisioning/' + provisioningKey, {\r\n method: 'GET',\r\n headers: {\r\n 'content-type': 'application/json'\r\n }\r\n })\r\n .then(res => {\r\n const STATUS_CODE = res.status;\r\n res.json().then(json => {\r\n if (STATUS_CODE === 200) {\r\n resolve({\r\n status: STATUS_CODE,\r\n data: json\r\n })\r\n }\r\n else {\r\n resolve({\r\n status: STATUS_CODE,\r\n message: 'Something went wrong while fetching API key with provisioning code'\r\n })\r\n }\r\n })\r\n })\r\n })\r\n}","export default __webpack_public_path__ + \"static/media/temperature_blue.81272434.svg\";","import { useEffect, useState } from 'react';\r\nimport TemperatureIcon from '../../../assets/icons/temperature_blue.svg';\r\nimport Highcharts from 'highcharts'\r\nimport HighchartsReact from 'highcharts-react-official'\r\nimport { Trans, useTranslation } from 'react-i18next';\r\n\r\n\r\nconst TemperatureCard = (data) => {\r\n const [tagResponse, setTagResponse] = useState(undefined)\r\n const [isOpened, setIsOpened] = useState(false);\r\n const [isChartLoaded, setIsChartLoaded] = useState(false);\r\n const [options, setOptions] = useState(undefined);\r\n const [currentLevel, setCurrentLevel] = useState(undefined);\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n const { t } = useTranslation()\r\n\r\n function setChartOptions(data, categoriesData){\r\n setOptions({\r\n chart: {\r\n type: 'areaspline',\r\n height: 300,\r\n },\r\n yAxis: {\r\n title: {\r\n enabled: false\r\n }\r\n },\r\n xAxis: {\r\n categories: categoriesData\r\n },\r\n title: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n fillColor: {\r\n linearGradient: [0, 0, 0, 300],\r\n stops: [\r\n [0, Highcharts.getOptions().colors[0]],\r\n [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]\r\n ]\r\n }\r\n }\r\n },\r\n tooltip: {\r\n formatter: function () {\r\n return 'Date: ' + this.point.options.date + 'Value: ' + Number.parseFloat(this.y).toFixed(1) + ' °C';\r\n }\r\n },\r\n series: [{ data: data, name: t('tag.TEMPERATURE.series') }]\r\n })\r\n\r\n setCurrentLevel(tagResponse.data[tagResponse.data.length - 1].value)\r\n setIsChartLoaded(true)\r\n }\r\n\r\n useEffect(() => {\r\n if (data !== undefined && data) {\r\n setTagResponse(data.data)\r\n }\r\n }, [data]);\r\n\r\n useEffect(() => {\r\n if (tagResponse) {\r\n let seriesData = [];\r\n let categoriesData = [];\r\n tagResponse.data.forEach(e => {\r\n //seriesData.push({ x: new Date(e.timestamp).valueOf(), y: e.value})\r\n let date = new Date(e.timestamp);\r\n let str = date.getUTCDate() + '. ' + months[date.getUTCMonth()]\r\n let hours = date.getUTCHours(); if (hours < 10) hours = '0' + hours;\r\n let minutes = date.getUTCMinutes(); if (minutes < 10) minutes = '0' + minutes;\r\n let strFull = str + ' ' + date.getUTCFullYear() + '. ' + hours + ':' + minutes;\r\n seriesData.push({date: strFull, y: e.value})\r\n categoriesData.push(str)\r\n });\r\n setChartOptions(seriesData, categoriesData)\r\n }\r\n }, [tagResponse]);\r\n\r\n\r\n\r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default TemperatureCard;","export default __webpack_public_path__ + \"static/media/tag_ENERGYMETER.ec4c519a.svg\";","export default __webpack_public_path__ + \"static/media/tag_AREA.cfd646ee.svg\";","export default __webpack_public_path__ + \"static/media/tag_BINARY.67f65e52.svg\";","export default __webpack_public_path__ + \"static/media/co2_blue.ade77c5e.svg\";","export default __webpack_public_path__ + \"static/media/tag_COP.b789d517.svg\";","export default __webpack_public_path__ + \"static/media/tag_COUNTER.b9f88612.svg\";","export default __webpack_public_path__ + \"static/media/tag_DISCRETE.9c21d521.svg\";","export default __webpack_public_path__ + \"static/media/tag_COST.78155cf4.svg\";","export default __webpack_public_path__ + \"static/media/tag_GAS.4233ac35.svg\";","export default __webpack_public_path__ + \"static/media/tag_POWER.f6768a9d.svg\";","export default __webpack_public_path__ + \"static/media/tag_PRESSURE.7b5e2ea3.svg\";","export default __webpack_public_path__ + \"static/media/tag_RADON.a3816efb.svg\";","export default __webpack_public_path__ + \"static/media/tag_SOUND.56aee978.svg\";","export default __webpack_public_path__ + \"static/media/tag_VOC.19e3c30e.svg\";","export default __webpack_public_path__ + \"static/media/tag_WATER.c24026ee.svg\";","export default __webpack_public_path__ + \"static/media/tag_WEIGHT.14c65995.svg\";","import { useEffect, useState } from 'react';\r\nimport Highcharts from 'highcharts'\r\nimport HighchartsReact from 'highcharts-react-official'\r\nimport { Trans, useTranslation } from 'react-i18next';\r\nimport EnergyIcon from '../../../assets/icons/tag_ENERGYMETER.svg';\r\nimport AreaIcon from '../../../assets/icons/tag_AREA.svg';\r\nimport BinaryIcon from '../../../assets/icons/tag_BINARY.svg';\r\nimport Co2Icon from '../../../assets/icons/co2_blue.svg';\r\nimport COPIcon from '../../../assets/icons/tag_COP.svg';\r\nimport CounterIcon from '../../../assets/icons/tag_COUNTER.svg';\r\nimport DiscreteIcon from '../../../assets/icons/tag_DISCRETE.svg';\r\nimport CostIcon from '../../../assets/icons/tag_COST.svg';\r\nimport GasIcon from '../../../assets/icons/tag_GAS.svg';\r\nimport PowerIcon from '../../../assets/icons/tag_POWER.svg';\r\nimport PressureIcon from '../../../assets/icons/tag_PRESSURE.svg';\r\nimport RadonIcon from '../../../assets/icons/tag_RADON.svg';\r\nimport SoundIcon from '../../../assets/icons/tag_SOUND.svg';\r\nimport VOCIcon from '../../../assets/icons/tag_VOC.svg';\r\nimport WaterIcon from '../../../assets/icons/tag_WATER.svg';\r\nimport WeightIcon from '../../../assets/icons/tag_WEIGHT.svg';\r\n\r\n\r\nconst Card = (data) => {\r\n const [tagResponse, setTagResponse] = useState(undefined)\r\n const [tagType, setTagType] = useState(undefined)\r\n const [uOM, setUOM] = useState(undefined)\r\n const [isOpened, setIsOpened] = useState(false);\r\n const [isChartLoaded, setIsChartLoaded] = useState(false);\r\n const [options, setOptions] = useState(undefined);\r\n const [currentLevel, setCurrentLevel] = useState(undefined);\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n const [tdata, setTdata] = useState('data');\r\n\r\n const icons = {\r\n 'ENERGYMETER': EnergyIcon,\r\n 'AREA': AreaIcon,\r\n 'BINARY': BinaryIcon,\r\n 'CO2FACTOR': Co2Icon,\r\n 'COP': COPIcon,\r\n 'COUNTERMETER': CounterIcon,\r\n 'COUNTERSENSOR': CounterIcon,\r\n 'DISCRETE': DiscreteIcon,\r\n 'FIXEDCOST': CostIcon,\r\n 'COSTFACTOR': CostIcon,\r\n 'GASMETER': GasIcon,\r\n 'POWER': PowerIcon,\r\n 'PRESSURE': PressureIcon,\r\n 'RADON': RadonIcon,\r\n 'SOUND': SoundIcon,\r\n 'VOC': VOCIcon,\r\n 'WATERMETER': WaterIcon,\r\n 'WEIGHT': WeightIcon,\r\n }\r\n\r\n const { t, i18n } = useTranslation()\r\n\r\n function setChartOptions(data, categoriesData, tagType){\r\n setOptions({\r\n chart: {\r\n type: 'areaspline',\r\n height: 300,\r\n },\r\n yAxis: {\r\n title: {\r\n enabled: false\r\n }\r\n },\r\n xAxis: {\r\n categories: categoriesData\r\n },\r\n title: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n fillColor: {\r\n linearGradient: [0, 0, 0, 300],\r\n stops: [\r\n [0, Highcharts.getOptions().colors[0]],\r\n [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]\r\n ]\r\n }\r\n }\r\n },\r\n tooltip: {\r\n formatter: function () {\r\n return 'Date: ' + this.point.options.date + '\r\n
\r\n {isChartLoaded && isOpened && \r\n
\r\n \r\n 
\r\n
\r\n
\r\n Temperature
\r\n {Number.parseFloat(currentLevel).toFixed(1)} °C
\r\n\r\n Between 18-25°C is advised for comfort \r\n
\r\n \r\n 🔻\r\n
\r\n \r\n {\r\n options.series &&\r\n
}\r\n Value: ' + Number.parseFloat(this.y).toFixed(1) + ' ' + uOM + '';\r\n }\r\n },\r\n series: [{ data: data, name: t('admin:tags.enum.tagTypes.' + tagType) + ' ' + t('common:data').toLowerCase() }]\r\n })\r\n\r\n setCurrentLevel(tagResponse.data[tagResponse.data.length - 1].value)\r\n setIsChartLoaded(true)\r\n }\r\n\r\n useEffect(() => {\r\n i18n.changeLanguage(\"en-US\")\r\n setTdata(t('common:data').toLowerCase())\r\n if (data !== undefined && data) {\r\n setTagResponse(data.data)\r\n setTagType(data.data.type)\r\n setUOM(data.data.unit)\r\n }\r\n }, [data]);\r\n \r\n useEffect(() => {\r\n if (tagResponse) {\r\n let seriesData = [];\r\n let categoriesData = [];\r\n tagResponse.data.forEach(e => {\r\n let date = new Date(e.timestamp);\r\n let str = date.getUTCDate() + '. ' + months[date.getUTCMonth()]\r\n let hours = date.getUTCHours(); if (hours < 10) hours = '0' + hours;\r\n let minutes = date.getUTCMinutes(); if (minutes < 10) minutes = '0' + minutes;\r\n let strFull = str + ' ' + date.getUTCFullYear() + '. ' + hours + ':' + minutes;\r\n seriesData.push({date: strFull, y: e.value})\r\n categoriesData.push(str)\r\n });\r\n setChartOptions(seriesData, categoriesData, data.data.type)\r\n }\r\n }, [tagResponse]);\r\n\r\n \r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default Card;","export default __webpack_public_path__ + \"static/media/humidity_blue.ab484ab6.svg\";","import { useEffect, useState } from 'react';\r\nimport HumidityIcon from '../../../assets/icons/humidity_blue.svg';\r\nimport Highcharts from 'highcharts'\r\nimport HighchartsReact from 'highcharts-react-official'\r\nimport { Trans, useTranslation } from 'react-i18next';\r\n\r\n\r\nconst HumidityCard = (data) => {\r\n const [tagResponse, setTagResponse] = useState(undefined)\r\n const [isOpened, setIsOpened] = useState(false);\r\n const [options, setOptions] = useState(undefined);\r\n const [currentLevel, setCurrentLevel] = useState(undefined);\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n const { t } = useTranslation()\r\n\r\n function setChartOptions(data, categoriesData) {\r\n setOptions({\r\n chart: {\r\n type: 'areaspline',\r\n height: 300,\r\n },\r\n yAxis: {\r\n title: {\r\n enabled: false\r\n }\r\n },\r\n xAxis: {\r\n categories: categoriesData\r\n },\r\n title: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n fillColor: {\r\n linearGradient: [0, 0, 0, 300],\r\n stops: [\r\n [0, Highcharts.getOptions().colors[0]],\r\n [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]\r\n ]\r\n }\r\n }\r\n },\r\n tooltip: {\r\n formatter: function () {\r\n return 'Date: ' + this.point.options.date + '\r\n
\r\n {isChartLoaded && isOpened && \r\n
\r\n \r\n 
\r\n\r\n {
\r\n
\r\n {
\r\n {Number.parseFloat(currentLevel).toFixed(1)}
\r\n\r\n {
\r\n \r\n 🔻\r\n
\r\n \r\n {\r\n options.series &&\r\n
}\r\n Value: ' + Number.parseInt(this.y) + '%';\r\n }\r\n },\r\n series: [{ data: data, name: t('tag.HUMIDITY.series') }]\r\n })\r\n\r\n setCurrentLevel(tagResponse.data[tagResponse.data.length - 1].value)\r\n }\r\n\r\n useEffect(() => {\r\n if (data !== undefined && data) {\r\n setTagResponse(data.data)\r\n }\r\n }, [data]);\r\n\r\n useEffect(() => {\r\n if (tagResponse) {\r\n let seriesData = [];\r\n let categoriesData = [];\r\n tagResponse.data.forEach(e => {\r\n //seriesData.push({ x: new Date(e.timestamp).valueOf(), y: e.value})\r\n let date = new Date(e.timestamp);\r\n let str = date.getUTCDate() + '. ' + months[date.getUTCMonth()]\r\n let hours = date.getUTCHours(); if (hours < 10) hours = '0' + hours;\r\n let minutes = date.getUTCMinutes(); if (minutes < 10) minutes = '0' + minutes;\r\n let strFull = str + ' ' + date.getUTCFullYear() + '. ' + hours + ':' + minutes;\r\n seriesData.push({ date: strFull, y: e.value })\r\n categoriesData.push(str)\r\n });\r\n\r\n setChartOptions(seriesData, categoriesData)\r\n }\r\n }, [tagResponse]);\r\n\r\n\r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default HumidityCard;","import { useEffect, useState } from 'react';\r\nimport Co2Icon from '../../../assets/icons/co2_blue.svg';\r\nimport Highcharts from 'highcharts'\r\nimport HighchartsReact from 'highcharts-react-official'\r\nimport { Trans, useTranslation } from 'react-i18next';\r\n\r\n\r\nconst Co2Card = (data) => {\r\n const [tagResponse, setTagResponse] = useState(undefined)\r\n const [isOpened, setIsOpened] = useState(false);\r\n const [options, setOptions] = useState(undefined);\r\n const [currentLevel, setCurrentLevel] = useState(undefined);\r\n const [uOM, setUOM] = useState(undefined)\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n const { t } = useTranslation()\r\n\r\n function setChartOptions(data, categoriesData) {\r\n setOptions({\r\n chart: {\r\n type: 'areaspline',\r\n height: 300,\r\n },\r\n yAxis: {\r\n title: {\r\n enabled: false\r\n }\r\n },\r\n xAxis: {\r\n categories: categoriesData\r\n },\r\n title: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n fillColor: {\r\n linearGradient: [0, 0, 0, 300],\r\n stops: [\r\n [0, Highcharts.getOptions().colors[0]],\r\n [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]\r\n ]\r\n }\r\n }\r\n },\r\n tooltip: {\r\n formatter: function () {\r\n return 'Date: ' + this.point.options.date + '\r\n
\r\n { isOpened && \r\n
\r\n \r\n 
\r\n
\r\n
\r\n Humidity
\r\n {currentLevel}%
\r\n\r\n Optimal levels are between 30-60% \r\n
\r\n \r\n 🔻\r\n
\r\n \r\n {\r\n options &&\r\n
}\r\n Value: ' + Number.parseInt(this.y) + ' ' + uOM + '';\r\n }\r\n },\r\n series: [{ data: data, name: t('tag.CO2.series') }]\r\n })\r\n\r\n setCurrentLevel(tagResponse.data[tagResponse.data.length - 1].value)\r\n }\r\n\r\n useEffect(() => {\r\n if (data !== undefined && data) {\r\n setTagResponse(data.data)\r\n setUOM(data.data.unit)\r\n }\r\n }, [data]);\r\n\r\n useEffect(() => {\r\n if (tagResponse) {\r\n let seriesData = [];\r\n let categoriesData = [];\r\n tagResponse.data.forEach(e => {\r\n //seriesData.push({ x: new Date(e.timestamp).valueOf(), y: e.value})\r\n let date = new Date(e.timestamp);\r\n let str = date.getUTCDate() + '. ' + months[date.getUTCMonth()]\r\n let hours = date.getUTCHours(); if (hours < 10) hours = '0' + hours;\r\n let minutes = date.getUTCMinutes(); if (minutes < 10) minutes = '0' + minutes;\r\n let strFull = str + ' ' + date.getUTCFullYear() + '. ' + hours + ':' + minutes;\r\n seriesData.push({ date: strFull, y: e.value })\r\n categoriesData.push(str)\r\n });\r\n\r\n setChartOptions(seriesData, categoriesData)\r\n }\r\n }, [tagResponse]);\r\n\r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default Co2Card;","export default __webpack_public_path__ + \"static/media/motion_blue.79b6407c.svg\";","import { useEffect, useState } from 'react';\r\nimport MotionIcon from '../../../assets/icons/motion_blue.svg';\r\nimport Highcharts from 'highcharts'\r\nimport HighchartsReact from 'highcharts-react-official'\r\nimport { Trans, useTranslation } from 'react-i18next';\r\n\r\nconst MotionCard = (data) => {\r\n const [tagResponse, setTagResponse] = useState(undefined)\r\n const [isOpened, setIsOpened] = useState(false);\r\n const [options, setOptions] = useState(undefined);\r\n const [currentLevel, setCurrentLevel] = useState(undefined);\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n const { t } = useTranslation()\r\n\r\n function setChartOptions(data, categoriesData) {\r\n setOptions({\r\n chart: {\r\n type: 'areaspline',\r\n height: 300,\r\n },\r\n yAxis: {\r\n title: {\r\n enabled: false\r\n }\r\n },\r\n xAxis: {\r\n categories: categoriesData\r\n },\r\n title: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n fillColor: {\r\n linearGradient: [0, 0, 0, 300],\r\n stops: [\r\n [0, Highcharts.getOptions().colors[0]],\r\n [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]\r\n ]\r\n }\r\n }\r\n },\r\n tooltip: {\r\n formatter: function () {\r\n return 'Date: ' + this.point.options.date + '\r\n
\r\n {isOpened && \r\n
\r\n \r\n 
\r\n
\r\n CO2
\r\n{currentLevel} {uOM}
\r\n\r\n Below 800 ppm is ideal for a healty workspace \r\n
\r\n \r\n 🔻\r\n
\r\n \r\n {\r\n options &&\r\n
}\r\n Value: ' + Number.parseFloat(this.y).toFixed(2) + ' ';\r\n }\r\n },\r\n series: [{ data: data, name: t('tag.MOTION.title') }]\r\n })\r\n\r\n setCurrentLevel(tagResponse.data[tagResponse.data.length - 1].value)\r\n }\r\n\r\n useEffect(() => {\r\n if (data !== undefined && data) {\r\n setTagResponse(data.data)\r\n }\r\n }, [data]);\r\n\r\n useEffect(() => {\r\n if (tagResponse) {\r\n let seriesData = [];\r\n let categoriesData = [];\r\n tagResponse.data.forEach(e => {\r\n //seriesData.push({ x: new Date(e.timestamp).valueOf(), y: e.value})\r\n let date = new Date(e.timestamp);\r\n let str = date.getUTCDate() + '. ' + months[date.getUTCMonth()]\r\n let hours = date.getUTCHours(); if (hours < 10) hours = '0' + hours;\r\n let minutes = date.getUTCMinutes(); if (minutes < 10) minutes = '0' + minutes;\r\n let strFull = str + ' ' + date.getUTCFullYear() + '. ' + hours + ':' + minutes;\r\n seriesData.push({ date: strFull, y: e.value })\r\n categoriesData.push(str)\r\n });\r\n\r\n setChartOptions(seriesData, categoriesData)\r\n }\r\n }, [tagResponse]);\r\n\r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default MotionCard;","export default __webpack_public_path__ + \"static/media/light_blue.dd44f1f3.svg\";","import { useEffect, useState } from 'react';\r\nimport LightIcon from '../../../assets/icons/light_blue.svg';\r\nimport Highcharts from 'highcharts'\r\nimport HighchartsReact from 'highcharts-react-official'\r\nimport { Trans, useTranslation } from 'react-i18next';\r\n\r\nconst LightCard = (data) => {\r\n const [tagResponse, setTagResponse] = useState(undefined)\r\n const [isOpened, setIsOpened] = useState(false);\r\n const [options, setOptions] = useState(undefined);\r\n const [currentLevel, setCurrentLevel] = useState(undefined);\r\n const months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];\r\n const { t } = useTranslation()\r\n\r\n function setChartOptions(data, categoriesData) {\r\n setOptions({\r\n chart: {\r\n type: 'areaspline',\r\n height: 300,\r\n },\r\n yAxis: {\r\n title: {\r\n enabled: false\r\n }\r\n },\r\n xAxis: {\r\n categories: categoriesData\r\n },\r\n title: {\r\n text: ''\r\n },\r\n plotOptions: {\r\n series: {\r\n fillColor: {\r\n linearGradient: [0, 0, 0, 300],\r\n stops: [\r\n [0, Highcharts.getOptions().colors[0]],\r\n [1, Highcharts.color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')]\r\n ]\r\n }\r\n }\r\n },\r\n tooltip: {\r\n formatter: function () {\r\n return 'Date: ' + this.point.options.date + '\r\n
\r\n {isOpened && \r\n
\r\n \r\n 
\r\n
\r\n
\r\n Motion
\r\n {Number.parseFloat(currentLevel).toFixed(2)}
\r\n\r\n Motion levels \r\n
\r\n \r\n 🔻\r\n
\r\n \r\n {\r\n options &&\r\n
}\r\n Value: ' + Number.parseInt(this.y) + ' lux';\r\n }\r\n },\r\n series: [{ data: data, name: t('tag.LIGHT.series') }]\r\n })\r\n\r\n setCurrentLevel(tagResponse.data[tagResponse.data.length - 1].value)\r\n }\r\n\r\n useEffect(() => {\r\n if (data !== undefined && data) {\r\n setTagResponse(data.data)\r\n }\r\n }, [data]);\r\n\r\n useEffect(() => {\r\n if (tagResponse) {\r\n let seriesData = [];\r\n let categoriesData = [];\r\n tagResponse.data.forEach(e => {\r\n //seriesData.push({ x: new Date(e.timestamp).valueOf(), y: e.value})\r\n let date = new Date(e.timestamp);\r\n let str = date.getUTCDate() + '. ' + months[date.getUTCMonth()]\r\n let hours = date.getUTCHours(); if (hours < 10) hours = '0' + hours;\r\n let minutes = date.getUTCMinutes(); if (minutes < 10) minutes = '0' + minutes;\r\n let strFull = str + ' ' + date.getUTCFullYear() + '. ' + hours + ':' + minutes;\r\n seriesData.push({ date: strFull, y: e.value })\r\n categoriesData.push(str)\r\n });\r\n\r\n setChartOptions(seriesData, categoriesData)\r\n }\r\n }, [tagResponse]);\r\n\r\n return (\r\n
\r\n
\r\n )\r\n}\r\n\r\nexport default LightCard;","import { useEffect, useState } from 'react';\r\nimport { useLocation, useParams } from 'react-router-dom';\r\nimport { Trans } from 'react-i18next';\r\nimport Logo from '../../assets/images/em_logo_all_white.svg';\r\nimport TemperatureCard from './cards/TemperatureCard';\r\nimport Card from './cards/Card';\r\nimport HumidityCard from './cards/HumidityCard';\r\nimport Co2Card from './cards/Co2Card';\r\nimport MotionCard from './cards/MotionCard';\r\nimport LightCard from './cards/LightCard';\r\n\r\n\r\nconst Tag = () => {\r\n const location = useLocation();\r\n const params = useParams();\r\n const [tagResponse, setTagResponse] = useState(undefined);\r\n const [temperatureData, setTemperatureData] = useState(undefined);\r\n const [humidityData, setHumidityData] = useState(undefined);\r\n const [co2Data, setCo2Data] = useState(undefined);\r\n const [batteryData, setBatteryData] = useState(undefined);\r\n const [motionData, setMotionData] = useState(undefined);\r\n const [lightData, setLightData] = useState(undefined);\r\n const [otherData, setOtherData] = useState(undefined);\r\n const [isLoading, setIsLoading] = useState(true);\r\n\r\n function fetchData() {\r\n let url = `https://em-public-api.azurewebsites.net/v1/Measurement/public/${params.id}/?code=${location.search.split('=')[1]}=`;\r\n fetch(url)\r\n .then(response => response.json())\r\n .then(data => { console.log(data); setTagResponse(data); setIsLoading(false) });\r\n }\r\n\r\n useEffect(() => {\r\n if(params)\r\n fetchData()\r\n }, [params]);\r\n\r\n useEffect(() => {\r\n if (tagResponse){\r\n setTemperatureData(tagResponse.find(x => x.type === 'TEMPERATURE'))\r\n setHumidityData(tagResponse.find(x => x.type === 'HUMIDITY'))\r\n setCo2Data(tagResponse.find(x => x.type === 'CO2'))\r\n setBatteryData(tagResponse.find(x => x.type === 'BATTERY'))\r\n setMotionData(tagResponse.find(x => x.type === 'MOTION'))\r\n setLightData(tagResponse.find(x => x.type === 'LIGHT'))\r\n if (!temperatureData && !humidityData && !co2Data && !batteryData && !motionData && !lightData){\r\n setOtherData(tagResponse[0])\r\n }\r\n }\r\n }, [tagResponse]);\r\n\r\n\r\n return (\r\n \r\n
\r\n {isOpened && \r\n
\r\n \r\n 
\r\n
\r\n
\r\n Light
\r\n {currentLevel} lux
\r\n\r\n Light levels \r\n
\r\n \r\n 🔻\r\n
\r\n \r\n {\r\n options &&\r\n
}\r\n \r\n
\r\n )\r\n}\r\n\r\nexport default Tag;","import { useState, useEffect } from 'react';\r\nimport { formatNumber } from '../helpers/numeral';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\n\r\n\r\nconst BuildingDetails = ({ }) => {\r\n const dispatch = useDispatch();\r\n const allSlides = useSelector(state => state.slideshow.slides);\r\n const lightTheme = useSelector(state => state.slideshow.lightTheme);\r\n const organization = useSelector(state => state.slideshow.organization);\r\n const organizationLogo = organization.logoFullSVG ? btoa(unescape(encodeURIComponent(organization.logoFullSVG))) : undefined;\r\n\r\n const [verticalSlidingTimout, setVerticalSlidingTimout] = useState(undefined);\r\n const [isSimpleCapacityBox, setIsSimpleCapacityBox] = useState(undefined);\r\n const [tempTop, setTempTop] = useState(0);\r\n const [capacity, setCapacity] = useState(1);\r\n\r\n\r\n useEffect(() => {\r\n \r\n }, []);\r\n\r\n\r\n return (\r\n \r\n \r\n
\r\n \r\n Loading ... :\r\n
\r\n \r\n
\r\n
}\r\n
\r\n {isLoading ? Tag data
\r\n ID: {params && params.id}
\r\n {batteryData && batteryData.data && batteryData.data[0] &&Battery level : {batteryData.data[0].value * 100}%
}\r\n \r\n {otherData &&
}\r\n \r\n \r\n\r\n\r\n\r\n \r\n\r\n
\r\n\r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default BuildingDetails;","// AppInsights.js\r\nimport { ApplicationInsights } from '@microsoft/applicationinsights-web';\r\nimport { ReactPlugin } from '@microsoft/applicationinsights-react-js';\r\nimport { createBrowserHistory } from 'history';\r\n\r\nconst browserHistory = createBrowserHistory({ basename: '' });\r\nconst reactPlugin = new ReactPlugin();\r\nconst appInsights = new ApplicationInsights({\r\n config: {\r\n instrumentationKey: process.env.REACT_APP_MICROSOFT_INSTRUMENTATION_KEY,\r\n extensions: [reactPlugin],\r\n extensionConfig: {\r\n [reactPlugin.identifier]: { history: browserHistory }\r\n }\r\n }\r\n});\r\nappInsights.loadAppInsights();\r\nexport { reactPlugin, appInsights };","//CSS\r\nimport \"./App.css\";\r\n\r\n//Components\r\nimport Slider from \"./components/carousel/Slider\";\r\nimport Tag from \"./components/tag/Tag\";\r\nimport GroupSlide from \"./screens/GroupSlide\";\r\n\r\n//Modules\r\nimport { BrowserRouter as Router, Switch, Route } from \"react-router-dom\";\r\n\r\n//Microsfot application insights\r\nimport { withAITracking } from \"@microsoft/applicationinsights-react-js\";\r\nimport { reactPlugin } from \"./AppInsights\";\r\nimport { ErrorBoundary } from \"react-error-boundary\";\r\nimport NoDataIcon from \"./assets/icons/nodata.svg\";\r\nimport { sleep } from \"./helpers/promises\";\r\n\r\nfunction App() {\r\n return (\r\n \r\n\r\n
\r\n\r\n\r\n \r\n
\r\n \r\n\r\n \r\n \r\n Hittil i år\r\n \r\n
\r\n \r\n \r\n Energiproduksjon\r\n
\r\n \r\n \r\n 2023-2024\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n 1 939\r\n \r\n {\" \"}\r\n kWh\r\n \r\n
\r\n \r\n Inneværende år\r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n 2 898\r\n \r\n {\" \"}\r\n kWh\r\n \r\n
\r\n \r\n Forrige år\r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n \r\n
\r\n \r\n -33,1\r\n \r\n {\" \"}\r\n %\r\n \r\n
\r\n \r\n Endring\r\n
\r\n \r\n
\r\n\r\n \r\n
\r\n\r\n\r\n\r\n\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 1 939 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 1 322 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 1 039 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 939 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 512 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 132 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n\r\n\r\n \r\n
\r\n \r\n Meter name\r\n
\r\n \r\n 39 kWh\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n );\r\n}\r\n\r\nconst logError = async (error, info) => {\r\n await sleep(300000);\r\n window.location.reload();\r\n};\r\n\r\nexport default withAITracking(reactPlugin, App);\r\n","const initialState = {\r\n id: '',\r\n name: '',\r\n slides: [],\r\n slideshow: null,\r\n buildingLocations: [],\r\n currentBuildingLocation: {},\r\n lightTheme: false,\r\n organization: {},\r\n};\r\n\r\nconst slideshowReducer = (state = initialState, action) => {\r\n if (action.type === 'SET_SLIDE_DATA') {\r\n return Object.assign({}, state, {\r\n id: action.id,\r\n name: action.name,\r\n slides: action.slides,\r\n slideshow: action.slideshow,\r\n lightTheme: action.lightTheme,\r\n organization: action.organization\r\n });\r\n }\r\n else if (action.type === 'SET_ALL_LOCATIONS') {\r\n return Object.assign({}, state, {\r\n buildingLocations: action.locations\r\n });\r\n }\r\n else if (action.type === 'SET_CURRENT_LOCATION') {\r\n return Object.assign({}, state, {\r\n currentBuildingLocation: {\r\n lat: action.lat,\r\n lng: action.lng\r\n }\r\n });\r\n }\r\n else if (action.type === 'SET_LIGHT_THEME') {\r\n return Object.assign({}, state, {\r\n lightTheme: action.lightTheme\r\n });\r\n }\r\n return state;\r\n};\r\n\r\nexport default slideshowReducer;\r\n","//Modules\r\nimport { combineReducers } from 'redux';\r\n\r\n//Reducers\r\nimport slideshowReducer from './slideshow';\r\n\r\nconst rootReducer = combineReducers({\r\n slideshow: slideshowReducer,\r\n});\r\n\r\nexport default rootReducer;\r\n","//Redux\r\nimport { createStore } from 'redux';\r\n\r\n//Reducers\r\nimport rootReducer from './reducers/rootReducer';\r\n\r\nconst configureStore = createStore(rootReducer);\r\n\r\n\r\nexport default configureStore;\r\n","//React\r\nimport React, { Suspense } from 'react';\r\nimport ReactDOM from 'react-dom/client';\r\n\r\n//CSS\r\nimport './index.css';\r\n\r\n//Components\r\nimport App from './App';\r\n\r\n//Redux\r\nimport { Provider } from 'react-redux';\r\nimport store from './redux/store';\r\n\r\n//Translations\r\nimport './i18n';\r\n\r\nconst root = ReactDOM.createRoot(document.getElementById('root'));\r\nroot.render(\r\n \r\n \r\n
\r\n Something went wrong. Try restarting your slideshow.
\r\n\r\n
\r\n {error.message}\r\n {error.stack}\r\n