vime-dailymotion

Enables loading, playing and controlling videos from Dailymotion.

You don't interact with this component for passing player properties, controlling playback, listening to player events and so on, that is all done through the vime-player component.

Quirks

• You cannot change the playbackRate prop because there is no API for it.

• The playsinline property cannot be set. The player automatically sets it to true if autoplay is true.

Usage

HTML

<vime-player controls>

<vime-dailymotion video-id="k3b11PemcuTrmWvYe0q"></vime-dailymotion>

<!-- ... -->

</vime-player>

React

import React from 'react';

import { VimePlayer, VimeDailymotion } from '@vime/react';

function Example() {

return (

<VimePlayer controls>

<VimeDailymotion videoId="k3b11PemcuTrmWvYe0q" />

{/* ... */}

</VimePlayer>

);

}

Vue

example.vue

<template>

<VimePlayer controls>

<VimeDailymotion videoId="k3b11PemcuTrmWvYe0q" />

<!-- ... -->

</VimePlayer>

</template>

<script>

import { VimePlayer, VimeDailymotion } from '@vime/vue';

export default {

components: {

VimePlayer,

VimeDailymotion,

},

};

</script>

Svelte

example.svelte

<VimePlayer controls>

<VimeDailymotion videoId="k3b11PemcuTrmWvYe0q" />

<!-- ... -->

</VimePlayer>

<script lang="ts">

import { VimePlayer, VimeDailymotion } from '@vime/svelte';

</script>

Stencil

class Example {

render() {

return (

<vime-player controls>

<vime-dailymotion videoId="k3b11PemcuTrmWvYe0q" />

{/* ... */}

</vime-player>

);

}

}

Angular

example.html

<vime-player controls>

<vime-dailymotion

color="fff"

video-id="k3b11PemcuTrmWvYe0q"

></vime-dailymotion>

<!-- ... -->

</vime-player>

Properties

Property	Attribute	Description	Type	Default
color	color	Change the default highlight color used in the controls (hex value without the leading #). Color set in the Partner HQ will override this prop.	string ∣ undefined	undefined
poster	poster	The absolute URL of a custom poster to be used for the current video.	string ∣ undefined	undefined
shouldAutoplayQueue	should-autoplay-queue	Whether to automatically play the next video in the queue.	boolean	false
showDailymotionLogo	show-dailymotion-logo	Whether to display the Dailymotion logo.	boolean	false
showShareButtons	show-share-buttons	Whether to show buttons for sharing the video.	boolean	false
showUpNextQueue	show-up-next-queue	Whether to show the 'Up Next' queue.	boolean	false
showVideoInfo	show-video-info	Whether to show video information (title and owner) on the start screen.	boolean	true
syndication	syndication	Forwards your syndication key to the player.	string ∣ undefined	undefined
videoId (required)	video-id	The Dailymotion resource ID of the video to load.	string	undefined

Dependencies

Used by

• vime-playground

Depends on

• vime-embed

Graph

graph TD;

vime-dailymotion --> vime-embed

vime-playground --> vime-dailymotion

style vime-dailymotion fill:#f9f,stroke:#333,stroke-width:4px

---

Built with StencilJS