Files
owncast/webroot/index.html
2020-06-11 01:24:05 -07:00

125 lines
4.9 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<head>
<meta charset="UTF-8" />
<title>Live stream test</title>
<link
href="https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
rel="stylesheet"
/>
<link href="./styles/layout.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<!-- Used for animating the scrolling of the chat div. Can that be done other ways? -->
<script src="vendor/jquery-2.1.4.min.js"></script>
<script src="vendor/autolink.js"></script>
</head>
<body>
<div id="app-container" class="flex">
<header class="flex">
<h1>
Maybe a header
</h1>
<span>💬</span>
</header>
<div id="main-content-container" class="flex nxo-chat">
<!-- LEFT CONTAINER SIDE-->
<div class="flex main-cols left-col">
<div id="video-container" class="flex shadow-md">
<video
id="video"
preload="auto"
autoplay
controls
src="https://ia800300.us.archive.org/17/items/BigBuckBunny_124/Content/big_buck_bunny_720p_surround.mp4"
></video>
</div>
<div id="info">
{{ streamStatus }} {{ viewerCount }} {{ 'viewer' | plural(viewerCount) }}.
Heart rate notifications.
Apple Watch checks for unusually high or low heart rates in the background, which could be signs of a serious underlying condition. This could help you and your patients identify situations which may warrant further evaluation.
<br>
If a patients heart rate is above 120 bpm or below 40 bpm while they appear to have been inactive for 10 minutes, the user will receive a notification. Patients can adjust the threshold bpm or turn these notifications on or off. All heart rate notifications — along with date, time, and heart rate — can be viewed in the Health app on iPhone.
<br>
Heart rate notifications.
Apple Watch checks for unusually high or low heart rates in the background, which could be signs of a serious underlying condition. This could help you and your patients identify situations which may warrant further evaluation.
<br>
If a patients heart rate is above 120 bpm or below 40 bpm while they appear to have been inactive for 10 minutes, the user will receive a notification. Patients can adjust the threshold bpm or turn these notifications on or off. All heart rate notifications — along with date, time, and heart rate — can be viewed in the Health app on iPhone.
</div>
</div>
<!-- RIGHT CONTAINER SIDE-->
<div class="flex main-cols right-col">
<div id="chat-container">
<div id="messages-container">
Heart rate notifications.
Apple Watch checks for unusually high or low heart rates in the background, which could be signs of a serious underlying condition. This could help you and your patients identify situations which may warrant further evaluation.— can be viewed in the Health app on iPhone.
<div v-for="(message, index) in messages">
<div class="message flex">
<img
v-bind:src="message.image"
class="message-avatar rounded-full"
/>
<div class="message-content">
<p class="message-author">{{ message.author }}</p>
<p class="message-text"v-html="message.linkedText()"></p>
</div>
</div>
</div>
</div>
<div id="chat-input-container" class="shadow-md">
<form id="chat-form" class="flex" @submit="submitChatForm">
<input type="hidden" name="inputAuthor" id="inputAuthor" v-model="message.author" />
<!-- Author -->
<!-- <label class="control-label" for="inputAuthor">Author</label>
<input
id="inputAuthor"
type="text"
class="appearance-none bg-gray-200 text-gray-700 border border-black-500 rounded py-3 px-4 mb-3 leading-tight focus:outline-none focus:bg-white"
placeholder="Name"
v-model="message.author"
/> -->
<textarea
id="inputBody"
placeholder="Message"
v-model="message.body"
class="appearance-none block w-full bg-gray-200 text-gray-700 border border-black-500 rounded py-2 px-2 my-2 leading-tight focus:bg-white"
>
</textarea>
<button
class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-1 px-2 rounded"
>
Send
</button>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="js/message.js"></script>
<script src="js/app.js"></script>
</body>
</html>