Javascript on Issue Navigator not working correctly

[Ivana Navratilova]

I realize that this questions had been asked many times before, but I havent been able to find a solution that would actually work for me. I am creating a plugin that adds a webpanel on an issue page (like "Description", "Issue Links", etc.). There is a lot of javascript included in rendering the panel contents as well as some Ajax calls. Everything works like a charm when I am in a normal issue view.

However I noticed that when I am in the issue navigator, the javascript for the panel doesnt get loaded at all. The solution seemed to be simple - only add the right context to the module descriptor. Now the javascript was loading, but still wasnt working - it was running fine, but too early, the webpanel wasnt rendered at the time, so the script didnt have access to the fields and variables filled in through velocity template.

The problem was, that the original code was called from the $(document).ready function, which is fired before all things are loaded when you access the page from the issue navigator.

Most answers to other questions suggest using JIRA.Events.NEW_CONTENT_ADDED. I have tried that, monitoring the events and the reasons they fired for - on the issue navigator, only two reasons were used - JIRA.CONTENT_ADDED_REASON.pageLoad and JIRA.CONTENT_ADDED_REASON.panelRefreshed.

The only option that seems to be working is attaching my function to the panelRefreshed event (the pageLoad event is also fired too early). That way all the DOM is rendered, the javascript has access to all the fields and variables.

HOWEVER, there is one big problem - this event is triggered more than 10 times when viewing an issue in the issue navigator and since I need to make Ajax calls, this is simply unacceptable.

Is there some other event, that would truly mean "I have finished rendering the page completely, you can do your thing now", which would get fired only once? Or is there a way to somehow catch all the panelRefreshed events and only run the function from one of them and ignore the rest?

JIRA.bind(JIRA.Events.NEW_CONTENT_ADDED, function (e, context, reason) {
    console.log('EVENT reason ' + reason);

    //I need to make sure, that the initialize function is only called once
    if (reason == JIRA.CONTENT_ADDED_REASON.panelRefreshed) {
        try{
            initialize();
        } catch(e){
            console.log('error while initializing ' + e);
        }
    }
});

function initialize(){
    var someVariable = AJS.$('#someVariable').val();

    //the variable only has value with the panelRefreshed event reason, every other reason or event it is undefined
    console.log('variable - ' + someVariable);
    //a lot of other code...
}