scratch – Blame information for rev 65

Subversion Repositories:
Rev:
Rev Author Line No. Line
25 office 1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
35 office 6 <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
7 <meta http-equiv="Pragma" content="no-cache" />
8 <meta http-equiv="Expires" content="0" />
25 office 9 <meta name="viewport" content="width=device-width, initial-scale=1">
10 <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
11 <meta name="description" content="quick asset upload">
12 <meta name="author" content="Wizardry and Steamworks">
13 <link rel="icon" href="favicon.ico">
14  
64 office 15 <title>scratch</title>
25 office 16  
17 <!-- Bootstrap core CSS -->
58 office 18 <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
65 office 19 <!-- Font Awesome -->
20 <link href="bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">
25 office 21 <!-- Trumbowyg -->
58 office 22 <link href="bower_components/trumbowyg/dist/ui/trumbowyg.min.css" rel="stylesheet">
25 office 23 <!-- Local style -->
32 office 24 <link href="css/text/style.css" rel="stylesheet">
25 office 25 </head>
26  
27 <body>
28  
29 <div class="container">
30  
31 <!-- Main component for a primary marketing message or call to action -->
32 <div class="jumbotron">
57 office 33 <h1>Scratch</h1>
25 office 34 <p>Asset sharing platform.</p>
35 </div>
36  
37 <ul class="nav nav-tabs">
38 <li><a href="index.html">Home</a></li>
56 office 39 <li><a href="file.html">File</a></li>
25 office 40 <li class="active"><a href="#">Text</a></li>
41 </ul>
42  
31 office 43 <div class="panel panel-default">
44 <div class="panel-heading">
37 office 45 <div class="form-group">
31 office 46 <div class="input-group">
47 <span class="input-group-btn">
39 office 48 <button id="save" class="btn btn-default" type="button" data-toggle="tooltip" data-placement="auto" title="Generate link.">
41 office 49 <i class="glyphicon glyphicon-share"></i>
31 office 50 </button>
51 </span>
38 office 52 <input id="URL" type="text" class="form-control" readonly>
32 office 53 <span class="input-group-btn">
39 office 54 <button id="copy-url" class="btn btn-default" type="button" data-clipboard-target="#URL" data-toggle="tooltip" data-placement="auto" title="Copy to clipboard."><i class="glyphicon glyphicon-paperclip"></i></button>
32 office 55 </span>
31 office 56 </div>
57 </div>
38 office 58 <form id="nick-form" role="form">
37 office 59 <div class="form-group has-feedback">
60 <div class="input-group">
61 <span class="input-group-btn">
39 office 62 <button id="go" class="btn btn-default" type="button" data-toggle="tooltip" data-placement="auto" title="Load document.">
37 office 63 <i class="glyphicon glyphicon-play"></i>
64 </button>
65 </span>
66 <span class="input-group-btn">
39 office 67 <button id="reset" class="btn btn-default" type="button" data-toggle="tooltip" data-placement="auto" title="Reset document.">
42 office 68 <i id="home-icon" class="glyphicon glyphicon-home"></i>
38 office 69 </button>
70 </span>
71 <input id="nick" type="text" class="form-control" pattern="^[A-Za-z0-9]{32}$" maxlength="32">
72 <span class="input-group-btn">
39 office 73 <button id="copy-nick" class="btn btn-default" type="button" data-clipboard-target="#nick" data-toggle="tooltip" data-placement="auto" title="Copy to clipboard."><i class="glyphicon glyphicon-paperclip"></i></button>
37 office 74 </span>
75 </div>
76 </div>
77 </form>
78 </div>
32 office 79 <div class="panel-body" id="editorpanel">
80 <div id="trumbowyg" style="display: none; font-family: monospace;">
31 office 81 </div>
82 </div>
25 office 83 </div>
84  
85 </div> <!-- /container -->
86  
87 <div id="footer">
88 <div class="container">
89 <p class="text-muted credit">Copyright <i class="glyphicon glyphicon-copyright-mark"></i> 2017 <a href="http://grimore.org">Wizardry and Steamworks</a>.</p>
90 </div>
91 </div>
92  
58 office 93 <!-- jQuery -->
94 <script src="bower_components/jquery/dist/jquery.min.js"></script>
95 <!-- BootStrap -->
96 <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
25 office 97  
98 <!-- Trumbowyg -->
58 office 99 <script src="bower_components/trumbowyg/dist/trumbowyg.min.js"></script>
32 office 100 <!-- Clipboard -->
58 office 101 <script src="bower_components/clipboard/dist/clipboard.min.js"></script>
37 office 102 <!-- Fingerprint 2 -->
58 office 103 <script src="bower_components/fingerprintjs2/dist/fingerprint2.min.js"></script>
37 office 104 <!-- js-cookie -->
58 office 105 <script src="bower_components/js-cookie/src/js.cookie.js"></script>
37 office 106 <!-- Bootstrap Validator -->
58 office 107 <script src="bower_components/bootstrap-validator/dist/validator.min.js"></script>
25 office 108 <script>
109 $(document).ready(() => {
38 office 110 // Attach the form validator.
111 $('#nick-form').validator({
112 focus: false
113 });
114  
43 office 115 // Enable the Clipboard button.
116 new Clipboard('#copy-url');
117  
37 office 118 // Get the fingerprint.
61 office 119 new Fingerprint2({
120 //excludeUserAgent: true,
121 //excludeLanguage: true,
122 excludeColorDepth: true,
123 excludeScreenResolution: true,
124 excludeAvailableScreenResolution: true,
125 //excludeTimezoneOffset: true,
126 excludeSessionStorage: true,
127 excludeIndexedDB: true,
128 excludeAddBehavior: true,
129 excludeOpenDatabase: true,
130 //excludeCpuClass: true,
131 //excludePlatform: true,
132 excludeDoNotTrack: true,
133 excludeCanvas: true,
134 excludeWebGL: true,
135 excludeAdBlock: true,
136 //excludeHasLiedLanguages: true,
137 //excludeHasLiedResolution: true,
138 //excludeHasLiedOs: true,
139 //excludeHasLiedBrowser: true,
140 excludeJsFonts: true,
141 excludeFlashFonts: true,
142 excludePlugins: true,
143 excludeIEPlugins: true,
144 //excludeTouchSupport: true,
145 excludePixelRatio: true
146 }).get((result, components) => {
37 office 147 // Set the nick as a cookie.
38 office 148 const fingerprint = result;
37 office 149 var nick = Cookies.get('nick');
43 office 150 if(!nick || nick.length !== 32) {
37 office 151 Cookies.set('nick', result, { path: '' });
43 office 152 nick = result;
153 }
37 office 154 else
155 result = nick;
156  
157 // Set the nick.
158 $('#nick').val(result);
159 new Clipboard('#copy-nick');
160  
42 office 161 if(fingerprint == nick)
162 $('#home-icon').addClass("text-success");
163 else
164 $('#home-icon').addClass("text-danger");
165  
54 office 166 function saveTextFile() {
49 office 167 $.post('text.php', {
37 office 168 data: $('#trumbowyg').trumbowyg('html'),
169 fingerprint: result,
51 office 170 action: 'SAVE',
171 timeout: 0
37 office 172 });
54 office 173 }
174 var autoSaveTimeoutID = window.setTimeout(saveTextFile, 250);
175  
176 // Load the editor.
177 $('#trumbowyg').trumbowyg({
178 autogrow: true,
179 disabled: true
180 }).on('tbwchange', () => {
181 // Clear the value of the URL box because the URL will have changed.
182 $('#URL').val('');
183 // Reschedule saving of the file.
184 window.clearTimeout(autoSaveTimeoutID);
185 autoSaveTimeoutID = window.setTimeout(saveTextFile, 250);
37 office 186 });
54 office 187  
37 office 188 // Retrieve the contents of the shared file.
54 office 189 $('#trumbowyg').trumbowyg('disable');
49 office 190 $.post('text.php',
37 office 191 {
192 timestamp: window.performance.now(),
193 fingerprint: result,
194 action: 'LOAD'
195 }).done((data) => {;
196 $('#trumbowyg')
197 .trumbowyg('html', data);
29 office 198 $('#trumbowyg').trumbowyg('enable');
37 office 199 $('#trumbowyg').show();
29 office 200 }).fail(() => {
201 $('#trumbowyg').trumbowyg('enable');
37 office 202 $('#trumbowyg').show();
25 office 203 });
31 office 204  
37 office 205 $('#save').click(() => {
206 $('#editor').trumbowyg('disable');
207 var formData = new FormData();
208 formData.append('file', new Blob(
209 [
210 $('#trumbowyg').trumbowyg('html')
211 ]
212 ),
213 '.html'
214 );
31 office 215  
37 office 216 $.ajax({
49 office 217 url: 'file.php',
37 office 218 type: 'POST',
219 data: formData,
220 // cache: false // FF
221 processData: false,
222 contentType: false
223 }).done((data) => {
224 $('#URL').val(data);
225 $('#trumbowyg').trumbowyg('enable');
226 }).fail(() => {
227 $('#trumbowyg').trumbowyg('enable');
228 });
31 office 229 });
37 office 230  
41 office 231 // When the button is clicked, navigate to the fingerprint.
37 office 232 $('#go').click(() => {
233 nick = $('#nick').val();
234 if(!nick || nick.length != 32)
235 return;
236 Cookies.set('nick', nick, { path: '' });
40 office 237 result = nick;
37 office 238  
239 // Retrieve the contents of the shared file.
54 office 240 $('#editor').trumbowyg('disable');
49 office 241 $.post('text.php',
37 office 242 {
243 timestamp: window.performance.now(),
244 fingerprint: nick,
245 action: 'LOAD'
246 }).done((data) => {;
247 $('#trumbowyg')
248 .trumbowyg('html', data);
249 $('#trumbowyg').trumbowyg('enable');
250 $('#trumbowyg').show();
42 office 251  
252 if(fingerprint == nick)
43 office 253 $('#home-icon').addClass("text-success").removeClass("text-danger");
42 office 254 else
43 office 255 $('#home-icon').addClass("text-danger").removeClass("text-success");
42 office 256  
37 office 257 }).fail(() => {
258 $('#trumbowyg').trumbowyg('enable');
259 $('#trumbowyg').show();
260 });
261 });
38 office 262  
41 office 263 // When the form is submitted, naigate to the fingerprint.
38 office 264 $('#nick-form').submit((e) => {
265 e.preventDefault();
266  
267 nick = $('#nick').val();
268 if(!nick || nick.length != 32)
269 return;
270 Cookies.set('nick', nick, { path: '' });
40 office 271 result = nick;
38 office 272  
273 // Retrieve the contents of the shared file.
54 office 274 $('#editor').trumbowyg('disable');
49 office 275 $.post('text.php',
38 office 276 {
277 timestamp: window.performance.now(),
278 fingerprint: nick,
279 action: 'LOAD'
280 }).done((data) => {;
281 $('#trumbowyg')
282 .trumbowyg('html', data);
283 $('#trumbowyg').trumbowyg('enable');
284 $('#trumbowyg').show();
42 office 285  
286 if(fingerprint == nick)
287 $('#home-icon').addClass("text-success").removeClass("text-danger");
288 else
289 $('#home-icon').addClass("text-danger").removeClass("text-success");
290  
38 office 291 }).fail(() => {
292 $('#trumbowyg').trumbowyg('enable');
293 $('#trumbowyg').show();
294 });
295 });
296  
41 office 297 // While the nick is changing, navigate to the changed fingerprint.
298 $("#nick").on('input', () => {
299 nick = $('#nick').val();
300 if(!nick || nick.length != 32)
301 return;
302 Cookies.set('nick', nick, { path: '' });
303 result = nick;
304  
305 // Retrieve the contents of the shared file.
54 office 306 $('#editor').trumbowyg('disable');
49 office 307 $.post('text.php',
41 office 308 {
309 timestamp: window.performance.now(),
310 fingerprint: nick,
311 action: 'LOAD'
312 }).done((data) => {;
313 $('#trumbowyg')
314 .trumbowyg('html', data);
315 $('#trumbowyg').trumbowyg('enable');
316 $('#trumbowyg').show();
43 office 317  
318 if(fingerprint == nick)
319 $('#home-icon').addClass("text-success").removeClass("text-danger");
320 else
321 $('#home-icon').addClass("text-danger").removeClass("text-success");
41 office 322 }).fail(() => {
323 $('#trumbowyg').trumbowyg('enable');
324 $('#trumbowyg').show();
325 });
326 });
327  
328 // When the reset button is pressed, navigate to the fingerprint.
38 office 329 $('#reset').click(() => {
330 Cookies.set('nick', fingerprint, { path: '' });
331 $('#nick').val(fingerprint);
40 office 332 result = fingerprint;
42 office 333 nick = fingerprint;
38 office 334  
335 // Retrieve the contents of the shared file.
54 office 336 $('#editor').trumbowyg('disable');
49 office 337 $.post('text.php',
38 office 338 {
339 timestamp: window.performance.now(),
340 fingerprint: fingerprint,
341 action: 'LOAD'
342 }).done((data) => {;
343 $('#trumbowyg')
344 .trumbowyg('html', data);
345 $('#trumbowyg').trumbowyg('enable');
346 $('#trumbowyg').show();
43 office 347 if(fingerprint == nick)
348 $('#home-icon').addClass("text-success").removeClass("text-danger");
349 else
350 $('#home-icon').addClass("text-danger").removeClass("text-success");
38 office 351 }).fail(() => {
352 $('#trumbowyg').trumbowyg('enable');
353 $('#trumbowyg').show();
354 });
355 });
31 office 356 });
25 office 357 });
358 </script>
359 </body>
360 </html>