Getting video current time in Dash app

Dash Python
1

Hi,

I am trying to build a small app that has video in it and need to be able to get current video time real time. Value would be used to update chart, i.e. I want to move vertical shapes line based off current time.

I found this thread which should give me what I need but Events have been removed from latest Dash version so it doesn’t work.

import dash
import dash_core_components as dcc
import dash_html_components as html
import plotly.graph_objs as go

external_stylesheets = ['https://codepen.io/chriddyp/pen/bWLwgP.css']
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

app.layout = html.Div(children = [

    html.Div(children = [
        html.Video(
            controls = True,
            id = 'movie_player',
        ),
    ]),
    html.Div(children = [
        dcc.Graph(
            id = 'mean_chart',
            figure = {
                'data': [go.Scatter(
                    x = [0,1,2,3,4,5,6,7,8,9,10],
                    y = [0,1,2,4,5,4,3,5,3,2,1],
                )],
                'layout': go.Layout(
                    xaxis = {
                        'title': 'Second',
                        'type': 'linear',
                    },
                    yaxis = {
                        'title': 'Average score',
                    },
                    shapes = [{
                        'type': 'line',
                        'x0': 3,
                        'y0': -1,
                        'x1': 3,
                        'y1': 6,
                    },]
                ),
            },
        ),
    ]),
])


if __name__ == '__main__':
    app.run_server(debug = True)

Any suggestions?

2

Without events I am not sure how well it will work BUT this component outputs its current cursor location which you could use to draw your line.

3

Saw this wrapper earlier but couldn’t make it work until added this callback in my code. Thought I don’t need it in my case.

@app.callback(Output('video-player', 'intervalCurrentTime'),
              [Input('slider-intervalCurrentTime', 'value')])
def update_intervalCurrentTime(value):
    return value

Thanks anyway