Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Chore/4.0.0 #246

Open
wants to merge 6 commits into
base: main
Choose a base branch
from
Open

Chore/4.0.0 #246

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
32c004a
feat: autoplay
Marcos-Bernasconi Oct 11, 2024
821e91e
chore: run lint
Marcos-Bernasconi Oct 11, 2024
58c6099
Update CldVideoPlayer.md Docs
Marcos-Bernasconi Oct 11, 2024
fbc5695
fix-#241: Signed Upload Widget
Baroshem Oct 15, 2024
8bcc2f3
Merge pull request #245 from nuxt-modules/fix/#241
Baroshem Oct 15, 2024
68e27c2
Merge pull request #244 from Marcos-Bernasconi/main
Baroshem Oct 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion docs/content/2.components/CldVideoPlayer.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -111,7 +111,8 @@ Adding a button to select chapters (you can pass `chapters` prop as a boolean if

| Prop Name | Type | Default | Description | Example |
| ---------------------- | -------------- | ---------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------- |
| autoPlay | string | `"never"` | When, if, should the video automatically play. See `autoplayMode` in [Video Player docs](https://cloudinary.com/documentation/video_player_api_reference#constructor_parameters?utm_campaign=devx_nuxtcloudinary&utm_medium=referral&utm_source=nuxtcloudinary) | `"on-scroll"` |
| autoPlay | boolean | `false` | Make the video automatically play | `true` |
| autoplayMode | string | `"always"` | When, if, should the video automatically play. See `autoplayMode` in [Video Player docs](https://cloudinary.com/documentation/video_player_api_reference#constructor_parameters?utm_campaign=devx_nuxtcloudinary&utm_medium=referral&utm_source=nuxtcloudinary) | `"on-scroll"` |
| className | string | - | Additional class names added to the video container | `"my-video-player"` |
| colors | object | See below | Player chrome colors | See Colors Below |
| controls | boolean | `true` | Show player controls | `true` |
Expand All @@ -127,6 +128,7 @@ Adding a button to select chapters (you can pass `chapters` prop as a boolean if
| onPause | Function | - | Triggered on video pause | See Events Below |
| onPlay | Function | - | Triggered on video play | See Events Below |
| onEnded | Function | - | Triggered when video has ended play | See Events Below |
| playsinline | boolean | `false` | Can be used with autoplay and muted to enable autoplay on iOS devices | `true`
| playerRef | Ref | - | React ref to access Player instance | See Refs Below |
| showLogo | boolean | `true` | Show the Cloudinary logo on Player | `false` |
| src | string | - | **Required**: Video public ID | `"videos/my-video"` |
Expand Down
5 changes: 5 additions & 0 deletions playground/app.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -51,6 +51,11 @@ const colors = {
/>
<CldVideoPlayer
ref="cldVideoRef"
auto-play
autoplay-mode="on-scroll"
loop
muted
playsinline
width="1620"
height="1080"
src="videos/dog-running-snow"
Expand Down
1 change: 1 addition & 0 deletions src/runtime/components/CldUploadWidget.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -254,6 +254,7 @@ const uploadOptions = getUploadWidgetOptions(
{
cloud: {
cloudName: useRuntimeConfig().public.cloudinary.cloudName,
apiKey: useRuntimeConfig().public.cloudinary.apiKey,
},
...options,
...instanceMethods,
Expand Down
12 changes: 9 additions & 3 deletions src/runtime/components/CldVideoPlayer.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,9 @@ export interface CloudinaryVideoPlayer {
}

export interface CloudinaryVideoPlayerOptions {
autoplayMode?: string
autoPlay?: boolean
autoplayMode?: 'never' | 'always' | 'on-scroll'
playsinline?: boolean
cloud_name?: string
colors?: CloudinaryVideoPlayerOptionsColors
controls?: boolean
Expand Down Expand Up @@ -61,7 +63,9 @@ export type CldVideoPlayerProps = Pick<
| 'transformation'
| 'hideContextMenu'
> & {
autoPlay?: string
autoPlay?: boolean
autoplayMode?: 'never' | 'always' | 'on-scroll'
playsinline?: boolean
className?: string
height: string | number
id?: string
Expand Down Expand Up @@ -92,7 +96,9 @@ export type CldVideoPlayerProps = Pick<
}

const props = withDefaults(defineProps<CldVideoPlayerProps>(), {
autoPlay: 'never',
autoPlay: false,
autoplayMode: 'always',
playsinline: false,
controls: true,
logo: true,
loop: false,
Expand Down
Loading