smarthut/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Merge branch 'dev' into '37-nav-resp'

Browse source 
# Conflicts:
#   smart-hut/src/views/Navbar.js
This commit is contained in:
Claudio Maggioni 2020-03-21 13:56:54 +01:00
commit dd94a6aa30
43 changed files with 1342 additions and 560 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
smart-hut/public/img/dimmer.svg Normal file
View file

@ -0,0 +1 @@
<svg id="icons" enable-background="new 0 0 64 64" height="512" viewBox="0 0 64 64" width="512" xmlns="http://www.w3.org/2000/svg"><path d="m62 6.005v51.99c0 2.2-1.8 4-4 4h-52c-2.2 0-4-1.8-4-4v-51.99c0-2.199 1.8-4 4-4h52c2.2 0 4 1.801 4 4zm-5 50.99v-50h-50v50z" fill="#fff"/><path d="m32 17.025c5.24 0 9.99 2.12 13.43 5.56 3.431 3.44 5.561 8.181 5.561 13.42v.011h-2.991v-.011c0-8.829-7.17-16-16-16s-16 7.171-16 16v.011h-2.98v-.011c0-5.239 2.121-9.979 5.561-13.409 3.429-3.441 8.179-5.571 13.419-5.571z" fill="#94c1ff"/><path d="m32 17.025c-5.24 0-9.99 2.13-13.42 5.57-3.439 3.43-5.561 8.17-5.561 13.409v.011h2.981v-.011c0-8.829 7.17-16 16-16s16 7.171 16 16v.011h2.99v-.011c0-5.239-2.13-9.979-5.561-13.42-3.439-3.438-8.189-5.559-13.429-5.559zm13 18.98c0-7.17-5.82-13-13-13-7.17 0-13 5.83-13 13 0 7.171 5.83 13 13 13 7.18 0 13-5.829 13-13zm12-29.01v50h-50v-50z" fill="#d7e9ff"/><path d="m32 25.995c1.109 0 2 .9 2 2 0 1.101-.891 2-2 2-1.1 0-2-.899-2-2 0-1.099.9-2 2-2z" fill="#d7e9ff"/><path d="m32 25.995c-1.1 0-2 .9-2 2 0 1.101.9 2 2 2 1.109 0 2-.899 2-2 0-1.099-.891-2-2-2zm0-2.99c7.18 0 13 5.83 13 13 0 7.171-5.82 13-13 13-7.17 0-13-5.829-13-13 0-7.17 5.83-13 13-13z" fill="#fff"/><g fill="#116fff"><path d="m57.999 62.999h-51.998c-2.757 0-5-2.243-5-5v-51.998c0-2.757 2.243-5 5-5h51.998c2.757 0 5 2.243 5 5v51.998c0 2.757-2.243 5-5 5zm-51.998-59.998c-1.654 0-3 1.346-3 3v51.998c0 1.654 1.346 3 3 3h51.998c1.654 0 3-1.346 3-3v-51.998c0-1.654-1.346-3-3-3z"/><path d="m57 58h-50c-.553 0-1-.447-1-1v-50c0-.553.447-1 1-1h50c.553 0 1 .447 1 1v50c0 .553-.447 1-1 1zm-49-2h48v-48h-48z"/><path d="m32 50.004c-7.72 0-14-6.281-14-14.001 0-7.719 6.28-13.999 14-13.999s14 6.28 14 13.999c0 7.72-6.28 14.001-14 14.001zm0-26c-6.617 0-12 5.383-12 11.999 0 6.617 5.383 12.001 12 12.001s12-5.384 12-12.001c0-6.616-5.383-11.999-12-11.999z"/><path d="m32 30.995c-1.654 0-3-1.346-3-3s1.346-3 3-3 3 1.346 3 3-1.346 3-3 3zm0-4c-.552 0-1 .448-1 1s.448 1 1 1 1-.448 1-1-.448-1-1-1z"/><path d="m50.983 37.003c-.553 0-1-.447-1-1 0-9.916-8.067-17.982-17.983-17.982s-17.983 8.066-17.983 17.982c0 .553-.447 1-1 1s-1-.447-1-1c0-11.019 8.965-19.982 19.983-19.982s19.983 8.964 19.983 19.982c0 .553-.447 1-1 1z"/><path d="m48 37.003c-.553 0-1-.447-1-1 0-8.271-6.729-14.999-15-14.999s-15 6.729-15 14.999c0 .553-.447 1-1 1s-1-.447-1-1c0-9.373 7.626-16.999 17-16.999s17 7.626 17 16.999c0 .553-.447 1-1 1z"/><path d="m32 19.021c-.553 0-1-.447-1-1v-1.017c0-.553.447-1 1-1s1 .447 1 1v1.017c0 .553-.447 1-1 1z"/><path d="m19.278 24.291c-.256 0-.512-.098-.707-.293l-.719-.719c-.391-.391-.391-1.023 0-1.414s1.023-.391 1.414 0l.719.719c.391.391.391 1.023 0 1.414-.195.195-.451.293-.707.293z"/><path d="m15.998 37.013h-3.006c-.553 0-1-.447-1-1s.447-1 1-1h3.006c.553 0 1 .447 1 1s-.447 1-1 1z"/><path d="m51.007 37.014h-3.007c-.553 0-1-.447-1-1s.447-1 1-1h3.007c.553 0 1 .447 1 1s-.447 1-1 1z"/><path d="m44.721 24.293c-.256 0-.512-.098-.707-.293-.391-.391-.391-1.023 0-1.414l.72-.72c.391-.391 1.023-.391 1.414 0s.391 1.023 0 1.414l-.72.72c-.196.195-.451.293-.707.293z"/><path d="m11.044 12.021c-.553 0-1.005-.447-1.005-1s.442-1 .994-1h.011c.552 0 1 .447 1 1s-.448 1-1 1z"/><path d="m11.044 54.017c-.553 0-1.005-.447-1.005-1s.442-1 .994-1h.011c.552 0 1 .447 1 1s-.448 1-1 1z"/><path d="m53.046 12.021c-.553 0-1.005-.447-1.005-1s.442-1 .994-1h.011c.552 0 1 .447 1 1s-.448 1-1 1z"/><path d="m53.046 54.017c-.553 0-1.005-.447-1.005-1s.442-1 .994-1h.011c.552 0 1 .447 1 1s-.448 1-1 1z"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 3.4 KiB

1
smart-hut/public/img/humidity-sensor.svg Normal file
View file

@ -0,0 +1 @@
<svg id="Capa_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g id="XMLID_2040_"><circle id="XMLID_1170_" cx="210" cy="302" fill="#91def5" r="200"/><path id="XMLID_1252_" d="m310.911 116.754 84.079-106.754 84.079 106.754c33.55 42.598 29.941 103.557-8.401 141.899-41.796 41.796-109.561 41.796-151.357 0-38.342-38.342-41.951-99.301-8.4-141.899z" fill="#dff6fc"/><g id="XMLID_759_"><path id="XMLID_760_" d="m174.798 388.747c1.265.531 2.576.782 3.866.782 3.907 0 7.618-2.304 9.225-6.133l64.758-154.303c2.138-5.092-.259-10.953-5.351-13.09-5.095-2.138-10.954.258-13.091 5.351l-64.758 154.303c-2.137 5.092.259 10.953 5.351 13.09z"/><path id="XMLID_763_" d="m199.375 247.585c0-21.81-16.087-39.553-35.859-39.553s-35.858 17.743-35.858 39.553 16.086 39.553 35.858 39.553 35.859-17.744 35.859-39.553zm-35.859 19.552c-8.744 0-15.858-8.771-15.858-19.553s7.114-19.553 15.858-19.553c8.745 0 15.859 8.771 15.859 19.553s-7.114 19.553-15.859 19.553z"/><path id="XMLID_770_" d="m256.484 400.032c19.772 0 35.858-17.743 35.858-39.553s-16.086-39.553-35.858-39.553-35.859 17.743-35.859 39.553 16.087 39.553 35.859 39.553zm0-59.106c8.744 0 15.858 8.771 15.858 19.553s-7.114 19.553-15.858 19.553c-8.745 0-15.859-8.771-15.859-19.553s7.114-19.553 15.859-19.553z"/><path id="XMLID_773_" d="m486.926 110.567-84.079-106.754c-1.897-2.408-4.792-3.813-7.857-3.813s-5.96 1.405-7.855 3.813l-84.081 106.754c-.598.759-1.184 1.524-1.76 2.293-28.294-13.656-59.669-20.86-91.294-20.86-115.794 0-210 94.206-210 210s94.206 210 210 210c39.357 0 77.729-10.955 110.966-31.681 4.687-2.922 6.116-9.09 3.194-13.776-2.922-4.687-9.09-6.117-13.776-3.194-30.06 18.743-64.772 28.651-100.384 28.651-104.767 0-190-85.233-190-190s85.233-190 190-190c27.901 0 55.58 6.193 80.663 17.946-22.563 44.347-14.795 99.405 21.578 135.777 22.103 22.104 51.49 34.277 82.748 34.277 1.665 0 3.324-.042 4.978-.111.008.704.033 1.409.033 2.111 0 35.875-10.045 70.807-29.048 101.018-2.94 4.675-1.534 10.848 3.141 13.789 1.654 1.041 3.495 1.537 5.314 1.537 3.323 0 6.574-1.656 8.475-4.677 21.012-33.405 32.118-72.019 32.118-111.667 0-1.547-.039-3.102-.073-4.655 21.74-4.695 41.71-15.52 57.812-31.621 41.902-41.901 45.851-108.604 9.187-155.157zm-91.937 169.433c-25.916 0-50.281-10.092-68.606-28.418-34.741-34.74-38.016-90.043-7.616-128.64h-.001l76.225-96.779 76.223 96.779c30.399 38.597 27.125 93.9-7.616 128.641-18.327 18.325-42.692 28.417-68.609 28.417z"/><path id="XMLID_799_" d="m351.34 433.5c-2.64 0-5.22 1.07-7.07 2.93-1.859 1.86-2.93 4.44-2.93 7.07 0 2.64 1.07 5.21 2.93 7.08 1.86 1.86 4.431 2.92 7.07 2.92 2.63 0 5.2-1.06 7.07-2.92 1.859-1.87 2.93-4.44 2.93-7.08 0-2.63-1.07-5.21-2.93-7.07s-4.44-2.93-7.07-2.93z"/></g></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

1
smart-hut/public/img/intensity-light.svg Normal file
View file

@ -0,0 +1 @@
<svg height="512pt" viewBox="-1 0 512 512" width="512pt" xmlns="http://www.w3.org/2000/svg"><path d="m255.128906 398.359375c-49.757812 0-90.234375-40.480469-90.234375-90.230469v-13.941406c0-8.429688 6.835938-15.265625 15.265625-15.265625h149.933594c8.429688 0 15.265625 6.835937 15.265625 15.265625v13.941406c0 49.75-40.480469 90.230469-90.230469 90.230469zm0 0" fill="#145180"/><path d="m330.089844 278.917969h-74.960938v119.441406c49.753906-.003906 90.230469-40.480469 90.230469-90.230469v-13.941406c0-8.433594-6.835937-15.269531-15.269531-15.269531zm0 0" fill="#082130"/><path d="m164.894531 294.1875v-57.515625c-28.894531-25.75-45.320312-62.191406-45.320312-101.121094 0-74.742187 60.808593-135.550781 135.554687-135.550781 74.742188 0 135.550782 60.808594 135.550782 135.550781 0 38.929688-16.425782 75.371094-45.320313 101.121094v57.515625zm0 0" fill="#fff04a"/><path d="m255.128906 0v294.1875h90.226563v-57.515625c28.898437-25.75 45.320312-62.191406 45.320312-101.121094 0-74.742187-60.804687-135.54687475-135.546875-135.550781zm0 0" fill="#ff961f"/><path d="m308.277344 126.613281c-5.960938-5.960937-15.628906-5.960937-21.589844 0l-31.558594 31.558594-31.558594-31.558594c-5.960937-5.964843-15.628906-5.964843-21.589843 0-5.964844 5.960938-5.964844 15.628907 0 21.589844l37.882812 37.882813v108.101562h30.53125v-108.101562l37.882813-37.882813c5.960937-5.960937 5.960937-15.628906 0-21.589844zm0 0" fill="#fff"/><path d="m286.6875 126.613281-31.558594 31.558594v136.015625h15.265625v-108.101562l37.882813-37.882813c5.960937-5.960937 5.960937-15.628906 0-21.589844-5.960938-5.960937-15.628906-5.960937-21.589844 0zm0 0" fill="#fff04a"/><path d="m494.992188 512h-479.726563c-8.429687 0-15.265625-6.835938-15.265625-15.265625v-51.90625c0-8.429687 6.835938-15.265625 15.265625-15.265625h479.726563c8.429687 0 15.265624 6.835938 15.265624 15.265625v51.90625c0 8.429687-6.832031 15.265625-15.265624 15.265625zm0 0" fill="#9ffeff"/><path d="m494.992188 429.5625h-239.863282v82.4375h239.863282c8.429687 0 15.265624-6.835938 15.265624-15.265625v-51.90625c0-8.429687-6.832031-15.265625-15.265624-15.265625zm0 0" fill="#78e3f6"/><path d="m494.992188 429.5625h-121.882813v82.4375h121.882813c8.429687 0 15.265624-6.835938 15.265624-15.265625v-51.90625c0-8.429687-6.832031-15.265625-15.265624-15.265625zm0 0" fill="#082130"/><path d="m494.992188 370.03125h-56.660157c-8.429687 0-15.265625-6.835938-15.265625-15.269531 0-8.429688 6.835938-15.265625 15.265625-15.265625h56.660157c8.429687 0 15.265624 6.835937 15.265624 15.265625 0 8.433593-6.832031 15.269531-15.265624 15.269531zm0 0" fill="#082130"/><path d="m71.925781 339.496094h-13.0625v-13.0625c0-8.429688-6.835937-15.265625-15.265625-15.265625-8.433594 0-15.269531 6.835937-15.269531 15.265625v13.0625h-13.0625c-8.429687 0-15.265625 6.835937-15.265625 15.265625 0 8.433593 6.835938 15.269531 15.265625 15.269531h13.0625v13.0625c0 8.429688 6.835937 15.265625 15.269531 15.265625 8.429688 0 15.265625-6.835937 15.265625-15.265625v-13.0625h13.0625c8.429688 0 15.265625-6.835938 15.265625-15.269531 0-8.429688-6.832031-15.265625-15.265625-15.265625zm0 0" fill="#145180"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

1
smart-hut/public/img/light-sensor.svg Normal file
View file

@ -0,0 +1 @@
<svg height="512pt" viewBox="0 0 512 512" width="512pt" xmlns="http://www.w3.org/2000/svg"><path d="m256 394.414062c-77.425781 0-140.414062-62.988281-140.414062-140.410156 0-77.425781 62.988281-140.414062 140.414062-140.414062s140.414062 62.988281 140.414062 140.414062c0 77.421875-62.988281 140.410156-140.414062 140.410156zm0 0" fill="#ffe645"/><path d="m256 113.589844c-.003906 0-.007812 0-.007812 0v280.824218h.007812c77.425781 0 140.414062-62.988281 140.414062-140.410156 0-77.425781-62.988281-140.414062-140.414062-140.414062zm0 0" fill="#a19d8d"/><path d="m256 512c-8.285156 0-15-6.714844-15-15v-56c0-8.28125 6.714844-15 15-15s15 6.71875 15 15v56c0 8.285156-6.714844 15-15 15zm0 0" fill="#ffe645"/><path d="m497 271h-54.011719c-8.285156 0-15-6.714844-15-15 0-8.28125 6.714844-15 15-15h54.011719c8.285156 0 15 6.71875 15 15 0 8.285156-6.714844 15-15 15zm0 0" fill="#ffcf2c"/><path d="m69.011719 271h-54.011719c-8.285156 0-15-6.714844-15-15 0-8.28125 6.714844-15 15-15h54.011719c8.285156 0 15 6.71875 15 15 0 8.285156-6.714844 15-15 15zm0 0" fill="#ffe645"/><path d="m418.839844 176.996094c-5.183594 0-10.226563-2.691406-13.003906-7.503906-4.140626-7.171876-1.683594-16.347657 5.492187-20.488282l45.882813-26.492187c7.175781-4.144531 16.351562-1.683594 20.492187 5.492187 4.140625 7.171875 1.683594 16.347656-5.492187 20.488282l-45.882813 26.492187c-2.363281 1.363281-4.941406 2.011719-7.488281 2.011719zm0 0" fill="#ffcf2c"/><g fill="#ffe645"><path d="m48.140625 391.019531c-5.183594 0-10.226563-2.691406-13.003906-7.503906-4.144531-7.171875-1.683594-16.347656 5.488281-20.488281l46.785156-27.011719c7.175782-4.144531 16.347656-1.683594 20.488282 5.492187 4.144531 7.171876 1.6875 16.347657-5.488282 20.488282l-46.785156 27.011718c-2.359375 1.363282-4.941406 2.011719-7.484375 2.011719zm0 0"/><path d="m136.332031 478.246094c-2.542969 0-5.121093-.644532-7.484375-2.011719-7.175781-4.140625-9.632812-13.316406-5.492187-20.488281l27.007812-46.777344c4.140625-7.171875 13.316407-9.632812 20.488281-5.488281 7.175782 4.140625 9.632813 13.316406 5.492188 20.488281l-27.007812 46.777344c-2.777344 4.8125-7.820313 7.5-13.003907 7.5zm0 0"/><path d="m93.160156 176.996094c-2.546875 0-5.125-.648438-7.484375-2.011719l-46.78125-27.007813c-7.171875-4.140624-9.632812-13.316406-5.488281-20.492187 4.140625-7.171875 13.3125-9.632813 20.488281-5.488281l46.78125 27.007812c7.171875 4.140625 9.628907 13.316406 5.488281 20.488282-2.777343 4.8125-7.820312 7.503906-13.003906 7.503906zm0 0"/></g><path d="m464.699219 391.503906c-2.546875 0-5.125-.648437-7.488281-2.011718l-47.617188-27.492188c-7.171875-4.144531-9.628906-13.316406-5.488281-20.492188 4.140625-7.171874 13.316406-9.632812 20.488281-5.488281l47.617188 27.492188c7.175781 4.140625 9.632812 13.316406 5.492187 20.488281-2.777344 4.8125-7.820313 7.503906-13.003906 7.503906zm0 0" fill="#ffcf2c"/><path d="m375.667969 478.246094c-5.1875 0-10.226563-2.6875-13.003907-7.5l-27.003906-46.769532c-4.140625-7.175781-1.683594-16.347656 5.492188-20.488281 7.171875-4.144531 16.347656-1.6875 20.488281 5.488281l27.003906 46.769532c4.140625 7.175781 1.683594 16.347656-5.492187 20.488281-2.363282 1.367187-4.941406 2.011719-7.484375 2.011719zm0 0" fill="#ffcf2c"/><path d="m256 84c-8.285156 0-15-6.714844-15-15v-54c0-8.285156 6.714844-15 15-15s15 6.714844 15 15v54c0 8.285156-6.714844 15-15 15zm0 0" fill="#ffe645"/><path d="m348.632812 108.535156c-2.542968 0-5.125-.648437-7.484374-2.015625-7.175782-4.140625-9.632813-13.3125-5.492188-20.488281l27.007812-46.773438c4.140626-7.175781 13.3125-9.636718 20.488282-5.492187 7.175781 4.140625 9.632812 13.316406 5.492187 20.492187l-27.007812 46.773438c-2.777344 4.8125-7.820313 7.503906-13.003907 7.503906zm0 0" fill="#ffcf2c"/><path d="m163.363281 108.527344c-5.183593 0-10.226562-2.691406-13.003906-7.503906l-27.003906-46.765626c-4.140625-7.175781-1.683594-16.351562 5.492187-20.492187 7.171875-4.144531 16.347656-1.683594 20.488282 5.492187l27.003906 46.765626c4.140625 7.175781 1.683594 16.347656-5.492188 20.492187-2.359375 1.363281-4.941406 2.011719-7.484375 2.011719zm0 0" fill="#ffe645"/><path d="m256 426c-.003906 0-.007812 0-.007812 0v86h.007812c8.285156 0 15-6.714844 15-15v-56c0-8.28125-6.714844-15-15-15zm0 0" fill="#ffcf2c"/><path d="m256 0c-.003906 0-.007812 0-.007812 0v84h.007812c8.285156 0 15-6.714844 15-15v-54c0-8.285156-6.714844-15-15-15zm0 0" fill="#ffcf2c"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 4.3 KiB

1
smart-hut/public/img/sensorOff.svg Normal file
View file

@ -0,0 +1 @@
<svg id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g><path d="m437.066 74.981c-5.857-5.858-15.355-5.858-21.213 0s-5.858 15.355 0 21.213c42.656 42.655 66.147 99.409 66.147 159.806s-23.491 117.151-66.147 159.806c-5.858 5.857-5.858 15.355 0 21.213 5.868 5.868 15.365 5.848 21.213 0 48.322-48.321 74.934-112.608 74.934-181.019s-26.612-132.698-74.934-181.019z"/><path d="m391.646 120.4c-5.858-5.857-15.356-5.857-21.213 0-5.857 5.858-5.857 15.355 0 21.213 30.533 30.531 47.349 71.155 47.349 114.387s-16.815 83.855-47.349 114.387c-5.858 5.858-5.858 15.355 0 21.213 5.856 5.856 15.353 5.859 21.213 0 36.2-36.198 56.136-84.355 56.136-135.601s-19.937-99.402-56.136-135.599z"/><path d="m346.193 165.852c-5.858-5.857-15.356-5.857-21.213 0-5.858 5.858-5.857 15.356 0 21.213 18.4 18.398 28.533 42.88 28.533 68.934s-10.133 50.536-28.533 68.934c-5.858 5.857-5.858 15.355 0 21.213 5.857 5.857 15.354 5.859 21.213 0 24.066-24.065 37.32-56.08 37.32-90.148s-13.254-66.081-37.32-90.146z"/><path d="m30 256c0-60.397 23.491-117.151 66.147-159.806 5.858-5.857 5.858-15.355 0-21.213-5.857-5.857-15.354-5.858-21.213 0-48.322 48.321-74.934 112.608-74.934 181.019s26.612 132.698 74.934 181.019c5.856 5.857 15.355 5.859 21.213 0 5.858-5.858 5.858-15.355 0-21.213-42.656-42.655-66.147-99.409-66.147-159.806z"/><path d="m94.219 256c0-43.232 16.815-83.855 47.349-114.387 5.858-5.858 5.858-15.355 0-21.213-5.857-5.858-15.355-5.857-21.213 0-36.2 36.197-56.136 84.355-56.136 135.6s19.936 99.403 56.136 135.601c5.866 5.865 15.363 5.85 21.213 0 5.857-5.858 5.857-15.355 0-21.213-30.534-30.532-47.349-71.156-47.349-114.388z"/><path d="m187.021 165.853c-5.857-5.858-15.355-5.858-21.213 0-24.066 24.065-37.32 56.08-37.32 90.148s13.254 66.083 37.32 90.148c5.866 5.865 15.363 5.85 21.213 0 5.858-5.858 5.857-15.356 0-21.213-18.4-18.398-28.533-42.88-28.533-68.934s10.133-50.536 28.533-68.934c5.857-5.859 5.857-15.357 0-21.215z"/><path d="m256 192.8c-34.849 0-63.2 28.352-63.2 63.2s28.352 63.2 63.2 63.2 63.2-28.352 63.2-63.2-28.351-63.2-63.2-63.2z"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

1
smart-hut/public/img/sensorOn.svg Normal file
View file

@ -0,0 +1 @@
<svg id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><g><path d="m415.853 437.019c-5.858-5.858-5.858-15.355 0-21.213 42.656-42.655 66.147-99.409 66.147-159.806s-23.491-117.151-66.147-159.806c-5.858-5.857-5.858-15.355 0-21.213 5.857-5.858 15.355-5.858 21.213 0 48.322 48.321 74.934 112.608 74.934 181.019s-26.612 132.698-74.934 181.019c-5.848 5.848-15.345 5.868-21.213 0z" fill="#7affe4"/><path d="m370.432 391.6c-5.857-5.858-5.857-15.355 0-21.213 30.533-30.531 47.349-71.155 47.349-114.387s-16.815-83.855-47.349-114.387c-5.858-5.858-5.858-15.355 0-21.213 5.857-5.857 15.355-5.858 21.213 0 36.2 36.198 56.136 84.355 56.136 135.601s-19.936 99.403-56.136 135.601c-5.86 5.858-15.356 5.855-21.213-.002z" fill="#00ddc1"/><path d="m324.979 346.148c-5.858-5.858-5.857-15.356 0-21.213 18.4-18.398 28.533-42.88 28.533-68.934s-10.133-50.536-28.533-68.934c-5.858-5.857-5.858-15.355 0-21.213 5.857-5.857 15.355-5.858 21.213 0 24.066 24.065 37.32 56.08 37.32 90.148s-13.254 66.083-37.32 90.148c-5.858 5.857-15.356 5.854-21.213-.002z" fill="#7affe4"/><path d="m415.853 437.019c5.868 5.868 15.365 5.848 21.213 0 48.322-48.321 74.934-112.608 74.934-181.019h-30c0 60.397-23.491 117.151-66.147 159.806-5.858 5.858-5.858 15.355 0 21.213z" fill="#00ddc1"/><path d="m370.432 391.6c5.856 5.856 15.353 5.859 21.213 0 36.2-36.198 56.136-84.355 56.136-135.601h-30c0 43.232-16.815 83.855-47.349 114.387-5.857 5.859-5.857 15.356 0 21.214z" fill="#00b4bc"/><path d="m324.979 346.148c5.857 5.857 15.354 5.859 21.213 0 24.066-24.065 37.32-56.08 37.32-90.148h-30c0 26.054-10.133 50.536-28.533 68.934-5.857 5.858-5.857 15.355 0 21.214z" fill="#00ddc1"/><path d="m74.934 437.019c-48.322-48.321-74.934-112.608-74.934-181.019s26.612-132.698 74.934-181.019c5.858-5.858 15.355-5.857 21.213 0 5.858 5.858 5.858 15.355 0 21.213-42.656 42.655-66.147 99.409-66.147 159.806s23.491 117.151 66.147 159.806c5.858 5.857 5.858 15.355 0 21.213-5.858 5.859-15.357 5.857-21.213 0z" fill="#7affe4"/><path d="m120.354 391.601c-36.199-36.198-56.135-84.355-56.135-135.601s19.936-99.403 56.136-135.601c5.858-5.857 15.356-5.857 21.213 0 5.857 5.858 5.857 15.355 0 21.213-30.534 30.533-47.349 71.156-47.349 114.388s16.815 83.855 47.349 114.387c5.858 5.858 5.858 15.355 0 21.213-5.85 5.85-15.347 5.866-21.214.001z" fill="#00ddc1"/><path d="m165.807 346.148c-24.066-24.065-37.32-56.08-37.32-90.148s13.254-66.083 37.32-90.148c5.858-5.858 15.356-5.857 21.213 0 5.858 5.858 5.857 15.356 0 21.213-18.4 18.398-28.533 42.88-28.533 68.934s10.133 50.536 28.533 68.934c5.858 5.857 5.858 15.355 0 21.213-5.85 5.852-15.347 5.867-21.213.002z" fill="#7affe4"/><path d="m96.147 437.019c5.858-5.858 5.858-15.355 0-21.213-42.656-42.655-66.147-99.409-66.147-159.806h-30c0 68.411 26.612 132.698 74.934 181.019 5.856 5.857 15.355 5.859 21.213 0z" fill="#00ddc1"/><path d="m141.568 391.6c5.857-5.858 5.857-15.355 0-21.213-30.534-30.531-47.349-71.155-47.349-114.387h-30c0 51.246 19.936 99.403 56.136 135.601 5.866 5.865 15.363 5.849 21.213-.001z" fill="#00b4bc"/><path d="m187.021 346.148c5.858-5.858 5.857-15.356 0-21.213-18.4-18.398-28.533-42.88-28.533-68.934h-30c0 34.068 13.254 66.083 37.32 90.148 5.865 5.864 15.362 5.849 21.213-.001z" fill="#00ddc1"/><circle cx="256" cy="256" fill="#00ddc1" r="63.2"/><path d="m256 319.2c34.849 0 63.2-28.352 63.2-63.2h-126.4c0 34.849 28.351 63.2 63.2 63.2z" fill="#00b4bc"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 3.3 KiB

48
smart-hut/public/img/switchOff.svg Normal file
View file

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
<g>
<g>
<path d="M336.709,74.843c-10.322-3.944-21.88,1.219-25.825,11.537c-3.945,10.316,1.22,21.879,11.536,25.824
C393.115,139.239,442,207.384,442,286c0,102.561-83.439,186-186,186S70,388.561,70,286c0-78.659,48.908-146.766,119.573-173.793
c10.317-3.946,15.481-15.509,11.536-25.825c-3.947-10.317-15.512-15.48-25.825-11.536C89.185,107.777,30,190.692,30,286
c0,124.922,101.09,226,226,226c124.922,0,226-101.09,226-226C482,190.65,422.778,107.759,336.709,74.843z"/>
</g>
</g>
<g>
<g>
<path d="M256,0c-11.046,0-20,8.954-20,20v195.851c0,11.046,8.954,20,20,20s20-8.955,20-20V20C276,8.954,267.046,0,256,0z"/>
</g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.1 KiB

48
smart-hut/public/img/switchOn.svg Normal file
View file

@ -0,0 +1,48 @@
<?xml version="1.0" encoding="iso-8859-1"?>
<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="30" y1="258" x2="482" y2="258" gradientTransform="matrix(1 0 0 -1 0 514)">
<stop offset="0" style="stop-color:#80D8FF"/>
<stop offset="0.16" style="stop-color:#88D1FF"/>
<stop offset="0.413" style="stop-color:#9FBEFE"/>
<stop offset="0.725" style="stop-color:#C4A0FD"/>
<stop offset="1" style="stop-color:#EA80FC"/>
</linearGradient>
<path style="fill:url(#SVGID_1_);" d="M256,512C131.09,512,30,410.922,30,286c0-95.308,59.185-178.223,145.284-211.154
c10.313-3.944,21.878,1.219,25.825,11.536c3.945,10.316-1.219,21.879-11.536,25.825C118.908,139.234,70,207.341,70,286
c0,102.561,83.439,186,186,186s186-83.439,186-186c0-78.616-48.885-146.761-119.58-173.796
c-10.316-3.945-15.481-15.508-11.536-25.824c3.945-10.318,15.503-15.481,25.825-11.537C422.778,107.759,482,190.65,482,286
C482,410.91,380.922,512,256,512z M276,215.851V20c0-11.046-8.954-20-20-20s-20,8.954-20,20v195.851c0,11.046,8.954,20,20,20
C267.046,235.851,276,226.896,276,215.851z"/>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
<g>
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

14
smart-hut/public/img/temperature-sensor.svg Normal file
View file

@ -0,0 +1,14 @@
<svg xmlns="http://www.w3.org/2000/svg" height="590pt" version="1.1" viewBox="-193 0 590 590.60879" width="590pt">
<g id="surface1">
<path d="M 163.433594 407.625 L 163.433594 61.121094 C 163.433594 27.363281 136.070312 0 102.308594 0 C 68.550781 0 41.1875 27.363281 41.1875 61.121094 L 41.1875 407.625 C -3.820312 441.386719 -12.945312 505.238281 20.8125 550.246094 C 54.574219 595.253906 118.425781 604.378906 163.433594 570.621094 C 208.441406 536.859375 217.566406 473.007812 183.808594 428 C 178.019531 420.277344 171.15625 413.421875 163.433594 407.625 Z M 163.433594 407.625 " style=" stroke:none;fill-rule:nonzero;fill:rgb(41.176471%,80%,84.313725%);fill-opacity:1;" />
<path d="M 163.433594 407.625 L 163.433594 244.488281 L 41.1875 366.734375 L 41.1875 407.625 C -3.820312 441.386719 -12.945312 505.238281 20.8125 550.246094 C 54.574219 595.253906 118.425781 604.378906 163.433594 570.621094 C 208.441406 536.859375 217.566406 473.007812 183.808594 428 C 178.019531 420.277344 171.15625 413.421875 163.433594 407.625 Z M 163.433594 407.625 " style=" stroke:none;fill-rule:nonzero;fill:rgb(38.039216%,74.117647%,78.039216%);fill-opacity:1;" />
<path d="M 143.058594 488.980469 C 143.058594 511.484375 124.816406 529.726562 102.308594 529.726562 C 79.804688 529.726562 61.5625 511.484375 61.5625 488.980469 C 61.5625 466.476562 79.804688 448.230469 102.308594 448.230469 C 124.816406 448.230469 143.058594 466.476562 143.058594 488.980469 Z M 143.058594 488.980469 " style=" stroke:none;fill-rule:nonzero;fill:rgb(92.941176%,19.215686%,14.117647%);fill-opacity:1;" />
<path d="M 92.125 81.496094 L 112.496094 81.496094 L 112.496094 478.792969 L 92.125 478.792969 Z M 92.125 81.496094 " style=" stroke:none;fill-rule:nonzero;fill:rgb(92.941176%,19.215686%,14.117647%);fill-opacity:1;" />
<path d="M 41.1875 356.546875 L 71.75 356.546875 L 71.75 376.921875 L 41.1875 376.921875 Z M 41.1875 356.546875 " style=" stroke:none;fill-rule:nonzero;fill:rgb(31.764706%,61.568627%,65.098039%);fill-opacity:1;" />
<path d="M 41.1875 305.613281 L 71.75 305.613281 L 71.75 325.988281 L 41.1875 325.988281 Z M 41.1875 305.613281 " style=" stroke:none;fill-rule:nonzero;fill:rgb(31.764706%,61.568627%,65.098039%);fill-opacity:1;" />
<path d="M 41.1875 254.675781 L 71.75 254.675781 L 71.75 275.050781 L 41.1875 275.050781 Z M 41.1875 254.675781 " style=" stroke:none;fill-rule:nonzero;fill:rgb(31.764706%,61.568627%,65.098039%);fill-opacity:1;" />
<path d="M 41.1875 203.742188 L 71.75 203.742188 L 71.75 224.117188 L 41.1875 224.117188 Z M 41.1875 203.742188 " style=" stroke:none;fill-rule:nonzero;fill:rgb(31.764706%,61.568627%,65.098039%);fill-opacity:1;" />
<path d="M 41.1875 152.804688 L 71.75 152.804688 L 71.75 173.179688 L 41.1875 173.179688 Z M 41.1875 152.804688 " style=" stroke:none;fill-rule:nonzero;fill:rgb(31.764706%,61.568627%,65.098039%);fill-opacity:1;" />
<path d="M 41.1875 101.871094 L 71.75 101.871094 L 71.75 122.246094 L 41.1875 122.246094 Z M 41.1875 101.871094 " style=" stroke:none;fill-rule:nonzero;fill:rgb(31.764706%,61.568627%,65.098039%);fill-opacity:1;" />
</g>
</svg>
Side by side

After

Width:  |  Height:  |  Size: 3 KiB

BIN
smart-hut/public/title6.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 3.5 KiB

19
smart-hut/src/App.js
View file

@ -9,6 +9,7 @@ import ForgotPass from "./views/Forgot-password";
import ChangePass from "./views/Forgot-pass-reset"; import ChangePass from "./views/Forgot-pass-reset";
import ConfirmForgotPasswrod from "./views/ConfirmForgotPassword"; import ConfirmForgotPasswrod from "./views/ConfirmForgotPassword";
import ConfirmRegistration from "./views/ConfirmRegistration"; import ConfirmRegistration from "./views/ConfirmRegistration";
import Instruction from "./views/Instruction";
import queryString from 'query-string'; import queryString from 'query-string';
import { call } from './client_server'; import { call } from './client_server';
@ -44,20 +45,25 @@ class App extends Component {
} }
componentDidMount() { componentDidMount() {
if (this.props.location) { if (window.location) {
const values = queryString.parse(this.props.location.search); const values = queryString.parse(window.location.search);
console.log(values);
this.setState({ this.setState({
query : values query : values
}); });
} else {
this.setState({
query : "ciao"
});
} }
} }
auth(data) { auth(data) {
return call.login(data.params) return call.login(data.params)
.then(res => { .then(res => {
console.log(res);
if (res.data && res.status === 200) { if (res.data && res.status === 200) {
localStorage.setItem("token", res.data.jwttoken); localStorage.setItem("token", res.data.jwttoken);
call.setToken(res.data.jwttoken);
this.setState( this.setState(
{ {
user: data.params.user, user: data.params.user,
@ -80,7 +86,6 @@ class App extends Component {
}; };
logout() { logout() {
console.log("logout")
this.setState({ this.setState({
loggedIn : false, loggedIn : false,
}); });
@ -109,7 +114,11 @@ class App extends Component {
<Route path="/sent-email-reg" > <Route path="/sent-email-reg" >
<ConfirmRegistration /> <ConfirmRegistration />
</Route> </Route>
<Route path="/forgot-pass-reset" > <Route path="/instruction" >
<Instruction />
</Route>
<Route path="/forgot-pass-reset" > </Route>
<Route path="/password-reset" >
<ChangePass query={this.state.query}/> <ChangePass query={this.state.query}/>
</Route> </Route>
<Route component={FourOhFour} /> <Route component={FourOhFour} />

104
smart-hut/src/client_server.js
View file

@ -1,7 +1,7 @@
import axios from 'axios'; import axios from 'axios';
let config = 'http://localhost:8080/'; let config = 'http://localhost:8080/';
const tkn = localStorage.getItem("token"); var tkn = localStorage.getItem("token");
// requests data devices // requests data devices
/* /*
@ -12,137 +12,75 @@ const tkn = localStorage.getItem("token");
id: se serve id: se serve
} }
device routes:
- buttonDimmer
- dimmableLight
- knobDimmer
- motionSensor
- regularLight
- sensor
- smartPlug
- switch
*/ */
export var call = { export var call = {
setToken: function(token) {
tkn = token;
},
login: function(data, headers) { login: function(data, headers) {
return axios.post(config +'auth/login', data) return axios.post(config +'auth/login', data)
.then(res => {
return res;
}).catch(err => {
return {status : "Errore"};
});
}, },
register: function(data, headers) { register: function(data, headers) {
return axios.post(config + 'register', data) return axios.post(config + 'register', data)
.then(res => {
return res;
}).catch(err => {
//console.error(err);
return {status : "Errore"};
});
}, },
initResetPassword: function(data, headers) { initResetPassword: function(data, headers) {
return axios.post(config + 'register/init-reset-password', data) return axios.post(config + 'register/init-reset-password', data)
.then(res => {
return res;
}).catch(err => {
return {status : "Errore"};
});
}, },
resetPassword: function(data, headers) { resetPassword: function(data, headers) {
return axios.put(config + 'register/reset-password', data) return axios.put(config + 'register/reset-password', data)
.then(res => {
return res;
}).catch(err => {
return {status : "Errore"};
});
}, },
getAllRooms: function(token) { getAllRooms: function(token) {
if (!token){ if (!token){
token = tkn; token = tkn;
} }
return axios.get(config + 'room', { headers: { Authorization : "Bearer " + token } }) return axios.get(config + 'room', { headers: { Authorization : "Bearer " + token } })
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
getAllDevices: function(token) { getAllDevices: function(token) {
if (!token){ if (!token){
token = tkn; token = tkn;
} }
return axios.get(config + 'device', { headers: { Authorization : "Bearer " + token } }) return axios.get(config + 'device', { headers: { Authorization : "Bearer " + token } });
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
getAllDevicesByRoom: function(id, token) { getAllDevicesByRoom: function(id, token) {
if (!token){ if (!token){
token = tkn; token = tkn;
} }
return axios.get(config + 'room/' + id + '/devices' , { headers: { Authorization : "Bearer " + token } }) return axios.get(config + 'room/' + id + '/devices' , { headers: { Authorization : "Bearer " + token } });
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
createRoom: function(data, headers) { createRoom: function(data, headers) {
return axios.post(config + 'room', data, { headers: { Authorization : "Bearer " + tkn } }) return axios.post(config + 'room', data, { headers: { Authorization : "Bearer " + tkn } })
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
updateRoom: function(data, headers) { updateRoom: function(data, headers) {
return axios.put(config + 'room/'+data.id) return axios.put(config + 'room/'+data.id)
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
deleteRoom: function(data, headers) { deleteRoom: function(data, headers) {
return axios.delete(config + 'room/'+data.id) return axios.delete(config + 'room/'+data.id, { headers: { Authorization : "Bearer " + tkn } });
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
devicePost: function(data, headers) { devicePost: function(data, headers) {
return axios.post(config + data.device, data.params) return axios.post(config + data.device, data.params, { headers: { Authorization : "Bearer " + tkn } })
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
deviceUpdate: function(data, headers) { deviceUpdate: function(data, headers) {
return axios.put(config + data.device, data.params) return axios.put(config + 'device', data, { headers: { Authorization : "Bearer " + tkn } })
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
deviceDelete: function(data, headers) { deviceDelete: function(data, headers) {
return axios.delete(config + data.device + '/' + data.id, data.params) return axios.delete(config + data.device + '/' + data.id, {}, { headers: { Authorization : "Bearer " + tkn } })
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
deviceGetById: function(data, headers) { deviceGetById: function(data, headers) {
return axios.get(config + data.device + '/' + data.id) return axios.get(config + data.device + '/' + data.id)
.then(res => {
return res;
}).catch(err => {
return err;
});
}, },
deviceGetAll: function(data, headers) { deviceGetAll: function(data, headers) {
return axios.get(config + data.device) return axios.get(config + data.device)
.then(res => {
return res;
}).catch(err => {
return err;
});
} }
}; };

12
smart-hut/src/components/HeaderController.js
View file

@ -1,6 +1,5 @@
import React, { Component } from "react"; import React from "react";
import { render } from "react-dom"; import { Dropdown, Icon, Grid, Divider} from 'semantic-ui-react'
import { Button, Menu, Header, Dropdown, Icon, Grid, Divider} from 'semantic-ui-react'
import { Segment, Image } from 'semantic-ui-react' import { Segment, Image } from 'semantic-ui-react'
const ImageExampleWrapped = () => ( const ImageExampleWrapped = () => (
@ -20,11 +19,7 @@ const ImageExampleWrapped = () => (
) )
const ImageExampleWrapped3 = () => ( const ImageExampleWrapped3 = () => (
<Image src='title2.png' size='medium' centered/> <Image src='title6.png' size='medium' centered/>
)
const HeaderExampleIconProp = () => (
<Header as='h2' icon='plug' color="white" content='Smart Hut' />
) )
@ -67,7 +62,6 @@ const GridExampleInverted = (props) => (
export default class MyHeader extends React.Component { export default class MyHeader extends React.Component {
render() { render() {
console.log(this.props)
return ( return (
<div> <div>
<GridExampleInverted logout={this.props.logout} /> <GridExampleInverted logout={this.props.logout} />

1
smart-hut/src/components/HomeNavbar.js
View file

@ -1,6 +1,5 @@
import _ from "lodash"; import _ from "lodash";
import React, { Component } from "react"; import React, { Component } from "react";
import { render } from "react-dom";
import { import {
Container, Container,
Icon, Icon,

3
smart-hut/src/components/SelectIcons.js
View file

@ -1,5 +1,5 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Button, Header, Image, Modal, Checkbox, Form, Grid, Input, Icon } from 'semantic-ui-react' import { Button, Grid } from 'semantic-ui-react'
export default class SelectIcons extends Component { export default class SelectIcons extends Component {
@ -29,7 +29,6 @@ export default class SelectIcons extends Component {
['trophy', 'wrench', 'image', 'book', 'university', 'medkit'], ['trophy', 'wrench', 'image', 'book', 'university', 'medkit'],
['paw', 'tree', 'utensils', 'male', 'female', 'life ring outline']]; ['paw', 'tree', 'utensils', 'male', 'female', 'life ring outline']];
var colums = 0;
return ( return (
<Grid centered> <Grid centered>
{ {

113
smart-hut/src/components/dashboard/DevicePanel.js
View file

@ -6,6 +6,8 @@ import {editButtonStyle, panelStyle} from "./devices/styleComponents";
import {checkMaxLength, DEVICE_NAME_MAX_LENGTH} from "./devices/constants"; import {checkMaxLength, DEVICE_NAME_MAX_LENGTH} from "./devices/constants";
import DeviceType from './devices/DeviceTypeController'; import DeviceType from './devices/DeviceTypeController';
import NewDevice from "./devices/NewDevice"; import NewDevice from "./devices/NewDevice";
import SettingsModal from "./devices/SettingsModal";
import { call } from '../../client_server';
export default class DevicePanel extends Component { export default class DevicePanel extends Component {
@ -13,16 +15,24 @@ export default class DevicePanel extends Component {
super(props); super(props);
this.state = { this.state = {
editMode : false, editMode : false,
devices : this.props.devices,
}; };
this.addDevice = this.addDevice.bind(this);
} }
editModeController = (e) => this.setState((prevState) => ({ editMode: !prevState.editMode })); editModeController = (e) => this.setState((prevState) => ({ editMode: !prevState.editMode }));
openModal = (settingsDeviceId) => {
this.setState(prevState => ({
openSettingsModal: !prevState.openSettingsModal,
settingsDeviceId: settingsDeviceId
}))
}
changeDeviceData = (deviceId, newSettings) => { changeDeviceData = (deviceId, newSettings) => {
console.log(newSettings.name, " <-- new name --> ", deviceId ); console.log(newSettings.name, " <-- new name --> ", deviceId );
this.state.devices.map(device => { this.props.devices.map(device => {
if(device.id === deviceId){ if(device.id === deviceId){
for(let prop in newSettings){ for(let prop in newSettings){
if(device.hasOwnProperty(prop)){ if(device.hasOwnProperty(prop)){
@ -45,27 +55,116 @@ export default class DevicePanel extends Component {
this.forceUpdate(); this.forceUpdate();
}; };
getDevices() {
if (this.props.activeItem === -1) {
call.getAllDevices()
.then(res => {
if ( res.status === 200) {
this.setState({
devices: res.data
});
}
}).catch(err => {
console.log(err);
});
} else {
call.getAllDevicesByRoom(this.state.settingsDeviceId)
.then(res => {
if (res.status === 200) {
this.setState({
devices: res.data
});
}
}).catch(err => {
});
}
}
async addDevice(data) {
const ds = await this.props.addDevice(data);
this.setState({
devices: ds
});
this.forceUpdate();
}
updateDevice = (data) => {
const roomId = this.props.devices.filter(d => d.id === this.state.settingsDeviceId)[0].roomId;
console.log(roomId)
data["id"] = this.state.settingsDeviceId;
data["roomId"] = roomId;
call.deviceUpdate(data)
.then(res => {
if (res.status === 200) {
this.getDevices();
}
}).catch(err => {
})
}
removeDevice = () => {
const item = this.props.devices.filter(d => d.id === this.state.settingsDeviceId)[0];
console.log(item)
const data = {
device: item.kind,
id: this.state.settingsDeviceId
};
call.deviceDelete(data)
.then(res => {
console.log(res)
if (res.status === 200) {
this.getDevices();
}
}).catch(err => {
});
}
render() { render() {
const edit = {
mode: this.state.editMode,
openModal: this.openModal,
};
const ds = this.state.devices ? this.state.devices : this.props.devices;
return ( return (
<div style={panelStyle}> <div style={panelStyle}>
<button style={editButtonStyle} onClick={this.editModeController}>Edit</button> <button style={editButtonStyle} onClick={this.editModeController}>Edit</button>
<Grid doubling columns={this.props.devices.length > 0 ? this.props.devices.length : 1} divided="vertically"> <Grid doubling columns={4} divided="vertically">
{this.state.openSettingsModal ?
<SettingsModal openModal={this.openModal}
updateDevice={this.updateDevice}
removeDevice={this.removeDevice}
device={ds.filter(d => d.id === this.state.settingsDeviceId)[0]}/> : ""
}
{ {
this.props.devices ? ds ?
this.props.devices.map((e, i) => { ds.map((e, i) => {
return ( return (
<Grid.Column key={i}> <Grid.Column key={i}>
<DeviceType type={e.kind} onChangeData={this.changeDeviceData} device={e} edit={this.state.editMode}/> <DeviceType type={e.kind} onChangeData={this.changeDeviceData} device={e} edit={edit}/>
</Grid.Column> </Grid.Column>
) )
}) })
: :
null null
} }
{
this.props.activeItem !== -1 ?
<Grid.Column> <Grid.Column>
<NewDevice/> <NewDevice addDevice={this.addDevice} devices={ds}/>
</Grid.Column> </Grid.Column>
:
null
}
</Grid> </Grid>
</div> </div>
) )

48
smart-hut/src/components/dashboard/devices/Device.js
View file

@ -1,48 +0,0 @@
import React, {Component} from 'react';
import {Image} from "semantic-ui-react";
import {iconStyle, nameStyle, StyledDiv} from "./styleComponents";
import Settings from './DeviceSettings';
export default class Device extends Component {
constructor(props) {
super(props);
this.state = {
turnOnOff: "off",
icon: this.props.device.img
}
}
onClickDevice = () => {
if (!this.props.edit) {
if (this.props.device.type === "light") {
if (this.state.turnOnOff === "on") {
this.setState({
turnOnOff: "off",
icon: this.props.device.img
});
} else {
this.setState({
turnOnOff: "on",
icon: this.props.device.imgClick
});
}
}
}
};
render() {
return (
<StyledDiv onClick={this.props.edit ? () => {
} : this.onClickDevice} style={{textAlign: "center"}}>
<Settings
deviceId={this.props.device.id}
edit={this.props.edit}
onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
<Image src={this.state.icon} style={iconStyle}/>
<h5 style={nameStyle}>{this.props.device.name}</h5>
</StyledDiv>
)
}
}

49
smart-hut/src/components/dashboard/devices/DeviceSettings.js
View file

@ -1,43 +1,12 @@
import React, {Component} from "react"; import React, {Component} from "react";
import {Button, Form} from "semantic-ui-react"; import {editModeIconStyle, editModeStyle} from "./styleComponents";
import {editModeIconStyle, editModeStyle, formStyle} from "./styleComponents";
class SettingsForm extends Component {
constructor(props) {
super(props);
this.state = {}
};
onChangeHandler = (event) => {
let nam = event.target.name;
let val = event.target.value;
this.setState({[nam]: val});
};
saveChanges = () => {
let newName = this.state["new-name"];
this.props.onChangeData(this.props.id, {"name": newName});
};
render() {
return (
<Form style={formStyle}>
<Form.Field>
<label style={{color: "white"}}>New Device Name</label>
<input name="new-name" placeholder='New name' onChange={this.onChangeHandler}/>
</Form.Field>
<Button type='submit' onClick={this.saveChanges}>Save</Button>
</Form>
)
}
}
export default class Settings extends Component { export default class Settings extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
displayForm: false, displayForm: true,
} }
}; };
@ -47,26 +16,18 @@ export default class Settings extends Component {
render() { render() {
const view = ( const view = (
<div> <div onClick={() => this.props.edit.openModal(this.props.deviceId)}>
{this.state.displayForm ? (
<SettingsForm id={this.props.deviceId} onChangeData={this.props.onChangeData}/>) : ("")}
<div onClick={this.displayForm}>
<span style={editModeStyle}> <span style={editModeStyle}>
{!this.state.displayForm ? (
<img <img
src="/img/settings.svg" src="/img/settings.svg"
alt="" alt=""
style={editModeIconStyle}/>) style={editModeIconStyle}/>
:
<p style={{color: "white"}}>&times;</p>
}
</span> </span>
</div> </div>
</div>
); );
return ( return (
<React.Fragment> <React.Fragment>
{this.props.edit ? view : ("")} {this.props.edit.mode ? view : ("")}
</React.Fragment> </React.Fragment>
) )
}; };

13
smart-hut/src/components/dashboard/devices/DeviceTypeController.js
View file

@ -1,16 +1,15 @@
import React, { Component } from 'react'; import React from 'react';
import Light from "./Light"; import Light from "./Light";
import SmartPlug from "./SmartPlug"; import SmartPlug from "./SmartPlug";
import Sensor from "./Sensor"; import Sensor from "./Sensor";
import DefaultDimmer from "./Dimmer"; import DefaultDimmer from "./Dimmer";
import Switcher from "./Switcher"; import Switcher from "./Switch";
const DeviceType = (props) => { const DeviceType = (props) => {
switch(props.type) { switch(props.type) {
case "light": case "regular-light":
return <Light onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} /> return (<Light onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />)
case "sensor": case "sensor":
return <Sensor onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} /> return <Sensor onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />
case "dimmer": case "dimmer":
@ -19,6 +18,10 @@ const DeviceType = (props) => {
return <SmartPlug onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} /> return <SmartPlug onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />
case "switch": case "switch":
return <Switcher onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} /> return <Switcher onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />
case "light":
return (<Light onChangeData={props.changeDeviceData} device={props.device} edit={props.edit} />)
default:
return ""
} }
} }

58
smart-hut/src/components/dashboard/devices/DigitalSensor.js Normal file
View file

@ -0,0 +1,58 @@
/**
* Users can add sensors in their rooms.
* Sensors typically measure physical quantities in a room.
* You must support temperature sensors, humidity sensors, light sensors (which measure luminosity1).
* Sensors have an internal state that cannot be changed by the user.
* For this story, make the sensors return a constant value with some small random error.
*/
import React, {Component} from "react";
import {CircularInput, CircularProgress, CircularTrack} from "react-circular-input";
import {errorStyle, sensorText, style, valueStyle} from "./SensorStyle";
import {StyledDiv} from "./styleComponents";
import Settings from "./DeviceSettings";
import {Image} from "semantic-ui-react";
import {imageStyle, nameStyle} from "./DigitalSensorStyle";
export default class DigitalSensor extends Component {
constructor(props) {
super(props);
this.state = {
value: false, // This value is a boolean, was this type of sensor returns presence/absence
};
this.iconOn = "/img/sensorOn.svg";
this.iconOff = "/img/sensorOff.svg"
}
setName = () => {
if(this.props.device.name.length > 15){
return this.props.device.name.slice(0,12) + "..."
}
return this.props.device.name;
};
getIcon = () => {
if(this.state.value){
return this.iconOn;
}
return this.iconOff;
};
componentDidMount() {
}
render() {
return (
<StyledDiv>
<Settings
deviceId={this.props.device.id}
edit={this.props.edit}
onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
<Image src={this.getIcon()} style={imageStyle}/>
<h5 style={nameStyle}>{this.props.device.name}</h5>
</StyledDiv>
)
}
}

17
smart-hut/src/components/dashboard/devices/DigitalSensorStyle.js Normal file
View file

@ -0,0 +1,17 @@
export const imageStyle = {
width: "3.5rem",
height: "auto",
position: "absolute",
top: "20%",
left: "50%",
transform: "translateX(-50%)",
filter: "drop-shadow( 1px 1px 0.5px rgba(0, 0, 0, .25))"
};
export const nameStyle = {
color : "black",
position: "absolute",
top: "40%",
left: "50%",
transform: "translateX(-50%)"
};

37
smart-hut/src/components/dashboard/devices/Light.js
View file

@ -7,30 +7,28 @@
*/ */
import React, {Component} from "react"; import React, {Component} from "react";
import {iconStyle, StyledDiv, nameStyle} from "./styleComponents"; import {iconStyle, StyledDiv} from "./styleComponents";
import Settings from "./DeviceSettings"; import Settings from "./DeviceSettings";
import {Image} from "semantic-ui-react"; import {Image} from "semantic-ui-react";
import {CircularInput, CircularProgress, CircularThumb, CircularTrack} from "react-circular-input"; import {CircularInput, CircularProgress, CircularThumb, CircularTrack} from "react-circular-input";
import {valueStyle, intensityLightStyle, style} from "./LightStyle"; import {valueStyle, intensityLightStyle, style, nameStyle} from "./LightStyle";
export default class Light extends Component { export default class Light extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
turnedOn: false, turnedOn: false,
hasIntensity : false
}; };
this.iconOn = "/img/lightOn.svg"; this.iconOn = "/img/lightOn.svg";
this.iconOff = "/img/lightOff.svg" this.iconOff = "/img/lightOff.svg"
} }
onClickDevice = () => { onClickDevice = () => {
this.setState((prevState) => ({turnedOn: !prevState.turnedOn})); this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
}; };
setIntensity = (newValue) => { setIntensity = (newValue) => {
this.setState({intensityLevel : newValue}); this.setState({intensity: newValue});
}; };
getIcon = () => { getIcon = () => {
@ -41,10 +39,9 @@ export default class Light extends Component {
}; };
componentDidMount() { componentDidMount() {
if(this.props.device.hasOwnProperty("hasIntensity") && this.props.device.hasOwnProperty("intensityLevel")) { if (this.props.device.hasOwnProperty("intensity")) {
this.setState({ this.setState({
hasIntensity: this.props.device.hasIntensity, intensity: this.props.device.intensity
intensityLevel: this.props.device.intensityLevel
}); });
} }
// Get the state and update it // Get the state and update it
@ -55,7 +52,7 @@ export default class Light extends Component {
render() { render() {
const intensityLightView = ( const intensityLightView = (
<CircularInput <CircularInput
value={this.state.intensityLevel} value={this.state.intensity}
onChange={this.setIntensity} onChange={this.setIntensity}
style={style} style={style}
> >
@ -64,7 +61,7 @@ export default class Light extends Component {
<CircularThumb/> <CircularThumb/>
<text style={valueStyle} x={100} y={100} textAnchor="middle" dy="0.3em" fontWeight="bold"> <text style={valueStyle} x={100} y={100} textAnchor="middle" dy="0.3em" fontWeight="bold">
{Math.round(this.state.intensityLevel*100)}% {Math.round(this.state.intensity * 100)}%
</text> </text>
<text style={intensityLightStyle} x={100} y={150} textAnchor="middle" dy="0.3em" fontWeight="bold"> <text style={intensityLightStyle} x={100} y={150} textAnchor="middle" dy="0.3em" fontWeight="bold">
{this.props.device.name} {this.props.device.name}
@ -73,21 +70,21 @@ export default class Light extends Component {
); );
const normalLightView = ( const normalLightView = (
<StyledDiv onClick={this.props.edit ? () => { <div onClick={this.props.edit.mode ? () => {
} : this.onClickDevice} style={{textAlign: "center"}}> } : this.onClickDevice}>
<Image src={this.getIcon()} style={iconStyle}/>
<h5 style={nameStyle}>{this.props.device.name}</h5>
</div>
);
return (
<StyledDiv>
<Settings <Settings
deviceId={this.props.device.id} deviceId={this.props.device.id}
edit={this.props.edit} edit={this.props.edit}
onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/> onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
<Image src={this.getIcon()} style={iconStyle}/> {this.state.intensity ? (intensityLightView) : (normalLightView)}
<h5 style={nameStyle}>{this.props.device.name}</h5>
</StyledDiv> </StyledDiv>
);
return (
<React.Fragment>
{this.state.hasIntensity ? (intensityLightView) : (normalLightView)}
</React.Fragment>
) )
} }
} }

11
smart-hut/src/components/dashboard/devices/LightStyle.js
View file

@ -8,7 +8,16 @@ export const valueStyle = {
export const intensityLightStyle = { export const intensityLightStyle = {
fill: "#3e99ff", fill: "#3e99ff",
fontSize: "1.5rem", fontSize: "1.2rem",
fontFamily: "Lato", fontFamily: "Lato",
textShadow: "1px 1px 0.5px rgba(0, 0, 0, .2)", textShadow: "1px 1px 0.5px rgba(0, 0, 0, .2)",
}; };
export const nameStyle = {
fontSize : "1rem",
position: "absolute",
top: "50%",
left: "50%",
transform: "translateX(-50%)",
color : "black"
};

288
smart-hut/src/components/dashboard/devices/NewDevice.js
View file

@ -1,8 +1,6 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import styled from 'styled-components'; import styled from 'styled-components';
import {Button, Dropdown, Form, Image} from "semantic-ui-react"; import {Button, Dropdown, Form, Icon, Image, Input, Modal} from "semantic-ui-react";
import {addDeviceFormStyle} from "./styleComponents";
import {deviceList} from "./TypesOfDevices";
const StyledDiv = styled.div` const StyledDiv = styled.div`
background-color : #ff4050; background-color : #ff4050;
@ -19,90 +17,230 @@ const StyledDiv = styled.div`
} }
`; `;
class NewDeviceForm extends Component {
constructor(props) {
super(props);
}
formSelector = (option) => {
switch (option) {
case "Light":
return <LightForm/>;
case "Sensor":
return "This is a sensor form";
default:
return "This is a default text"
}
};
render() {
let options = [];
deviceList.forEach((e, i) => {
options.push({key: i, text: e, value: e})
});
return (
<Form style={addDeviceFormStyle}>
<Form.Field>
<label style={{color: "white"}}>Select the type of device</label>
<Dropdown clearable options={options} selection/>
</Form.Field>
<Button type='submit' onClick={this.saveChanges}>Save</Button>
</Form>
);
}
}
class LightForm extends Component {
constructor(props) {
super(props);
this.state = {}
}
render() {
let options = [
{
key: 1,
value: "common",
text: "Normal Light"
},
{
key: 1,
value: "intensity",
text: "Supports intensity level"
}
]
return (
<Form.Field>
<label style={{color: "white"}}>Type of light</label>
<Dropdown clearable options={options} selection/>
</Form.Field>
);
};
};
export default class NewDevice extends Component { export default class NewDevice extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
openForm: false step: 1,
} openModal : false
};
this.baseState = this.state
this.createDevice = this.createDevice.bind(this);
} }
onClickDevice = (event) => { handleOpen = () => {this.setState({openModal : true})};
this.setState((prevState) => ({openForm: !prevState.openForm})); handleClose = () => {this.setState({openModal : false})};
resetState = () => {
this.setState(this.baseState);
this.handleClose();
}; };
nextStep = () => {
this.setState((prevState) => ({step: prevState.step + 1}));
};
previousStep = () => {
this.setState((prevState) => ({step: prevState.step - 1}));
};
setTypeOfDevice = (e, d) => {
if (d.value === "dimmableLight"){
this.setState({typeOfDevice: d.value,
intensity: 0,});
} else {
this.setState({typeOfDevice: d.value,});
}
};
setDeviceName = (e, d) => {
this.setState({deviceName: d.value});
};
setTypeOfSensor = (e, d) => {
this.setState({typeOfSensor: d.value});
};
setLightsDimmerSwitch = (e, d) => {
this.setState({lightsAttached : d.value});
};
createDevice() {
// Connect to the backend and create device here.
const data = {
params: {
"name": this.state.deviceName,
},
device: this.state.typeOfDevice
}
switch(this.state.typeOfDevice) {
case "dimmableLight":
data.params["intensity"] = 1;
break;
default:
break;
}
this.props.addDevice(data);
this.resetState();
};
render() { render() {
const deviceOptions = [
{
key: 'light',
text: 'Normal Light',
value: 'regularLight',
image: {avatar: true, src: '/img/lightOn.svg'},
},
{
key: 'intensity-light',
text: 'Intensity Light',
value: 'dimmableLight',
image: {avatar: true, src: '/img/intensity-light.svg'},
},
{
key: 'smart-plug',
text: 'Smart Plug',
value: 'smartPlug',
image: {avatar: true, src: '/img/smart-plug.svg'},
},
{
key: 'sensor',
text: 'Sensor',
value: 'sensor',
image: {avatar: true, src: '/img/sensorOn.svg'},
},
{
key: 'switch',
text: 'Switch',
value: 'switch',
image: {avatar: true, src: '/img/switchOn.svg'},
},
{
key: 'dimmer',
text: 'Dimmer',
value: 'dimmer',
image: {avatar: true, src: '/img/dimmer.svg'},
},
];
const sensorOptions = [
{
key: "temperature",
text: "Temperature Sensor",
value: "TEMPERATURE",
image: {avatar: true, src: '/img/temperature-sensor.svg'},
},
{
key: "humidity",
text: "Humidity Sensor",
value: "HUMIDITY",
image: {avatar: true, src: '/img/humidity-sensor.svg'},
},
{
key: "light",
text: "Light Sensor",
value: "LIGHT",
image: {avatar: true, src: '/img/light-sensor.svg'},
},
{
key: "motion",
text: "Motion Sensor",
value: "motionSensor",
image: {avatar: true, src: '/img/sensorOn.svg'},
}
];
const availableLights = [];
this.props.devices.forEach(d => {
availableLights.push(
{
key: d.id,
text: d.name,
value: d.id,
}
)
});
const step1 = (
<Dropdown
name="typeOfDevice"
placeholder='Select a Type of Device'
fluid
selection
onChange={this.setTypeOfDevice}
options={deviceOptions}
/>
);
const step2 = (typeOfDevice) => {
const deviceName = (<div>
<Form.Field>
<label>Device Name: </label>
<Input fluid size={"large"} onChange={this.setDeviceName} focus placeholder='Device Name'/>
</Form.Field>
</div>);
const sensorForm = (<Form.Field style={{marginTop : "1rem"}}>
<label>Type of Sensor: </label>
<Dropdown
name="typeOfDevice"
placeholder='Select a Type of Sensor'
fluid
selection
onChange={this.setTypeOfSensor}
options={sensorOptions}
/>
</Form.Field>);
const switchDimmerOptions = (<Form.Field style={{marginTop : "1rem"}}>
<label>Select the Lights You Want to Attach: </label>
<Dropdown
name="typeOfDevice"
placeholder='Select Lights'
fluid
multiple
onChange={this.setLightsDimmerSwitch}
options={availableLights}
/>
</Form.Field>);
return ( return (
<StyledDiv onClick={this.onClickDevice} style={{textAlign: "center"}}> <Form>
{deviceName}
{this.state.typeOfDevice === "sensor" ? (sensorForm) : ""}
{this.state.typeOfDevice === "switch" || this.state.typeOfDevice === "dimmer" ?
(switchDimmerOptions) : ""
}
</Form>
)
};
const steps = [step1, step2()];
return (
<Modal closeIcon open={this.state.openModal} onClose={this.resetState} trigger={<StyledDiv onClick={this.handleOpen}>
<Image src="/img/add.svg" style={{filter: "invert()"}}/> <Image src="/img/add.svg" style={{filter: "invert()"}}/>
{this.state.openForm ? ( </StyledDiv>} centered={true}>
<NewDeviceForm/> <Modal.Header>Add a New Device</Modal.Header>
<Modal.Content>
{steps[this.state.step -1]}
</Modal.Content>
<Modal.Actions>
{this.state.step > 1 ? (
<Button onClick={this.previousStep} color="blue" icon labelPosition='left'>
<Icon name='left arrow'/>
Back
</Button>
) : ""} ) : ""}
</StyledDiv> {this.state.step < steps.length ? (
<Button color="blue" onClick={this.nextStep} icon labelPosition='right'>
Next
<Icon name='right arrow'/>
</Button>
) : ""}
{this.state.step === steps.length ? (
<Button onClick={this.createDevice} color="blue" icon labelPosition='right'>
<Icon name='up arrow'/>
Finish
</Button>
) : ""}
</Modal.Actions>
</Modal>
) )
} }
} }

12
smart-hut/src/components/dashboard/devices/Sensor.js
View file

@ -9,8 +9,10 @@
import React, {Component} from "react"; import React, {Component} from "react";
import {CircularInput, CircularProgress, CircularTrack} from "react-circular-input"; import {CircularInput, CircularProgress, CircularTrack} from "react-circular-input";
import {errorStyle, sensorText, style, valueStyle} from "./SensorStyle"; import {errorStyle, sensorText, style, valueStyle} from "./SensorStyle";
import Settings from "./DeviceSettings";
import {StyledDiv} from "./styleComponents";
export default class Light extends Component { export default class Sensor extends Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
@ -34,13 +36,18 @@ export default class Light extends Component {
render() { render() {
return ( return (
<StyledDiv>
<Settings
deviceId={this.props.device.id}
edit={this.props.edit}
onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
<CircularInput <CircularInput
value={this.state.value / 100} value={this.state.value / 100}
style={style} style={style}
> >
<CircularTrack/> <CircularTrack/>
<CircularProgress/> <CircularProgress/>
<text style={valueStyle} x={100} y={80} textAnchor="middle" dy="0.3em" fontWeight="bold"> <text style={valueStyle} x={100} y={80} textAnchor="middle" dy="0.3em" fontWeight="bold">
{Math.round(this.state.value)}{this.units} {Math.round(this.state.value)}{this.units}
</text> </text>
@ -51,6 +58,7 @@ export default class Light extends Component {
{this.setName()} {this.setName()}
</text> </text>
</CircularInput> </CircularInput>
</StyledDiv>
) )
} }
} }

90
smart-hut/src/components/dashboard/devices/SettingsModal.js Normal file
View file

@ -0,0 +1,90 @@
import React, {Component, useState} from 'react';
import {Button, Checkbox, Form, Icon, Header, Modal} from "semantic-ui-react";
const DeleteModal = (props) => (
<Modal trigger={<Button color='red'>Remove</Button>} closeIcon>
<Header icon='archive' content='Are you sure ?' />
<Modal.Actions>
<Button color='red'>
<Icon name='remove' /> No
</Button>
<Button onClick={() => props.removeDevice()} color='green'>
<Icon name='checkmark' /> Yes
</Button>
</Modal.Actions>
</Modal>
)
const SettingsForm = (props) => {
const handleInputChange = e => {
const {name, value} = e.target;
setValues({...values, [name]: value})
};
const handleCheckboxChange = (e,d) => {
const {name, checked} = d;
setValues({...values, [name]: checked})
};
const [values, setValues] = useState({name: ''});
return (
<Form>
<Form.Field>
<label>New Name: </label>
<input autoComplete="off" name="name" onChange={handleInputChange} value={values.name} placeholder='Device name'/>
</Form.Field>
{props.type === "smart-plug" ? (
<Form.Field>
<Checkbox slider name={"reset"} onClick={handleCheckboxChange} label='Reset Energy Consumption'/>
</Form.Field>
) : ""}
<Form.Field>
<DeleteModal removeDevice={() => props.removeDevice(values)} />
</Form.Field>
<Button onClick={() => props.saveFunction(values)} color="blue" type='submit'>Save</Button>
</Form>
)
}
export default class SettingsModal extends Component {
constructor(props) {
super(props);
this.state = {
open: true,
};
}
handleClose = () => {
this.setState({open: false});
};
saveSettings = (device) => {
// TODO Here there should be all the connections to save the data in the backend
console.log("SAVED: ", device);
if (device.name.length > 0) {
this.props.updateDevice(device);
}
this.props.openModal();
};
render() {
const SettingsModal = () => (
<Modal open={true} onOpen={this.props.openModal} onClose={this.props.openModal}>
<Modal.Header>Settings of {this.props.device.name}</Modal.Header>
<Modal.Content>
<SettingsForm type={this.props.device.type} removeDevice={this.props.removeDevice} saveFunction={this.saveSettings}/>
</Modal.Content>
</Modal>
);
return (
<SettingsModal/>
)
}
}

19
smart-hut/src/components/dashboard/devices/SmartPlug.js
View file

@ -1,18 +1,14 @@
/** /**
A smart plug is a plug that has a boolean internal state, i.e., that can be turned on or off, either with the A smart plug is a plug that has a boolean internal state, i.e., that can be turned on or off, either with the
SmartHut interface or by a switch. SmartHut interface or by a switch.
The smart plug also stores the total energy consumed while the plug is active, in terms of kilowatt-hours The smart plug also stores the total energy consumed while the plug is active, in terms of kilowatt-hours 2(kWh) .
2 The user can reset this value.
(kWh) . The user can reset this value.
**/ **/
import React, {Component} from 'react'; import React, {Component} from 'react';
import {iconStyle, nameStyle, StyledDiv} from "./styleComponents"; import {StyledDiv} from "./styleComponents";
import Settings from "./DeviceSettings"; import Settings from "./DeviceSettings";
import {Image} from "semantic-ui-react"; import {Image} from "semantic-ui-react";
import {energyConsumedStyle, imageStyle} from "./SmartPlugStyle"; import {energyConsumedStyle, imageStyle, nameStyle} from "./SmartPlugStyle";
export default class SmartPlug extends Component { export default class SmartPlug extends Component {
constructor(props){ constructor(props){
@ -36,17 +32,12 @@ export default class SmartPlug extends Component {
return this.iconOff; return this.iconOff;
}; };
resetEnergyConsumedValue = () => {
// In the settings form there must be an option to restore this value
// along with the rename feature.
}
componentDidMount() { componentDidMount() {
} }
render(){ render(){
return ( return (
<StyledDiv onClick={this.props.edit ? () => {} : this.onClickDevice} style={{textAlign: "center"}}> <StyledDiv onClick={this.props.edit.mode ? () => {} : this.onClickDevice}>
<Settings <Settings
deviceId={this.props.device.id} deviceId={this.props.device.id}
edit={this.props.edit} edit={this.props.edit}

10
smart-hut/src/components/dashboard/devices/SmartPlugStyle.js
View file

@ -1,6 +1,6 @@
import {iconStyle} from "./styleComponents";
export const energyConsumedStyle = { export const energyConsumedStyle = {
color : "black",
fontSize : "1.3rem", fontSize : "1.3rem",
position: "absolute", position: "absolute",
top: "30%", top: "30%",
@ -17,3 +17,11 @@ export const imageStyle = {
transform: "translateX(-50%)", transform: "translateX(-50%)",
filter: "drop-shadow( 1px 1px 0.5px rgba(0, 0, 0, .25))" filter: "drop-shadow( 1px 1px 0.5px rgba(0, 0, 0, .25))"
}; };
export const nameStyle = {
color : "black",
position: "absolute",
top: "50%",
left: "50%",
transform: "translateX(-50%)"
};

52
smart-hut/src/components/dashboard/devices/Switch.js Normal file
View file

@ -0,0 +1,52 @@
/**
* Users can add on-off switches. A on-off switch can turn on (or off) lights.
* If a light has an intensity level, when it gets switched back on, it gets the last available
* intensity level that was set by the user (or 100% if no such level exists).
* The user can change the state of a switch through the SmartHut interface.
*/
import React, {Component} from 'react';
import {StyledDiv} from "./styleComponents";
import Settings from "./DeviceSettings";
import {Image} from "semantic-ui-react";
import {imageStyle, nameStyle} from "./SwitchStyle";
export default class Switch extends Component {
constructor(props){
super(props);
this.state = {
turnedOn: false,
pointingLights : []
};
this.iconOn = "/img/switchOn.svg";
this.iconOff = "/img/switchOff.svg";
}
onClickDevice = () => {
this.setState((prevState) => ({turnedOn: !prevState.turnedOn}));
};
getIcon = () => {
if(this.state.turnedOn){
return this.iconOn;
}
return this.iconOff;
};
componentDidMount() {
}
render(){
return (
<StyledDiv onClick={this.props.edit.mode ? () => {} : this.onClickDevice}>
<Settings
deviceId={this.props.device.id}
edit={this.props.edit}
onChangeData={(id, newSettings) => this.props.onChangeData(id, newSettings)}/>
<Image src={this.getIcon()} style={imageStyle}/>
<h5 style={nameStyle}>{this.props.device.name}</h5>
</StyledDiv>
)
}
}

17
smart-hut/src/components/dashboard/devices/SwitchStyle.js Normal file
View file

@ -0,0 +1,17 @@
export const imageStyle = {
width: "4.5rem",
height: "auto",
position: "absolute",
top: "15%",
left: "50%",
transform: "translateX(-50%)",
filter: "drop-shadow( 1px 1px 0.5px rgba(0, 0, 0, .25))"
};
export const nameStyle = {
color : "black",
position: "absolute",
top: "45%",
left: "50%",
transform: "translateX(-50%)"
};

0
smart-hut/src/components/dashboard/devices/Switcher.js
View file

9
smart-hut/src/components/dashboard/devices/styleComponents.js
View file

@ -16,10 +16,9 @@ export const editButtonStyle = {
export const panelStyle = { export const panelStyle = {
position : "relative", position : "relative",
backgroundColor: "#fafafa", backgroundColor: "#fafafa",
height: "100%", height: "100vh",
width: "auto", width: "auto",
padding: "3rem", padding: "0rem 3rem",
color: "#000"
}; };
export const editModeStyle = { export const editModeStyle = {
@ -30,7 +29,8 @@ export const editModeStyle = {
height : "1.5rem", height : "1.5rem",
backgroundColor : "black", backgroundColor : "black",
borderRadius: "100%", borderRadius: "100%",
zIndex : "100" zIndex : "1000",
cursor : "pointer",
}; };
export const editModeIconStyle = { export const editModeIconStyle = {
@ -89,6 +89,7 @@ export const StyledDiv = styled.div`
position : relative; position : relative;
box-shadow: 3px 2px 10px 5px #ccc; box-shadow: 3px 2px 10px 5px #ccc;
transition : all .3s ease-out; transition : all .3s ease-out;
text-align : center;
:hover{ :hover{
background-color : #f2f2f2; background-color : #f2f2f2;
} }

28
smart-hut/src/components/modalform.js
View file

@ -1,5 +1,5 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Button, Header, Image, Modal, Checkbox, Form, Grid, Input, Icon } from 'semantic-ui-react' import { Button, Header, Modal, Form, Input, Icon } from 'semantic-ui-react'
import SelectIcons from "./SelectIcons"; import SelectIcons from "./SelectIcons";
export default class ModalWindow extends Component { export default class ModalWindow extends Component {
@ -39,10 +39,7 @@ export default class ModalWindow extends Component {
} }
deleteRoom = (e) => { deleteRoom = (e) => {
let data = { this.props.deleteRoom();
"id" : this.state.id
}
this.props.deleteRoom(data);
this.closeModal(); this.closeModal();
} }
@ -77,40 +74,39 @@ export default class ModalWindow extends Component {
return ( return (
<div> <div>
{this.props.type == "new" ? {this.props.type === "new" ?
<Button icon labelPosition='left' inverted onClick={this.openModal}> <Button icon labelPosition='left' inverted onClick={this.openModal}>
<Icon name='plus' size='small'/> <Icon name='plus' size='small'/>
ADD ROOM ADD ROOM
</Button> </Button>
: :
<Icon name="pencil" size="small" onClick={this.openModal}/> null
} }
<Modal <Modal
onClose={this.closeModal} onClose={this.closeModal}
open={this.state.openModal}> open={this.state.openModal}>
<Header>{this.props.type == "new" ? "Add new room" : "Modify room" }</Header> <Header>{this.props.type === "new" ? "Add new room" : "Modify room" }</Header>
<Modal.Content> <Modal.Content>
<Form> <Form>
<p>Insert the name of the room:</p> <p>Insert the name of the room:</p>
<Form.Field> <Form.Field>
<Input label='Room name' placeholder='Room Name' name="name" type='text' onChange={this.changeSomething} <Input label='Room name' placeholder='Room Name' name="name" type='text' onChange={this.changeSomething}
value={this.props.type == "new" ? null : this.props.idRoom.name }/> value={this.props.type === "new" ? null : this.props.idRoom.name }/>
</Form.Field> </Form.Field>
<p>Insert an image of the room:</p> <p>Insert an image of the room:</p>
<Form.Field> <Form.Field>
<Input label='Room image' type='file' name="img" onChange={this.changeSomething} <Input label='Room image' type='file' name="img" onChange={this.changeSomething}
value={this.props.type == "new" ? null : this.props.idRoom.images }/> value={this.props.type === "new" ? null : this.props.idRoom.images }/>
</Form.Field> </Form.Field>
</Form> </Form>
<div style={spaceDiv}> <div style={spaceDiv}>
<p>Select an icon:</p> <p>Select an icon:</p>
{this.props.type == "new" ? "home" : this.props.idRoom.icon } <SelectIcons updateIcon={this.updateIcon} currentIcon={this.props.type === "new" ? "home" : this.props.idRoom.icon }/>
<SelectIcons updateIcon={this.updateIcon} currentIcon={this.state.selectedIcon}/>
</div> </div>
{this.props.type == "modify" ? {this.props.type === "modify" ?
<Button icon labelPosition='left' inverted color='red' onClick={this.deleteRoom}> <Button icon labelPosition='left' inverted color='red' onClick={this.deleteRoom}>
<Icon name='trash alternate' /> <Icon name='trash alternate' />
Delete room Delete room
@ -119,12 +115,12 @@ export default class ModalWindow extends Component {
</Modal.Content> </Modal.Content>
<Modal.Actions> <Modal.Actions>
<Button color='red' onClick={this.closeModal}> <Button color='red' onClick={this.closeModal}>
<Icon name='remove' /> {this.props.type == "new" ? "Cancel" : "Discard changes" } <Icon name='remove' /> {this.props.type === "new" ? "Cancel" : "Discard changes" }
</Button> </Button>
<Button color='green' onClick={this.props.type == "new" ? this.addRoomModal : this.modifyRoomModal}> <Button color='green' onClick={this.props.type === "new" ? this.addRoomModal : this.modifyRoomModal}>
<Icon name='checkmark' /> {this.props.type == "new" ? "Add room" : "Save changes"} <Icon name='checkmark' /> {this.props.type === "new" ? "Add room" : "Save changes"}
</Button> </Button>
</Modal.Actions> </Modal.Actions>

7
smart-hut/src/views/ConfirmForgotPassword.js
View file

@ -1,14 +1,7 @@
import React, { Component } from "react"; import React, { Component } from "react";
import { render } from "react-dom";
import HomeNavbar from "./../components/HomeNavbar"; import HomeNavbar from "./../components/HomeNavbar";
import { import {
Container,
Icon,
Image, Image,
Menu,
Sidebar,
Responsive,
Header,
Divider, Divider,
Message, Message,
Grid Grid

7
smart-hut/src/views/ConfirmRegistration.js
View file

@ -1,14 +1,7 @@
import React, { Component } from "react"; import React, { Component } from "react";
import { render } from "react-dom";
import HomeNavbar from "./../components/HomeNavbar"; import HomeNavbar from "./../components/HomeNavbar";
import { import {
Container,
Icon,
Image, Image,
Menu,
Sidebar,
Responsive,
Header,
Divider, Divider,
Message, Message,
Grid Grid

53
smart-hut/src/views/Dashboard.js
View file

@ -25,23 +25,29 @@ export default class Dashboard extends Component{
}; };
this.addRoom = this.addRoom.bind(this); this.addRoom = this.addRoom.bind(this);
this.deleteRoom = this.deleteRoom.bind(this);
this.addDevice = this.addDevice.bind(this);
this.handleItemClick = this.handleItemClick.bind(this); this.handleItemClick = this.handleItemClick.bind(this);
} }
componentDidMount() { componentDidMount() {
call.getAllRooms(this.props.tkn) call.getAllRooms(this.props.tkn)
.then(res => { .then(res => {
if (res.status === 200){
this.setState({ this.setState({
rooms: res.data rooms: res.data
}); });
}
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
call.getAllDevices(this.props.tkn) call.getAllDevices(this.props.tkn)
.then(res => { .then(res => {
if (res.status === 200) {
this.setState({ this.setState({
devices: res.data devices: res.data
}); });
}
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
@ -50,7 +56,6 @@ export default class Dashboard extends Component{
addRoom(data) { addRoom(data) {
call.createRoom(data) call.createRoom(data)
.then(res => { .then(res => {
console.log(res);
if (res.status === 200 && res.data) { if (res.status === 200 && res.data) {
this.setState(state => ({ this.setState(state => ({
rooms: state.rooms.concat([res.data]) rooms: state.rooms.concat([res.data])
@ -61,8 +66,11 @@ export default class Dashboard extends Component{
}); });
}; };
deleteRoom(id) { deleteRoom() {
call.deleteRoom(id) let data = {
id : this.state.activeItem
}
call.deleteRoom(data)
.then(res => { .then(res => {
//remove room in state.rooms //remove room in state.rooms
}).catch(err => { }).catch(err => {
@ -73,15 +81,48 @@ export default class Dashboard extends Component{
handleItemClick(id) { handleItemClick(id) {
// el -> obj of name and id // el -> obj of name and id
//da fare richiesta get della room e settare activeItem //da fare richiesta get della room e settare activeItem
call.getAllDevicesByRoom(id, this.props.tkn) this.setState({
activeItem: id
});
if ( id === -1) {
call.getAllDevices(this.props.tkn)
.then(res => { .then(res => {
if ( res.status === 200) {
this.setState({ this.setState({
devices: res.data devices: res.data
}); });
}
}).catch(err => {
console.log(err);
});
} else {
call.getAllDevicesByRoom(id, this.props.tkn)
.then(res => {
if (res.status === 200) {
console.log(res.data);
this.setState({
devices: res.data
});
}
}).catch(err => { }).catch(err => {
console.log(err); console.log(err);
}); });
} }
}
addDevice(data) {
data.params["roomId"] = this.state.activeItem;
call.devicePost(data, this.props.tkn)
.then(res => {
this.setState(state => ({
devices: state.devices.concat([res.data])
}));
return this.state.devices;
}).catch(err => {
});
}
render () { render () {
return( return(
@ -94,11 +135,11 @@ export default class Dashboard extends Component{
</Grid.Row> </Grid.Row>
<Grid.Row color='black'> <Grid.Row color='black'>
<Grid.Column width={3}> <Grid.Column width={3}>
<Navbar addRoom={this.addRoom} rooms={this.state.rooms} handleItemClick={this.handleItemClick}/> <Navbar addRoom={this.addRoom} deleteRoom={this.deleteRoom} rooms={this.state.rooms} handleItemClick={this.handleItemClick}/>
</Grid.Column> </Grid.Column>
<Grid.Column width={13}> <Grid.Column width={13}>
<DevicePanel devices={this.state.devices} /> <DevicePanel tkn={this.props.tkn} activeItem={this.state.activeItem} addDevice={this.addDevice} devices={this.state.devices} />
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
</Grid> </Grid>

8
smart-hut/src/views/Forgot-pass-reset.js
View file

@ -1,6 +1,7 @@
import React, {Component} from 'react'; import React, {Component} from 'react';
import {Button, Form, Grid, Header, Image, Icon, Message} from 'semantic-ui-react'; import {Button, Form, Grid, Header, Image, Icon, Message} from 'semantic-ui-react';
import { call } from '../client_server'; import { call } from '../client_server';
import { Redirect } from "react-router-dom";
export default class ChangePass extends Component { export default class ChangePass extends Component {
@ -13,6 +14,7 @@ export default class ChangePass extends Component {
message: "", message: "",
} }
} }
this.handleChangePassword = this.handleChangePassword.bind(this);
} }
onChangeHandler = (event) => { onChangeHandler = (event) => {
@ -32,14 +34,16 @@ export default class ChangePass extends Component {
handleChangePassword = (e) => { handleChangePassword = (e) => {
const params = { const params = {
"confirmationToken" : this.props.query.confirmationToken , "confirmationToken" : this.props.query.token ,
"password" : this.state.password "password" : this.state.password
} }
call.resetPassword(params) call.resetPassword(params)
.then(res => { .then(res => {
if (res.status === "Errore") { if (res.status !== 200){
this.setState({ error: { state: true, this.setState({ error: { state: true,
message: "Errore"}}); message: "Errore"}});
} else {
return <Redirect to="/" />
} }
// else set a message that an email has been sent // else set a message that an email has been sent
}).catch(err => { }).catch(err => {

17
smart-hut/src/views/Home.js
View file

@ -4,7 +4,6 @@ import HomeNavbar from './../components/HomeNavbar';
import { import {
Button, Button,
Container, Container,
Divider,
Grid, Grid,
Header, Header,
Icon, Icon,
@ -70,7 +69,6 @@ class DesktopContainer extends Component {
render() { render() {
const { children } = this.props const { children } = this.props
const { fixed } = this.state
return ( return (
<Responsive getWidth={getWidth} minWidth={Responsive.onlyTablet.minWidth}> <Responsive getWidth={getWidth} minWidth={Responsive.onlyTablet.minWidth}>
@ -197,11 +195,11 @@ const Home = () => (
In a few steps your home will be fully connected with SmartHut. In a few steps your home will be fully connected with SmartHut.
</p> </p>
<Header as='h3' style={{ fontSize: '2em' }}> <Header as='h3' style={{ fontSize: '2em' }}>
We Make Bananas That Can Dance Choose between a wide range of devices
</Header> </Header>
<p style={{ fontSize: '1.33em' }}> <p style={{ fontSize: '1.33em' }}>
Yes that's right, you thought it was the stuff of dreams, but even bananas can be SmartHut is a leading worldwide company in technology innovation.
bioengineered. Explore our website to find the best devices for each room of your home!
</p> </p>
</Grid.Column> </Grid.Column>
<Grid.Column floated='right' width={6}> <Grid.Column floated='right' width={6}>
@ -219,12 +217,13 @@ const Home = () => (
<Segment style={{ padding: '8em 0em' }} vertical> <Segment style={{ padding: '8em 0em' }} vertical>
<Container text> <Container text>
<Header as='h3' style={{ fontSize: '2em' }}> <Header as='h3' style={{ fontSize: '2em' }}>
Breaking The Grid, Grabs Your Attention Have you ever dreamt about a smart home?
</Header> </Header>
<p style={{ fontSize: '1.33em' }}> <p style={{ fontSize: '1.33em' }}>
Instead of focusing on content creation and hard work, we have learned how to master the Let us carrying you into the future. With SmartHut, being at home
art of doing nothing by providing massive amounts of whitespace and generic content that will be a refreshing experience. With just a few clicks, you will be
can seem massive, monolithic and worth your attention. able the set the illumination of your entire place.
Follow the intelligent light, follow SmartHut.
</p> </p>
<Button as='a' size='large'> <Button as='a' size='large'>
Read More Read More

116
smart-hut/src/views/Instruction.js Normal file
View file

@ -0,0 +1,116 @@
import React, { Component } from "react";
import { render } from "react-dom";
import HomeNavbar from "./../components/HomeNavbar";
import {
Container,
Icon,
Image,
Menu,
Sidebar,
Responsive,
Header,
Divider,
Message,
Grid
} from "semantic-ui-react";
const ContainerExampleAlignment = () => (
<div>
<HomeNavbar />
<Container textAlign='justified'>
<Header as="h1"> Instructions Page </Header>
<Grid>
<Grid.Row height={15}></Grid.Row>
</Grid>
</Container>
<Container textAlign='justified'>
<b>First Step</b>
<Divider />
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa
quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget,
arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras
dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend
tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac,
enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.
Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean
imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper
ultricies nisi.
</p>
<Divider />
</Container>
<Container textAlign='justified'>
<b>Second Step</b>
<Divider />
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa
quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget,
arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras
dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend
tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac,
enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.
Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean
imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper
ultricies nisi.
</p>
<Divider />
</Container>
<Container textAlign='justified'>
<b>Third Step</b>
<Divider />
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa
quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget,
arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras
dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend
tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac,
enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.
Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean
imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper
ultricies nisi.
</p>
<Divider />
</Container>
<Container textAlign='justified'>
<b>Last Step</b>
<Divider />
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo
ligula eget dolor. Aenean massa strong. Cum sociis natoque penatibus et
magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis,
ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa
quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget,
arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo.
Nullam dictum felis eu pede link mollis pretium. Integer tincidunt. Cras
dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend
tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac,
enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus.
Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean
imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper
ultricies nisi.
</p>
<Divider />
</Container>
</div>
)
export default class Insturction extends Component{
render() {
return(
<ContainerExampleAlignment />
)
}
}

17
smart-hut/src/views/Navbar.js
View file

@ -18,8 +18,16 @@ class Navbar extends Component {
handleClick = (e, {id, name}) => { handleClick = (e, {id, name}) => {
console.log(id); console.log(id);
this.setState({ activeItem: id, let obj = undefined;
activeItemName: name this.props.rooms.forEach((e) => {
if (e.id === id) {
obj = e;
}
});
this.setState({
activeItem: id,
activeItemName: name,
activeRoom: obj
}); });
this.props.handleItemClick(id) this.props.handleItemClick(id)
} }
@ -38,6 +46,7 @@ class Navbar extends Component {
<Menu inverted fluid vertical> <Menu inverted fluid vertical>
<Menu.Item <Menu.Item
key={-1} key={-1}
id={-1}
name='Home' name='Home'
active={this.state.activeItem === 'Home'} active={this.state.activeItem === 'Home'}
onClick={this.handleClick} onClick={this.handleClick}
@ -104,7 +113,6 @@ class Navbar extends Component {
</Responsive> </Responsive>
<Responsive as={Segment} maxWidth={768}> <Responsive as={Segment} maxWidth={768}>
<Menu inverted> <Menu inverted>
<Dropdown item fluid text={this.state.activeItemName}> <Dropdown item fluid text={this.state.activeItemName}>
<Dropdown.Menu> <Dropdown.Menu>
@ -171,10 +179,7 @@ class Navbar extends Component {
</Grid.Column> </Grid.Column>
</Grid.Row> </Grid.Row>
</Grid> </Grid>
</Responsive> </Responsive>
</Segment.Group> </Segment.Group>
</div> </div>
); );

12
smart-hut/src/views/NavbarTest.js
View file

@ -1,12 +0,0 @@
import React, {Component} from 'react';
import {Button } from 'semantic-ui-react';
export default class NavbarTest extends Component {
render() {
return (
<h1>Ciao</h1>
)
}
}

11
smart-hut/src/views/TestHeaderController.js
View file

@ -1,15 +1,6 @@
import _ from "lodash"; import _ from "lodash";
import React, { Component } from "react"; import React from "react";
import HeaderController from "./../components/HeaderController"; import HeaderController from "./../components/HeaderController";
import { render } from "react-dom";
import {
Container,
Icon,
Image,
Menu,
Sidebar,
Responsive
} from "semantic-ui-react";
export default class TestHeaderController extends React.Component { export default class TestHeaderController extends React.Component {
render () { render () {

220
smart-hut/yarn.lock
View file

@ -49,7 +49,17 @@
lodash "^4.17.13" lodash "^4.17.13"
source-map "^0.5.0" source-map "^0.5.0"
"@babel/helper-annotate-as-pure@^7.8.3": "@babel/generator@^7.8.6":
version "7.8.8"
resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.8.8.tgz#cdcd58caab730834cee9eeadb729e833b625da3e"
integrity sha512-HKyUVu69cZoclptr8t8U5b6sx6zoWjh8jiUhnuj3MpZuKT2dJ8zPTuiy31luq32swhI0SpwItCIlU8XW7BZeJg==
dependencies:
"@babel/types" "^7.8.7"
jsesc "^2.5.1"
lodash "^4.17.13"
source-map "^0.5.0"
"@babel/helper-annotate-as-pure@^7.0.0", "@babel/helper-annotate-as-pure@^7.8.3":
version "7.8.3" version "7.8.3"
resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.8.3.tgz#60bc0bc657f63a0924ff9a4b4a0b24a13cf4deee" resolved "https://registry.yarnpkg.com/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.8.3.tgz#60bc0bc657f63a0924ff9a4b4a0b24a13cf4deee"
integrity sha512-6o+mJrZBxOoEX77Ezv9zwW7WV8DdluouRKNY/IR5u/YTMuKHgugHOzYWlYvYLpLA9nPsQCAAASpCIbjI9Mv+Uw== integrity sha512-6o+mJrZBxOoEX77Ezv9zwW7WV8DdluouRKNY/IR5u/YTMuKHgugHOzYWlYvYLpLA9nPsQCAAASpCIbjI9Mv+Uw==
@ -159,7 +169,7 @@
dependencies: dependencies:
"@babel/types" "^7.8.3" "@babel/types" "^7.8.3"
"@babel/helper-module-imports@^7.8.3": "@babel/helper-module-imports@^7.0.0", "@babel/helper-module-imports@^7.8.3":
version "7.8.3" version "7.8.3"
resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.8.3.tgz#7fe39589b39c016331b6b8c3f441e8f0b1419498" resolved "https://registry.yarnpkg.com/@babel/helper-module-imports/-/helper-module-imports-7.8.3.tgz#7fe39589b39c016331b6b8c3f441e8f0b1419498"
integrity sha512-R0Bx3jippsbAEtzkpZ/6FIiuzOURPcMjHp+Z6xPe6DtApDJx+w7UYyOLanZqO8+wKR9G10s/FmHXvxaMd9s6Kg== integrity sha512-R0Bx3jippsbAEtzkpZ/6FIiuzOURPcMjHp+Z6xPe6DtApDJx+w7UYyOLanZqO8+wKR9G10s/FmHXvxaMd9s6Kg==
@ -266,6 +276,11 @@
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.8.4.tgz#d1dbe64691d60358a974295fa53da074dd2ce8e8" resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.8.4.tgz#d1dbe64691d60358a974295fa53da074dd2ce8e8"
integrity sha512-0fKu/QqildpXmPVaRBoXOlyBb3MC+J0A66x97qEfLOMkn3u6nfY5esWogQwi/K0BjASYy4DbnsEWnpNL6qT5Mw== integrity sha512-0fKu/QqildpXmPVaRBoXOlyBb3MC+J0A66x97qEfLOMkn3u6nfY5esWogQwi/K0BjASYy4DbnsEWnpNL6qT5Mw==
"@babel/parser@^7.8.6":
version "7.8.8"
resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.8.8.tgz#4c3b7ce36db37e0629be1f0d50a571d2f86f6cd4"
integrity sha512-mO5GWzBPsPf6865iIbzNE0AvkKF3NE+2S3eRUpE+FE07BOAkXh6G+GW/Pj01hhXjve1WScbaIO4UlY1JKeqCcA==
"@babel/plugin-proposal-async-generator-functions@^7.8.3": "@babel/plugin-proposal-async-generator-functions@^7.8.3":
version "7.8.3" version "7.8.3"
resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.8.3.tgz#bad329c670b382589721b27540c7d288601c6e6f" resolved "https://registry.yarnpkg.com/@babel/plugin-proposal-async-generator-functions/-/plugin-proposal-async-generator-functions-7.8.3.tgz#bad329c670b382589721b27540c7d288601c6e6f"
@ -880,6 +895,21 @@
globals "^11.1.0" globals "^11.1.0"
lodash "^4.17.13" lodash "^4.17.13"
"@babel/traverse@^7.4.5":
version "7.8.6"
resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.8.6.tgz#acfe0c64e1cd991b3e32eae813a6eb564954b5ff"
integrity sha512-2B8l0db/DPi8iinITKuo7cbPznLCEk0kCxDoB9/N6gGNg/gxOXiR/IcymAFPiBwk5w6TtQ27w4wpElgp9btR9A==
dependencies:
"@babel/code-frame" "^7.8.3"
"@babel/generator" "^7.8.6"
"@babel/helper-function-name" "^7.8.3"
"@babel/helper-split-export-declaration" "^7.8.3"
"@babel/parser" "^7.8.6"
"@babel/types" "^7.8.6"
debug "^4.1.0"
globals "^11.1.0"
lodash "^4.17.13"
"@babel/types@^7.0.0", "@babel/types@^7.3.0", "@babel/types@^7.4.0", "@babel/types@^7.4.4", "@babel/types@^7.8.3": "@babel/types@^7.0.0", "@babel/types@^7.3.0", "@babel/types@^7.4.0", "@babel/types@^7.4.4", "@babel/types@^7.8.3":
version "7.8.3" version "7.8.3"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.8.3.tgz#5a383dffa5416db1b73dedffd311ffd0788fb31c" resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.8.3.tgz#5a383dffa5416db1b73dedffd311ffd0788fb31c"
@ -889,6 +919,15 @@
lodash "^4.17.13" lodash "^4.17.13"
to-fast-properties "^2.0.0" to-fast-properties "^2.0.0"
"@babel/types@^7.8.6", "@babel/types@^7.8.7":
version "7.8.7"
resolved "https://registry.yarnpkg.com/@babel/types/-/types-7.8.7.tgz#1fc9729e1acbb2337d5b6977a63979b4819f5d1d"
integrity sha512-k2TreEHxFA4CjGkL+GYjRyx35W0Mr7DP5+9q6WMkyKXB+904bYmG40syjMFV0oLlhhFCwWl0vA0DyzTDkwAiJw==
dependencies:
esutils "^2.0.2"
lodash "^4.17.13"
to-fast-properties "^2.0.0"
"@cnakazawa/watch@^1.0.3": "@cnakazawa/watch@^1.0.3":
version "1.0.3" version "1.0.3"
resolved "https://registry.yarnpkg.com/@cnakazawa/watch/-/watch-1.0.3.tgz#099139eaec7ebf07a27c1786a3ff64f39464d2ef" resolved "https://registry.yarnpkg.com/@cnakazawa/watch/-/watch-1.0.3.tgz#099139eaec7ebf07a27c1786a3ff64f39464d2ef"
@ -912,6 +951,28 @@
resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.7.4.tgz#f14932887422c9056b15a8d222a9074a7dfa2831" resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.7.4.tgz#f14932887422c9056b15a8d222a9074a7dfa2831"
integrity sha512-fxfMSBMX3tlIbKUdtGKxqB1fyrH6gVrX39Gsv3y8lRYKUqlgDt3UMqQyGnR1bQMa2B8aGnhLZokZgg8vT0Le+A== integrity sha512-fxfMSBMX3tlIbKUdtGKxqB1fyrH6gVrX39Gsv3y8lRYKUqlgDt3UMqQyGnR1bQMa2B8aGnhLZokZgg8vT0Le+A==
"@emotion/is-prop-valid@^0.8.3":
version "0.8.8"
resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-0.8.8.tgz#db28b1c4368a259b60a97311d6a952d4fd01ac1a"
integrity sha512-u5WtneEAr5IDG2Wv65yhunPSMLIpuKsbuOktRojfrEiEvRyC85LgPMZI63cr7NUqT8ZIGdSVg8ZKGxIug4lXcA==
dependencies:
"@emotion/memoize" "0.7.4"
"@emotion/memoize@0.7.4":
version "0.7.4"
resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
"@emotion/stylis@^0.8.4":
version "0.8.5"
resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
"@emotion/unitless@^0.7.4":
version "0.7.5"
resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
"@hapi/address@2.x.x": "@hapi/address@2.x.x":
version "2.1.4" version "2.1.4"
resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5" resolved "https://registry.yarnpkg.com/@hapi/address/-/address-2.1.4.tgz#5d67ed43f3fd41a69d4b9ff7b56e7c0d1d0a81e5"
@ -1963,7 +2024,7 @@ arrify@^1.0.1:
resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d" resolved "https://registry.yarnpkg.com/arrify/-/arrify-1.0.1.tgz#898508da2226f380df904728456849c1501a4b0d"
integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0= integrity sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=
asap@~2.0.6: asap@~2.0.3, asap@~2.0.6:
version "2.0.6" version "2.0.6"
resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46" resolved "https://registry.yarnpkg.com/asap/-/asap-2.0.6.tgz#e50347611d7e690943208bbdafebcbc2fb866d46"
integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY= integrity sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=
@ -2173,6 +2234,21 @@ babel-plugin-named-asset-import@^0.3.6:
resolved "https://registry.yarnpkg.com/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.6.tgz#c9750a1b38d85112c9e166bf3ef7c5dbc605f4be" resolved "https://registry.yarnpkg.com/babel-plugin-named-asset-import/-/babel-plugin-named-asset-import-0.3.6.tgz#c9750a1b38d85112c9e166bf3ef7c5dbc605f4be"
integrity sha512-1aGDUfL1qOOIoqk9QKGIo2lANk+C7ko/fqH0uIyC71x3PEGz0uVP8ISgfEsFuG+FKmjHTvFK/nNM8dowpmUxLA== integrity sha512-1aGDUfL1qOOIoqk9QKGIo2lANk+C7ko/fqH0uIyC71x3PEGz0uVP8ISgfEsFuG+FKmjHTvFK/nNM8dowpmUxLA==
"babel-plugin-styled-components@>= 1":
version "1.10.7"
resolved "https://registry.yarnpkg.com/babel-plugin-styled-components/-/babel-plugin-styled-components-1.10.7.tgz#3494e77914e9989b33cc2d7b3b29527a949d635c"
integrity sha512-MBMHGcIA22996n9hZRf/UJLVVgkEOITuR2SvjHLb5dSTUyR4ZRGn+ngITapes36FI3WLxZHfRhkA1ffHxihOrg==
dependencies:
"@babel/helper-annotate-as-pure" "^7.0.0"
"@babel/helper-module-imports" "^7.0.0"
babel-plugin-syntax-jsx "^6.18.0"
lodash "^4.17.11"
babel-plugin-syntax-jsx@^6.18.0:
version "6.18.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-jsx/-/babel-plugin-syntax-jsx-6.18.0.tgz#0af32a9a6e13ca7a3fd5069e62d7b0f58d0d8946"
integrity sha1-CvMqmm4Tyno/1QaeYtew9Y0NiUY=
babel-plugin-syntax-object-rest-spread@^6.8.0: babel-plugin-syntax-object-rest-spread@^6.8.0:
version "6.13.0" version "6.13.0"
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5" resolved "https://registry.yarnpkg.com/babel-plugin-syntax-object-rest-spread/-/babel-plugin-syntax-object-rest-spread-6.13.0.tgz#fd6536f2bce13836ffa3a5458c4903a597bb3bf5"
@ -2600,6 +2676,11 @@ camelcase@5.3.1, camelcase@^5.0.0, camelcase@^5.3.1:
resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320" resolved "https://registry.yarnpkg.com/camelcase/-/camelcase-5.3.1.tgz#e3c9b31569e106811df242f715725a1f4c494320"
integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg== integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
camelize@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/camelize/-/camelize-1.0.0.tgz#164a5483e630fa4321e5af07020e531831b2609b"
integrity sha1-FkpUg+Yw+kMh5a8HAg5TGDGyYJs=
caniuse-api@^3.0.0: caniuse-api@^3.0.0:
version "3.0.0" version "3.0.0"
resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0" resolved "https://registry.yarnpkg.com/caniuse-api/-/caniuse-api-3.0.0.tgz#5e4d90e2274961d46291997df599e3ed008ee4c0"
@ -3021,6 +3102,11 @@ core-js-pure@^3.0.0:
resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.6.4.tgz#4bf1ba866e25814f149d4e9aaa08c36173506e3a" resolved "https://registry.yarnpkg.com/core-js-pure/-/core-js-pure-3.6.4.tgz#4bf1ba866e25814f149d4e9aaa08c36173506e3a"
integrity sha512-epIhRLkXdgv32xIUFaaAry2wdxZYBi6bgM7cB136dzzXXa+dFyRLTZeLUJxnd8ShrmyVXBub63n2NHo2JAt8Cw== integrity sha512-epIhRLkXdgv32xIUFaaAry2wdxZYBi6bgM7cB136dzzXXa+dFyRLTZeLUJxnd8ShrmyVXBub63n2NHo2JAt8Cw==
core-js@^1.0.0:
version "1.2.7"
resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
integrity sha1-ZSKUwUZR2yj6k70tX/KYOk8IxjY=
core-js@^2.4.0: core-js@^2.4.0:
version "2.6.11" version "2.6.11"
resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c" resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.6.11.tgz#38831469f9922bded8ee21c9dc46985e0399308c"
@ -3140,6 +3226,11 @@ css-blank-pseudo@^0.1.4:
dependencies: dependencies:
postcss "^7.0.5" postcss "^7.0.5"
css-color-keywords@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/css-color-keywords/-/css-color-keywords-1.0.0.tgz#fea2616dc676b2962686b3af8dbdbe180b244e05"
integrity sha1-/qJhbcZ2spYmhrOvjb2+GAskTgU=
css-color-names@0.0.4, css-color-names@^0.0.4: css-color-names@0.0.4, css-color-names@^0.0.4:
version "0.0.4" version "0.0.4"
resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0" resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.4.tgz#808adc2e79cf84738069b646cb20ec27beb629e0"
@ -3211,6 +3302,15 @@ css-select@^2.0.0:
domutils "^1.7.0" domutils "^1.7.0"
nth-check "^1.0.2" nth-check "^1.0.2"
css-to-react-native@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/css-to-react-native/-/css-to-react-native-3.0.0.tgz#62dbe678072a824a689bcfee011fc96e02a7d756"
integrity sha512-Ro1yETZA813eoyUp2GDBhG2j+YggidUmzO1/v9eYBKR2EHVEniE2MI/NqpTQ954BMpTPZFsGNPm46qFB9dpaPQ==
dependencies:
camelize "^1.0.0"
css-color-keywords "^1.0.0"
postcss-value-parser "^4.0.2"
css-tree@1.0.0-alpha.37: css-tree@1.0.0-alpha.37:
version "1.0.0-alpha.37" version "1.0.0-alpha.37"
resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.37.tgz#98bebd62c4c1d9f960ec340cf9f7522e30709a22" resolved "https://registry.yarnpkg.com/css-tree/-/css-tree-1.0.0-alpha.37.tgz#98bebd62c4c1d9f960ec340cf9f7522e30709a22"
@ -3759,6 +3859,13 @@ encodeurl@~1.0.2:
resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59" resolved "https://registry.yarnpkg.com/encodeurl/-/encodeurl-1.0.2.tgz#ad3ff4c86ec2d029322f5a02c3a9a606c95b3f59"
integrity sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k= integrity sha1-rT/0yG7C0CkyL1oCw6mmBslbP1k=
encoding@^0.1.11:
version "0.1.12"
resolved "https://registry.yarnpkg.com/encoding/-/encoding-0.1.12.tgz#538b66f3ee62cd1ab51ec323829d1f9480c74beb"
integrity sha1-U4tm8+5izRq1HsMjgp0flIDHS+s=
dependencies:
iconv-lite "~0.4.13"
end-of-stream@^1.0.0, end-of-stream@^1.1.0: end-of-stream@^1.0.0, end-of-stream@^1.1.0:
version "1.4.4" version "1.4.4"
resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0" resolved "https://registry.yarnpkg.com/end-of-stream/-/end-of-stream-1.4.4.tgz#5ae64a5f45057baf3626ec14da0ca5e4b2431eb0"
@ -4308,6 +4415,19 @@ fb-watchman@^2.0.0:
dependencies: dependencies:
bser "2.1.1" bser "2.1.1"
fbjs@^0.8.16:
version "0.8.17"
resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.17.tgz#c4d598ead6949112653d6588b01a5cdcd9f90fdd"
integrity sha1-xNWY6taUkRJlPWWIsBpc3Nn5D90=
dependencies:
core-js "^1.0.0"
isomorphic-fetch "^2.1.1"
loose-envify "^1.0.0"
object-assign "^4.1.0"
promise "^7.1.1"
setimmediate "^1.0.5"
ua-parser-js "^0.7.18"
figgy-pudding@^3.5.1: figgy-pudding@^3.5.1:
version "3.5.1" version "3.5.1"
resolved "https://registry.yarnpkg.com/figgy-pudding/-/figgy-pudding-3.5.1.tgz#862470112901c727a0e495a80744bd5baa1d6790" resolved "https://registry.yarnpkg.com/figgy-pudding/-/figgy-pudding-3.5.1.tgz#862470112901c727a0e495a80744bd5baa1d6790"
@ -4891,7 +5011,7 @@ hmac-drbg@^1.0.0:
minimalistic-assert "^1.0.0" minimalistic-assert "^1.0.0"
minimalistic-crypto-utils "^1.0.1" minimalistic-crypto-utils "^1.0.1"
hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.2.1, hoist-non-react-statics@^3.3.2: hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.1.0, hoist-non-react-statics@^3.2.1, hoist-non-react-statics@^3.3.2:
version "3.3.2" version "3.3.2"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45" resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw== integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@ -5062,7 +5182,7 @@ hyphenate-style-name@^1.0.3:
resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz#097bb7fa0b8f1a9cf0bd5c734cf95899981a9b48" resolved "https://registry.yarnpkg.com/hyphenate-style-name/-/hyphenate-style-name-1.0.3.tgz#097bb7fa0b8f1a9cf0bd5c734cf95899981a9b48"
integrity sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ== integrity sha512-EcuixamT82oplpoJ2XU4pDtKGWQ7b00CD9f1ug9IaQ3p1bkHMiKCZ9ut9QDI6qsa6cpUuB+A/I+zLtdNK4n2DQ==
iconv-lite@0.4.24, iconv-lite@^0.4.24: iconv-lite@0.4.24, iconv-lite@^0.4.24, iconv-lite@~0.4.13:
version "0.4.24" version "0.4.24"
resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b" resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA== integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
@ -5515,7 +5635,7 @@ is-root@2.1.0:
resolved "https://registry.yarnpkg.com/is-root/-/is-root-2.1.0.tgz#809e18129cf1129644302a4f8544035d51984a9c" resolved "https://registry.yarnpkg.com/is-root/-/is-root-2.1.0.tgz#809e18129cf1129644302a4f8544035d51984a9c"
integrity sha512-AGOriNp96vNBd3HtU+RzFEc75FfR5ymiYv8E553I71SCeXBiMsVDUtdio1OEFvrPyLIQ9tVR5RxXIFe5PUFjMg== integrity sha512-AGOriNp96vNBd3HtU+RzFEc75FfR5ymiYv8E553I71SCeXBiMsVDUtdio1OEFvrPyLIQ9tVR5RxXIFe5PUFjMg==
is-stream@^1.1.0: is-stream@^1.0.1, is-stream@^1.1.0:
version "1.1.0" version "1.1.0"
resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44" resolved "https://registry.yarnpkg.com/is-stream/-/is-stream-1.1.0.tgz#12d4a3dd4e68e0b79ceb8dbc84173ae80d91ca44"
integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ= integrity sha1-EtSj3U5o4Lec6428hBc66A2RykQ=
@ -5586,6 +5706,14 @@ isobject@^3.0.0, isobject@^3.0.1:
resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df" resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df"
integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8= integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8=
isomorphic-fetch@^2.1.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-2.2.1.tgz#611ae1acf14f5e81f729507472819fe9733558a9"
integrity sha1-YRrhrPFPXoH3KVB0coGf6XM1WKk=
dependencies:
node-fetch "^1.0.1"
whatwg-fetch ">=0.10.0"
isstream@~0.1.2: isstream@~0.1.2:
version "0.1.2" version "0.1.2"
resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a" resolved "https://registry.yarnpkg.com/isstream/-/isstream-0.1.2.tgz#47e63f7af55afa6f92e1500e690eb8b8529c099a"
@ -6902,6 +7030,14 @@ no-case@^2.2.0:
dependencies: dependencies:
lower-case "^1.1.1" lower-case "^1.1.1"
node-fetch@^1.0.1:
version "1.7.3"
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-1.7.3.tgz#980f6f72d85211a5347c6b2bc18c5b84c3eb47ef"
integrity sha512-NhZ4CsKx7cYm2vSrBAr2PvFOe6sWDf0UYLRqA6svUYg7+/TSfVAu49jYC4BvQ4Sms9SZgdqGBgroqfDhJdTyKQ==
dependencies:
encoding "^0.1.11"
is-stream "^1.0.1"
node-forge@0.9.0: node-forge@0.9.0:
version "0.9.0" version "0.9.0"
resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.9.0.tgz#d624050edbb44874adca12bb9a52ec63cb782579" resolved "https://registry.yarnpkg.com/node-forge/-/node-forge-0.9.0.tgz#d624050edbb44874adca12bb9a52ec63cb782579"
@ -8333,6 +8469,13 @@ promise-inflight@^1.0.1:
resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3" resolved "https://registry.yarnpkg.com/promise-inflight/-/promise-inflight-1.0.1.tgz#98472870bf228132fcbdd868129bad12c3c029e3"
integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM= integrity sha1-mEcocL8igTL8vdhoEputEsPAKeM=
promise@^7.1.1:
version "7.3.1"
resolved "https://registry.yarnpkg.com/promise/-/promise-7.3.1.tgz#064b72602b18f90f29192b8b1bc418ffd1ebd3bf"
integrity sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==
dependencies:
asap "~2.0.3"
promise@^8.0.3: promise@^8.0.3:
version "8.0.3" version "8.0.3"
resolved "https://registry.yarnpkg.com/promise/-/promise-8.0.3.tgz#f592e099c6cddc000d538ee7283bb190452b0bf6" resolved "https://registry.yarnpkg.com/promise/-/promise-8.0.3.tgz#f592e099c6cddc000d538ee7283bb190452b0bf6"
@ -8348,7 +8491,15 @@ prompts@^2.0.1:
kleur "^3.0.3" kleur "^3.0.3"
sisteransi "^1.0.3" sisteransi "^1.0.3"
prop-types@^15.5.8, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2: prop-types@15.6.2:
version "15.6.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.6.2.tgz#05d5ca77b4453e985d60fc7ff8c859094a497102"
integrity sha512-3pboPvLiWD7dkI3qf3KbUe6hKFKa52w+AE0VCqECtf+QHAKgOL37tTaNCnuX1nAAQ4ZhyP+kYVKf8rLmJ/feDQ==
dependencies:
loose-envify "^1.3.1"
object-assign "^4.1.1"
prop-types@^15.5.8, prop-types@^15.6.0, prop-types@^15.6.1, prop-types@^15.6.2, prop-types@^15.7.2:
version "15.7.2" version "15.7.2"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5"
integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ==
@ -8519,6 +8670,16 @@ react-axios@^2.0.3:
resolved "https://registry.yarnpkg.com/react-axios/-/react-axios-2.0.3.tgz#9aeb75a2db07cebaf0ff710f666a2932ce024af5" resolved "https://registry.yarnpkg.com/react-axios/-/react-axios-2.0.3.tgz#9aeb75a2db07cebaf0ff710f666a2932ce024af5"
integrity sha512-63kY2iupdRgbvPq9G8xmM0NWUnt2Q5YmpotMoLQsxKOzKXKZg2Lo6CzF/bcZvtmv3WnfjBU6Bg8nZQO28eIAZw== integrity sha512-63kY2iupdRgbvPq9G8xmM0NWUnt2Q5YmpotMoLQsxKOzKXKZg2Lo6CzF/bcZvtmv3WnfjBU6Bg8nZQO28eIAZw==
react-circular-input@^0.1.6:
version "0.1.7"
resolved "https://registry.yarnpkg.com/react-circular-input/-/react-circular-input-0.1.7.tgz#dcaae9176f1689b80ca23a52f740028a01ca633f"
integrity sha512-hlNMepjGhyWucsx3gOHMX9YVwN23dRqskap+7GkKzgrUrAqWZeNtriNetrHngSZ+c4OQe0JxHf8sgqgsxO61Vw==
react-circular-slider-svg@^0.1.5:
version "0.1.5"
resolved "https://registry.yarnpkg.com/react-circular-slider-svg/-/react-circular-slider-svg-0.1.5.tgz#bbca4fb04b47e22ada8b4bc39d83f16196d96256"
integrity sha512-ZXSlwKHExjb950+84gydH5wxX1CnND1v4w1DywOHcOgzD48Wmjr+nME4JeOumNJ9QOXhm1HROhSEDMlTFIAGqw==
react-dev-utils@^10.2.0: react-dev-utils@^10.2.0:
version "10.2.0" version "10.2.0"
resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-10.2.0.tgz#b11cc48aa2be2502fb3c27a50d1dfa95cfa9dfe0" resolved "https://registry.yarnpkg.com/react-dev-utils/-/react-dev-utils-10.2.0.tgz#b11cc48aa2be2502fb3c27a50d1dfa95cfa9dfe0"
@ -8587,6 +8748,14 @@ react-popper@^1.3.4:
typed-styles "^0.0.7" typed-styles "^0.0.7"
warning "^4.0.2" warning "^4.0.2"
react-round-slider@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/react-round-slider/-/react-round-slider-1.0.1.tgz#2f6f14f4e7ce622cc7e450911a163b5841b3fd88"
integrity sha512-Z26omllRvX/8IyDW/0MUklamitqUzCpnWHl9op425inmYYN7A1TarQci6PElYfnakHAi42I5LBvyMqLBe/uvvA==
dependencies:
prop-types "15.6.2"
react "16.4.2"
react-router-dom@^5.1.2: react-router-dom@^5.1.2:
version "5.1.2" version "5.1.2"
resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.1.2.tgz#06701b834352f44d37fbb6311f870f84c76b9c18" resolved "https://registry.yarnpkg.com/react-router-dom/-/react-router-dom-5.1.2.tgz#06701b834352f44d37fbb6311f870f84c76b9c18"
@ -8686,6 +8855,16 @@ react-transition-group@^4.3.0:
loose-envify "^1.4.0" loose-envify "^1.4.0"
prop-types "^15.6.2" prop-types "^15.6.2"
react@16.4.2:
version "16.4.2"
resolved "https://registry.yarnpkg.com/react/-/react-16.4.2.tgz#2cd90154e3a9d9dd8da2991149fdca3c260e129f"
integrity sha512-dMv7YrbxO4y2aqnvA7f/ik9ibeLSHQJTI6TrYAenPSaQ6OXfb+Oti+oJiy8WBxgRzlKatYqtCjphTgDSCEiWFg==
dependencies:
fbjs "^0.8.16"
loose-envify "^1.1.0"
object-assign "^4.1.1"
prop-types "^15.6.0"
react@^16.12.0: react@^16.12.0:
version "16.12.0" version "16.12.0"
resolved "https://registry.yarnpkg.com/react/-/react-16.12.0.tgz#0c0a9c6a142429e3614834d5a778e18aa78a0b83" resolved "https://registry.yarnpkg.com/react/-/react-16.12.0.tgz#0c0a9c6a142429e3614834d5a778e18aa78a0b83"
@ -9306,7 +9485,7 @@ set-value@^2.0.0, set-value@^2.0.1:
is-plain-object "^2.0.3" is-plain-object "^2.0.3"
split-string "^3.0.1" split-string "^3.0.1"
setimmediate@^1.0.4: setimmediate@^1.0.4, setimmediate@^1.0.5:
version "1.0.5" version "1.0.5"
resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285" resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU= integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=
@ -9834,6 +10013,22 @@ style-loader@0.23.1:
loader-utils "^1.1.0" loader-utils "^1.1.0"
schema-utils "^1.0.0" schema-utils "^1.0.0"
styled-components@^5.0.1:
version "5.0.1"
resolved "https://registry.yarnpkg.com/styled-components/-/styled-components-5.0.1.tgz#57782a6471031abefb2db5820a1876ae853bc619"
integrity sha512-E0xKTRIjTs4DyvC1MHu/EcCXIj6+ENCP8hP01koyoADF++WdBUOrSGwU1scJRw7/YaYOhDvvoad6VlMG+0j53A==
dependencies:
"@babel/helper-module-imports" "^7.0.0"
"@babel/traverse" "^7.4.5"
"@emotion/is-prop-valid" "^0.8.3"
"@emotion/stylis" "^0.8.4"
"@emotion/unitless" "^0.7.4"
babel-plugin-styled-components ">= 1"
css-to-react-native "^3.0.0"
hoist-non-react-statics "^3.0.0"
shallowequal "^1.1.0"
supports-color "^5.5.0"
stylehacks@^4.0.0: stylehacks@^4.0.0:
version "4.0.3" version "4.0.3"
resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-4.0.3.tgz#6718fcaf4d1e07d8a1318690881e8d96726a71d5" resolved "https://registry.yarnpkg.com/stylehacks/-/stylehacks-4.0.3.tgz#6718fcaf4d1e07d8a1318690881e8d96726a71d5"
@ -9848,7 +10043,7 @@ supports-color@^2.0.0:
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc= integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=
supports-color@^5.3.0: supports-color@^5.3.0, supports-color@^5.5.0:
version "5.5.0" version "5.5.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f" resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow== integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
@ -10168,6 +10363,11 @@ typedarray@^0.0.6:
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777" resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c= integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
ua-parser-js@^0.7.18:
version "0.7.21"
resolved "https://registry.yarnpkg.com/ua-parser-js/-/ua-parser-js-0.7.21.tgz#853cf9ce93f642f67174273cc34565ae6f308777"
integrity sha512-+O8/qh/Qj8CgC6eYBVBykMrNtp5Gebn4dlGD/kKXVkJNDwyrAwSIqwz8CDf+tsAIWVycKcku6gIXJ0qwx/ZXaQ==
unicode-canonical-property-names-ecmascript@^1.0.4: unicode-canonical-property-names-ecmascript@^1.0.4:
version "1.0.4" version "1.0.4"
resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818" resolved "https://registry.yarnpkg.com/unicode-canonical-property-names-ecmascript/-/unicode-canonical-property-names-ecmascript-1.0.4.tgz#2619800c4c825800efdd8343af7dd9933cbe2818"
@ -10576,7 +10776,7 @@ whatwg-encoding@^1.0.1, whatwg-encoding@^1.0.3, whatwg-encoding@^1.0.5:
dependencies: dependencies:
iconv-lite "0.4.24" iconv-lite "0.4.24"
whatwg-fetch@^3.0.0: whatwg-fetch@>=0.10.0, whatwg-fetch@^3.0.0:
version "3.0.0" version "3.0.0"
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb" resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
integrity sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q== integrity sha512-9GSJUgz1D4MfyKU7KRqwOjXCXTqWdFNvEr7eUBYchQiVc744mqK/MzXPNR2WsPkmkOa4ywfg8C2n8h+13Bey1Q==