需要帮助在Video Player中保存播放器控件的状态

时间:2017-04-27 21:12:05

标签: javascript html5 knockout.js

我正在使用视频播放器开发应用程序,前端是用HTML5开发的,带有Knockoutjs !!

现在,我正在尝试保存播放/暂停按钮的状态。我的要求是......

- 当我暂停视频并尝试向前搜索时,当我离开搜索栏时,它应该保持其暂停状态

  • 当它处于游戏状态时,当我向前寻找时,它应该是在向前寻求后的状态。

非常感谢帮助。感谢。

这是播放器控件的HTML ...

<!-- playback controls -->
        <div class="clearfix playback-set1">
            <div class="pull-left">
                <div class="edit-btn-list-container">
                    <ul class="unstyled-list edit-btn-list clearfix">
                        <li style="margin-top: 8px; width: 45px; margin-left: 0;">
                            <a data-bind="click:play, event:{ended:playerOnEnded}" class="btn btn-alt btn-default" data-placement="bottom" data-toggle="tooltip" data-original-title="Play" style="font-size: 25px;"><span data-bind="if: !playerPlaying()"><i class="fa fa-play"></i></span><span data-bind="if: playerPlaying"><i class="fa fa-pause"></i></span></a>
                        </li>
                        <li><a data-bind="click:rewindClick" class="btn btn-alt btn-default" data-placement="bottom" data-toggle="tooltip" data-original-title="Rewind"><i class="fa fa-fast-backward fa-fw"></i><!-- ko if:intervalRewind() != null --><span data-bind="text:playbackRateIndicator"></span><!-- /ko --></a></li>
                        <li><a data-bind="event:{mousedown:function(){startstep('backward');}}" data-placement="bottom" class="btn btn-alt btn-default" data-toggle="tooltip" data-original-title="Step Backward"><i class="fa fa-step-backward fa-fw"></i></a></li>
                        <li><a data-bind="event:{mousedown:function(){startstep('forward');}}" data-placement="bottom" class="btn btn-alt btn-default" data-toggle="tooltip" data-original-title="Step Forward"><i class="fa fa fa-step-forward fa-fw"></i></a></li>
                        <li><a data-bind="click:fastForwardClick" class="btn btn-alt btn-default" data-placement="bottom" data-toggle="tooltip" data-original-title="Fast Forward"><!-- ko if:intervalRewind() == null --><span data-bind="text:playbackRateIndicator"></span><!-- /ko --><i class="fa fa-fast-forward fa-fw"></i></a></li>
                    </ul>
                </div>

这里是搜索栏的Javascript代码

 self.slideScrubber = function (event, ui) {
    self.pauseVideo();
    var secsScrubbedTo = TimecodeMath.Timecode.getFileRelativeSeconds(ui.currentTarget.value, self.frameRate());

          // if scrub to point is currently outside of constrained clip playback points, break out of it:
        if (self.playClipConstrained() && (self.playClipConstrained().startTime > secsScrubbedTo || self.playClipConstrained().endTime < secsScrubbedTo)) {
            self.playClipConstrained(null);
        }
        self.seekTo(secsScrubbedTo);
  }

0 个答案:

没有答案