3

Is there a way to seek the video frame by frame using Videogular API? If not, what would be the best work around?

Thanks!

amit
  • 2,171
  • 4
  • 31
  • 50
  • Do you know the framerate of your video? If you don't know I'm afraid that it's not possible. If you know the framerate just use API.seekTime(time) and check this post http://stackoverflow.com/questions/20336955/how-to-step-one-frame-forward-and-one-frame-backward-in-video-playback – elecash Mar 28 '15 at 17:54
  • thanks @elecash, I've noticed in the docs that seekTime() accepts "an *integer* representing the target position in seconds". So seeking to partial second (e.g 2.5s) is not supported? – amit Mar 29 '15 at 08:55
  • 1
    It should work, seekTime supports Number – elecash Mar 29 '15 at 10:31

1 Answers1

2

Came across a need for this myself. Here is the directive I created. Note that I hardcoded the framerate and I'm only showing the controls when the player is paused.

app.directive("vgFrameButtons", ["VG_STATES",
    function (VG_STATES) {
        return {
            restrict: "E",
            require: "^videogular",
            template:
                '<button class="iconButton" ng-click="prevFrame()"><i class="fa fa-angle-double-left"></i></button>' +
                '<button class="iconButton" ng-click="nextFrame()"><i class="fa fa-angle-double-right"></i></button>',
            link: function (scope, elem, attr, API) {
                var frameTime = 1 / 29.97;

                scope.prevFrame = function () {
                    API.seekTime((API.currentTime / 1000) - frameTime);
                };
                scope.nextFrame = function () {
                    API.seekTime((API.currentTime / 1000) + frameTime);
                };

                scope.$watch(
                    function () {
                        return API.currentState;
                    },
                    function (newVal) {
                        var display = newVal == VG_STATES.PAUSE ? "table-cell" : "none";
                        elem.css("display", display);
                    }
                );

            }
        }
    }
]);
What-About-Bob
  • 649
  • 5
  • 13