Calling jQuery Function from Flash

Question

I'm trying to call an external JS function from flash using the ExternalInterface.call() method in action script. The function should open a modal window that has been written in jQuery. My problem is two fold:

1. How do I open this modal window without attaching the action to a link? I just want the window open and to pass in the URL.
2. Is there a better way to do this?

(Code below - I only included the relevent functions. If more if needed, let me know)

ActionScript:

import flash.external.ExternalInterface;

function openMapWindowLink(thingName):Void {
  ExternalInterface.call("openMapWindow",locationURL);
}

jQuery:

// Add the action to a link (this works)
function initAjaxPopups() {
    $('.ajax-popup').simpleLightbox({
     closeLink:'a.btn-close, a.close-popup',
     faderOpacity: 0.7,
     faderBackground: '#000',
     href:true,
     onClick: null
    });
}

// Open the lightbox from flash with url (not working correctly)
function openMapWindow(locationURL) {
    //alert('Clicked '+locationURL);
    $simpleLightbox({
     closeLink:'a.btn-close, a.close-popup',
     faderOpacity: 0.7,
     faderBackground: '#000',
     href:locationURL,
     onClick: null
    });

}

/* ajax lightbox plugin */
jQuery.fn.simpleLightbox = function(_options){
    var _options = jQuery.extend({
     lightboxContentBlock: '.lightbox',
     faderOpacity: 0.8,
     faderBackground: '#ffffff',
     closeLink:'a.close-btn, a.cancel',
     href:true,
     onClick: null
    },_options);


    var _popupCounter = 1;

    return this.each(function(i, _this){
     var _this = jQuery(_this);
     if (!_options.href)
      _this.lightboxContentBlock = _options.lightboxContentBlock;
     else _this.lightboxContentBlock = _this.attr('href');
     if (_this.lightboxContentBlock != '' && _this.lightboxContentBlock.length > 1) {
      _this.faderOpacity = _options.faderOpacity;
      _this.faderBackground = _options.faderBackground;
      _this.closeLink = _options.closeLink;
      var _fader;
      var _lightbox = $(_this.lightboxContentBlock);
      if (!jQuery('div.lightbox-fader').length)
       _fader = $('body').append('<div class="lightbox-fader"></div>');

      _fader = jQuery('div.lightbox-fader');
      _lightbox.css({
       'zIndex':999
      });
      _fader.css({
       opacity:_this.faderOpacity,
       backgroundColor:_this.faderBackground,
       display:'none',
       position:'absolute',
       top:0,
       left:0,
       zIndex:998,
       textIndent: -9999
      }).text('&nbsp;');
      _lightbox.shownFlag = false;
      _this.click(function(){
       if (jQuery.isFunction(_options.onClick)) {
        _options.onClick.apply(_this);
       }

       var _popupURL = _this.attr('href');
       if(jQuery('div[rel*="'+_popupURL+'"]').length == 0) {
        $.ajax({
         url: _popupURL,
         global: false,
         type: "GET",
         dataType: "html",
         success: function(msg){
          // append loaded popup
          _lightbox = $(msg);
          _lightbox.attr('rel',_popupURL).css({
           zIndex:999,
           position:'absolute',
           display:'block',
           top: -9999,
           left: -9999
          });
          _lightbox.attr('id','ajaxpopup'+_popupCounter);
          jQuery('body').append(_lightbox);

          // init js for lightbox
          if(typeof initPopupJS == "function"){
           initPopupJS(_lightbox);
          }
          _popupCounter++;

          // attach close event
          jQuery(_this.closeLink, _lightbox).click(function(){
           _lightbox.fadeOut(400, function(){
            _fader.fadeOut(300);
            _scroll = false;
           });
           return false;
          });

          // show lightbox
          _lightbox.hide();
          _lightbox.shownFlag = true;
          jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
          _fader.fadeIn(300, function(){
           _lightbox.fadeIn(400);
           jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
           if(typeof VSA_handleResize === 'function') {
            VSA_handleResize();
           }
          });
         },
         error: function(msg){
          alert('ajax error');
          return false;
         }
        });
       } else {
        _lightbox = jQuery('div[rel*="'+_popupURL+'"]');
        _lightbox.hide();
        _lightbox.shownFlag = true;
        jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
        _fader.fadeIn(300, function(){
         _lightbox.fadeIn(400);
         jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
         if(typeof VSA_handleResize === 'function') {
          VSA_handleResize();
         }
        });
       }
       return false;
      });
      jQuery(_this.closeLink).click(function(){
       _lightbox.fadeOut(400, function(){
        _fader.fadeOut(300);
        _scroll = false;
       });
       return false;
      });
      _fader.click(function(){
       _lightbox.fadeOut(400, function(){
        _fader.fadeOut(300);
       });
       return false;
      });
      var _scroll = false;
      jQuery.fn.simpleLightbox.positionLightbox = function (_lbox) {
       if(!_lbox.shownFlag) return false;
       var _height = 0;
       var _width = 0;
       var _minWidth = $('body > div:eq(0)').outerWidth();
       if (window.innerHeight) {
        _height = window.innerHeight;
        _width = window.innerWidth;
       } else {
        _height = document.documentElement.clientHeight;
        _width = document.documentElement.clientWidth;
       }
       var _thisHeight = _lbox.outerHeight();
       var _page = $('body');
       if (_lbox.length) {
        if (_width < _minWidth) {_fader.css('width',_minWidth);} else {_fader.css('width','100%');}
        if (_height > _page.innerHeight()) _fader.css('height',_height); else _fader.css('height',_page.innerHeight());
        if (_height > _thisHeight) {
         if ($.browser.msie && $.browser.version < 7) {
          _lbox.css({
           position:'absolute',
           top: (document.documentElement.scrollTop + (_height - _thisHeight) / 2)+"px"
          });
         } else {
          _lbox.css({
           position:'fixed',
           top: ((_height - _lbox.outerHeight()) / 2)+"px"
          });
         }
        }
        else {
         var _fh = parseInt(_fader.css('height'));
         if (!_scroll) {
         if (_fh - _thisHeight > parseInt($(document).scrollTop())) {
           _fh = parseInt($(document).scrollTop())
           _scroll = _fh;
          } else {
           _scroll = _fh - _thisHeight;
          }
         }
         _lbox.css({
          position:'absolute',
          top: _scroll
         });
        }
        if (_width > _lbox.outerWidth()) _lbox.css({left:((_width - _lbox.outerWidth()) / 2 + 10) + "px"});
        else _lbox.css({position:'absolute',left: 0});
       }
      }

      jQuery(window).resize(function(){
       if (_lightbox.is(':visible'))
        jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
      });
      jQuery(window).scroll(function(){
       if (_lightbox.is(':visible'))
        jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
      });

      jQuery.fn.simpleLightbox.positionLightbox(_lightbox);
       $(document).keydown(function (e) {
       if (!e) evt = window.event;
       if (e.keyCode == 27) {
        _lightbox.fadeOut(400, function(){
         _fader.fadeOut(300);
        });
       }
      });
     }
    });
}

Answer 1

If attaching lightBox to something which isn't a link it should be

$.simpleLightbox({...})  // with the "." after $

IF that doesnt work you could alter the lightBox plugin source, but this could be troublesome if you wish to update to a newer versions later.

This is a workaround that should work:

<a class="hidden" id="dummylink" href="#">&nbsp</a>

//on ready
$('#dummylink').simpleLightbox({...});


function openMapWindow(locationURL) {
   $("#dummylink").attr("href", locationURL).trigger('click');
}