import React from 'react';
import VideoWidget from '../components/VideoWidget';

export default {
  title: 'page-ui/VideoWidget',
  component: VideoWidget,
};

const Template = (args) => <VideoWidget  {...args} />;


const configYoutube = {
  youtube: {
    playerVars: { showinfo: 1 }
  }
}

export const VideoWidgetDefault = Template.bind({});
VideoWidgetDefault.args = {
}

export const VideoWidgetCustomWebYoutube = Template.bind({});
VideoWidgetCustomWebYoutube.args = {
  config: configYoutube,
  url: 'https://www.youtube.com/watch?v=a0M_QUS3kC0&ab_channel=Whattheduck',
  // url: 'https://fb.watch/eFG2la3H2x/',
  // url: 'https://www.facebook.com/nanny.unloveable/videos/4105085632922108/?fs=e&s=cl',
  // url: '../static/video/video-cat.mp4',
  playing: false,
  controls: true,
  loop: false,
  muted: false,
  volume: 1,
  light: false,
  width: '100%',
  height: 'auto',
  marginBottom: 0,
}

export const VideoWidgetCustomWebFBVideos = Template.bind({});
VideoWidgetCustomWebFBVideos.args = {
  config: configYoutube,
  url: 'https://www.facebook.com/nanny.unloveable/videos/4105085632922108/?fs=e&s=cl',
  playing: false,
  controls: true,
  loop: false,
  muted: false,
  volume: 1,
  light: false,
  width: '100%',
  height: 'auto',
  marginBottom: 0,
}

export const VideoWidgetCustomWebStatic = Template.bind({});
VideoWidgetCustomWebStatic.args = {
  config: configYoutube,
  url: '../static/video/video-cat.mp4',
  playing: false,
  controls: true,
  loop: false,
  muted: false,
  volume: 1,
  light: false,
  width: '100%',
  height: 'auto',
  marginBottom: 0,
}