photocat API

API Description

PhotoCat interface contains 3 parts: Edit, Retouch and Collage.

1. Environment Configuration

1.1 crossdomain.xml configuration

Create a xml file named crossdomain.xml, add the following statement in crossdomain.xml:

<?xml version="1.0" encoding="UTF-8"?>
<cross-domain-policy xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="http://www.adobe.com/xml/schemas/PolicyFile.xsd">
<allow-access-from domain="*.photocat.com"/>
</cross-domain-policy>

For example, if the URL of your image saving webserver is: http://example.com.cn, then crossdomain.xml path should be: http://example.com.cn/crossdomain.xml. Note that crossdomain.xml is only allowed to be deployed in the site's root directory;

The crossdomain.xml will authorize flash under PhotoCat domain to upload images to your site or load pictures from your site.

[Note] If testing locally, it will be blocked by flash security sandbox, so please set up a web server to test it in a web environment.

1.2 crossdomain.xml configuration

1.2.1 include JS code

Include the code in your page head or body tags.
<script src="http://source.photocat.com/api/js/photocat.js" type="text/javascript"></script>

1.2.2 initialize PhotoCat

photocat is the top-level namespace. API calls are all in this form: photocat.xxx (arg1, arg2, ...) To ensure flash initialization is complete, be sure to use the following syntax to call the API:

photocat.onInit = function ()
{
    // your code here
}

2 API list

2.1 Method

2.1.1 photocat.embedSWF

Functional Description: embed a PhotoCat editor in your web page

Syntax:

photocat.embedSWF (container: String, editorType: Number, width: String, height: String); //This Function should be placed after other Functions.
Parameter Required Description
container Yes Nested flash container
editorType No Editor type (1: Edit, 2: Collage, 3: Retouch, the default value is 1.)
width No The width of the editor ( The value could be numbers or percentages.)
height No The height of the editor ( The value could be numbers or percentages.)

Sample code

photocat.embedSWF("altContent", 3, 800, "100%");

2.1.2 photocat.loadPhoto

Functional Description: load images to editor

syntax:

photocat.loadPhoto(url:String);

Notes:Use the following method to load multiple pictures for collages:
phtocat.loadPhoto(url1,url2,url3,..) //9 photos at most

Parameter Required Description
url Yes The URL of the image that editor would load (only applied for lightweight editor and full version)

Sample code

photocat.loadPhoto("http://static.cnblogs.com/images/t_shirt_404.jpg");

2.1.3 photocat.setUploadURL

Description: set the upload URL

syntax:

photocat.setUploadURL (url:String);
Parameter Required Description
url Yes Set the upload URL (must be an absolute path)

Sample code

photocat.setUploadURL("http://web.photocat.com/api/sample/image_upload.php");

2.1.4 photocat.setUploadArgs

Description: Set the upload parameter

syntax:

photocat.setUploadArgs (args:Object);
Parameter Required Description
args Yes Set upload parameters (no need to call the function if you don't need upload parameters)

Sample code

photocat.setUploadArgs({a:1, b:"lucky"});

2.1.5 photocat.setUploadArgs

Description: set Upload content type

syntax:

photocat.setUploadType (uploadType:Number);
Parameter Required Description
uploadType Yes Set upload content type: Content-type:application/octet-stream;
1.Stream upload Content-type: application/octet-stream;
2.upload a standard form:
Content-type: multipart/form-data; The default type is stream upload, only need to call this function if you want to upload a standard form.

Sample code

photocat.setUploadType(2);

Note: PhotoCat provides two upload interfaces for your testing:
One for octet-stream upload: http://web.photocat.com/api/sample/image_save_sample.php
The other for multipart/form-data upload: http://web.photocat.com/api/sample/image_upload.php
The file field name is "upload_file".

2.1.6 photocat.setUploadDataFieldName

Description: Set the file data field name when using POST method to upload.

Corresponding code in html

<input type="file" name="Filedata" id="file" />

syntax:

photocat.setUploadDataFieldName (uploadDataFieldName: String);
Parameter Required Description
uploadDataFieldName Yes For form upload only (you will only need to call this function if you upload using a form and the field name is not "Filedata")

Sample code

photocat.setUploadDataFieldName ("Filedata");

2.1.7 photocat.setFlashvars

Function description (advanced features): Set the flash initialization parameters to achieve more advanced features, please call this function before photocat.embedSWF, otherwise it will not work.

syntax:

photocat.setFlashvars (key: String, value: *);
Parameter Required Description
key Yes Parameter name
value Yes Parameter name

Sample code

photocat.setFlashvars ("scrollTrap", 1);

photocat.setFlashvars("openButton","false");

photocat.setFlashvars("localSaveButton","false");

The following table shows the list of attributes that can be set

Parameter possible values Description
scrollTrap 0,1 Whether or not to enable mouse capture, 0 for disable, 1 for enable. Whether or not to disable page scrolling when using the scrolling mouse wheel with flash.
openButton true,false To hide the "open" button, set the "openButton" value as false. The default value is true(Recomended)
localSaveButton true,false To hide the "Save to computer" button, set the "localSaveButton" value as false. The default value is true(Recomended)

2.2 Event

2.2.1 photocat.onInit

photocat.onInit = function () {}

This function will be called when the editor initialization is complete, you must define a function that will be executed when the event handler is called.

Sample code

photocat.onInit = function ()
{
  // Your code here
  alert ("flash initialization completed");
}

2.2.2 photocat.onUploadResponse

photocat.onUploadResponse = function (data) {}

This function will be called when the back-end responses to images uploads, you must define a function that will be executed when the event handler is called.

Parameters:

data: the data returned by the server-side

Sample code

photocat.onUploadResponse = function (data)
{
  alert ("Upload response" + data);
}

2.2.3 photocat.onClose

photocat.onClose = function () {}

This function will be called when you click on the Close button in flash, you must define a function that will be executed when the event handler is called.

Parameters:

data: the data returned by the server-side

Sample code

photocat.onClose = function ()
{
  alert ("Editor Closed");
}

2.2.4 photocat.onDebug

photocat.onDebug = function (data) {}

Output debug information when an error occurs, you must define a function that will be executed when the event handler is called.

Parameters:

data: debug information

Sample code

photocat.onDebug = function (data)
{
  alert ("error response" + data);
}

Error codes and their meaning

Error Codes Description
MT0001 Upload interface does not exist
MT0002 Your server does not have crossdomain.xml,
Or crossdomain.xml does not contain <allow-access-from domain="*.photocat.com"/>

3 Example

Run the following example

Select an editor     

goTop