scratch – Blame information for rev 70

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