VideoJS Advanced plugin - Comment position issue

Need help Plugins
1

Hi,

I’m using [pork1977gm] 's VideoJS Advanced plugin and I really like it so far! However, I’m having trouble figuring out the correct workflow for one of my apps. I read the following pages before getting in touch with you:

I want to use the commenting feature of the plugin. In the database I have “Item”s which has a list of Comments. Items can be audio, image or video files.

I was able to create “Comment”s with X and Y coordinates and timestamps, and attach them to the proper “Item”s, but I’m having trouble listing these comments on the images and videos.

For images, the concept is that the image loads into the Videoplayer, and shows all the related Comments in the form of a circle with the creator’s profile picture, all at once over the image. The user would be able to click on those and open the details of the comments. Unfortunately, I wasn’t able to achieve this.

My workflow was the following for the images:

  • VideoJSPlayer has loaded data:
  • Trigger time event (list) VideoJSPlayer
  • Intervals: Parent group’s Item’s comments:each item’s timestamp
  • Pause: no
  • One time event: yes
  • VideoJSPlayer reaches a specified time:
  • Add overlay VideoJSPlayer:
  • Is video: no
  • Start: 0
  • End: This VideoJSPlayer’s Duration

For videos, I was also having trouble with adding a timeline below the player with the comments positioned on the right timestamp value (just how jj11 was able to achieve it here: [How can I leave comments on a video with time code? - #30 by jj11])

So basically I’m having trouble listing Comments based on their coordinates.

(Additional feature idea: A custom, repeating group type of element with dynamic X and Y position values for its items would make this really easy.)

I hope you can help me with this issue.

Kind regards, Zoltan

2

I think one of my demo pages has the timeline setup and working, although it’s a little complex.

Check this page if you haven’t already.

I can put all x, y comments into an object state if you want, so list of coordinates each items x item 1 and item 2 would be x, y.

I’m on mobile at the moment but when back at the computer, I’ll see what can be done.

How are you recording the x, y cords in your app right now? I guess you doing it through one of the clicked events?

3

Thank you for the quick reply! I’ll take a look at the demo page you sent, I think this is what I was looking for for videos.

For images, I record the coordinates on the “VideJS Player coordinates have changed” event. I hope this helps.

Regarding putting the comments into an object state, I’m not sure what would be the best workflow for displaying them on the image.

4

This is not my plugin? I haven’t worked on that part of my app for over a year. Maybe contact the plugin creator?

5

Sorry if I tagged you somewhere, fortunately pork1977gm found my topic.

6

Awesome :slight_smile:

7

Hi pork1977gm !

I managed to resolve placing the comments when the videoplayer loads an image file. However I’m having a hard time triggering the “coordinates have changed” event when the loaded file is a Youtube video.

The videoplayer’s “Enable coordinates” is set to “Yes”, but it still doesn’t work. Do you have any idea what could cause that? There’s no elements above the videoplayer, or anything like that.

Thank you in advance!