Add basic player component

web/stories/Dropdown.stories.tsx

@@ -25,7 +25,7 @@ const DropdownExample = () => (
 );
 
 export default {
-  title: 'owncast/Dropdown',
+  title: 'example/Dropdown',
   component: Dropdown,
   parameters: {},
 } as ComponentMeta<typeof Dropdown>;

web/stories/Introduction.stories.mdx

@@ -8,7 +8,7 @@ import Plugin from './assets/plugin.svg';
 import Repo from './assets/repo.svg';
 import StackAlt from './assets/stackalt.svg';
 
-<Meta title="Example/Introduction" />
+<Meta title="Owncast/Readme" />
 
 <style>{`
   .subheading {

web/stories/Tabs.stories.tsx

@@ -45,7 +45,7 @@ class TabsExample extends React.Component {
 }
 
 export default {
-  title: 'owncast/Tabs',
+  title: 'example/Tabs',
   component: Tabs,
 } as ComponentMeta<typeof Tabs>;
 

web/stories/Video.stories.tsx

@@ -1,16 +1,32 @@
 import React from 'react';
 import { ComponentStory, ComponentMeta } from '@storybook/react';
-import VideoPoster from '../components/video/VideoPoster';
+import OwncastPlayer from '../components/video/owncastplayer';
+
+const streams = {
+  DemoServer: `https://watch.owncast.online`,
+  RetroStrangeTV: `https://live.retrostrange.com`,
+  localhost: `http://localhost:8080`,
+};
 
 export default {
-  title: 'owncast/VideoPoster',
-  component: VideoPoster,
+  title: 'owncast/Player',
+  component: OwncastPlayer,
+  argTypes: {
+    source: {
+      options: Object.keys(streams),
+      mapping: streams,
+      control: {
+        type: 'select',
+      },
+    },
+  },
   parameters: {},
-} as ComponentMeta<typeof VideoPoster>;
+} as ComponentMeta<typeof OwncastPlayer>;
 
-const VideoPosterExample = () => <VideoPoster />;
+const Template: ComponentStory<typeof OwncastPlayer> = args => <OwncastPlayer {...args} />;
 
-// eslint-disable-next-line @typescript-eslint/no-unused-vars
-const Template: ComponentStory<typeof VideoPoster> = args => <VideoPosterExample />;
-
-export const Basic = Template.bind({});
+export const LiveDemo = Template.bind({});
+LiveDemo.args = {
+  online: true,
+  source: 'https://watch.owncast.online',
+};