Pipe Video Recorder Integration

Video Recorder Validation

• 1. Add a text question to your survey page, this question will be used to display the validation error message with scripting. Ensure the question has a Question Access Code.
  
• 2. Add a single choice question to your survey page, this question will be hidden in the survey and used to determine if a video has been recorded or uploaded. Ensure the question has a Question Access Code.
  
• 3. Event listeners need to be added to the recorder object in your script, the Pipe Video Recorder event API will fire when specific recorder events occur. We can use this to select the hidden choice question when a specific event takes place. For example if a respondent successfully uploads a video. You can read more about the Pipe Video Recorder API in their JavaScript documentation.
  Here is our code from earlier in this tutorial but with event listeners added to the recorder object. Note that each time an event occurs, the WSC selectChoice method is used to select a choice in the hidden question:
  //Get the questions
var oQText = wscScripting.getQuestionByDataPipingCode('TEXTQUESTION');
var oQCheckUpload = wscScripting.getQuestionByDataPipingCode('CHECKUPLOAD');

//Set the hidden question to false
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[1]);

var oLink = document.createElement('link');
oLink.type = "text/css";
oLink.rel = "stylesheet";
oLink.href = "https://cdn.addpipe.com/2.0/pipe.css";

oLink.onload = function () {
var oScript = document.createElement('script');
oScript.type = 'text/javascript';
oScript.src = 'https://cdn.addpipe.com/2.0/pipe.js';

oScript.onload = function () {

   var pipeParams = {
   size: { width: 640, height: 390 },
   qualityurl: "avq/360p.xml",
   accountHash: "put-your-account-hash-here",
   eid: "put-your-eid-here",
   payload: "userId: [@RECALLCODE@], jobId: put-your-job-id-here",
   mrt: 120,
   sis: 0,
   asv: 1,
   mv: 0,
   dpv: 0,
   ao: 0,
   dup: 1,
   };
  PipeSDK.insert("{QuestionContainer}", pipeParams, function (recorderInserted) {

//Desktop video RECORDING UPLOAD is complete event
recorderInserted.onUploadDone = function (recorderId, streamName, streamDuration, audioCodec, videoCodec, fileType, audioOnly, location) {
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[0]);
}

//Desktop RECORDING STARTED event
recorderInserted.onRecordingStarted = function (recorderId) {
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[1]);
}

//Desktop video UPLOAD success event
recorderInserted.onDesktopVideoUploadSuccess = function (recorderId, filename, filetype, videoId, audioOnly, location) {
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[0]);
}

//Desktop video UPLOAD STARTED event
recorderInserted.onDesktopVideoUploadStarted = function (recorderId, filename, filetype, audioOnly) {
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[1]);
}

//Mobile video UPLOAD SUCCESS event
recorderInserted.onVideoUploadSuccess = function (recorderId, filename, filetype, videoId, audioOnly, location) {
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[0]);
}

//Mobile video UPLOAD STARTED event
recorderInserted.onVideoUploadStarted = function (recorderId, filename, filetype, audioOnly) {
wscScripting.selectChoice(oQCheckUpload, oQCheckUpload.choices[1]);
}

  });
 };
document.getElementsByTagName('head')[0].appendChild(oScript);
};
document.getElementsByTagName('head')[0].appendChild(oLink);

• 4. Now that our event listeners and questions are setup, we just need to add a standard validation script to the survey page. Add a new JavaScript script to the page, ensure the script is using the "Execute Javascript before Survey Page is Validated" scripting event. The script below will check which choice is selected in the hidden choice question. EG, if a user has not uploaded a video yet, No will be selected in the hidden question, therefore failing the validation.
  
  Example validation script code:
  //Get the questions
var oQText = wscScripting.getQuestionByDataPipingCode('TEXTQUESTION');
var oQCheckUpload = wscScripting.getQuestionByDataPipingCode('CHECKUPLOAD');

//Check if YES is selected in the hidden question
if (wscScripting.isChoiceSelected(oQCheckUpload, oQCheckUpload.choices[0]) == true) {
//Pass the validation
wscScripting.clearValidation(oQText);
args.isValid = true;

//Fail the validation
} else {
wscScripting.setValidation(oQText, 'You MUST upload or record a video');
args.isValid = false;
}


The validation will now fail if the respondent has not uploaded or recorded a video: