pimhwang
/
owncast
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge pull request #10 from thilobillerbeck/master 

Add help section to admin (see owncast/owncast#541)
pull/1886/head
Gabe Kangas 6 years ago committed by GitHub
parent
f5f5939ce0 82bcff444a
commit
611b5dd9a2
2 changed files with 176 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 10
      web/pages/components/main-layout.tsx
  2. 167
      web/pages/help.tsx

10
web/pages/components/main-layout.tsx
Unescape View File

@ -13,7 +13,8 @@ import {
ToolOutlined, ToolOutlined,
PlayCircleFilled, PlayCircleFilled,
MinusSquareFilled, MinusSquareFilled,
MessageOutlined, QuestionCircleOutlined,
MessageOutlined
} from '@ant-design/icons'; } from '@ant-design/icons';
import classNames from 'classnames'; import classNames from 'classnames';
import { upgradeVersionAvailable } from "../../utils/apis"; import { upgradeVersionAvailable } from "../../utils/apis";
@ -149,6 +150,13 @@ export default function MainLayout(props) {
</Link> </Link>
</Menu.Item> </Menu.Item>
</SubMenu> </SubMenu>
<Menu.Item
key="help"
icon={<QuestionCircleOutlined />}
title="Help"
>
<Link href="/help">Help</Link>
</Menu.Item>
</Menu> </Menu>
</Sider> </Sider>

167
web/pages/help.tsx
Unescape View File

@ -0,0 +1,167 @@
import { Button, Card, Col, Divider, Result, Row } from 'antd'
import Meta from 'antd/lib/card/Meta'
import Title from 'antd/lib/typography/Title'
import {
AlertOutlined,
ApiTwoTone,
BookOutlined,
BugTwoTone,
CameraTwoTone,
DatabaseTwoTone,
EditTwoTone,
Html5TwoTone,
LinkOutlined,
QuestionCircleTwoTone,
SettingTwoTone,
SlidersTwoTone,
} from '@ant-design/icons'
import React from 'react'
interface Props { }
export default function Help(props: Props) {
const questions = [
{
icon: <SettingTwoTone style={{ fontSize: '24px' }} />,
title: "I want to configure my owncast instance",
content: (
<div>
<a href="https://owncast.online/docs/configuration/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a>
</div>
)
},
{
icon: <CameraTwoTone style={{ fontSize: '24px' }} />,
title: "I need help configuring my broadcasting software",
content: (
<div>
<a href="https://owncast.online/docs/broadcasting/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a>
</div>
)
},
{
icon: <Html5TwoTone style={{ fontSize: '24px' }} />,
title: "I want to embed my stream into another site",
content: (
<div>
<a href="https://owncast.online/docs/embed/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a>
</div>
)
},
{
icon: <EditTwoTone style={{ fontSize: '24px' }} />,
title: "I want to customize my website",
content: (
<div>
<a href="https://owncast.online/docs/website/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a>
</div>
)
},
{
icon: <SlidersTwoTone style={{ fontSize: '24px' }} />,
title: "I want to tweak my encoding",
content: (
<div>
<a href="https://owncast.online/docs/encoding/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a>
</div>
)
},
{
icon: <DatabaseTwoTone style={{ fontSize: '24px' }} />,
title: "I want to offload my video to an external storage provider",
content: (
<div>
<a href="https://owncast.online/docs/s3/" target="_blank" rel="noopener noreferrer"><LinkOutlined/> Learn more</a>
</div>
)
},
]
const otherResources = [
{
icon: <BugTwoTone style={{ fontSize: '24px' }} />,
title: "I found a bug",
content: (
<div>
If you found a bug, then report it in our
<a href="https://github.com/owncast/owncast/" target="_blank" rel="noopener noreferrer"> Github Issues</a>
</div>
)
},
{
icon: <QuestionCircleTwoTone style={{ fontSize: '24px' }} />,
title: "I have a general question",
content: (
<div>
Most general questions are answered in our
<a href="https://owncast.online/docs/faq/" target="_blank" rel="noopener noreferrer"> FAQ</a>
</div>
)
},
{
icon: <ApiTwoTone style={{ fontSize: '24px' }} />,
title: "I want to use the API",
content: (
<div>
You can view the API documentation for either the
<a href="https://owncast.online/api/latest" target="_blank" rel="noopener noreferrer">&nbsp;latest&nbsp;</a>
or
<a href="https://owncast.online/api/development" target="_blank" rel="noopener noreferrer">&nbsp;development&nbsp;</a>
release.
</div>
)
}
]
return (
<div>
<Title style={{textAlign: 'center'}}>How can we help you?</Title>
<Row gutter={[16, 16]} justify="space-around" align="middle">
<Col xs={24} lg={12} style={{textAlign: 'center'}}>
<Result status="500" />
<Title level={2}>Troubleshooting</Title>
<Button target="_blank" rel="noopener noreferrer" href="https://owncast.online/docs/troubleshooting/" icon={<LinkOutlined/>} type="primary">Read Troubleshoting</Button>
</Col>
<Col xs={24} lg={12} style={{textAlign: 'center'}}>
<Result status="404" />
<Title level={2}>Documentation</Title>
<Button target="_blank" rel="noopener noreferrer" href="https://owncast.online/" icon={<LinkOutlined/>} type="primary">Read the Docs</Button>
</Col>
</Row>
<Divider />
<Title level={2}>Common tasks</Title>
<Row gutter={[16, 16]}>
{
questions.map(question => (
<Col xs={24} lg={12}>
<Card key={question.title}>
<Meta
avatar={question.icon}
title={question.title}
description={question.content}
/>
</Card>
</Col>
))
}
</Row>
<Divider />
<Title level={2}>Other</Title>
<Row gutter={[16, 16]}>
{
otherResources.map(question => (
<Col xs={24} lg={12}>
<Card key={question.title}>
<Meta
avatar={question.icon}
title={question.title}
description={question.content}
/>
</Card>
</Col>
))
}
</Row>
</div>
)
}
Write Preview
Loading…
Cancel
Save