Navy.gif/owncast
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
0ac9ea7f57
owncast/webroot/index.html

86 lines
3.8 KiB
HTML
Raw Normal View History

chat fixes v3 or 5 or 123 (#168) * only consider short-heights when not smallscreen; hide status bar when small screen, but leave shadow; * fix max char counting bugs with paste, yet be still be able to use modifier keys even when max chars reached * rmeove 'chat' button; move into textarea * use image for emoji picker for sizing consitency * cleanup unused things * - totally unecessary emoji picker style improvements - totally necessary doctype added to emoji picker so it shows up more stable-y on mobile views * more stable layout positioning for chat panel without hacky margins, so that the bottom of the message list will always be on top of the form input, and not behind it at any point. * hide header on touch screens when screns are small and screen height is short (possibly when keyboard is up), so that there's more visibliity to see messages. this only works on chrome, not ios safari right now, due to the position: fixed of things. * move char counting to keyup instead * address message text horiz overflow (#157) * dont jumpToBottom if user has scrolled about 200px from the bottom (#101) * scroll to bottom on resize too * cleanup * revert test bool * typo * re-readjust short-wide case again * - add focus to input field after emoji is selected, put cursor at end - instead of smooth scrolling to bottom, just jump there.
2020-09-22 05:11:09 +02:00
<!DOCTYPE html>
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>
<link rel="apple-touch-icon" sizes="57x57" href="/img/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/img/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/img/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/img/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/img/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/img/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/img/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/img/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/img/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/img/favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/img/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/img/favicon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/img/favicon/favicon-16x16.png">
<link rel="manifest" href="/manifest.json">
Preload preact, emoji. Defer some js. (#162)
2020-09-20 19:03:54 +02:00
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/img/favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
Preload preact, emoji. Defer some js. (#162)
2020-09-20 19:03:54 +02:00
<link href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css" rel="stylesheet"/>
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
Preload preact, emoji. Defer some js. (#162)
2020-09-20 19:03:54 +02:00
<link href="//unpkg.com/video.js@7.9.3/dist/video-js.css" rel="stylesheet" />
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
<link href="https://unpkg.com/@videojs/themes@1/dist/fantasy/index.css" rel="stylesheet" />
Preload preact, emoji. Defer some js. (#162)
2020-09-20 19:03:54 +02:00
<script src="//unpkg.com/video.js@7.9.3/dist/alt/video.core.min.js" defer></script>
<script src="//unpkg.com/@videojs/http-streaming@2.1.0/dist/videojs-http-streaming.min.js" defer></script>
start a video-only page; fix some styles
2020-08-24 06:23:16 +02:00
<!-- markdown renderer -->
Preload preact, emoji. Defer some js. (#162)
2020-09-20 19:03:54 +02:00
<script src="//unpkg.com/showdown/dist/showdown.min.js" defer></script>
<script type="module" src="https://cdn.jsdelivr.net/npm/@justinribeiro/lite-youtube@0.6.2/lite-youtube.js" defer></script>
address MR comments
2020-08-26 09:51:40 +02:00
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
<link href="./styles/video.css" rel="stylesheet" />
<link href="./styles/chat.css" rel="stylesheet" />
<link href="./styles/user-content.css" rel="stylesheet" />
fix responsive styles
2020-08-24 12:30:42 +02:00
<link href="./styles/app.css" rel="stylesheet" />
Preload preact, emoji. Defer some js. (#162)
2020-09-20 19:03:54 +02:00
<!-- Preloads -->
<link rel="preconnect" href="https://cdn.skypack.dev/pin/@joeattardi/emoji-button@v4.1.0-v8psdkkxts3LNdpA0m5Q/min/@joeattardi/emoji-button.js" />
<link rel="preconnect" href="https://unpkg.com/preact?module" />
<link rel="preconnect" href="https://unpkg.com/htm?module" />
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
</head>
chat fixes v3 or 5 or 123 (#168) * only consider short-heights when not smallscreen; hide status bar when small screen, but leave shadow; * fix max char counting bugs with paste, yet be still be able to use modifier keys even when max chars reached * rmeove 'chat' button; move into textarea * use image for emoji picker for sizing consitency * cleanup unused things * - totally unecessary emoji picker style improvements - totally necessary doctype added to emoji picker so it shows up more stable-y on mobile views * more stable layout positioning for chat panel without hacky margins, so that the bottom of the message list will always be on top of the form input, and not behind it at any point. * hide header on touch screens when screns are small and screen height is short (possibly when keyboard is up), so that there's more visibliity to see messages. this only works on chrome, not ios safari right now, due to the position: fixed of things. * move char counting to keyup instead * address message text horiz overflow (#157) * dont jumpToBottom if user has scrolled about 200px from the bottom (#101) * scroll to bottom on resize too * cleanup * revert test bool * typo * re-readjust short-wide case again * - add focus to input field after emoji is selected, put cursor at end - instead of smooth scrolling to bottom, just jump there.
2020-09-22 05:11:09 +02:00
<body class="scrollbar-hidden bg-gray-300 text-gray-800">
address MR comments
2020-08-26 09:51:40 +02:00
<div id="app"></div>
set up components and icons for optional creator's social pages; add airplay icon
2020-06-21 08:41:13 +02:00
address MR comments
2020-08-26 09:51:40 +02:00
<script type="module">
import { render, html } from 'https://unpkg.com/htm/preact/standalone.module.js';
import App from './js/app.js';
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
render(html`<${App} />`, document.getElementById("app"));
address MR comments
2020-08-26 09:51:40 +02:00
</script>
Merge of emoji + autolink + embed + etc (#108) * Add an emoji picker to chat * Update to the custom emoji picker and add first pass at using custom emoji in text box * Add custom emoji endpoint and use it in the app * Position the emoji picker * Handle events from the text input * pair down the number of party parrots * Size emoji in chat and input * Add new custom emoji * Add OMQ stickers as custom emoji * Show custom category for emoji picker by default * update omq emojis * Document basic supported markdown syntax. Closes #95 * Websocket refactor: Pull it out of the UI and support callbacks (#104) * Websocket refactor: Pull it out of the UI and support listeners * Changes required for Safari to be happy with modules * Move to explicit ad-hoc callback registration * Add an emoji picker to chat * Update to the custom emoji picker and add first pass at using custom emoji in text box * Handle events from the text input * Rebuild autolinking + embed handling for #93 * Re-enable disabling chat * Document basic supported markdown syntax. Closes #95 * Document basic supported markdown syntax. Closes #95 * Add an emoji picker to chat * Merge emoji and embeds. * Merge emoji + embed branches. Rework autolink +embeds. WIP for username highlighting for #100 * More updates to chat text formatting/embedding/linking * Fix username autocomplete to work with div instead of form elements * Post-rebase fixes + tweaks * Disable text input by setting contentEditable = false * Remove test that hardcodes pointing to public test server * Fix re-enable chat with the contentEditable input div * Style and fix the fake placeholder text in the input div * Missing file. Were did it go? * Set a height for instagram embeds * Cleanup Co-authored-by: Ginger Wong <omqmail@gmail.com>
2020-08-13 06:56:41 +02:00
address MR comments
2020-08-26 09:51:40 +02:00
<noscript>
<style>
.noscript {
text-align: center;
padding: 30px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
rename standalone assets so they're easier to find
2020-08-24 04:38:58 +02:00
address MR comments
2020-08-26 09:51:40 +02:00
.noscript a {
display: inline;
color: blue;
text-decoration: underline;
}
</style>
<div class="noscript">
<img src="https://owncast.online/images/logo.png" />
<br/>
<p>
This <a href="https://owncast.online" target="_blank">Owncast</a> stream requires Javascript to play.
</p>
</div>
</noscript>
</body>
Merge of emoji + autolink + embed + etc (#108) * Add an emoji picker to chat * Update to the custom emoji picker and add first pass at using custom emoji in text box * Add custom emoji endpoint and use it in the app * Position the emoji picker * Handle events from the text input * pair down the number of party parrots * Size emoji in chat and input * Add new custom emoji * Add OMQ stickers as custom emoji * Show custom category for emoji picker by default * update omq emojis * Document basic supported markdown syntax. Closes #95 * Websocket refactor: Pull it out of the UI and support callbacks (#104) * Websocket refactor: Pull it out of the UI and support listeners * Changes required for Safari to be happy with modules * Move to explicit ad-hoc callback registration * Add an emoji picker to chat * Update to the custom emoji picker and add first pass at using custom emoji in text box * Handle events from the text input * Rebuild autolinking + embed handling for #93 * Re-enable disabling chat * Document basic supported markdown syntax. Closes #95 * Document basic supported markdown syntax. Closes #95 * Add an emoji picker to chat * Merge emoji and embeds. * Merge emoji + embed branches. Rework autolink +embeds. WIP for username highlighting for #100 * More updates to chat text formatting/embedding/linking * Fix username autocomplete to work with div instead of form elements * Post-rebase fixes + tweaks * Disable text input by setting contentEditable = false * Remove test that hardcodes pointing to public test server * Fix re-enable chat with the contentEditable input div * Style and fix the fake placeholder text in the input div * Missing file. Were did it go? * Set a height for instagram embeds * Cleanup Co-authored-by: Ginger Wong <omqmail@gmail.com>
2020-08-13 06:56:41 +02:00
</html>
Reference in New Issue Copy Permalink