-
-
Notifications
You must be signed in to change notification settings - Fork 115
/
Copy pathindex.html
221 lines (200 loc) · 10.6 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>TelePrompter</title>
<!-- Mobile Specific Meta Tags -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta name="apple-mobile-web-app-title" content="TelePrompter" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="theme-color" content="#141414" />
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0,viewport-fit=cover" />
<!-- Default Meta Tags -->
<meta name="description" content="Browser-based TelePrompter with Remote Control">
<meta name="keywords" content="TelePrompter, Remote, Browser, Open Source">
<meta name="cache-control" content="public">
<meta name="company" content="Fatal Encounters">
<meta name="googlebot" content="index,follow">
<meta name="robots" content="noodp,noydir">
<meta name="robots" content="index,follow">
<meta name="author" content="Peter Schmalfeldt">
<!-- Twitter META Info -->
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:site" content="@mrmidi">
<meta property="twitter:title" content="TelePrompter">
<meta property="twitter:description" content="Browser-based TelePrompter with Remote Control">
<meta property="twitter:creator" content="@mrmidi">
<meta property="twitter:image:src" content="https://promptr.tv/assets/img/social-card.png">
<meta property="twitter:domain" content="promptr.tv">
<!-- Open Graph protocol -->
<meta property="og:locale" content="en_US">
<meta property="og:type" content="website">
<meta property="og:title" content="TelePrompter">
<meta property="og:url" content="https://promptr.tv">
<meta property="og:image" content="https://promptr.tv/assets/img/social-card.png">
<meta property="og:site_name" content="TelePrompter">
<meta property="og:description" content="Browser-based TelePrompter with Remote Control">
<!-- Dublin Core Metadata -->
<meta name="dc:language" content="en_US">
<meta name="dc:title" content="TelePrompter">
<meta name="dc:source" content="https://promptr.tv">
<meta name="dc:description" content="Browser-based TelePrompter with Remote Control">
<!-- Manifest -->
<link rel="manifest" href="manifest.json" />
<!-- Icons -->
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
<link rel="apple-touch-icon" sizes="192x192" href="assets/img/apple/icon-192x192.png" />
<!-- Canonical -->
<link rel="canonical" href="https://promptr.tv" />
<!-- Styles -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;600&display=swap">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/redmond/jquery-ui.min.css" />
<link rel="stylesheet" href="assets/css/style.v122.css">
<link rel="stylesheet" href="assets/css/font-awesome.min.css">
<!-- DNS Pre-Connects -->
<link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin />
<link rel="preconnect" href="https://code.jquery.com/" crossorigin />
<!-- Preload Assets -->
<link rel="preload" href="assets/font/fontawesome-webfont.woff?v=3.2.1" as="font" type="font/woff2" crossorigin>
</head>
<body id="gui">
<a href="https://github.com/manifestinteractive/teleprompter#readme" id="get-help" target="_blank" title="Get Help with TelePrompter" aria-label="Get Help with TelePrompter" data-ga data-category="Nav" data-action="Help" data-label="Get Help">
<i class="icon-question-sign"></i>
</a>
<div id="modal">
<a class="button icon-remove-circle close-modal" href="javascript:void(0)" role="button" aria-label="Close Modal" title="Close Modal" data-ga data-category="Nav" data-action="Modal" data-label="Close Modal"></a>
<div class="modal-content">
<!-- Remote Control -->
<div id="remote-control-modal">
<h1>Remote Control</h1>
<p>Access the Following URL from another device:</p>
<p class="remote-url">https://promptr.tv/remote</p>
<p>Enter this Remote ID:</p>
<p class="remote-id"></p>
<div id="qr-code"></div>
<p>Remote Control QR Code</p>
</div>
<!-- Software Update -->
<div id="software-update">
<h1>Software Update</h1>
<p>Thanks for using <strong>TelePrompter</strong>. We just wanted to let you know that we have updated our site since the last time you visited.</p>
<a href="https://github.com/manifestinteractive/teleprompter/releases/latest" target="_blank" rel="nofollow noopener" data-ga data-category="Nav" data-action="Software Update" data-label="See Updates">See Updates</a>
</div>
</div>
<div class="modal-overlay"></div>
</div>
<header>
<h1><i class="icon icon-bullhorn"></i> <span class="clock">00:00:00</span></h1>
<nav>
<div class="colors" role="group" aria-label="Color Pickers">
<input type="color" id="text-color" value="#ffffff" aria-label="Text Color">
<input type="color" id="background-color" value="#141414" aria-label="Background Color">
</div>
<div class="sliders">
<label class="font_size_label" aria-label="Font Size">
Font <span>(60)</span>:
<div class="font_size slider"></div>
</label><br>
<label class="speed_label" aria-label="Page Speed">
Speed <span>(35)</span>:
<div class="speed slider"></div>
</label>
</div>
<div class="buttons" role="group" aria-label="TelePrompter Controls">
<button class="button small icon-tablet remote" aria-label="Remote Control" title="Remote Control" data-ga data-category="Nav" data-action="Control" data-label="Remote"></button>
<button class="button small icon-eye-close dim-controls" aria-label="Dim While Reading" title="Dim While Reading" data-ga data-category="Nav" data-action="Control" data-label="Dim"></button>
<button class="button small icon-undo reset" aria-label="Reset TelePrompter" title="Reset TelePrompter" data-ga data-category="Nav" data-action="Control" data-label="Reset"></button>
<button class="button small icon-text-width flip-x" aria-label="Flip Text Horizontally" title="Flip Text Horizontally" data-ga data-category="Nav" data-action="Control" data-label="FlipX"></button>
<button class="button small icon-text-height flip-y" aria-label="Flip Text Vertically" title="Flip Text Vertically" data-ga data-category="Nav" data-action="Control" data-label="FlipY"></button>
<button class="button icon-play play active" aria-label="Play / Pause" title="Play / Pause TelePrompter" data-ga data-category="Nav" data-action="Control" data-label="Play"></button>
</div>
</nav>
</header>
<article>
<div class="overlay">
<div class="top"></div>
<div class="bottom"></div>
</div>
<div class="teleprompter" id="teleprompter" role="textbox" aria-multiline="true" aria-label="TelePrompter Text" contenteditable>
Oh, hello there. I did not see you come in. I was too busy reading off this TelePrompter. It does some pretty cool
things, for example:
<br><br>
You can edit the text right on the page. It'll even save it for you if you happen to leave the page. That's some
smart thinking.
<br><br>
If you're using an iPad, you can add a shortcut to your home screen for full screen awesomeness.
<br><br>
You can also use some handy keyboard shortcuts to speed things up. You can adjust the speed and font size at the
top right as well. We're also experimenting with ways to flip the text around for you fancy folks using mirrors.
<br><br>
The keyboard shortcuts are as follows:
<br><br>
Up: Increases Font Size
<br><br>
Down: Decreases Font Size
<br><br>
Left: Slows Down Teleprompter
<br><br>
Right: Speeds Up Teleprompter
<br><br>
Space: Starts / Stops Teleprompter
<br><br>
Escape: Resets Everything
<br><br>
Finally, we also made an effort to make sure your text will be easy to read. So if you are pasting text from a
Microsoft Word document, we'll do some cleaning up to make the breaks flow more easily.
<br><br>
Thanks for stopping by.
<br><br>
Love this TelePrompter?
<br><br>
<a href="https://github.com/manifestinteractive/teleprompter#project-support" contenteditable="false" class="sponsor-project" target="_blank" title="Support TelePrompter" aria-label="Support TelePrompter" data-ga data-category="Nav" data-action="Help" data-label="Support TelePrompter">
Support Our Work :)
</a><br><br>
Thanks !!!
</div>
<i class="icon-play marker" style="display: none"></i>
</article>
<script>
(function(d, s, id) {
var js, tjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) { return; }
js = d.createElement(s);
js.id = id;
js.src = (window.location.hostname === 'promptr.tv')
? 'https://promptr.tv/remote/socket.io/socket.io.js'
: 'http://' + window.location.hostname + ':3000/socket.io/socket.io.js';
tjs.parentNode.insertBefore(js, tjs);
}(document, 'script', 'teleprompter-socket'));
</script>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-S1R98WW400"></script>
<script>
window['ga-disable-G-S1R98WW400'] = (window.location.hostname !== 'promptr.tv');
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-S1R98WW400', {
'anonymize_ip': true,
'allow_google_signals': false
});
</script>
<script src="assets/js/plugins.v122.js"></script>
<script src="assets/js/script.v122.js"></script>
<script>
// Load Service Worker for PWA
if (typeof navigator !== 'undefined' && 'serviceWorker' in navigator) {
navigator.serviceWorker.register('./sw.js').then(function(reg) {
console.log('Successfully registered service worker', reg);
}).catch(function(err) {
console.warn('Error whilst registering service worker', err);
});
}
// Initialize App
window.onload = function() {
TelePrompter.init();
};
</script>
</body>
</html>