a video player framework aims to bring wonderful experience on browser
We support Picture-in-Picture Api in this version. If you don't know what Picture-in-Picture Api is, you can watch the demo make from Google Chrome.
We support the basic Api below:
requestPictureInPicture
exitPictureInPicture
You can enter/leave the Picture-In-Picture mode through the apis above. They will trigger events below.
enterpictureinpicture
leavepictureinpicture
If you want to know whether your instance is in Picture-In-Picture mode, you can detect it through inPictureInPictureMode
attribute.
On the browsers which don't support Picture-In-Picture mode, we will fallback to a canvas render.
index.esm.js
to fix https://github.com/Chimeejs/chimee/issues/142
You can see the demo in https://github.com/Chimeejs/chimee/tree/master/demo/esm-import
x5-video-player-type
do not work bug (https://github.com/Chimeejs/chimee-mobile-player/issues/22)noDefaultContextMenu
If you want to disable the native context menu of the video. You can set this variable on user config.
import Chimee from `chimee`;
new Chiee({
wrapper: 'chimee',
noDefaultContextMenu: true,
});
We will prevent the default context menu of video to show.
Also, you can pass in container
and wrapper
too. We will disable the context menu inside the dom node.
In 0.10.0, we make a big refactor on the events system which can help us to solve the problem described in #106 and #102.
We introduce event options. It's the key to use the new event system.
We now can pass in event option to provide more info for event.
The event options including two parameter, target
and stage
, they are both optional.
target means the target you need to listen on, you can value below.
'kernel' | 'container' | 'wrapper' | 'video' | 'video-dom' | 'plugin' | 'esFullscreen'
For example, you used to listen on container by c_
.
// what you used to do
player.on('c_click', event => console.log(event));
// what you can do now
player.on('click', event => console.log(event), { target: 'container' });
stage means the event stage, it includes 'before' | 'main' | 'after' | '_'
so you can listen on before play event
like this:
// what you used to do
player.on('beforePlay', event => console.log(event));
// what you can do now
player.on('play', event => console.log(event), { stage: 'before' });
So you can clarify the target of your event emit.
player.emit({
name: 'click',
target: 'container',
});
In some situation, the developer may create their own kernel events. So we provide a new interface for developer to register events.
But we can just register kernel events now.
import Chimee from 'chimee'
Chimee.registerEvents({
name: 'test',
target: 'kernel',
});
We have merged chimee-kernel into chimee. That make chimee's layer clearer and easier to understand.
In some situation, the browser's fullscreen api do not perform well. We can use css to simulate fullscreen. You can just set useStyleFullscreen
to be true
like this:
Chimee.config.useStyleFullscreen = true;
$autoFocus
You can change plugin's autoFocus setting whenever you want now.
immediate
seek on silentload
We will seek to the current time when you are using silentload
with immediate
as true
.
We published chimee-plugin-panaroma to help you play panorama video. (https://github.com/Chimeejs/chimee/issues/66)
You can see the demo on https://chimeejs.github.io/chimee-plugin-panorama/
mouseenter
and mouseleave
on container