JavaScript Media API Examples

Applies to Roles
Developer
Version
Brightcove 4
Modules
Media API
Edition
Express, Pro, Enterprise

This document presents some simple examples of making Media API queries from JavaScript. To understand these examples, you should be familiar with the JavaScript programming language. Be sure to read Getting Started using JavaScript before continuing.

Examples of querying for content with the Read API

Here are some simple examples of using the Media API read methods to query for content.

find_all_videos example

To query for all videos in your account, your request would look like this:

// Get all videos
http://api.brightcove.com/services/library?command=find_all_videos&token=0Z2dtxTdJAxtbZ-d0U7Bhio2V1Rhr5Iafl5FFtDPY8E.

In this example, the method is find_all_videos. In the query parameters, we also pass the token argument with the value of our API token.

Click here to see an example making this call.

find_videos_by_tags example

To find videos tagged with specific words, make a request like this:

 
// Get all videos
http://api.brightcove.com/services/library?command=find_videos_by_tags
  &and_tags=adventure&token=0Z2dtxTdJAxtbZ-d0U7Bhio2V1Rhr5Iafl5FFtDPY8E.

The and_tags parameter indicates all the following tags must match. Use or_tags if a partial match is what you want. Click here to see an example making this call.

find_all_videos, sorted by popularity example

This query finds all videos sorted by descending popularity based on total plays. The query also restricts the return object so that only the name field for each record is returned.

// Get all videos
http://api.brightcove.com/services/library?command=find_all_videos
  &sort_by=plays_total&sort_order=DESC&fields=name,playsTotal
  &token=0Z2dtxTdJAxtbZ-d0U7Bhio2V1Rhr5Iafl5FFtDPY8E.

Click here to see an example making this call.

Examples of working with videos with the Write API

Using the Media API write methods is less straightforward, since creating the JSON Request object is more complicated, in contrast with the read methods, where you just need to set string parameters in a GET call. Here are examples of the following write methods using JavaScript:

Note: These examples expose the Write API token in the HTML page. Exposing the token like this in production is a bad idea. See Media API: Security Best Practices for tips about protecting your token.

create_video example

Click here to see the example in action.
Click here to see the source code for this example.

This example presents a form that takes the video's name, short description, and path as input and uses the create_video method to upload the video when the Upload button is clicked. It also displays the JSON Request that is passed and the response.

The buildJSONRequest function takes the form inputs and creates the JSON-RPC object that is passed in the create_video method.

function buildJSONRequest(form){
if(document.getElementById('name').value =="" 
   || document.getElementById('shortDescription').value =="" || form.filePath.value ==""){
	alert("Require Name, Short Description and File");
	return;
  }else
    {
	json = form.JSONRPC
	//Construct the JSON request:
	json.value = '{"method": "create_video", "params": {"video": {"name": "'
       + document.getElementById('name').value + '", "shortDescription": "' 
       + document.getElementById('shortDescription').value 
       + '"},"token": "'+ document.getElementById("yourWriteToken").value + '"}}';
	form.JSONView.value = json.value;
	}
}

The buildJSONRequest function is called by the doFileUpload function:

function doFileUpload(){
	form = document.getElementById("create_video_sample");
	buildJSONRequest(form);
	form.action = document.getElementById("yourAPILocation").value;
	form.submit();
}

update_video example

Click here to see the example in action.
Click here to see the source code for this example.

This example presents a form that takes the video's ID and uses the update_video method to modify the metadata of the video when the Upload button is clicked. It also displays the JSON Request that is passed and the response.

The buildJSONRequest function takes the form inputs and creates the JSON-RPC object that is passed in the update_video method.

function buildJSONRequest(){
	mform = document.getElementById('metaForm');
	json = document.getElementById('JSONView');
	//Construct the JSON request:
	json.value = '{"method": "update_video", "params":{"video": {"id": '+
		document.getElementById("id").value;
	idx = 0;
	for(i = 0; i < mform.elements.length; i++){
		if(mform.elements[i].value != "" && mform.elements[i].type=="text"){
 
        json.value += ','
        //Tags should be a list of strings
        if(mform.elements[i].name == "tags"){
          json.value += '"tags": [';
          tags = mform.elements[i].value.split(',');
          for(k = 0; k < tags.length; k++){
            if(k>0){json.value += ',';}
            json.value += '"' + tags[k] + '"';
          } 
          json.value +=']';
        }else{
 
		json.value += '"'+mform.elements[i].name+'": 
            "'+mform.elements[i].value+'"';
			}
			idx++;
		}
	}
	//special case for economics select, since type != text
	json.value += ',"economics": "'+document.getElementById("economics").value+'"';		
	json.value += '} ,"token": "'+ document.getElementById("yourWriteToken").value
     + '"}}';
}

The buildJSONRequest function is called by the doUpdateVideo function:

function doUpdateVideo(){
	form = document.getElementById("update_video_sample");
	buildJSONRequest();
	form.action = document.getElementById("yourAPILocation").value;
	form.submit();
}

add_image example

Click here to see the example in action.
Click here to see the source code for this example.

This example presents a form that takes the filename, file size, and path of a thumbnail image and a video's ID as input and uses the add_image method to upload the image and assign it to the video as a thumbnail image when the Upload button is clicked. It also displays the JSON Request that is passed and the response.

The buildJSONRequest function takes the form inputs and creates the JSON-RPC object that is passed in the add_image method.

function buildJSONRequest(form){
	if(document.getElementById('videoRefId').value =="" || form.filePath.value ==""){
		alert("Require Video ID and File");
		return;
	}else{
		json = form.JSONRPC
		//Construct the JSON request:
		json.value = '{"method": "add_image", "params": {"image": 
        {"displayName": "' + document.getElementById('name').value +	
        '", "referenceId": "' + document.getElementById('refId').value + 
        '", "type": "' + document.getElementById('imageType').value +
		'"},"video_reference_id": "'+ document.getElementById("videoRefId").value+ 
        '","token": "'+ document.getElementById("yourWriteToken").value + '"}}';
		form.JSONView.value = json.value;
	}
}

The buildJSONRequest function is called by the doFileUpload function:

function doFileUpload(){
	form = document.getElementById("add_image_sample");
	buildJSONRequest(form);
	form.action = document.getElementById("yourAPILocation").value;
	form.submit();
}

delete_video example

Click here to see the example in action.
Click here to see the source code for this example.

This example presents a form that takes the video's ID and uses the delete_video method to modify the metadata of the video when the Delete button is clicked. It also displays the JSON Request that is passed and the response.

The buildJSONRequest function takes the form inputs and creates the JSON-RPC object that is passed in the delete_video method.

function buildJSONRequest(){
	if(document.getElementById('id').value ==""){
		alert("Please enter a videoId");
		return;
	}else
    {
		json = document.getElementById('JSONView');
		//Construct the JSON request:
		json.value = '{"method": "delete_video", "params":{"video_id": 
        '+ document.getElementById('id').value +
		',"token": "'+ document.getElementById("yourWriteToken").value + '"}}';
	}
}

The buildJSONRequest function is called by the doVideoDelete function:

function doVideoDelete(){
	form = document.getElementById("delete_video_sample");
	buildJSONRequest();
	form.action = document.getElementById("yourAPILocation").value;
	form.submit();
}

get_upload_status example

Click here to see the example in action.
Click here to see the source code for this example.

This example presents a form that takes the video's ID and uses the get_upload_status method to return the upload status of the video when the Get Status button is clicked. It also displays the JSON Request that is passed and the response. The status returned is one of UPLOADING, PROCESSING, COMPLETE, or ERROR.

The buildJSONRequest function takes the form inputs and creates the JSON-RPC object that is passed in the get_upload_status method.

function buildJSONRequest(){
	if(document.getElementById('id').value ==""){
		alert("Please enter a videoId");
		return;
	}else{
		json = document.getElementById('JSONView');
		//Construct the JSON request:
		json.value = '{"method": "get_upload_status", "params":{"video_id": 
        '+ document.getElementById('id').value +
		',"token": "'+ document.getElementById("yourWriteToken").value + '"}}';
	}
}

The buildJSONRequest function is called by the doVideoStatus function:

function doVideoStatus(){
	form = document.getElementById("video_status_sample");
	buildJSONRequest();
	form.action = document.getElementById("yourAPILocation").value;
	form.submit();
}

More examples

Here are some more examples to help you get started:

Tags
JavaScript