Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
2
2021-060
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Analytics
Analytics
CI / CD
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
2021-060
2021-060
Commits
60e7e948
Commit
60e7e948
authored
Sep 21, 2021
by
Dhananjaya Jayashanka
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
add live speech UI
parent
171c1a65
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
254 additions
and
0 deletions
+254
-0
UI/live speech.html
UI/live speech.html
+254
-0
No files found.
UI/live speech.html
0 → 100644
View file @
60e7e948
<!DOCTYPE html>
<html
lang=
"en"
>
<head>
<meta
charset=
"utf-8"
>
<meta
content=
"width=device-width, initial-scale=1.0"
name=
"viewport"
>
<title>
Inner Page - OnePage Bootstrap Template
</title>
<meta
content=
""
name=
"description"
>
<meta
content=
""
name=
"keywords"
>
<!-- Favicons -->
<link
href=
"assets/img/favicon.png"
rel=
"icon"
>
<link
href=
"assets/img/apple-touch-icon.png"
rel=
"apple-touch-icon"
>
<!-- Google Fonts -->
<link
href=
"https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Raleway:300,300i,400,400i,500,500i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i"
rel=
"stylesheet"
>
<!-- Vendor CSS Files -->
<link
href=
"assets/vendor/aos/aos.css"
rel=
"stylesheet"
>
<link
href=
"assets/vendor/bootstrap/css/bootstrap.min.css"
rel=
"stylesheet"
>
<link
href=
"assets/vendor/bootstrap-icons/bootstrap-icons.css"
rel=
"stylesheet"
>
<link
href=
"assets/vendor/boxicons/css/boxicons.min.css"
rel=
"stylesheet"
>
<link
href=
"assets/vendor/glightbox/css/glightbox.min.css"
rel=
"stylesheet"
>
<link
href=
"assets/vendor/remixicon/remixicon.css"
rel=
"stylesheet"
>
<link
href=
"assets/vendor/swiper/swiper-bundle.min.css"
rel=
"stylesheet"
>
<!-- Template Main CSS File -->
<link
href=
"assets/css/style.css"
rel=
"stylesheet"
>
<title>
Media Recorder in Javascript
</title>
<link
rel=
"stylesheet"
href=
"main.css"
/>
<!-- =======================================================
* Template Name: OnePage - v4.3.0
* Template URL: https://bootstrapmade.com/onepage-multipurpose-bootstrap-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
======================================================== -->
<link
rel=
"stylesheet"
href=
"https://use.fontawesome.com/releases/v5.6.3/css/all.css"
integrity=
"sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/"
crossorigin=
"anonymous"
>
</head>
<body>
<!-- ======= Header ======= -->
<header
id=
"header"
class=
"fixed-top"
>
<div
class=
"container d-flex align-items-center justify-content-between"
>
<h1
class=
"logo"
><a
href=
"index.html"
>
OnePage
</a></h1>
<!-- Uncomment below if you prefer to use an image logo -->
<!-- <a href="index.html" class="logo"><img src="assets/img/logo.png" alt="" class="img-fluid"></a>-->
<nav
id=
"navbar"
class=
"navbar"
>
<ul>
<li><a
class=
"nav-link scrollto "
href=
"#hero"
>
Home
</a></li>
<li><a
class=
"nav-link scrollto"
href=
"#about"
>
About
</a></li>
<li><a
class=
"nav-link scrollto"
href=
"#services"
>
Services
</a></li>
<li><a
class=
"nav-link scrollto o"
href=
"#portfolio"
>
Portfolio
</a></li>
<li><a
class=
"nav-link scrollto"
href=
"#team"
>
Team
</a></li>
<li><a
class=
"nav-link scrollto"
href=
"#pricing"
>
Pricing
</a></li>
<li
class=
"dropdown"
><a
href=
"#"
><span>
Drop Down
</span>
<i
class=
"bi bi-chevron-down"
></i></a>
<ul>
<li><a
href=
"#"
>
Drop Down 1
</a></li>
<li
class=
"dropdown"
><a
href=
"#"
><span>
Deep Drop Down
</span>
<i
class=
"bi bi-chevron-right"
></i></a>
<ul>
<li><a
href=
"#"
>
Deep Drop Down 1
</a></li>
<li><a
href=
"#"
>
Deep Drop Down 2
</a></li>
<li><a
href=
"#"
>
Deep Drop Down 3
</a></li>
<li><a
href=
"#"
>
Deep Drop Down 4
</a></li>
<li><a
href=
"#"
>
Deep Drop Down 5
</a></li>
</ul>
</li>
<li><a
href=
"#"
>
Drop Down 2
</a></li>
<li><a
href=
"#"
>
Drop Down 3
</a></li>
<li><a
href=
"#"
>
Drop Down 4
</a></li>
</ul>
</li>
<li><a
class=
"nav-link scrollto"
href=
"#contact"
>
Contact
</a></li>
<li><a
class=
"getstarted scrollto"
href=
"#about"
>
Get Started
</a></li>
</ul>
<i
class=
"bi bi-list mobile-nav-toggle"
></i>
</nav>
<!-- .navbar -->
</div>
</header>
<!-- End Header -->
<main
id=
"main"
>
<br><br><br><br>
<div
id=
"container"
>
<div
class=
"row"
>
<div
class=
"col"
>
</div>
<div
class=
"col"
>
<video
id=
"gum"
playsinline
autoplay
muted
></video>
<br>
<h3>
The recorded video will appear here
</h3>
<video
id=
"recorded"
playsinline
loop
></video>
<br>
</div>
<div
class=
"col"
>
</div>
</div>
<div
class=
"row"
>
<div
class=
"col d-flex justify-content-center"
><button
id=
"start"
class=
"btn btn-primary btn-lg"
>
Start camera
 
<h5
class=
"fa fa-camera"
></h5></button></div>
<div
class=
"col d-flex justify-content-center "
><button
id=
"record"
class=
"btn btn-danger btn-lg"
disabled
>
Record
</button></div>
<div
class=
"col d-flex justify-content-center"
><button
id=
"play"
class=
"btn btn-success btn-lg"
disabled
>
Play
 
<h5
class=
"fa fa-play"
></h5></button></div>
<div
class=
"col d-flex justify-content-center"
><button
id=
"download"
class=
"btn btn-dark btn-lg"
disabled
>
Download
 
<h5
class=
"fa fa-download"
></h5></button></div>
</div>
<br>
<div
class=
"row"
>
<div
class=
"col"
>
</div>
<div
class=
"col d-flex justify-content-center"
>
<div>
<!-- <h4>Media Stream Constraints options</h4>-->
<h6><b>
Echo cancellation:
<input
type=
"checkbox"
id=
"echoCancellation"
/>
</b>
</h6>
</div>
</div>
<div
class=
"col"
></div>
</div>
<br>
<div>
<span
id=
"errorMsg"
></span>
</div>
</div>
</main>
<!-- End #main -->
<!-- ======= Footer ======= -->
<footer
id=
"footer"
>
<div
class=
"footer-top"
>
<div
class=
"container"
>
<div
class=
"row"
>
<div
class=
"col-lg-3 col-md-6 footer-contact"
>
<h3>
OnePage
</h3>
<p>
A108 Adam Street
<br>
New York, NY 535022
<br>
United States
<br><br>
<strong>
Phone:
</strong>
+1 5589 55488 55
<br>
<strong>
Email:
</strong>
info@example.com
<br>
</p>
</div>
<div
class=
"col-lg-2 col-md-6 footer-links"
>
<h4>
Useful Links
</h4>
<ul>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Home
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
About us
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Services
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Terms of service
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Privacy policy
</a></li>
</ul>
</div>
<div
class=
"col-lg-3 col-md-6 footer-links"
>
<h4>
Our Services
</h4>
<ul>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Web Design
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Web Development
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Product Management
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Marketing
</a></li>
<li><i
class=
"bx bx-chevron-right"
></i>
<a
href=
"#"
>
Graphic Design
</a></li>
</ul>
</div>
<div
class=
"col-lg-4 col-md-6 footer-newsletter"
>
<h4>
Join Our Newsletter
</h4>
<p>
Tamen quem nulla quae legam multos aute sint culpa legam noster magna
</p>
<form
action=
""
method=
"post"
>
<input
type=
"email"
name=
"email"
><input
type=
"submit"
value=
"Subscribe"
>
</form>
</div>
</div>
</div>
</div>
<div
class=
"container d-md-flex py-4"
>
<div
class=
"me-md-auto text-center text-md-start"
>
<div
class=
"copyright"
>
©
Copyright
<strong><span>
OnePage
</span></strong>
. All Rights Reserved
</div>
<div
class=
"credits"
>
<!-- All the links in the footer should remain intact. -->
<!-- You can delete the links only if you purchased the pro version. -->
<!-- Licensing information: https://bootstrapmade.com/license/ -->
<!-- Purchase the pro version with working PHP/AJAX contact form: https://bootstrapmade.com/onepage-multipurpose-bootstrap-template/ -->
Designed by
<a
href=
"https://bootstrapmade.com/"
>
BootstrapMade
</a>
</div>
</div>
<div
class=
"social-links text-center text-md-right pt-3 pt-md-0"
>
<a
href=
"#"
class=
"twitter"
><i
class=
"bx bxl-twitter"
></i></a>
<a
href=
"#"
class=
"facebook"
><i
class=
"bx bxl-facebook"
></i></a>
<a
href=
"#"
class=
"instagram"
><i
class=
"bx bxl-instagram"
></i></a>
<a
href=
"#"
class=
"google-plus"
><i
class=
"bx bxl-skype"
></i></a>
<a
href=
"#"
class=
"linkedin"
><i
class=
"bx bxl-linkedin"
></i></a>
</div>
</div>
</footer>
<!-- End Footer -->
<div
id=
"preloader"
></div>
<a
href=
"#"
class=
"back-to-top d-flex align-items-center justify-content-center"
><i
class=
"bi bi-arrow-up-short"
></i></a>
<!-- Vendor JS Files -->
<script
src=
"assets/vendor/aos/aos.js"
></script>
<script
src=
"assets/vendor/bootstrap/js/bootstrap.bundle.min.js"
></script>
<script
src=
"assets/vendor/glightbox/js/glightbox.min.js"
></script>
<script
src=
"assets/vendor/isotope-layout/isotope.pkgd.min.js"
></script>
<script
src=
"assets/vendor/php-email-form/validate.js"
></script>
<script
src=
"assets/vendor/purecounter/purecounter.js"
></script>
<script
src=
"assets/vendor/swiper/swiper-bundle.min.js"
></script>
<!-- Template Main JS File -->
<script
src=
"assets/js/main.js"
></script>
<script
src=
"script.js"
></script>
</body>
</html>
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment