acmertz / eo1 Goto Github PK
View Code? Open in Web Editor NEWA video editor for Windows 10 built on web technologies
A video editor for Windows 10 built on web technologies
Enable seeking by clicking any location in the Timeline ruler.
Create an animation to smoothly transition the scrolling position of the Timeline tracks.
Split clips at the current playback time, preserving all properties except for unique ID.
Ensemble of One currently uses a myriad of styles for dialogs and other user interaction, ranging from the "film strip" flyouts of the main menu to the 3D "ticker" and settings dialogs, to the fly-in video preview window of the Editor. Some UI elements use standard WinJS animations (projects in the "Open Project" list use WinJS animation when clicking/releasing), others use custom animations outright (pretty much all dialogs callable on the Main Menu), and some do not animate at all (confirmation buttons in the "New Project" and "Open Project" dialogs, as well as the menu bar "tabs" in the Editor). There is no coherence in the UI as it currently stands.
Devise a set of standard styles (position, appearance, borders, transparency/blur, background color/image, font sizes, padding/margin) and animations (fade, translate, 3D) to use across UI elements. Establish a core set of guidelines for how dialogs and user interactions should be presented and animated.
Testing on Surface 3 with Windows 10 (build 10074) has demonstrated very low frame rates in the Renderer (Ensemble.Editor.Renderer). Not sure if this is due to Build 10074 running on an older version of the Edge HTML rendering engine, or just an issue of power. Either way, performance was smooth before updating the codebase from Windows 8.1 to Windows 10.
This issue may resolve itself as Windows 10 approaches RTM and the Edge engine becomes better optimized.
Compile the FFmpeg library for x86, x64, and ARM and leverage it to enable the playback of additional file formats and media types not natively supported by Windows.
Drag and drop clips from the Media Browser into the timeline. Media Browser thumbnail turns into a standard timeline "ghost" when dragged over the timeline and snaps to valid free slots.
Trim time from the start and end of clips in the timeline. This feature must be history-compliant.
Add a user setting for adjusting the default height of tracks in the timeline. Perhaps make it a 3-position toggle: small, medium, and large.
The Timeline selection callout currently only displays when the user selects a clip via the Timeline (selecting the same clip by clicking on its image in the Canvas will not display the Timeline selection callout). Update Ensemble.Editor.SelectionMGR to trigger the selection callout when any clip is selected.
Similar to #67.
Import clips via the host OS's built-in file picker.
Seeking back to the beginning of the project when playback was previously paused in any time segment other than the first causes the wrong clips to play and render until such a point where the user seeks the project to a non-zero time.
Upgrade development environment to Windows 10 and redeploy Ensemble of One as a Universal Windows App.
Create an animation that smoothly animates the creation of a track. Consider using WinJS's "add to list" animation to ease development: http://msdn.microsoft.com/en-us/library/windows/apps/xaml/br212653.aspx
The Timeline selection callout appears when the user selects a clip via its object in the Timeline. It can be used by touch and pen users to move and edit the clip. However, the selection callout fails to dismiss if the user clears the selected clip by clicking an empty space in the Canvas. Attempting to drag the selection callout when no clips are selected will result in an application crash.
Similar to #68.
Store a thumbnail of the project on every save operation. Bind the Editor menu thumbnail to the image so it always stays up-to-date in the UI.
Make the dialog windows and user interaction more consistent with each other. Let's go for a "film strip" or theater look and feel: dialogs slide in from the edge of the screen and cover most (but not all) of the app canvas.
Remove unneeded dialog styles from CSS (prevent style bloat).
Dialogs must integrate properly with the KeyboardMGR. Pressing "Escape" on the keyboard should dismiss a dialog, all keyboard shortcuts not relevant to the dialog should be disabled until the dialog is closed (it would be confusing to the user if "Ctrl + Z" still worked on a clip in the timeline, for example, even when the settings dialog was open).
When the user chooses to exit the Editor by clicking the "Close project" button, the Navigation history is not cleared (but should be). Then, when the user tries to push the system "Back" button, the application may enter an inescapable state.
Project thumbnails are currently stored in a separate file from the project data, itself (for instance, "My Great Project.eo1" would have a thumbnail stored as "My Great Project.eo1.jpg"). Modify the save/load chain to store the thumbnail as Base64-encoded data within the .eo1 project file.
User can choose from a list of premade transition animations for clips.
Capture media from an attached microphone or camera and import it directly into the project. Media capture must have the following characteristics:
To do:
Update canvas interaction to be more accessible to touch users:
Overhaul the design and layout of the main menu. The current menu design has a lot of empty space and doesn't take very good advantage of screen real estate. A new design should take into account both desktop and touch platforms and be responsively designed so it translates well to different screen sizes.
The new design should incorporate the following elements:
The new Main Menu should follow the look and feel established in the Ensemble of One style guide (#28).
Create an animation that smoothly animates the removal of a track from the timeline. Consider using the WinJS "delete from list" animation to ease development: http://msdn.microsoft.com/en-us/library/windows/apps/xaml/br212656.aspx
Update Ensemble.Pages.Editor to better handle window resize operations. As it currently functions, the application lags visibly when the user resizes its window due to firing too many resize events.
Audio clips should function identically to video clips, but should be excluded from the rendering chain.
Import clips to the timeline by browsing, previewing, or dragging and dropping.
Expands the number of animatable properties and adds multiple presets. Users can use mouse, touch, or pen input to draw a movement pattern for animations or use a wizard to set up and preview animations. Animations can be shared for free within Ensemble of One and are stored on a web server authenticated by the user's Microsoft Account.
Moving a clip in the timeline causes FileIO to generate invalid XML due to a forgotten end tag.
Add basic color effects ("Lenses") to the Editor. A lens effect lives in the Timeline with all other clips and may be used to manipulate the coloration of the playback canvas.
Devise an animation that smoothly transitions a Timeline track from one position to another.
A WinJS reposition animation might suffice: https://msdn.microsoft.com/en-us/library/windows/apps/br212660.aspx
Note that the page linked above is partially incorrect at the time of this writing. It has some correct information, but the sample code is copied from the "add to list" animation.
When the user drags the playback cursor in the Timeline, a small dialog is supposed to appear and indicate the current time of the drag position. This indicator is missing or misplaced, and needs to be realigned to a visible location.
When resizing a clip from the bottom left or bottom right corner, the clip being resized will not "stick" to the edges of other clips if neither corner of the clip being resized intersects with the clip to which the user is trying to stick it.
Update all clickeaters in the application to use the BEM-compliant naming convention introduced with the system back navigation:
<div class="ensemble-clickeater ensemble-clickeater--page-or-purpose-here"></div>
Optionally, include ensemble-clickeater--backnav as part of the class name to enable system back navigation upon clicking the clickeater (make sure to push a new "back" state to Ensemble.Navigation before showing such a clickeater: failing to push a new "back" state may result in unexpected behavior when the user clicks the clickeater).
The Action object represents a single, undoable/redoable user interaction within the application. Undo/redo history is saved with the project and retrieved upon project load, using the Ensemble.FileIO namespace for platform independence.
Instances of Action currently only store just enough information to function (undo/redo, and otherwise perform the action). Alter the Action class to track, save, and retrieve the time it was last performed. A separate GitHub issue will request the creation of a centralized logging system at a future date.
Update Timeline clip code so that a thumbnail is displayed for each clip, replacing the current "gray box" placeholder.
Taking advantage of new APIs available under Windows 10, update the clip importing code in Ensemble.Editor.TimelineMGR, Ensemble.Editor.Renderer, and Ensemble.Pages.Editor to enable the dropping of files dragged from outside the application.
Users should be able to drag any supported media file into Ensemble of One, as long as the Editor is active. Once the mouse cursor enters the application, the UI should enter the same state as if the user had started a drag operation from the Media Browser.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.