Friendly warning: Welcome to developer territory.
You will have a lot of fun if you are comfortable with HTML, Javascript and CSS, or have a friend / colleague that is. If not, you may have a bad time.
If you are a real do-it-yourselfer and want to learn yourself, we highly recommend first taking Codeacademy's free HTML/CSS and Javascript courses.

Overview:

To create interactions between your main page and the video, you will need to utilize our viewer object along with creating a few simple functions.

Let’s see this in action.

On-page Controls

  1. Click “Embeded”
  2. Ensure you’re using the HapYak “Native Player” embed code 
  3. Copy and Paste this code onto your webpage
  4. Attach an “onload” event within “hapyak.viewer”
  5. Create a variable which can be accessed within the necessary scope
hapyak.viewer({
    apiKey: "xxxx",
    projectID: xxxx,
    player: xxxx,
    playerType: "xxxx",
    autoplay: false,
     onload: function(viewer) {
       hapyak_viewer = viewer;
     }
});

You are now able to call hapyak_viewer.play() or hapyak_viewer.pause() from within a function

Note: For a snippet of example code please see the resource below

Part 2: Click Here

Did this answer your question?