{"id":1406,"date":"2026-03-19T21:01:21","date_gmt":"2026-03-19T21:01:21","guid":{"rendered":"https:\/\/brightwrx.com\/south-florida\/?page_id=1406"},"modified":"2026-03-19T21:11:04","modified_gmt":"2026-03-19T21:11:04","slug":"demo","status":"publish","type":"page","link":"https:\/\/brightwrx.com\/south-florida\/services\/permanent-lighting\/demo\/","title":{"rendered":"Demo"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"1406\" class=\"elementor elementor-1406\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-895d5aa e-con-full e-flex e-con e-child\" data-id=\"895d5aa\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e428f2f elementor-widget__width-inherit elementor-widget elementor-widget-html\" data-id=\"e428f2f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\n<!-- WordPress\/Elementor Compatible HTML -->\n<!-- Place this in an HTML widget in Elementor -->\n\n<div class=\"vn-lighting-demo\" role=\"main\" aria-label=\"Interactive lighting control demo\">\n\n    <div class=\"showcase\" role=\"img\" aria-label=\"Lighting scene display area\" id=\"displayImage\" style=\"background-image: url('https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/dark.jpg'); background-size: cover; background-position: center;\">\n    <\/div>\n\n    <div class=\"phone-container\" role=\"region\" aria-label=\"Lighting control interface\">\n        <img decoding=\"async\" src=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/handholding.png\" alt=\"Hand holding phone with lighting control app interface\">\n\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n        <div class=\"highlight-overlay\" aria-hidden=\"true\"><\/div>\n\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/security.jpg\" aria-label=\"Security lighting scene\" title=\"Security lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/halloween.jpg\" aria-label=\"Halloween lighting scene\" title=\"Halloween lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/christmas.jpg\" aria-label=\"Christmas lighting scene\" title=\"Christmas lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/coolwhite.jpg\" aria-label=\"Cool white lighting scene\" title=\"Cool white lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/warmwhite.jpg\" aria-label=\"Warm white lighting scene\" title=\"Warm white lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/stpatricks.jpg\" aria-label=\"St. Patrick's Day lighting scene\" title=\"St. Patrick's Day lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/independence.jpg\" aria-label=\"Independence Day lighting scene\" title=\"Independence Day lighting scene\"><\/div>\n        <div class=\"hotspot\" data-image=\"https:\/\/brightwrx.com\/bend\/wp-content\/uploads\/sites\/2\/2026\/03\/dark.jpg\" aria-label=\"Lights off scene\" title=\"Lights off scene\"><\/div>\n    <\/div>\n\n<\/div>\n\n<script>\n\/\/ WordPress\/Elementor Compatible JavaScript\n(function() {\n    \/\/ Wait for DOM to be ready\n    function initLightingDemo() {\n        const displayImage = document.getElementById('displayImage');\n        const hotspots = document.querySelectorAll('.vn-lighting-demo .hotspot');\n        const highlightOverlays = document.querySelectorAll('.vn-lighting-demo .highlight-overlay');\n\n        \/\/ Preload images for better performance\n        const imageCache = {};\n        hotspots.forEach(hotspot => {\n            const imageSrc = hotspot.getAttribute('data-image');\n            if (imageSrc) {\n                const img = new Image();\n                img.src = imageSrc;\n                imageCache[imageSrc] = img;\n            }\n        });\n\n        \/\/ Add click event listeners to hotspots\n        hotspots.forEach((hotspot, index) => {\n            hotspot.addEventListener('click', function() {\n                const imageSrc = hotspot.getAttribute('data-image');\n\n                if (imageSrc) {\n                    \/\/ Update the background image\n                    displayImage.style.backgroundImage = `url('${imageSrc}')`;\n\n                    \/\/ Clear all highlight overlays\n                    highlightOverlays.forEach(overlay => overlay.classList.remove('active'));\n\n                    \/\/ Activate the corresponding highlight overlay\n                    if (highlightOverlays[index]) {\n                        highlightOverlays[index].classList.add('active');\n                    }\n                }\n            });\n        });\n    }\n\n    \/\/ Initialize when DOM is ready\n    if (document.readyState === 'loading') {\n        document.addEventListener('DOMContentLoaded', initLightingDemo);\n    } else {\n        initLightingDemo();\n    }\n})();\n<\/script>\n\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-2bfbb6e3 elementor-reverse-mobile elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"2bfbb6e3\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d444446\" data-id=\"d444446\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":33,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"footnotes":""},"class_list":["post-1406","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/pages\/1406","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/comments?post=1406"}],"version-history":[{"count":7,"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/pages\/1406\/revisions"}],"predecessor-version":[{"id":1415,"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/pages\/1406\/revisions\/1415"}],"up":[{"embeddable":true,"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/pages\/33"}],"wp:attachment":[{"href":"https:\/\/brightwrx.com\/south-florida\/wp-json\/wp\/v2\/media?parent=1406"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}