Implementing a Javascript Handler to Open the Editor or KCW from a KDP

Overview

The KDP provides the functionality to call javascript function defined on the page that embeds it.
This guide explain the use of this functionality to create a kdp button that when clicked opens a lightbox with kaltura editor or KCW.
Use the "KDP with Editors & KCW Kit" to easily and quickly set up an integrated page with KDP, editor and KCW.

KDP uiConf XML - adding a button

Use the uiconf.update api to edit your KDP uiConf xml and add the following line:

For more information about the KDP uiConf - Click here.
The k_click attribute indicate what the KDP will execute when the button will be clicked:
jsCall('gotoEditorWindow',myKplayer.kalturaEntry.entryId);pauseMedia()

• The jsCall is a KDP function that trigger javascript functions on the page, the first parameter jsCall get indicate the name of the javascript function to call to on page (in this case, the name of the function that will be called is "gotoEditorWindow"), and the second forward is additional values to pass to the javascript function that will be called (in this case, the entryId that is currently playing).
• The pauseMedia function will just verify that the KDP is paused immediately after calling the function - this is not mandatory.

Adding an edit, upload and custom buttons via Application Studio

The Application Studio provide a friendly interface to create KDP designs.
To add an edit or contribute button to the KDP, open the UGC & User Interaction tab under features, select the buttons to add, and you're all set to go.
The edit and upload buttons from the Application Studio call the following javascript functions:

• Edit button - gotoEditorWindow
• Upload button - gotoContributorWindow

To add more custom buttons via the Application Studio, open the Custom Buttons tab.

Implementing the javascript handler

After the user will click the buttons, the KDP will call the relevant function (as specified in the uiConf).
To open the editors or contribution wizard implement these functions and use swfObject to embed the editor or kcw widgets.
Following function will load an instance of the Kaltura Contribution Wizard:

KDP with Editors & KCW Kit

To ease the integration work and provide a quick way to start building a collaborative video editing site use the KDP with Editors & KCW Kit.
The kit is a php script and the php kaltura client library.

• The openEditorKCW.php - A PHP script that provide a set of basic functions to embed the KDP, KCW and editors (KAE and KSE). The script can be configured and modified to suit the target environment or design.
• The kaltura_client_v3 folder - this is the PHP Kaltura Client Library for api_v3. The client library is used to perform the creation of Kaltura Session.

Setting up the Kit

• Download the Kit.
• Extract the contents of the kit to a single folder on your localhost.
• Edit the openEditorKCW.php file.
• Modify the following constants to setup the partner credentials:
  
  // Change ENTER_YOUR_PARTNER_ID_HERE with your partner id as assigned to you when registering on corp.kaltura.com/about/signup or installation of KalturaCE.
  define("KALTURA_PARTNER_ID", ENTER_YOUR_PARTNER_ID_HERE);
  // Change ENTER_YOUR_PARTNER_SECRET_HERE with your partner web service secret as assigned to you when registering on corp.kaltura.com/about/signup or installation of KalturaCE.
  define("KALTURA_PARTNER_WEB_SERVICE_SECRET", "ENTER_YOUR_PARTNER_SECRET_HERE");
  // Change ENTER_YOUR_KALTURA_MIX_ID_HERE with the id of the MIX entry you would like to play and edit
  define("KALTURA_MIX_ENTRY_ID", "ENTER_YOUR_KALTURA_MIX_ID_HERE");
• Direct your browser to the openEditorKCW.php url.

Further reading

• We suggest using lightbox when loading the kcw and editors.
• Learn how to How to pre-populate your editor with content.
• Learn more about the Kaltura Contribution Wizard.
• Learn more about the KDP and it's modules.