hart-estate-widget 0.0.58 → 0.0.61

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/README.md +3 -0
  2. package/build/assets/css/app.css +1 -1
  3. package/build/assets/css/app.css.map +1 -1
  4. package/build/assets/sass/components/instructions.sass +8 -0
  5. package/build/assets/sass/components/panorama.sass +51 -20
  6. package/build/assets/sass/components/tabs.sass +65 -30
  7. package/build/assets/sass/index.sass +29 -38
  8. package/build/assets/sass/vars.sass +5 -0
  9. package/build/components/Application.js +2 -1
  10. package/build/components/PanoramaTab.js +84 -43
  11. package/build/components/RotationTab.js +41 -25
  12. package/build/config/defaultConfig.js +1 -1
  13. package/build/locale/{en_US → en}/data.json +1 -0
  14. package/build/locale/index.js +6 -6
  15. package/build/locale/{ru_RU → ru}/data.json +2 -1
  16. package/build/store/index.js +12 -0
  17. package/package.json +1 -1
package/README.md CHANGED
@@ -66,6 +66,9 @@ export App;
66
66
  logo: '', // путь к логотипу
67
67
  logoUrl: '', // ссылка, открывающаяся по клику на логотип
68
68
 
69
+ // локализация
70
+ locale: 'en', // языковой код ISO 639 (Доступно: ru, en)
71
+
69
72
  // ширина/высота
70
73
  width: 500,
71
74
  height: 750,
package/build/assets/css/app.css CHANGED
@@ -1 +1 @@
1
- *,*:before,*:after{box-sizing:border-box;-webkit-box-sizing:border-box;margin:0;padding:0}html,body{font-size:20px}.widget-application{--vh: 100vh;width:100%;height:calc(100*var(--vh));overflow:hidden;position:relative;z-index:1;background-color:#fff}.widget-application *,.widget-application *:before,.widget-application *:after{font-family:"Roboto Mono",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;outline:none;font-weight:700;text-decoration:none;color:#413e3e}.widget-application .widget-logo{position:absolute;left:45px;top:30px;z-index:3}@media only screen and (max-width: 900px){.widget-application .widget-logo{left:20px;top:20px}}.widget-application .widget-logo img{display:block;width:82px;height:82px;object-fit:contain;object-position:center}@media only screen and (max-width: 900px){.widget-application .widget-logo img{width:65px;height:65px}}@media only screen and (max-width: 545px){.widget-application .widget-logo img{width:40px;height:40px}}.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{position:absolute;right:45px;top:36px;z-index:3;ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;padding:10px}@media only screen and (max-width: 900px){.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{right:20px;top:23px}}@media only screen and (max-width: 545px){.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{padding:5px}}.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{display:block;width:50px;height:50px;object-fit:contain;object-position:center}@media only screen and (max-width: 900px){.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:40px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:30px;height:30px}}.widget-application .widget-close{position:absolute;display:flex;align-items:center;justify-content:center;z-index:3;right:15px;top:15px;color:#000;background-color:#fac62d;padding:5px 15px;border-radius:10px;font-size:.8rem;border:none;cursor:pointer}.widget-application .widget-close:hover{box-shadow:1px 1px 10px rgba(0,0,0,.15)}.widget-application .widget-tab-buttons{position:absolute;z-index:3;right:44px;bottom:35px;display:flex;align-items:center;justify-content:flex-end}@media only screen and (max-width: 900px){.widget-application .widget-tab-buttons{flex-direction:column;right:20px;bottom:20px}}.widget-application .widget-tab-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:#eaeaea;color:#413e3e;font-size:28px;line-height:120%;font-weight:bold;margin-left:40px}@media only screen and (max-width: 900px){.widget-application .widget-tab-button{width:60px;height:60px;font-size:24px;margin-left:0px;margin-top:20px}}@media only screen and (max-width: 545px){.widget-application .widget-tab-button{margin-top:15px;font-size:18px;width:45px;height:45px}}.widget-application .widget-tab-button--active{background-color:#fac62d}.widget-application .widget-tab{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:60px 30px}@media(max-width: 630px){.widget-application .widget-tab{padding:60px 15px}}.widget-application .widget-tab__image{max-width:100%;max-height:100%;object-fit:contain;display:block}.widget-application .widget-tab__threesixty{width:100%;height:100%;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__threesixty-start{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;position:absolute;left:50%;bottom:35px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;padding:0 30px 0 27px;background-color:#eaeaea;border-radius:38px;height:72px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start{height:60px;width:60px;padding:0;left:20px;bottom:20px;transform:none}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start{width:45px;height:45px}}.widget-application .widget-tab__threesixty-start img{display:block;margin-right:20px;position:relative;top:2px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start img{top:0;width:30px;margin-right:0}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start img{width:20px}}.widget-application .widget-tab__threesixty-start span{font-size:24px;font-weight:bold;color:#413e3e;text-transform:uppercase}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start span{display:none}}.widget-application .widget-tab__threesixty-container{width:100% !important;height:100% !important;position:relative;background-image:none !important}.widget-application .widget-tab__threesixty-container img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);max-width:100%;max-height:100%;width:600px;height:600px;object-fit:contain;opacity:0;pointer-events:none;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab__threesixty-container img.active{opacity:1}.widget-application .widget-tab__threesixty--active .widget-tab__threesixty-container{cursor:move}.widget-application .widget-tab-menu{position:absolute;z-index:3;left:15px;top:15px;max-height:100%;overflow-y:auto;padding-bottom:30px}.widget-application .widget-tab-menu__wallpapers{display:flex;flex-wrap:wrap;align-items:flex-start;margin-top:10px;width:100%}.widget-application .widget-tab-menu__wallpapers img{width:30px;height:30px;display:block;object-fit:cover;cursor:pointer;margin-right:10px;margin-block-end:10px}.widget-application .widget-tab-menu ul{list-style-type:none}.widget-application .widget-tab-menu ul li{color:#413e3e;background-color:#fac62d;padding:5px 15px;border-radius:10px;font-size:.7rem;border:none;cursor:pointer;margin-bottom:15px;width:200px;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab-menu ul li label{display:flex;cursor:inherit;width:100%}.widget-application .widget-tab-menu ul li input[type=color]{cursor:pointer;margin-left:auto;width:50px;height:20px;border:0;border-radius:5px}.widget-application .widget-tab-menu ul li input[type=color]::-webkit-color-swatch-wrapper{display:none !important}.widget-application .widget-tab-menu ul li input[type=file]{display:none}.widget-application .widget-tab-menu ul li:nth-child(1){position:relative}.widget-application .widget-tab-menu ul li:nth-child(1)::after{--bar-width: 2px;content:"";width:20px;height:15px;display:block;background:repeating-linear-gradient(180deg, #000000, #000000 var(--bar-width), rgba(0, 0, 0, 0) var(--bar-width), rgba(0, 0, 0, 0) calc(var(--bar-width) * 3));position:absolute;right:10px;top:50%;transform:translateY(-50%)}.widget-application .widget-instructions{position:absolute;z-index:2;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-position:center;background-repeat:no-repeat;background-size:cover}.widget-application .widget-instructions__content{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background-color:rgba(234,234,234,.85);border-radius:20px;overflow:hidden;width:400px;max-width:calc(100% - 60px);padding:36px 30px 30px 30px;backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}@media only screen and (max-width: 545px){.widget-application .widget-instructions__content{width:280px;padding:26px 20px 20px 20px}}.widget-application .widget-instructions__steps{display:flex;align-items:flex-start;justify-content:center}.widget-application .widget-instructions__step{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin:0 15px}@media only screen and (max-width: 900px){.widget-application .widget-instructions__step{margin:0 10px}}.widget-application .widget-instructions__step img{display:block;width:52px;height:80px;object-fit:contain;object-position:center}@media only screen and (max-width: 545px){.widget-application .widget-instructions__step img{width:40px;height:60px}}.widget-application .widget-instructions__step p{color:#413e3e;font-size:20px;font-weight:bold;text-align:center;margin-top:10px;max-width:130px}@media only screen and (max-width: 900px){.widget-application .widget-instructions__step p{font-size:18px;max-width:115px}}@media only screen and (max-width: 545px){.widget-application .widget-instructions__step p{font-size:16px}}.widget-application .widget-instructions button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;display:flex;align-items:center;justify-content:center;height:44px;padding:0 33px;border-radius:52px;background-color:#fac62d;color:#413e3e;font-size:24px;font-weight:bold;text-transform:uppercase;margin:25px auto 0 auto}@media only screen and (max-width: 900px){.widget-application .widget-instructions button{font-size:18px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-instructions button{font-size:16px;height:35px}}.widget-application .widget-tab__panorama{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__panorama-overlay{width:100%;height:100%;overflow:hidden;background:#fff !important}.widget-application .widget-tab__panorama-overlay *{display:none !important}.widget-application .widget-tab__panorama-overlay canvas{display:block !important}.widget-application .widget-tab__panorama-controls{position:absolute;z-index:2;left:50%;bottom:35px;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:38px;background-color:rgba(0,0,0,.2);transform:translateX(-50%);backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls{bottom:20px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls{padding:5px}}.widget-application .widget-tab__panorama-controls-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:55px;height:55px;border-radius:50%;background-color:#fff;display:flex;align-items:center;justify-content:center;margin-right:18px}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls-button{width:40px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls-button{margin-right:13px;width:35px;height:35px}}.widget-application .widget-tab__panorama-controls-button img{display:block}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.7)}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.55)}}.widget-application .widget-tab__panorama-controls-button:nth-last-child(1){margin-right:0}.widget-application .widget-tab__panorama-map{position:absolute;left:45px;bottom:35px;z-index:3;border-radius:10px;border:8px solid #fff;background-color:#fff;opacity:1;transition:opacity .5s}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map{left:20px;bottom:20px;transform:scale(0.6);transform-origin:0% 100%}.widget-application .widget-tab__panorama-map svg polygon{opacity:0}.widget-application .widget-tab__panorama-map--scaled{transform:scale(1) !important}.widget-application .widget-tab__panorama-map--scaled svg polygon:active{opacity:.3 !important}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-map{transform:scale(0.4)}}.widget-application .widget-tab__panorama-map--hidden{opacity:0;pointer-events:none}.widget-application .widget-tab__panorama-map img{width:195px;border-radius:none;display:block;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none;-webkit-backface-visibility:hidden;-ms-transform:translateZ(0);-webkit-transform:translateZ(0);transform:translateZ(0)}.widget-application .widget-tab__panorama-map img:hover{box-shadow:1px 1px 10px rgba(0,0,0,.15)}.widget-application .widget-tab__panorama-map svg{position:absolute;left:0;top:0;width:195px;height:100%;z-index:3;display:block;border-radius:inherit}.widget-application .widget-tab__panorama-map svg polygon{opacity:0;fill:#fac62d;cursor:pointer}.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:.3}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:0}}.widget-application .widget-tab__panorama-map__fov{position:absolute;left:0;top:0;width:0px;height:0px;border-radius:50%;border-left:30px solid rgba(250,198,45,0);border-right:30px solid rgba(250,198,45,0);border-bottom:30px solid rgba(250,198,45,0);border-top:40px solid rgba(250,198,45,.4);transform:translate(-50%, -50%) rotate(0rad);transform-origin:50% 50%;z-index:4;pointer-events:none}.widget-application .widget-tab__panorama-map__fov::before{content:"";position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%, -50%) translateY(-5px);width:15px;height:15px;background-color:#fac62d;border-radius:50%;border:2px solid #fac62d;box-shadow:inset 0 0 0 2px #fff}.widget-loader{display:block;position:relative;width:80px;height:80px}.widget-loader--absolute{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.widget-loader--sm{transform:translate(-50%, -50%) scale(0.75)}.widget-loader div{position:absolute;top:33px;width:13px;height:13px;border-radius:50%;background:#fac62d;animation-timing-function:cubic-bezier(0, 1, 1, 0)}.widget-loader div:nth-child(1){left:8px;animation:widget-loader-1 .6s infinite}.widget-loader div:nth-child(2){left:8px;animation:widget-loader-2 .6s infinite}.widget-loader div:nth-child(3){left:32px;animation:widget-loader-2 .6s infinite}.widget-loader div:nth-child(4){left:56px;animation:widget-loader-3 .6s infinite}@keyframes widget-loader-1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes widget-loader-3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes widget-loader-2{0%{transform:translate(0, 0)}100%{transform:translate(24px, 0)}}.widget-application .widget-tab__model{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__model-scene{width:100%;height:100%;display:block}.widget-application .widget-tab__model-joystick{position:absolute;left:100px;bottom:100px;opacity:0;pointer-events:none}@media only screen and (max-width: 545px){.widget-application .widget-tab__model-joystick{left:50%;transform:translateX(-50%)}}.widget-application .widget-tab__model-joystick--active{opacity:1;pointer-events:unset}/*# sourceMappingURL=app.css.map */
1
+ .widget-application{--vh: 100vh;width:100%;height:calc(100*var(--vh));overflow:hidden;position:relative;z-index:1;background-color:#fff;font-size:20px}.widget-application *,.widget-application *:before,.widget-application *:after{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:"Roboto Mono",sans-serif;text-decoration:none;font-weight:700;color:#413e3e;outline:none;padding:0;margin:0;box-sizing:border-box;-webkit-box-sizing:border-box}.widget-application .widget-logo{position:absolute;left:45px;top:30px;z-index:3}@media only screen and (max-width: 900px){.widget-application .widget-logo{left:20px;top:30px}}@media only screen and (max-width: 374px){.widget-application .widget-logo{top:25px}}.widget-application .widget-logo img{display:block;width:82px;height:82px;object-fit:contain;object-position:center}@media only screen and (max-width: 900px){.widget-application .widget-logo img{width:65px;height:65px}}@media only screen and (max-width: 545px){.widget-application .widget-logo img{width:42px;height:42px}}@media only screen and (max-width: 374px){.widget-application .widget-logo img{width:36px;height:36px}}.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{position:absolute;right:45px;top:36px;z-index:3;padding:10px;touch-action:none;ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{right:17px;top:35px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{padding:5px;right:20px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-close-map,.widget-application .widget-enter-fullscreen,.widget-application .widget-exit-fullscreen{top:25px}}.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{display:block;width:50px;height:50px;object-fit:contain;object-position:center}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:40px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:32px;height:32px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-close-map img,.widget-application .widget-enter-fullscreen img,.widget-application .widget-exit-fullscreen img{width:26px;height:26px}}.widget-application .widget-tab-buttons{position:absolute;z-index:3;right:44px;bottom:35px;display:flex;align-items:center;justify-content:flex-end}@media only screen and (max-width: 900px){.widget-application .widget-tab-buttons{right:20px;bottom:35px}}@media only screen and (max-width: 374px){.widget-application .widget-tab-buttons{bottom:30px}}.widget-application .widget-tab-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;background-color:#eaeaea;color:#413e3e;font-size:28px;line-height:120%;font-weight:bold;margin-left:40px}@media only screen and (max-width: 900px){.widget-application .widget-tab-button{margin-left:20px;width:60px;height:60px;font-size:22px}}@media only screen and (max-width: 545px){.widget-application .widget-tab-button{margin-left:10px;font-size:17px;width:44px;height:44px}}@media only screen and (max-width: 374px){.widget-application .widget-tab-button{width:36px;height:36px;font-size:14px}}.widget-application .widget-tab-button--active{background-color:#fac62d}.widget-application .widget-tab{width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:60px 30px}@media(max-width: 630px){.widget-application .widget-tab{padding:60px 20px}}.widget-application .widget-tab__image{max-width:100%;max-height:100%;object-fit:contain;display:block}.widget-application .widget-tab__threesixty{width:100%;height:100%;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__threesixty-start{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;position:absolute;left:50%;bottom:35px;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;padding:0 25px 0 10px;background-color:#eaeaea;border-radius:38px;height:72px;width:202px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start{height:60px;width:166px;padding:0 20px 0 8px;bottom:35px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start{height:44px;width:115px;padding:0 10px 0 6px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start{height:36px;width:94px;padding:0 8px 0 6px;bottom:30px}}.widget-application .widget-tab__threesixty-start-icon{display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#fff;margin-right:18px;padding:10px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start-icon{padding:7px;margin-right:15px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start-icon{margin-right:7px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start-icon{padding:6px;margin-right:5px}}.widget-application .widget-tab__threesixty-start-icon img{display:block;position:relative;top:2px;width:34px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start-icon img{width:30px;top:1px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start-icon img{width:19px;top:0}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start-icon img{width:15px}}.widget-application .widget-tab__threesixty-start span{font-size:24px;font-weight:bold;color:#413e3e;text-transform:uppercase;width:100%;display:block;text-align:center;position:relative;top:1px}@media only screen and (max-width: 900px){.widget-application .widget-tab__threesixty-start span{font-size:20px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__threesixty-start span{font-size:14px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__threesixty-start span{font-size:12px}}.widget-application .widget-tab__threesixty-container{width:100% !important;height:100% !important;position:relative;background-image:none !important}.widget-application .widget-tab__threesixty-container img{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);max-width:100%;max-height:100%;width:600px;height:600px;object-fit:contain;opacity:0;pointer-events:none;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab__threesixty-container img.active{opacity:1}.widget-application .widget-tab__threesixty--active .widget-tab__threesixty-container{cursor:move}.widget-application .widget-tab-menu{position:absolute;z-index:3;left:15px;top:15px;max-height:100%;overflow-y:auto;padding-bottom:30px}.widget-application .widget-tab-menu__wallpapers{display:flex;flex-wrap:wrap;align-items:flex-start;margin-top:10px;width:100%}.widget-application .widget-tab-menu__wallpapers img{width:30px;height:30px;display:block;object-fit:cover;cursor:pointer;margin-right:10px;margin-block-end:10px}.widget-application .widget-tab-menu ul{list-style-type:none}.widget-application .widget-tab-menu ul li{color:#413e3e;background-color:#fac62d;padding:5px 15px;border-radius:10px;font-size:.7rem;border:none;cursor:pointer;margin-bottom:15px;width:200px;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none}.widget-application .widget-tab-menu ul li label{display:flex;cursor:inherit;width:100%}.widget-application .widget-tab-menu ul li input[type=color]{cursor:pointer;margin-left:auto;width:50px;height:20px;border:0;border-radius:5px}.widget-application .widget-tab-menu ul li input[type=color]::-webkit-color-swatch-wrapper{display:none !important}.widget-application .widget-tab-menu ul li input[type=file]{display:none}.widget-application .widget-tab-menu ul li:nth-child(1){position:relative}.widget-application .widget-tab-menu ul li:nth-child(1)::after{--bar-width: 2px;content:"";width:20px;height:15px;display:block;background:repeating-linear-gradient(180deg, #000000, #000000 var(--bar-width), rgba(0, 0, 0, 0) var(--bar-width), rgba(0, 0, 0, 0) calc(var(--bar-width) * 3));position:absolute;right:10px;top:50%;transform:translateY(-50%)}.widget-application .widget-instructions{position:absolute;z-index:2;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-position:center;background-repeat:no-repeat;background-size:cover}.widget-application .widget-instructions__content{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background-color:rgba(234,234,234,.85);border-radius:20px;overflow:hidden;width:400px;max-width:calc(100% - 60px);padding:36px 30px 30px 30px;backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}@media only screen and (max-width: 545px){.widget-application .widget-instructions__content{width:280px;padding:26px 20px 20px 20px}}.widget-application .widget-instructions__steps{display:flex;align-items:flex-start;justify-content:center}.widget-application .widget-instructions__step{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;margin:0 15px}@media only screen and (max-width: 900px){.widget-application .widget-instructions__step{margin:0 10px}}.widget-application .widget-instructions__step img{display:block;width:52px;height:80px;object-fit:contain;object-position:center}@media only screen and (max-width: 545px){.widget-application .widget-instructions__step img{width:40px;height:60px}}@media only screen and (max-width: 374px){.widget-application .widget-instructions__step img{width:35px}}.widget-application .widget-instructions__step p{color:#413e3e;font-size:20px;font-weight:bold;text-align:center;margin-top:10px;max-width:130px}@media only screen and (max-width: 900px){.widget-application .widget-instructions__step p{font-size:18px;max-width:115px}}@media only screen and (max-width: 545px){.widget-application .widget-instructions__step p{font-size:16px}}@media only screen and (max-width: 374px){.widget-application .widget-instructions__step p{font-size:14px}}.widget-application .widget-instructions button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;display:flex;align-items:center;justify-content:center;height:44px;padding:0 33px;border-radius:52px;background-color:#fac62d;color:#413e3e;font-size:24px;font-weight:bold;text-transform:uppercase;margin:25px auto 0 auto}@media only screen and (max-width: 900px){.widget-application .widget-instructions button{font-size:18px;height:40px}}@media only screen and (max-width: 545px){.widget-application .widget-instructions button{font-size:16px;height:35px}}@media only screen and (max-width: 374px){.widget-application .widget-instructions button{font-size:14px;height:26px;padding:0 25px}}.widget-application .widget-tab__panorama{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__panorama-overlay{width:100%;height:100%;overflow:hidden;background:#fff !important}.widget-application .widget-tab__panorama-overlay *{display:none !important}.widget-application .widget-tab__panorama-overlay canvas{display:block !important}.widget-application .widget-tab__panorama-controls{position:absolute;z-index:2;left:50%;bottom:35px;display:flex;align-items:center;justify-content:center;padding:8px;border-radius:38px;background-color:rgba(0,0,0,.2);transform:translateX(-50%);backdrop-filter:blur(5px);-moz-backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls{padding:5px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-controls{bottom:30px}}.widget-application .widget-tab__panorama-controls-button{ouline:none;border:none;box-shadow:none;background:rgba(0,0,0,0);cursor:pointer;width:55px;height:55px;border-radius:50%;background-color:#fff;display:flex;align-items:center;justify-content:center;margin-right:18px}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls-button{width:44px;height:44px}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls-button{margin-right:10px;width:33px;height:33px}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-controls-button{width:26px;height:26px}}.widget-application .widget-tab__panorama-controls-button img{display:block}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.7)}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.52)}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-controls-button img{transform:scale(0.45)}}.widget-application .widget-tab__panorama-controls-button:nth-last-child(1){margin-right:0}.widget-application .widget-tab__panorama-close-map{z-index:4}.widget-application .widget-tab__panorama-map{position:absolute;left:45px;bottom:35px;z-index:3;border-radius:10px;opacity:1;transition:opacity .5s;touch-action:none;-webkit-touch-action:none}.widget-application .widget-tab__panorama-map::before{content:"";position:absolute;z-index:-1;left:50%;top:50%;transform:translate(-50%, -50%);width:calc(100% + 16px);height:calc(100% + 16px);border-radius:inherit;background-color:#fff}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map{left:20px;transform:scale(0.6);transform-origin:0% 100%}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-map{transform:scale(0.4)}}@media only screen and (max-width: 374px){.widget-application .widget-tab__panorama-map{bottom:30px;transform:scale(0.35)}}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map--scaled{transform:scale(1.4) translate(-50%, 50%);left:50%;bottom:50%}.widget-application .widget-tab__panorama-map--scaled::after{content:"";position:absolute;z-index:-2;left:50%;top:50%;transform:translate(-50%, -50%);width:100vw;height:calc(100*var(--vh));background-color:rgba(196,196,196,.8)}.widget-application .widget-tab__panorama-map--scaled svg polygon:active{opacity:.3 !important}}@media only screen and (max-width: 545px){.widget-application .widget-tab__panorama-map--scaled{transform:scale(1) translate(-50%, 50%)}}.widget-application .widget-tab__panorama-map--hidden{opacity:0;pointer-events:none}.widget-application .widget-tab__panorama-map img{width:200px;border-radius:none;display:block;user-select:none;-webkit-user-select:none;user-drag:none;-webkit-user-drag:none;-webkit-backface-visibility:hidden;-ms-transform:translateZ(0);-webkit-transform:translateZ(0);transform:translateZ(0)}.widget-application .widget-tab__panorama-map img:hover{box-shadow:1px 1px 10px rgba(0,0,0,.15)}.widget-application .widget-tab__panorama-map svg{position:absolute;left:0;top:0;width:200px;height:100%;z-index:3;display:block;border-radius:inherit}.widget-application .widget-tab__panorama-map svg polygon{opacity:0;fill:#fac62d;cursor:pointer}.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:.3}@media only screen and (max-width: 900px){.widget-application .widget-tab__panorama-map svg polygon:hover{opacity:0}}.widget-application .widget-tab__panorama-map__fov{position:absolute;left:0;top:0;width:0px;height:0px;border-radius:50%;border-left:30px solid rgba(250,198,45,0);border-right:30px solid rgba(250,198,45,0);border-bottom:30px solid rgba(250,198,45,0);border-top:40px solid rgba(250,198,45,.4);transform:translate(-50%, -50%) rotate(0rad);transform-origin:50% 50%;z-index:4;pointer-events:none}.widget-application .widget-tab__panorama-map__fov::before{content:"";position:absolute;z-index:5;left:50%;top:50%;transform:translate(-50%, -50%) translateY(-5px);width:15px;height:15px;background-color:#fac62d;border-radius:50%;border:2px solid #fac62d;box-shadow:inset 0 0 0 2px #fff}.widget-loader{display:block;position:relative;width:80px;height:80px}.widget-loader--absolute{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.widget-loader--sm{transform:translate(-50%, -50%) scale(0.75)}.widget-loader div{position:absolute;top:33px;width:13px;height:13px;border-radius:50%;background:#fac62d;animation-timing-function:cubic-bezier(0, 1, 1, 0)}.widget-loader div:nth-child(1){left:8px;animation:widget-loader-1 .6s infinite}.widget-loader div:nth-child(2){left:8px;animation:widget-loader-2 .6s infinite}.widget-loader div:nth-child(3){left:32px;animation:widget-loader-2 .6s infinite}.widget-loader div:nth-child(4){left:56px;animation:widget-loader-3 .6s infinite}@keyframes widget-loader-1{0%{transform:scale(0)}100%{transform:scale(1)}}@keyframes widget-loader-3{0%{transform:scale(1)}100%{transform:scale(0)}}@keyframes widget-loader-2{0%{transform:translate(0, 0)}100%{transform:translate(24px, 0)}}.widget-application .widget-tab__model{width:100%;height:100%;position:absolute;left:0;top:0;z-index:2}.widget-application .widget-tab__model-scene{width:100%;height:100%;display:block}.widget-application .widget-tab__model-joystick{position:absolute;left:100px;bottom:100px;opacity:0;pointer-events:none}@media only screen and (max-width: 545px){.widget-application .widget-tab__model-joystick{left:50%;transform:translateX(-50%)}}.widget-application .widget-tab__model-joystick--active{opacity:1;pointer-events:unset}/*# sourceMappingURL=app.css.map */
package/build/assets/css/app.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../src/assets/sass/index.sass","../../../src/assets/sass/vars.sass","../../../src/assets/sass/mixin.sass","../../../src/assets/sass/components/tabs.sass","../../../src/assets/sass/components/instructions.sass","../../../src/assets/sass/components/panorama.sass","../../../src/assets/sass/components/loader.sass","../../../src/assets/sass/components/model.sass"],"names":[],"mappings":"AAGA,mBACE,sBACA,8BACA,SACA,UAEF,UACE,eAEF,oBACE,YAEA,WACA,2BACA,gBACA,kBACA,UACA,iBCfM,KDiBN,+EACE,qCACA,mCACA,kCACA,aACA,gBACA,qBACA,MClBQ,QDoBV,iCACE,kBACA,UACA,SACA,UACA,0CALF,iCAMI,UACA,UACF,qCACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,qCAOI,WACA,aACF,0CATF,qCAUI,WACA,aAEN,yFAEE,kBACA,WACA,SACA,UExDF,YACA,YACA,gBACA,yBACA,eFsDE,aACA,0CARF,yFASI,WACA,UACF,0CAXF,yFAYI,aACF,iGACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,iGAOI,WACA,aACF,0CATF,iGAUI,WACA,aAEN,kCACE,kBACA,aACA,mBACA,uBACA,UACA,WACA,SACA,MChFI,KDiFJ,iBC9EQ,QD+ER,iBACA,mBACA,gBACA,YACA,eACA,wCACE,wCG1FJ,wCACE,kBACA,UACA,WACA,YACA,aACA,mBACA,yBACA,0CARF,wCASI,sBACA,WACA,aACJ,uCDfA,YACA,YACA,gBACA,yBACA,eCaE,WACA,YACA,kBACA,aACA,mBACA,uBACA,iBFjBG,QEkBH,MFdQ,QEeR,eACA,iBACA,iBACA,iBACA,0CAdF,uCAeI,WACA,YACA,eACA,gBACA,iBACF,0CApBF,uCAqBI,gBACA,eACA,WACA,aACF,+CACE,iBFjCM,QEmCV,gCACE,WACA,YACA,aACA,mBACA,uBACA,kBACA,yBAPF,gCAQI,mBACF,uCACE,eACA,gBACA,mBACA,cACF,4CACE,WACA,YACA,kBACA,0BACA,kDD9DJ,YACA,YACA,gBACA,yBACA,eC4DM,kBACA,SACA,YACA,2BACA,aACA,mBACA,uBACA,sBACA,iBFlED,QEmEC,mBACA,YACA,0CAbF,kDAcI,YACA,WACA,UACA,UACA,YACA,gBACF,0CApBF,kDAqBI,WACA,aACF,sDACE,cACA,kBACA,kBACA,QACA,0CALF,sDAMI,MACA,WACA,gBACF,0CATF,sDAUI,YACJ,uDACE,eACA,iBACA,MFzFE,QE0FF,yBACA,0CALF,uDAMI,cACN,sDACE,sBACA,uBACA,kBACA,iCACA,0DACE,kBACA,SACA,QACA,gCACA,eACA,gBACA,YACA,aACA,mBACA,UACA,oBF1GR,iBACA,yBACA,eACA,uBEyGQ,iEACE,UAEJ,sFACE,YAEN,qCACE,kBACA,UACA,UACA,SACA,gBACA,gBACA,oBACA,iDACE,aACA,eACA,uBACA,gBACA,WACA,qDACE,WACA,YACA,cACA,iBACA,eACA,kBACA,sBACJ,wCACE,qBACA,2CACE,MF9IE,QE+IF,iBFjJE,QEkJF,iBACA,mBACA,gBACA,YACA,eACA,mBACA,YFnJR,iBACA,yBACA,eACA,uBEkJQ,iDACE,aACA,eACA,WAEA,6DACE,eACA,iBACA,WACA,YACA,SACA,kBACA,2FACE,wBACJ,4DACE,aACJ,wDACE,kBACA,+DACE,iBACA,WACA,WACA,YACA,cACA,gKACA,kBACA,WACA,QACA,2BC3LZ,yCACE,kBACA,UACA,OACA,MACA,WACA,YACA,aACA,mBACA,uBACA,2BACA,4BACA,sBAEA,kDACE,aACA,sBACA,mBACA,2BACA,uCACA,mBACA,gBACA,YACA,4BACA,4BFpBJ,0BACA,+BACA,kCEoBI,0CAZF,kDAaI,YACA,6BACJ,gDACE,aACA,uBACA,uBACF,+CACE,aACA,sBACA,mBACA,2BACA,cACA,0CANF,+CAOI,eACF,mDACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,mDAOI,WACA,aACJ,iDACE,MH5CI,QG6CJ,eACA,iBACA,kBACA,gBACA,gBACA,0CAPF,iDAQI,eACA,iBACF,0CAVF,iDAWI,gBACN,gDFjEF,YACA,YACA,gBACA,yBACA,eE+DI,aACA,mBACA,uBACA,YACA,eACA,mBACA,iBHjEM,QGkEN,MHhEM,QGiEN,eACA,iBACA,yBACA,wBACA,0CAdF,gDAeI,eACA,aACF,0CAjBF,gDAkBI,eACA,aChFJ,0CACE,WACA,YACA,kBACA,OACA,MACA,UACA,kDACE,WACA,YACA,gBACA,2BACA,oDACE,wBACF,yDACE,yBACJ,mDACE,kBACA,UACA,SACA,YACA,aACA,mBACA,uBACA,YACA,mBACA,gCACA,2BHxBN,0BACA,+BACA,kCGwBM,0CAbF,mDAcI,aACF,0CAfF,mDAgBI,aACF,0DHrCN,YACA,YACA,gBACA,yBACA,eGmCQ,WACA,YACA,kBACA,iBJtCF,KIuCE,aACA,mBACA,uBACA,kBACA,0CAVF,0DAWI,WACA,aACF,0CAbF,0DAcI,kBACA,WACA,aACF,8DACE,cACA,0CAFF,8DAGI,sBACF,0CAJF,8DAKI,uBACJ,4EACE,eACN,8CACE,kBACA,UACA,YACA,UACA,mBACA,sBACA,iBJjEA,KIkEA,UACA,uBACA,0CAVF,8CAWI,UACA,YACA,qBACA,yBAEE,0DACE,UACJ,sDACE,8BAGI,yEACE,uBACV,0CAxBF,8CAyBI,sBACF,sDACE,UACA,oBACF,kDACE,YACA,mBACA,cJjFR,iBACA,yBACA,eACA,uBAGA,mCACA,4BACA,gCACA,wBI2EQ,wDACE,wCACJ,kDACE,kBACA,OACA,MACA,YACA,YACA,UACA,cACA,sBACA,0DACE,UACA,KJtGA,QIuGA,eACA,gEACE,WACA,0CAFF,gEAGI,WACR,mDACE,kBACA,OACA,MACA,UACA,WACA,kBACA,0CACA,2CACA,4CACA,0CACA,6CACA,yBACA,UACA,oBACA,2DACE,WACA,kBACA,UACA,SACA,QACA,iDACA,WACA,YACA,iBJpIA,QIqIA,kBACA,yBACA,gCC9IZ,eACE,cACA,kBACA,WACA,YACA,yBACE,kBACA,SACA,QACA,gCACF,mBACE,4CACF,mBACE,kBACA,SACA,WACA,YACA,kBACA,WLXQ,QKYR,mDACA,gCACE,SACA,uCACF,gCACE,SACA,uCACF,gCACE,UACA,uCACF,gCACE,UACA,uCAEN,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,0BAEF,KACE,8BChDA,uCACE,WACA,YACA,kBACA,OACA,MACA,UACA,6CACE,WACA,YACA,cACF,gDACE,kBACA,WACA,aACA,UACA,oBACA,0CANF,gDAOI,SACA,4BACF,wDACE,UACA","file":"app.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../src/assets/sass/index.sass","../../../src/assets/sass/vars.sass","../../../src/assets/sass/mixin.sass","../../../src/assets/sass/components/tabs.sass","../../../src/assets/sass/components/instructions.sass","../../../src/assets/sass/components/panorama.sass","../../../src/assets/sass/components/loader.sass","../../../src/assets/sass/components/model.sass"],"names":[],"mappings":"AAGA,oBACE,YAEA,WACA,2BACA,gBACA,kBACA,UACA,iBCLM,KDMN,eAEA,+EACE,mCACA,kCACA,qCACA,qBACA,gBACA,MCRQ,QDSR,aACA,UACA,SACA,sBACA,8BAEF,iCACE,kBACA,UACA,SACA,UACA,0CALF,iCAMI,UACA,UACF,0CARF,iCASI,UACF,qCACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,qCAOI,WACA,aACF,0CATF,qCAUI,WACA,aACF,0CAZF,qCAaI,WACA,aAEN,6IAGE,kBACA,WACA,SACA,UACA,aACA,kBE5DF,YACA,YACA,gBACA,yBACA,eF0DE,0CAVF,6IAWI,WACA,UACF,0CAbF,6IAcI,YACA,YACF,0CAhBF,6IAiBI,UACF,yJACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,yJAOI,WACA,aACF,0CATF,yJAUI,WACA,aACF,0CAZF,yJAaI,WACA,aGjFN,wCACE,kBACA,UACA,WACA,YACA,aACA,mBACA,yBACA,0CARF,wCASI,WACA,aACF,0CAXF,wCAYI,aACJ,uCDhBA,YACA,YACA,gBACA,yBACA,eCcE,WACA,YACA,kBACA,aACA,mBACA,uBACA,iBFjBG,QEkBH,MFdQ,QEeR,eACA,iBACA,iBACA,iBACA,0CAdF,uCAeI,iBACA,WACA,YACA,gBACF,0CAnBF,uCAoBI,iBACA,eACA,WACA,aACF,0CAxBF,uCAyBI,WACA,YACA,gBACF,+CACE,iBFpCM,QEsCV,gCACE,WACA,YACA,aACA,mBACA,uBACA,kBACA,yBAPF,gCAQI,mBACF,uCACE,eACA,gBACA,mBACA,cACF,4CACE,WACA,YF3CJ,kBACA,0BE4CI,kDDjEJ,YACA,YACA,gBACA,yBACA,eC+DM,kBACA,SACA,YACA,2BACA,aACA,mBACA,uBACA,sBACA,iBFpED,QEqEC,mBACA,YACA,YACA,0CAdF,kDAeI,YACA,YACA,qBACA,aACF,0CAnBF,kDAoBI,YACA,YACA,sBACF,0CAvBF,kDAwBI,YACA,WACA,oBACA,aACF,uDACE,aACA,mBACA,uBACA,kBACA,iBF7FF,KE8FE,kBACA,aACA,0CARF,uDASI,YACA,mBACF,0CAXF,uDAYI,kBACF,0CAbF,uDAcI,YACA,kBACF,2DACE,cACA,kBACA,QACA,WACA,0CALF,2DAMI,WACA,SACF,0CARF,2DASI,WACA,OACF,0CAXF,2DAYI,YACN,uDACE,eACA,iBACA,MFlHE,QEmHF,yBACA,WACA,cACA,kBACA,kBACA,QACA,0CAVF,uDAWI,gBACF,0CAZF,uDAaI,gBACF,0CAdF,uDAeI,gBACN,sDACE,sBACA,uBACA,kBACA,iCACA,0DACE,kBACA,SACA,QACA,gCACA,eACA,gBACA,YACA,aACA,mBACA,UACA,oBF5IR,iBACA,yBACA,eACA,uBE2IQ,iEACE,UAEJ,sFACE,YAEN,qCACE,kBACA,UACA,UACA,SACA,gBACA,gBACA,oBACA,iDACE,aACA,eACA,uBACA,gBACA,WACA,qDACE,WACA,YACA,cACA,iBACA,eACA,kBACA,sBACJ,wCACE,qBACA,2CACE,MFhLE,QEiLF,iBFnLE,QEoLF,iBACA,mBACA,gBACA,YACA,eACA,mBACA,YFrLR,iBACA,yBACA,eACA,uBEoLQ,iDACE,aACA,eACA,WAEA,6DACE,eACA,iBACA,WACA,YACA,SACA,kBACA,2FACE,wBACJ,4DACE,aACJ,wDACE,kBACA,+DACE,iBACA,WACA,WACA,YACA,cACA,gKACA,kBACA,WACA,QACA,2BC9NZ,yCACE,kBACA,UACA,OACA,MACA,WACA,YACA,aACA,mBACA,uBACA,2BACA,4BACA,sBAEA,kDACE,aACA,sBACA,mBACA,2BACA,uCACA,mBACA,gBACA,YACA,4BACA,4BFpBJ,0BACA,+BACA,kCEoBI,0CAZF,kDAaI,YACA,6BACJ,gDACE,aACA,uBACA,uBACF,+CACE,aACA,sBACA,mBACA,2BACA,cACA,0CANF,+CAOI,eACF,mDACE,cACA,WACA,YACA,mBACA,uBACA,0CANF,mDAOI,WACA,aACF,0CATF,mDAUI,YACJ,iDACE,MH7CI,QG8CJ,eACA,iBACA,kBACA,gBACA,gBACA,0CAPF,iDAQI,eACA,iBACF,0CAVF,iDAWI,gBACF,0CAZF,iDAaI,gBACN,gDFrEF,YACA,YACA,gBACA,yBACA,eEmEI,aACA,mBACA,uBACA,YACA,eACA,mBACA,iBHpEM,QGqEN,MHnEM,QGoEN,eACA,iBACA,yBACA,wBACA,0CAdF,gDAeI,eACA,aACF,0CAjBF,gDAkBI,eACA,aACF,0CApBF,gDAqBI,eACA,YACA,gBCxFJ,0CACE,WACA,YACA,kBACA,OACA,MACA,UACA,kDACE,WACA,YACA,gBACA,2BACA,oDACE,wBACF,yDACE,yBACJ,mDACE,kBACA,UACA,SACA,YACA,aACA,mBACA,uBACA,YACA,mBACA,gCACA,2BHxBN,0BACA,+BACA,kCGwBM,0CAbF,mDAcI,aACF,0CAfF,mDAgBI,aACF,0DHrCN,YACA,YACA,gBACA,yBACA,eGmCQ,WACA,YACA,kBACA,iBJrCF,KIsCE,aACA,mBACA,uBACA,kBACA,0CAVF,0DAWI,WACA,aACF,0CAbF,0DAcI,kBACA,WACA,aACF,0CAjBF,0DAkBI,WACA,aACF,8DACE,cACA,0CAFF,8DAGI,sBACF,0CAJF,8DAKI,uBACF,0CANF,8DAOI,uBACJ,4EACE,eACN,oDACE,UACF,8CACE,kBACA,UACA,YACA,UACA,mBACA,UACA,uBJxDN,kBACA,0BIyDM,sDACE,WACA,kBACA,WACA,SACA,QACA,gCACA,wBACA,yBACA,sBACA,iBJnFF,KIoFA,0CApBF,8CAqBI,UACA,qBACA,0BACF,0CAxBF,8CAyBI,sBACF,0CA1BF,8CA2BI,YACA,uBAEA,0CADF,sDAEI,0CACA,SACA,WACA,6DACE,WACA,kBACA,WACA,SACA,QACA,gCACA,YACA,2BACA,sCAGE,yEACE,uBACR,0CAnBF,sDAoBI,yCACJ,sDACE,UACA,oBACF,kDACE,YACA,mBACA,cJ/GR,iBACA,yBACA,eACA,uBAOA,mCACA,4BACA,gCACA,wBIqGQ,wDACE,wCACJ,kDACE,kBACA,OACA,MACA,YACA,YACA,UACA,cACA,sBACA,0DACE,UACA,KJpIA,QIqIA,eACA,gEACE,WACA,0CAFF,gEAGI,WACR,mDACE,kBACA,OACA,MACA,UACA,WACA,kBACA,0CACA,2CACA,4CACA,0CACA,6CACA,yBACA,UACA,oBACA,2DACE,WACA,kBACA,UACA,SACA,QACA,iDACA,WACA,YACA,iBJlKA,QImKA,kBACA,yBACA,gCC7KZ,eACE,cACA,kBACA,WACA,YACA,yBACE,kBACA,SACA,QACA,gCACF,mBACE,4CACF,mBACE,kBACA,SACA,WACA,YACA,kBACA,WLVQ,QKWR,mDACA,gCACE,SACA,uCACF,gCACE,SACA,uCACF,gCACE,UACA,uCACF,gCACE,UACA,uCAEN,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,mBACF,KACE,oBAEJ,2BACE,GACE,0BAEF,KACE,8BChDA,uCACE,WACA,YACA,kBACA,OACA,MACA,UACA,6CACE,WACA,YACA,cACF,gDACE,kBACA,WACA,aACA,UACA,oBACA,0CANF,gDAOI,SACA,4BACF,wDACE,UACA","file":"app.css"}
package/build/assets/sass/components/instructions.sass CHANGED
@@ -52,6 +52,8 @@
52
52
  @media #{$mobile}
53
53
  width: 40px
54
54
  height: 60px
55
+ @media #{$w-374}
56
+ width: 35px
55
57
  p
56
58
  color: $text-dark
57
59
  font-size: 20px
@@ -64,6 +66,8 @@
64
66
  max-width: 115px
65
67
  @media #{$mobile}
66
68
  font-size: 16px
69
+ @media #{$w-374}
70
+ font-size: 14px
67
71
  button
68
72
  @include customButton
69
73
  display: flex
@@ -84,3 +88,7 @@
84
88
  @media #{$mobile}
85
89
  font-size: 16px
86
90
  height: 35px
91
+ @media #{$w-374}
92
+ font-size: 14px
93
+ height: 26px
94
+ padding: 0 25px
package/build/assets/sass/components/panorama.sass CHANGED
@@ -32,10 +32,10 @@
32
32
  background-color: transparentize($black, .8)
33
33
  transform: translateX(-50%)
34
34
  @include blurBackground(5px)
35
- @media #{$tablet}
36
- bottom: 20px
37
35
  @media #{$mobile}
38
36
  padding: 5px
37
+ @media #{$w-374}
38
+ bottom: 30px
39
39
  &-button
40
40
  @include customButton
41
41
  width: 55px
@@ -47,51 +47,82 @@
47
47
  justify-content: center
48
48
  margin-right: 18px
49
49
  @media #{$tablet}
50
- width: 40px
51
- height: 40px
50
+ width: 44px
51
+ height: 44px
52
52
  @media #{$mobile}
53
- margin-right: 13px
54
- width: 35px
55
- height: 35px
53
+ margin-right: 10px
54
+ width: 33px
55
+ height: 33px
56
+ @media #{$w-374}
57
+ width: 26px
58
+ height: 26px
56
59
  img
57
60
  display: block
58
61
  @media #{$tablet}
59
62
  transform: scale(.7)
60
63
  @media #{$mobile}
61
- transform: scale(.55)
64
+ transform: scale(.52)
65
+ @media #{$w-374}
66
+ transform: scale(.45)
62
67
  &:nth-last-child(1)
63
68
  margin-right: 0
69
+ &-close-map
70
+ z-index: 4
64
71
  &-map
65
72
  position: absolute
66
73
  left: 45px
67
74
  bottom: 35px
68
75
  z-index: 3
69
76
  border-radius: 10px
70
- border: 8px solid $white
71
- background-color: $white
72
77
  opacity: 1
73
78
  transition: opacity .5s
79
+ @include noTouch
80
+ &::before
81
+ content: ''
82
+ position: absolute
83
+ z-index: -1
84
+ left: 50%
85
+ top: 50%
86
+ transform: translate(-50%, -50%)
87
+ width: calc(100% + 16px)
88
+ height: calc(100% + 16px)
89
+ border-radius: inherit
90
+ background-color: $white
74
91
  @media #{$tablet}
75
92
  left: 20px
76
- bottom: 20px
77
93
  transform: scale(.6)
78
94
  transform-origin: 0% 100%
79
- svg
80
- polygon
81
- opacity: 0
82
- &--scaled
83
- transform: scale(1) !important
95
+ @media #{$mobile}
96
+ transform: scale(.4)
97
+ @media #{$w-374}
98
+ bottom: 30px
99
+ transform: scale(.35)
100
+ &--scaled
101
+ @media #{$tablet}
102
+ transform: scale(1.4) translate(-50%, 50%)
103
+ left: 50%
104
+ bottom: 50%
105
+ &::after
106
+ content: ''
107
+ position: absolute
108
+ z-index: -2
109
+ left: 50%
110
+ top: 50%
111
+ transform: translate(-50%, -50%)
112
+ width: 100vw
113
+ height: calc(100 * var(--vh))
114
+ background-color: transparentize(#C4C4C4, .2)
84
115
  svg
85
116
  polygon
86
117
  &:active
87
118
  opacity: .3 !important
88
- @media #{$mobile}
89
- transform: scale(.4)
119
+ @media #{$mobile}
120
+ transform: scale(1) translate(-50%, 50%)
90
121
  &--hidden
91
122
  opacity: 0
92
123
  pointer-events: none
93
124
  img
94
- width: 195px
125
+ width: 200px
95
126
  border-radius: none
96
127
  display: block
97
128
  @include noSelect
@@ -102,7 +133,7 @@
102
133
  position: absolute
103
134
  left: 0
104
135
  top: 0
105
- width: 195px
136
+ width: 200px
106
137
  height: 100%
107
138
  z-index: 3
108
139
  display: block
package/build/assets/sass/components/tabs.sass CHANGED
@@ -11,9 +11,10 @@
11
11
  align-items: center
12
12
  justify-content: flex-end
13
13
  @media #{$tablet}
14
- flex-direction: column
15
14
  right: 20px
16
- bottom: 20px
15
+ bottom: 35px
16
+ @media #{$w-374}
17
+ bottom: 30px
17
18
  .widget-tab-button
18
19
  @include customButton
19
20
  width: 72px
@@ -29,16 +30,19 @@
29
30
  font-weight: bold
30
31
  margin-left: 40px
31
32
  @media #{$tablet}
33
+ margin-left: 20px
32
34
  width: 60px
33
35
  height: 60px
34
- font-size: 24px
35
- margin-left: 0px
36
- margin-top: 20px
36
+ font-size: 22px
37
37
  @media #{$mobile}
38
- margin-top: 15px
39
- font-size: 18px
40
- width: 45px
41
- height: 45px
38
+ margin-left: 10px
39
+ font-size: 17px
40
+ width: 44px
41
+ height: 44px
42
+ @media #{$w-374}
43
+ width: 36px
44
+ height: 36px
45
+ font-size: 14px
42
46
  &--active
43
47
  background-color: $mainColor
44
48
 
@@ -50,7 +54,7 @@
50
54
  justify-content: center
51
55
  padding: 60px 30px
52
56
  @media (max-width: 630px)
53
- padding: 60px 15px
57
+ padding: 60px 20px
54
58
  &__image
55
59
  max-width: 100%
56
60
  max-height: 100%
@@ -59,8 +63,7 @@
59
63
  &__threesixty
60
64
  width: 100%
61
65
  height: 100%
62
- touch-action: none
63
- -webkit-touch-action: none
66
+ @include noTouch
64
67
  &-start
65
68
  @include customButton
66
69
  position: absolute
@@ -70,38 +73,70 @@
70
73
  display: flex
71
74
  align-items: center
72
75
  justify-content: center
73
- padding: 0 30px 0 27px
76
+ padding: 0 25px 0 10px
74
77
  background-color: $gray
75
78
  border-radius: 38px
76
79
  height: 72px
80
+ width: 202px
77
81
  @media #{$tablet}
78
82
  height: 60px
79
- width: 60px
80
- padding: 0
81
- left: 20px
82
- bottom: 20px
83
- transform: none
83
+ width: 166px
84
+ padding: 0 20px 0 8px
85
+ bottom: 35px
84
86
  @media #{$mobile}
85
- width: 45px
86
- height: 45px
87
- img
88
- display: block
89
- margin-right: 20px
90
- position: relative
91
- top: 2px
87
+ height: 44px
88
+ width: 115px
89
+ padding: 0 10px 0 6px
90
+ @media #{$w-374}
91
+ height: 36px
92
+ width: 94px
93
+ padding: 0 8px 0 6px
94
+ bottom: 30px
95
+ &-icon
96
+ display: flex
97
+ align-items: center
98
+ justify-content: center
99
+ border-radius: 50%
100
+ background-color: $white
101
+ margin-right: 18px
102
+ padding: 10px
92
103
  @media #{$tablet}
93
- top: 0
94
- width: 30px
95
- margin-right: 0
104
+ padding: 7px
105
+ margin-right: 15px
96
106
  @media #{$mobile}
97
- width: 20px
107
+ margin-right: 7px
108
+ @media #{$w-374}
109
+ padding: 6px
110
+ margin-right: 5px
111
+ img
112
+ display: block
113
+ position: relative
114
+ top: 2px
115
+ width: 34px
116
+ @media #{$tablet}
117
+ width: 30px
118
+ top: 1px
119
+ @media #{$mobile}
120
+ width: 19px
121
+ top: 0
122
+ @media #{$w-374}
123
+ width: 15px
98
124
  span
99
125
  font-size: 24px
100
126
  font-weight: bold
101
127
  color: $text-dark
102
128
  text-transform: uppercase
129
+ width: 100%
130
+ display: block
131
+ text-align: center
132
+ position: relative
133
+ top: 1px
103
134
  @media #{$tablet}
104
- display: none
135
+ font-size: 20px
136
+ @media #{$mobile}
137
+ font-size: 14px
138
+ @media #{$w-374}
139
+ font-size: 12px
105
140
  &-container
106
141
  width: 100% !important
107
142
  height: 100% !important
package/build/assets/sass/index.sass CHANGED
@@ -1,15 +1,6 @@
1
1
  @import './vars'
2
2
  @import './mixin'
3
3
 
4
- *, *:before, *:after
5
- box-sizing: border-box
6
- -webkit-box-sizing: border-box
7
- margin: 0
8
- padding: 0
9
-
10
- html, body
11
- font-size: 20px
12
-
13
4
  .widget-application
14
5
  --vh: 100vh
15
6
 
@@ -19,15 +10,20 @@ html, body
19
10
  position: relative
20
11
  z-index: 1
21
12
  background-color: $white
13
+ font-size: 20px
22
14
 
23
15
  *, *:before, *:after
24
- font-family: 'Roboto Mono', sans-serif
25
16
  -webkit-font-smoothing: antialiased
26
17
  -moz-osx-font-smoothing: grayscale
27
- outline: none
28
- font-weight: 700
18
+ font-family: 'Roboto Mono', sans-serif
29
19
  text-decoration: none
20
+ font-weight: 700
30
21
  color: $text-dark
22
+ outline: none
23
+ padding: 0
24
+ margin: 0
25
+ box-sizing: border-box
26
+ -webkit-box-sizing: border-box
31
27
 
32
28
  .widget-logo
33
29
  position: absolute
@@ -36,7 +32,9 @@ html, body
36
32
  z-index: 3
37
33
  @media #{$tablet}
38
34
  left: 20px
39
- top: 20px
35
+ top: 30px
36
+ @media #{$w-374}
37
+ top: 25px
40
38
  img
41
39
  display: block
42
40
  width: 82px
@@ -47,22 +45,30 @@ html, body
47
45
  width: 65px
48
46
  height: 65px
49
47
  @media #{$mobile}
50
- width: 40px
51
- height: 40px
48
+ width: 42px
49
+ height: 42px
50
+ @media #{$w-374}
51
+ width: 36px
52
+ height: 36px
52
53
 
54
+ .widget-tab__panorama-close-map,
53
55
  .widget-enter-fullscreen,
54
56
  .widget-exit-fullscreen
55
57
  position: absolute
56
58
  right: 45px
57
59
  top: 36px
58
60
  z-index: 3
59
- @include customButton
60
61
  padding: 10px
62
+ touch-action: none
63
+ @include customButton
61
64
  @media #{$tablet}
62
- right: 20px
63
- top: 23px
65
+ right: 17px
66
+ top: 35px
64
67
  @media #{$mobile}
65
68
  padding: 5px
69
+ right: 20px
70
+ @media #{$w-374}
71
+ top: 25px
66
72
  img
67
73
  display: block
68
74
  width: 50px
@@ -73,26 +79,11 @@ html, body
73
79
  width: 40px
74
80
  height: 40px
75
81
  @media #{$mobile}
76
- width: 30px
77
- height: 30px
78
-
79
- .widget-close
80
- position: absolute
81
- display: flex
82
- align-items: center
83
- justify-content: center
84
- z-index: 3
85
- right: 15px
86
- top: 15px
87
- color: $black
88
- background-color: $mainColor
89
- padding: 5px 15px
90
- border-radius: 10px
91
- font-size: .8rem
92
- border: none
93
- cursor: pointer
94
- &:hover
95
- box-shadow: 1px 1px 10px rgba(0, 0, 0, .15)
82
+ width: 32px
83
+ height: 32px
84
+ @media #{$w-374}
85
+ width: 26px
86
+ height: 26px
96
87
 
97
88
  @import './components/tabs'
98
89
  @import './components/instructions'
package/build/assets/sass/vars.sass CHANGED
@@ -1,3 +1,4 @@
1
+ $w-374: "only screen and (max-width: 374px)"
1
2
  $mobile: "only screen and (max-width: 545px)"
2
3
  $tablet: "only screen and (max-width: 900px)"
3
4
  $laptop: "only screen and (max-width: 1440px)"
@@ -17,6 +18,10 @@ $text-dark: #413E3E
17
18
  user-drag: none
18
19
  -webkit-user-drag: none
19
20
 
21
+ @mixin noTouch
22
+ touch-action: none
23
+ -webkit-touch-action: none
24
+
20
25
  @mixin highResolution
21
26
  -webkit-backface-visibility: hidden
22
27
  -ms-transform: translateZ(0)
package/build/components/Application.js CHANGED
@@ -100,6 +100,7 @@ var Application = (0, _mobxReactLite.observer)(function (_ref) {
100
100
 
101
101
  var getTabButton = function getTabButton(button, index) {
102
102
  if (!_store.default.isTabIncluded(button.tab) || _store.default.config.tabs.length < 2) return null;
103
+ if (!_store.default.controlsVisible) return null;
103
104
  return /*#__PURE__*/_react.default.createElement(_TabButton.default, {
104
105
  key: index,
105
106
  text: button.text,
@@ -124,7 +125,7 @@ var Application = (0, _mobxReactLite.observer)(function (_ref) {
124
125
  }, /*#__PURE__*/_react.default.createElement("img", {
125
126
  src: config.logo,
126
127
  alt: "logo"
127
- })), /*#__PURE__*/_react.default.createElement(_FullScreenButton.default, null), /*#__PURE__*/_react.default.createElement("div", {
128
+ })), _store.default.controlsVisible && /*#__PURE__*/_react.default.createElement(_FullScreenButton.default, null), /*#__PURE__*/_react.default.createElement("div", {
128
129
  className: "widget-tab-buttons"
129
130
  }, tabButtons.map(getTabButton)));
130
131
  });
package/build/components/PanoramaTab.js CHANGED
@@ -53,6 +53,8 @@ var _x = _interopRequireDefault(require("../assets/icons/1x.svg"));
53
53
 
54
54
  var _x2 = _interopRequireDefault(require("../assets/icons/2x.svg"));
55
55
 
56
+ var _close = _interopRequireDefault(require("../assets/icons/close.svg"));
57
+
56
58
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
57
59
 
58
60
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -274,50 +276,55 @@ var PanoramaTab = function PanoramaTab(_ref4) {
274
276
  setWindowSize = _useState8[1];
275
277
 
276
278
  var _useState9 = (0, _react.useState)({
277
- width: '195px',
279
+ width: '200px',
278
280
  height: 'auto'
279
281
  }),
280
282
  _useState10 = _slicedToArray(_useState9, 2),
281
283
  mapSize = _useState10[0],
282
284
  setMapSize = _useState10[1];
283
285
 
284
- var _useState11 = (0, _react.useState)({
286
+ var _useState11 = (0, _react.useState)(false),
287
+ _useState12 = _slicedToArray(_useState11, 2),
288
+ mapOpen = _useState12[0],
289
+ setMapState = _useState12[1];
290
+
291
+ var _useState13 = (0, _react.useState)({
285
292
  X: 1,
286
293
  Y: 1
287
294
  }),
288
- _useState12 = _slicedToArray(_useState11, 2),
289
- planScale = _useState12[0],
290
- setPlanScale = _useState12[1];
291
-
292
- var _useState13 = (0, _react.useState)(true),
293
295
  _useState14 = _slicedToArray(_useState13, 2),
294
- isMapDisabled = _useState14[0],
295
- setMapDisabledState = _useState14[1];
296
+ planScale = _useState14[0],
297
+ setPlanScale = _useState14[1];
296
298
 
297
- var _useState15 = (0, _react.useState)(false),
299
+ var _useState15 = (0, _react.useState)(true),
298
300
  _useState16 = _slicedToArray(_useState15, 2),
299
- autoplayEnabled = _useState16[0],
300
- setAutoplayState = _useState16[1];
301
+ isMapDisabled = _useState16[0],
302
+ setMapDisabledState = _useState16[1];
301
303
 
302
- var _useState17 = (0, _react.useState)(cameraFovValues.x1),
304
+ var _useState17 = (0, _react.useState)(false),
303
305
  _useState18 = _slicedToArray(_useState17, 2),
304
- cameraFov = _useState18[0],
305
- setCameraFov = _useState18[1];
306
+ autoplayEnabled = _useState18[0],
307
+ setAutoplayState = _useState18[1];
306
308
 
307
- var _useState19 = (0, _react.useState)(0),
309
+ var _useState19 = (0, _react.useState)(cameraFovValues.x1),
308
310
  _useState20 = _slicedToArray(_useState19, 2),
309
- currentRoomIndex = _useState20[0],
310
- setCurrentRoomIndex = _useState20[1];
311
+ cameraFov = _useState20[0],
312
+ setCameraFov = _useState20[1];
311
313
 
312
- var _useState21 = (0, _react.useState)([]),
314
+ var _useState21 = (0, _react.useState)(0),
313
315
  _useState22 = _slicedToArray(_useState21, 2),
314
- panoramas = _useState22[0],
315
- setPanoramas = _useState22[1];
316
+ currentRoomIndex = _useState22[0],
317
+ setCurrentRoomIndex = _useState22[1];
316
318
 
317
- var _useState23 = (0, _react.useState)(null),
319
+ var _useState23 = (0, _react.useState)([]),
318
320
  _useState24 = _slicedToArray(_useState23, 2),
319
- viewer = _useState24[0],
320
- setViewer = _useState24[1];
321
+ panoramas = _useState24[0],
322
+ setPanoramas = _useState24[1];
323
+
324
+ var _useState25 = (0, _react.useState)(null),
325
+ _useState26 = _slicedToArray(_useState25, 2),
326
+ viewer = _useState26[0],
327
+ setViewer = _useState26[1];
321
328
 
322
329
  var changePanorama = function changePanorama(panorama) {
323
330
  setCurrentRoomIndex(panorama['panorama_index']);
@@ -333,7 +340,7 @@ var PanoramaTab = function PanoramaTab(_ref4) {
333
340
  var imageWidth = image.naturalWidth;
334
341
  var imageHeight = image.naturalHeight;
335
342
  var imageDelta = imageWidth / imageHeight;
336
- var maxWidth = 195;
343
+ var maxWidth = 200;
337
344
  var maxHeight = clientHeight - 200;
338
345
  var width = maxWidth;
339
346
  var height = width / imageDelta;
@@ -412,18 +419,19 @@ var PanoramaTab = function PanoramaTab(_ref4) {
412
419
  viewer.enableAutoRate();
413
420
  };
414
421
 
415
- var updateWindowWidth = function updateWindowWidth() {
416
- return setWindowSize({
417
- width: window.innerWidth,
418
- height: window.innerHeight
419
- });
420
- };
421
-
422
422
  (0, _react.useEffect)(function () {
423
- window.addEventListener('resize', updateWindowWidth);
424
- updateWindowWidth();
423
+ var onResize = function onResize() {
424
+ setWindowSize({
425
+ width: window.innerWidth,
426
+ height: window.innerHeight
427
+ });
428
+ closeMap();
429
+ };
430
+
431
+ onResize();
432
+ window.addEventListener('resize', onResize);
425
433
  return function cleanup() {
426
- window.removeEventListener('resize', updateWindowWidth);
434
+ window.removeEventListener('resize', onResize);
427
435
  };
428
436
  }, []);
429
437
  (0, _react.useEffect)(function () {
@@ -523,23 +531,36 @@ var PanoramaTab = function PanoramaTab(_ref4) {
523
531
  }).toString();
524
532
  };
525
533
 
534
+ var openMap = function openMap() {
535
+ _store.default.hideControls();
536
+
537
+ setMapState(true);
538
+ };
539
+
540
+ var closeMap = function closeMap() {
541
+ _store.default.showControls();
542
+
543
+ setMapState(false);
544
+ };
545
+
526
546
  var onMapClick = function onMapClick(event) {
527
547
  if (loadingState) return;
528
- var map = document.querySelector('.widget-tab__panorama-map');
529
548
 
530
549
  if (windowSize.width <= _deviceWidth.deviceWidth.tablet) {
531
- if (!map.classList.contains('widget-tab__panorama-map--scaled')) {
532
- map.classList.add('widget-tab__panorama-map--scaled');
550
+ if (!mapOpen) {
551
+ openMap();
533
552
  return;
534
553
  }
535
554
  }
536
555
 
556
+ var map = document.querySelector('.widget-tab__panorama-map');
557
+ var mapScale = map.getBoundingClientRect().width / map.offsetWidth;
537
558
  var image = document.querySelector('.widget-tab__panorama-map img');
538
559
  var offset = image.getBoundingClientRect();
539
560
  var clientX = event.clientX,
540
561
  clientY = event.clientY;
541
- var x = (clientX - offset.left) / planScale.X;
542
- var y = (clientY - offset.top) / planScale.Y;
562
+ var x = (clientX - offset.left) / mapScale / planScale.X;
563
+ var y = (clientY - offset.top) / mapScale / planScale.Y;
543
564
  var availablePanoramas = panoramas.filter(function (_ref9) {
544
565
  var userData = _ref9.userData;
545
566
  return (0, _geometric.pointInPolygon)([x, y], userData.points);
@@ -548,11 +569,25 @@ var PanoramaTab = function PanoramaTab(_ref4) {
548
569
  var _getClosestPanorama2 = (0, _panoramaHelpers.getClosestPanorama)([x, y], availablePanoramas),
549
570
  panorama = _getClosestPanorama2.panorama;
550
571
 
551
- map.classList.remove('widget-tab__panorama-map--scaled');
572
+ closeMap();
552
573
  if (!panorama) return;
553
574
  changePanorama(panorama);
554
575
  };
555
576
 
577
+ var getMapClass = function getMapClass() {
578
+ var className = 'widget-tab__panorama-map';
579
+
580
+ if (isMapDisabled) {
581
+ className += ' widget-tab__panorama-map--hidden';
582
+ }
583
+
584
+ if (mapOpen) {
585
+ className += ' widget-tab__panorama-map--scaled';
586
+ }
587
+
588
+ return className;
589
+ };
590
+
556
591
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
557
592
  className: "widget-tab__panorama"
558
593
  }, /*#__PURE__*/_react.default.createElement("div", {
@@ -560,8 +595,14 @@ var PanoramaTab = function PanoramaTab(_ref4) {
560
595
  onContextMenu: _helpers.preventRightClick
561
596
  }), loadingState && /*#__PURE__*/_react.default.createElement(_Loader.default, {
562
597
  absolute: true
563
- }), /*#__PURE__*/_react.default.createElement("div", {
564
- className: "widget-tab__panorama-map ".concat(isMapDisabled ? 'widget-tab__panorama-map--hidden' : '')
598
+ }), mapOpen && /*#__PURE__*/_react.default.createElement("div", {
599
+ className: "widget-tab__panorama-close-map",
600
+ onClick: closeMap
601
+ }, /*#__PURE__*/_react.default.createElement("img", {
602
+ src: _close.default,
603
+ alt: "close-map"
604
+ })), /*#__PURE__*/_react.default.createElement("div", {
605
+ className: getMapClass()
565
606
  }, /*#__PURE__*/_react.default.createElement("img", {
566
607
  src: planImage,
567
608
  style: mapSize,
package/build/components/RotationTab.js CHANGED
@@ -63,30 +63,36 @@ var RotationTab = function RotationTab(_ref) {
63
63
  showInstructions = _useState2[0],
64
64
  setInstructionsState = _useState2[1];
65
65
 
66
- var _useState3 = (0, _react.useState)(0),
66
+ var _useState3 = (0, _react.useState)(false),
67
67
  _useState4 = _slicedToArray(_useState3, 2),
68
- activeIndex = _useState4[0],
69
- setActiveIndex = _useState4[1];
68
+ initialized = _useState4[0],
69
+ setInitState = _useState4[1];
70
70
 
71
- var _useState5 = (0, _react.useState)(false),
71
+ var _useState5 = (0, _react.useState)(0),
72
72
  _useState6 = _slicedToArray(_useState5, 2),
73
- active = _useState6[0],
74
- setActiveState = _useState6[1];
73
+ activeIndex = _useState6[0],
74
+ setActiveIndex = _useState6[1];
75
+
76
+ var _useState7 = (0, _react.useState)(null),
77
+ _useState8 = _slicedToArray(_useState7, 2),
78
+ rotation = _useState8[0],
79
+ setRotation = _useState8[1];
80
+
81
+ var updateRotation = function updateRotation() {
82
+ setActiveIndex(this.index);
83
+ };
75
84
 
76
85
  var onStart = function onStart() {
77
86
  setInstructionsState(false);
87
+ setInitState(true);
78
88
  var container = document.querySelector('.widget-tab__threesixty-container');
79
89
  var widgetTab = document.querySelector('.widget-tab');
80
- var rotation = new _threesixty.default(container, {
90
+ var newRotation = new _threesixty.default(container, {
81
91
  image: _toConsumableArray(images),
82
92
  parentElement: widgetTab,
83
93
  inverted: true
84
94
  });
85
-
86
- rotation._update = function () {
87
- return setActiveIndex(rotation.index);
88
- };
89
-
95
+ newRotation._update = updateRotation;
90
96
  var lastIndex = 0;
91
97
  var controller = (0, _panzoom.default)(container, {
92
98
  maxZoom: 3,
@@ -95,27 +101,35 @@ var RotationTab = function RotationTab(_ref) {
95
101
  return !event.shiftKey;
96
102
  }
97
103
  });
104
+ newRotation.controller = controller;
98
105
  controller.on('panstart', function () {
99
- lastIndex = rotation.index;
106
+ lastIndex = newRotation.index;
107
+ newRotation.stop();
100
108
 
101
- rotation._update = function () {};
109
+ newRotation._update = function () {};
102
110
  });
103
111
  controller.on('panend', function () {
104
- rotation.goto(lastIndex);
105
-
106
- rotation._update = function () {
107
- return setActiveIndex(rotation.index);
108
- };
112
+ newRotation.goto(lastIndex);
113
+ newRotation._update = updateRotation;
109
114
  });
115
+ setRotation(newRotation);
116
+ };
117
+
118
+ var onEnd = function onEnd() {
119
+ rotation.controller.pause();
120
+ rotation.container.style.transform = 'none';
121
+ rotation.destroy();
122
+ setActiveIndex(0);
123
+ setRotation(null);
124
+ setInitState(false);
110
125
  };
111
126
 
112
127
  var openInstructions = function openInstructions() {
113
- setInstructionsState(true);
114
- setActiveState(true);
128
+ return setInstructionsState(true);
115
129
  };
116
130
 
117
131
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
118
- className: "widget-tab__threesixty ".concat(active ? 'widget-tab__threesixty--active' : '')
132
+ className: "widget-tab__threesixty ".concat(initialized ? 'widget-tab__threesixty--active' : '')
119
133
  }, /*#__PURE__*/_react.default.createElement("div", {
120
134
  className: "widget-tab__threesixty-container",
121
135
  onContextMenu: _helpers.preventRightClick
@@ -126,13 +140,15 @@ var RotationTab = function RotationTab(_ref) {
126
140
  alt: "rotation-view-".concat(index),
127
141
  className: activeIndex === index ? 'active' : ''
128
142
  });
129
- }))), !active && !showInstructions && /*#__PURE__*/_react.default.createElement("button", {
143
+ }))), !showInstructions && /*#__PURE__*/_react.default.createElement("button", {
130
144
  className: "widget-tab__threesixty-start",
131
- onClick: openInstructions
145
+ onClick: initialized ? onEnd : openInstructions
146
+ }, /*#__PURE__*/_react.default.createElement("div", {
147
+ className: "widget-tab__threesixty-start-icon"
132
148
  }, /*#__PURE__*/_react.default.createElement("img", {
133
149
  src: _rotation.default,
134
150
  alt: "start-icon"
135
- }), /*#__PURE__*/_react.default.createElement("span", null, _locale.default.getLocaleText('rotate'))), showInstructions && /*#__PURE__*/_react.default.createElement(_Instructions.default, {
151
+ })), /*#__PURE__*/_react.default.createElement("span", null, _locale.default.getLocaleText(initialized ? 'stop' : 'rotate'))), showInstructions && /*#__PURE__*/_react.default.createElement(_Instructions.default, {
136
152
  disabled: disabled,
137
153
  steps: instructionSteps,
138
154
  onClick: onStart
package/build/config/defaultConfig.js CHANGED
@@ -21,7 +21,7 @@ var defaultConfig = {
21
21
  rotationImages: [],
22
22
  panoramaImages: [],
23
23
  json: null,
24
- locale: 'en-US',
24
+ locale: 'en',
25
25
  API_URL: 'https://backend.estate.hart-digital.com'
26
26
  };
27
27
  var _default = defaultConfig;
package/build/locale/{en_US → en}/data.json RENAMED
@@ -2,6 +2,7 @@
2
2
  "research-plan": "Research plan",
3
3
  "rotate-plan": "Rotate plan",
4
4
  "rotate": "Rotate",
5
+ "stop": "Stop",
5
6
  "plan": "Plan",
6
7
  "off": "Off",
7
8
  "on": "On",
package/build/locale/index.js CHANGED
@@ -9,9 +9,9 @@ var _react = _interopRequireDefault(require("react"));
9
9
 
10
10
  var _mobx = require("mobx");
11
11
 
12
- var _data = _interopRequireDefault(require("./ru_RU/data.json"));
12
+ var _data = _interopRequireDefault(require("./ru/data.json"));
13
13
 
14
- var _data2 = _interopRequireDefault(require("./en_US/data.json"));
14
+ var _data2 = _interopRequireDefault(require("./en/data.json"));
15
15
 
16
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
17
17
 
@@ -33,14 +33,14 @@ var LocaleStore = /*#__PURE__*/function () {
33
33
 
34
34
  _classCallCheck(this, LocaleStore);
35
35
 
36
- _defineProperty(this, "availableLocales", ['ru-RU', 'en-US']);
36
+ _defineProperty(this, "availableLocales", ['ru', 'en']);
37
37
 
38
38
  _defineProperty(this, "locales", {
39
- 'ru-RU': _data.default,
40
- 'en-US': _data2.default
39
+ 'ru': _data.default,
40
+ 'en': _data2.default
41
41
  });
42
42
 
43
- _defineProperty(this, "currentLocale", 'en-US');
43
+ _defineProperty(this, "currentLocale", 'en');
44
44
 
45
45
  _defineProperty(this, "getLocaleText", function (key) {
46
46
  return _this.localeData[key];
package/build/locale/{ru_RU → ru}/data.json RENAMED
@@ -1,7 +1,8 @@
1
1
  {
2
2
  "research-plan": "Исследовать планировку",
3
3
  "rotate-plan": "Вращать планировку",
4
- "rotate": "Вращать",
4
+ "rotate": "Старт",
5
+ "stop": "Стоп",
5
6
  "plan": "Планировка",
6
7
  "off": "Выкл",
7
8
  "on": "Вкл",
package/build/store/index.js CHANGED
@@ -44,6 +44,8 @@ var Store = /*#__PURE__*/function () {
44
44
 
45
45
  _defineProperty(this, "listeners", {});
46
46
 
47
+ _defineProperty(this, "controlsVisible", true);
48
+
47
49
  (0, _mobx.makeAutoObservable)(this);
48
50
  }
49
51
 
@@ -76,6 +78,16 @@ var Store = /*#__PURE__*/function () {
76
78
  value: function setConfig(config) {
77
79
  this.config = config;
78
80
  }
81
+ }, {
82
+ key: "hideControls",
83
+ value: function hideControls() {
84
+ this.controlsVisible = false;
85
+ }
86
+ }, {
87
+ key: "showControls",
88
+ value: function showControls() {
89
+ this.controlsVisible = true;
90
+ }
79
91
  }, {
80
92
  key: "addEventListener",
81
93
  value: function addEventListener(event, callback) {
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "HART Estate widget",
4
4
  "author": "HART",
5
5
  "keywords": [],
6
- "version": "0.0.58",
6
+ "version": "0.0.61",
7
7
  "private": false,
8
8
  "main": "build/index.js",
9
9
  "module": "build/index.js",