Admin UI Video Editor - Improved playback and timeline

Description

  1. Improve timeline indicator visually (easier to select without hiding handle at the edges)

  2. Improve visual distinction of button to manage of "cut" segments

  3. Clicking on the timeline. Select clicked on section and move timeline indicator to the time position of the click.

  4. Clicking on the timeline indicator bar - move timeline indicator to that position.

  5. Track list (remove from further processing).

  6. Moving timeline indicator on it's track "scrub" through video.

------------------------------------------------------------------------------
Taken over from : - Admin UI Video Editor - Improved Zoom Controls

  1. Improve layout of zoom controls / combine. Overflow styling issues.

  2. Zoom view control drag-able to select zoomed timeline view.

  3. Selectable zoom level buttons/dropdown.

------------------------------------------------------------------------------
Move to another issue:

  1. Add labels (flavor) on the video playback section.

Activity

Show:
Corné Oosthuizen
November 11, 2016, 9:12 PM

for: Open - Admin UI Video Editor - Improved Zoom Controls

Sven Stauber added a comment - 2016-10-25 11:35 AM
Cool, looking forward to this!

Inspiration:

It would be quite useful if the "blue rectangle" indicating which area of the whole timeline is currently displayed (with start and end time in it) could be dragged to left/right to select which portion of the timeline should be displayed without needing to change the playback position in the video.

Corné Oosthuizen
November 12, 2016, 12:23 AM

Moving timeline indicator on it's track "scrub" through video.

This is most likely not feasible - the timeline update delay takes too long.

Corné Oosthuizen
November 15, 2016, 7:48 PM

Changes:
1. Zoom controls moved to above timeline with smaller range bar and drop-down to select specific predefined values. Zoom level drop-down also indicates to some degree the zoom (time for the zoom range)
2. Zoom field of view has overall waveform background, styling issue is fixed with displaying time and the zoom field bar (blue rectangle) is draggable inside the view (mini-map)
3. Segments includes button to remove segement or "delete" / "not use" the segement.
4. Segment seperator is draggable for finer control on positioning.
5. Timeline cursor increased in size and styling fixed so that it is not cut-off at the edges.
6. Timeline track is clickable and moves the timeline cursor (like previous versions).
7. Cut button is shown when Timeline cursor is moved and will disappear in 1minute.

TODO:
1. How to handle multiple tracks and the waveforms
2. JavaScript Unit test for timelineDirective.js

Fixed and reviewed

Assignee

Corné Oosthuizen

Reporter

Corné Oosthuizen

Tags (folksonomy)

None

Components

Fix versions

Affects versions

Priority

Major