diff --git a/docker/rootfs/usr/local/nginx/conf/nginx.conf b/docker/rootfs/usr/local/nginx/conf/nginx.conf index eff884c14..9aea23cd9 100644 --- a/docker/rootfs/usr/local/nginx/conf/nginx.conf +++ b/docker/rootfs/usr/local/nginx/conf/nginx.conf @@ -204,6 +204,15 @@ http { proxy_set_header Host $host; } + location /api/go2rtc/ { + proxy_pass http://go2rtc/; + rewrite ^/api/go2rtc/(.*)$ /api/$1 break; + proxy_http_version 1.1; + proxy_set_header Upgrade $http_upgrade; + proxy_set_header Connection "Upgrade"; + proxy_set_header Host $host; + } + location ~* /api/.*\.(jpg|jpeg|png)$ { add_header 'Access-Control-Allow-Origin' '*'; add_header 'Access-Control-Allow-Methods' 'GET, POST, PUT, DELETE, OPTIONS'; diff --git a/web/src/Sidebar.jsx b/web/src/Sidebar.jsx index a7d7639e8..2afec76c5 100644 --- a/web/src/Sidebar.jsx +++ b/web/src/Sidebar.jsx @@ -48,6 +48,7 @@ export default function Sidebar() { +
diff --git a/web/src/app.tsx b/web/src/app.tsx index 124a0f3cb..11fce8e70 100644 --- a/web/src/app.tsx +++ b/web/src/app.tsx @@ -38,6 +38,7 @@ export default function App() { + diff --git a/web/src/routes/Go2RTC.jsx b/web/src/routes/Go2RTC.jsx new file mode 100644 index 000000000..b28ba7e40 --- /dev/null +++ b/web/src/routes/Go2RTC.jsx @@ -0,0 +1,97 @@ +import { h } from 'preact'; +import useSWR from 'swr'; +import axios from 'axios'; +import { useApiHost } from '../api'; +import ActivityIndicator from '../components/ActivityIndicator'; +import Heading from '../components/Heading'; +import { useEffect, useState } from 'preact/hooks'; +import Button from '../components/Button'; +import { editor, Uri } from 'monaco-editor'; +import { setDiagnosticsOptions } from 'monaco-yaml'; +import copy from 'copy-to-clipboard'; + +export default function Go2RTC() { + const apiHost = useApiHost(); + + const { data: config } = useSWR('go2rtc/config'); + const [success, setSuccess] = useState(); + const [error, setError] = useState(); + + const onHandleSaveConfig = async (e) => { + if (e) { + e.stopPropagation(); + } + + axios + .post('go2rtc/config', window.editor.getValue(), { + headers: { 'Content-Type': 'text/plain' }, + }) + .then((response) => { + if (response.status === 200) { + setSuccess(response.data); + } + }) + .catch((error) => { + if (error.response) { + setError(error.response.data.message); + } else { + setError(error.message); + } + }); + }; + + const handleCopyConfig = async () => { + copy(window.editor.getValue()); + }; + + useEffect(() => { + if (!config) { + return; + } + + if (document.getElementById('container_go2rtc').children.length > 0) { + // we don't need to recreate the editor if it already exists + return; + } + + setDiagnosticsOptions({ + enableSchemaRequest: true, + hover: true, + completion: true, + validate: true, + format: true, + }); + + window.editor = editor.create(document.getElementById('container_go2rtc'), { + language: 'yaml', + value: config, + scrollBeyondLastLine: false, + theme: 'vs-dark', + }); + }); + + if (!config) { + return ; + } + + return ( +
+
+ go2rtc +
+ + +
+
+ + {success &&
{success}
} + {error &&
{error}
} + +
+
+ ); +} \ No newline at end of file diff --git a/web/src/routes/index.js b/web/src/routes/index.js index eeadbbb4f..a9c98e271 100644 --- a/web/src/routes/index.js +++ b/web/src/routes/index.js @@ -43,6 +43,11 @@ export async function getConfig(_url, _cb, _props) { return module.default; } +export async function getGo2RTC(_url, _cb, _props) { + const module = await import('./Go2RTC.jsx'); + return module.default; +} + export async function getLogs(_url, _cb, _props) { const module = await import('./Logs.jsx'); return module.default;