Javascript function not getting called

[dreidesign]

Hello,

I'm trying to integrate an intro/help image for a turnaround.

This is my intro image in the xml:

    <hotspot id="intro" renderMode="2" indicatorImage="" margin="0,0,0,0" align="center,center">
      <spotinfo src="images/spots/start_icon.png" imgWidth="534" imgNoScale="false" clickAction="11" clickData="hideIntro()" />
    </hotspot>

This is my javascript in the index.html:

<script language="javascript" type="text/javascript">
function initializeAPI(api){
    var hideHotspot = false;

    function hideIntro(){
		console.log("test");
        //e.preventDefault();
        hideHotspot = !hideHotspot;
        api.hotspots.hide("intro", hideHotspot);
    };
}

jQuery(document).ready(function(){

    jQuery('#wr360PlayerId').rotator({
        licenseFileURL: 'license.lic',
		configFileURL: '360_assets/index/index.xml',
		graphicsPath: 'imagerotator/html/img/round',
        responsiveBaseWidth: 2560,
        responsiveMinHeight: 0,
        googleEventTracking: false,
        apiReadyCallback: function(api, isFullScreen){
            // apiReadyCallback is also called when user enters full-screen which creates a separate viewer object.
			
            if (!isFullScreen) 
                initializeAPI(api);
        },
    });

});

I've looked at the browser console, but not getting any errors. I even tried to do a normal href for the image and set it to "javascript:hideIntro();". But then I'm getting "function is not definied".

Any hints?

 

[WebSupport]

Hi!

hideIntro(){} is not visible outside of initializeAPI(){}. You would need to move it outside.

PS: we also have api.hotspots.onAction() which you can call to subscribe to the hotspot action events. You can see how it works in the api template here: https://webrotate360.s3.amazonaws.com/s ... plates.zip

 

[dreidesign]

Thx this worked.

 

[riyasathe]

Thanks this topic was helpful for me. Excellent thread!