Javascript function not getting called

CSS styling, controls, custom look and feel, custom packaging and deployment.
dreidesign
Posts: 2
Joined: Fri Sep 21, 2018 2:48 am
Contact:

Javascript function not getting called

Postby dreidesign » Wed Nov 28, 2018 2:06 am

Hello,

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

This is my intro image in the xml:

Code: Select all

    <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:

Code: Select all

<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
Posts: 897
Joined: Thu Aug 23, 2012 11:35 am
Location: Pasadena, CA
Contact:

Re: Javascript function not getting called

Postby WebSupport » Thu Nov 29, 2018 2:19 am

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


Return to “Viewer Development and Customizations”

cron