InnovaStudio WYSIWYG Editor Integration

I use InnovaStudio WYSIWYG Editor, and I am trying to replace InnovaStudio's Asset Manager with CKFinder. There's a line in the editor configuration for what URL to use for the asset manager. I have pointed it at CKFinder. The part I can't get to work is getting the field to populate with the double-clicked file's path from CKFinder.

Innova Editor set's a local var, `sActiveAssetInput`, with the field name before lauching the asset manager. It provides this callback function for setting the field value:

function setAssetValue(v)
{
   document.getElementById(sActiveAssetInput).value = v;
}

The URL I've tried using to call CKFinder is as such: '/common/ckfinder/ckfinder.html?action=js&func=setAssetValue'

Mon, 04/05/2010 - 16:37

sonnysavage

Joined: 02/04/2010

Posts: 10

Re: Innova Editor Integration

My company just purchased the "Corporate Web Sites" license, and I need to get this working. This forum is what is listed on the CKFinder web site as the point-of-contact for support. Is there actually official support here?

Mon, 04/05/2010 - 16:53

alfonsoml

Joined: 31/12/2006

Posts: 3737

Re: Innova Editor Integration

Do you get any error in that code?
Does it happens with any browser?
Have you verified if the callback function is called and that "sActiveAssetInput" contains the id of the correct input?

Mon, 04/05/2010 - 17:25

sonnysavage

Joined: 02/04/2010

Posts: 10

Re: Innova Editor Integration

1) I get no errors. No JavaScript or PHP errors. CKFinder displays and can be browsed normally. Nothing appears to happen when double-clicking the thumbnail or using the "select" option in the context menu. CKFinder stays open, and the field remains unpopulated.
2) I have tested Firefox 3.6.3, IE 8, and Safari 4.0.4 on Windows XP. All broswers are behaving in the same way.
3) I double-checked InnovaStudio's code, and the callback functions are actually hard-coded for each form that calls the asset manager. Here's an example from the flash form:

function setAssetValue(v)
  {
  document.getElementById("inpSwfURL").value = v;
  }

The callback function only accepts the single parameter. Could this be causing the problem? I dug through the CKFinder JavaScript a bit to try to determine this myself, but the obfuscation makes it a bit difficult to read.

Mon, 04/05/2010 - 20:04

sonnysavage

Joined: 02/04/2010

Posts: 10

Re: InnovaStudio WYSIWYG Editor Integration

More Info:
The InnovaStudio WYSIWYG Editor has a "popup" for adding an image or flash file to the content. This pop-up is in an iframe. When it calls CKFinder (or it's own asset manager), that is also in an iframe. It appears that CKFinder is looking in the scope of the main window rather than the image/flash iframe that actually contains the field that needs to be populated. Is there a way to change this behavior?

Tue, 04/06/2010 - 00:28

sonnysavage

Joined: 02/04/2010

Posts: 10

(Sort of) Solution

(Sort of) Solution

I discovered, by digging through the DOM with Firebug, that InnovaStudio creates an ISWindow object where it places references to the windows that it spawns. I modified my callback function to loop over that object and call the setAssetValue() function for the appropriate iframe. This worked, but CKEditor still did not close itself. I assume that's because it didn't "know" how to close the iframe that it was inside. Is there a way to tell CKFinder how to close the window it's inside of? I can envision other cases where using an iframe would be useful.

I would prefer to have CKFinder to use the iframe display, but I finally got things working using a popup.

Editor config line:

oEdit1.cmdAssetManager = "parent.BrowseServerIS();";

Supporting functions:

// InnovaStudio WYSIWYG Editor version
function BrowseServerIS()
{
   // You can use the "CKFinder" class to render CKFinder in a page:
   var finder = new CKFinder();
   // The path for the installation of CKFinder (default = "/ckfinder/").
   finder.BasePath = '/common/ckfinder/';
   // Name of a function which is called when a file is selected in CKFinder.
   finder.SelectFunction = SetFileFieldIS;
   // Launch CKFinder
   finder.Popup();
}

// InnovaStudio WYSIWYG Editor version
function SetFileFieldIS(fileUrl, data)
{
   for (var i in ISWindow.objs) {
      if ((null != ISWindow.objs[i].rt.frm.contentWindow)
            && ('function' == typeof ISWindow.objs[i].rt.frm.contentWindow.setAssetValue)) {
         ISWindow.objs[i].rt.frm.contentWindow.setAssetValue(fileUrl);
      }
   }
}