scaleflex / js-cloudimage-360-view

Engage your customers with a stunning 360 view of your products. Any questions or issues, please report to https://github.com/scaleflex/js-cloudimage-360-view/issues
Other
2.02k stars 232 forks source link

Calling update() on a not-initialized lazyloaded viewer causes to add a duplicate 360 icon #138

Open Xriuk opened 1 year ago

Xriuk commented 1 year ago
<div
    class="cloudimage-360"
    id="tw-360-1"
    data-folder="https://localhost:44396/files/"
    data-image-list-x="[...]"
    data-lazyload
    data-lazyload-selector="lazyload"></div>

If a viewer with data-lazyload (or lazyload) set is not yet loaded and it's updated instead by calling window.CI360.update("tw-360-1"), this causes to add a 360 icon to it, which then gets added again after it loads causing a duplicate icon, and the second one does not get deleted.

I believe this is caused by https://github.com/scaleflex/js-cloudimage-360-view/blob/65f08fdb07f841b38821a430436ea0c113977f8e/src/ci360.service.js#L1072 which in turn creates the icon here https://github.com/scaleflex/js-cloudimage-360-view/blob/65f08fdb07f841b38821a430436ea0c113977f8e/src/ci360.service.js#L1333-L1344

This could be easily solved by checking isReady() before updating: https://github.com/scaleflex/js-cloudimage-360-view/blob/65f08fdb07f841b38821a430436ea0c113977f8e/src/ci360.service.js#L85-L92