scratch – Diff between revs 95 and 98

Subversion Repositories:
Rev:
Only display areas with differencesIgnore whitespace
Rev 95 Rev 98
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html lang="en"> 2 <html lang="en">
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge">
6 <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" /> 6 <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
7 <meta http-equiv="Pragma" content="no-cache" /> 7 <meta http-equiv="Pragma" content="no-cache" />
8 <meta http-equiv="Expires" content="0" /> 8 <meta http-equiv="Expires" content="0" />
9 <meta name="viewport" content="width=device-width, initial-scale=1"> 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 --> 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"> 11 <meta name="description" content="quick asset upload">
12 <meta name="author" content="Wizardry and Steamworks"> 12 <meta name="author" content="Wizardry and Steamworks">
13 <link rel="icon" href="favicon.ico"> 13 <link rel="icon" href="favicon.ico">
14   14  
15 <title>scratch</title> 15 <title>scratch</title>
16   16  
17 <!-- Bootstrap core CSS --> 17 <!-- Bootstrap core CSS -->
18 <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> 18 <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
19 <!-- Font Awesome --> 19 <!-- Font Awesome -->
20 <link href="bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet"> 20 <link href="bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">
21   21  
22 <!-- Site-wide style CCS --> 22 <!-- Site-wide style CCS -->
23 <link href="css/style.css" rel="stylesheet"> 23 <link href="css/style.css" rel="stylesheet">
24 24
25 <!-- Local style --> 25 <!-- Local style -->
26 <!-- <link href="css/link/style.css" rel="stylesheet"> --> 26 <!-- <link href="css/link/style.css" rel="stylesheet"> -->
27 </head> 27 </head>
28   28  
29 <body> 29 <body>
30   30  
31 <!-- Main component for a primary marketing message or call to action --> 31 <!-- Main component for a primary marketing message or call to action -->
32 <div class="paralax-background"></div> 32 <div class="paralax-background"></div>
33 <div class="jumbotron"> 33 <div class="jumbotron">
34 <h1>scratch copy</h1> 34 <h1>scratch copy</h1>
35 <p class="quote">the asset sharer</p> 35 <p class="quote">the asset sharer</p>
36 </div> 36 </div>
37   37  
38 <div class="container"> 38 <div class="container">
39 39
40 <ul class="nav nav-tabs"> 40 <ul class="nav nav-tabs">
41 <li><a href="index.html">Home</a></li> 41 <li><a href="index.html">Home</a></li>
42 <li><a href="file.html">File</a></li> 42 <li><a href="file.html">File</a></li>
43 <li><a href="text.html">Text</a></li> 43 <li><a href="text.html">Text</a></li>
44 <li><a href="draw.html">Draw</a></li> 44 <li><a href="draw.html">Draw</a></li>
45 <li class="active"><a href="#">Link</a></li> 45 <li class="active"><a href="#">Link</a></li>
46 </ul> 46 </ul>
47 47
48 <div id="main-panel" class="panel panel-default"> 48 <div id="main-panel" class="panel panel-default">
49 <div class="panel-body"> 49 <div class="panel-body">
50 <form id="link-form" role="form"> 50 <form id="link-form" role="form">
51 <div class="form-group has-feedback"> 51 <div class="form-group has-feedback">
52 <div class="input-group"> 52 <div class="input-group">
53 <span class="input-group-btn"> 53 <span class="input-group-btn">
54 <button id="save" class="btn btn-default" type="button" data-toggle="tooltip" data-placement="auto" title="Generate link." data-disable="true" disabled> 54 <button id="save" class="btn btn-default" type="button" data-toggle="tooltip" data-placement="auto" title="Generate link." data-disable="true" disabled>
55 <i class="glyphicon glyphicon-share"></i> 55 <i class="glyphicon glyphicon-share"></i>
56 </button> 56 </button>
57 </span> 57 </span>
58 <input id="link" type="text" class="form-control" pattern="^https?://[\-_\.\+!\*'\(\),a-zA-Z0-9]+:?[0-9]{0,5}/.*$"> 58 <input id="link" type="text" class="form-control" pattern="^https?://[\-_\.\+!\*'\(\),a-zA-Z0-9]+:?[0-9]{0,5}/.*$">
59 </div> 59 </div>
60 <div class="input-group"> 60 <div class="input-group">
61 <input id="URL" type="text" class="form-control" readonly> 61 <input id="URL" type="text" class="form-control" readonly>
62 <span class="input-group-btn"> 62 <span class="input-group-btn">
63 <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> 63 <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>
64 </span> 64 </span>
65 </div> 65 </div>
66 <div class="input-group"> 66 <div class="input-group">
67 <input id="deleteURL" type="text" class="form-control" readonly> 67 <input id="deleteURL" type="text" class="form-control" readonly>
68 <span class="input-group-btn"> 68 <span class="input-group-btn">
69 <button id="delete-url" class="btn btn-default" type="button" data-clipboard-target="#deleteURL"><i class="glyphicon glyphicon-paperclip"></i></button> 69 <button id="delete-url" class="btn btn-default" type="button" data-clipboard-target="#deleteURL"><i class="glyphicon glyphicon-paperclip"></i></button>
70 </span> 70 </span>
71 </div> 71 </div>
72 </div> 72 </div>
73 </form> 73 </form>
74 </div> 74 </div>
75   75  
76 </div> <!-- /container --> 76 </div> <!-- /container -->
77 77
78 <div id="footer"> 78 <div id="footer">
79 <div class="container"> 79 <div class="container">
80 <p class="text-muted credit text-center">Copyright <i class="glyphicon glyphicon-copyright-mark"></i> 2017 <a href="http://grimore.org">Wizardry and Steamworks</a>.</p> 80 <p class="text-muted credit text-center">Copyright <i class="glyphicon glyphicon-copyright-mark"></i> 2017 <a href="http://grimore.org">Wizardry and Steamworks</a>.</p>
81 </div> 81 </div>
82 </div> 82 </div>
83   83  
84 <!-- jQuery --> 84 <!-- jQuery -->
85 <script src="bower_components/jquery/dist/jquery.min.js"></script> 85 <script src="bower_components/jquery/dist/jquery.min.js"></script>
86 <!-- BootStrap --> 86 <!-- BootStrap -->
87 <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script> 87 <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
88 <!-- Bootstrap Validator --> 88 <!-- Bootstrap Validator -->
89 <script src="bower_components/bootstrap-validator/dist/validator.min.js"></script> 89 <script src="bower_components/bootstrap-validator/dist/validator.min.js"></script>
90 <!-- Clipboard --> 90 <!-- Clipboard -->
91 <script src="bower_components/clipboard/dist/clipboard.min.js"></script> 91 <script src="bower_components/clipboard/dist/clipboard.min.js"></script>
92 <script> 92 <script>
93 $(document).ready(() => { 93 $(document).ready(() => {
94 // Attach the form validator. 94 // Attach the form validator.
95 $('#link-form').validator({ 95 $('#link-form').validator({
96 focus: false, 96 focus: false,
97 delay: 1000 97 delay: 1000
98 }).on('invalid.bs.validator', () => { 98 }).on('invalid.bs.validator', () => {
99 $('#save').attr('disabled', true); 99 $('#save').attr('disabled', true);
100 }).on('valid.bs.validator', () => { 100 }).on('valid.bs.validator', () => {
101 $('#save').attr('disabled', false); 101 $('#save').attr('disabled', false);
102 }); 102 });
103 103
104 // Save image and create URL. 104 // Save image and create URL.
105 $('#save').click(() => { 105 $('#save').click(() => {
106 106
107 var formData = new FormData(); 107 var formData = new FormData();
108 formData.append('file', new Blob( 108 formData.append('file', new Blob(
109 [ 109 [
110 '[InternetShortcut]' 110 '[InternetShortcut]'
111 .concat('\n') 111 .concat('\n')
112 .concat('URL=') 112 .concat('URL=')
113 .concat($('#link') 113 .concat($('#link')
114 .val() 114 .val()
115 ) 115 )
116 .concat('\n') 116 .concat('\n')
117 ] 117 ]
118 ), 118 ),
119 '.url' 119 '.url'
120 ); 120 );
-   121
-   122 $.get('session.php').then((token) => {
121 123 formData.append('token', token);
122 $.ajax({ 124 $.ajax({
123 url: 'file.php', 125 url: 'file.php',
124 type: 'POST', 126 type: 'POST',
125 data: formData, 127 data: formData,
126 // cache: false // FF 128 // cache: false // FF
127 processData: false, 129 processData: false,
128 contentType: false 130 contentType: false
129 }).done((data) => { 131 }).done((data) => {
130 // Serialize JSON to object. 132 // Serialize JSON to object.
131 data = JSON.parse(data); 133 data = JSON.parse(data);
132 134
133 $('#URL') 135 $('#URL')
134 .val( 136 .val(
135 location.protocol 137 location.protocol
136 .concat("//") 138 .concat("//")
137 .concat(window.location.hostname) 139 .concat(window.location.hostname)
138 .concat("/") 140 .concat("/")
139 .concat(data.hash) 141 .concat(data.hash)
140 ); 142 );
141 143
142 $('#deleteURL') 144 $('#deleteURL')
143 .val( 145 .val(
144 location 146 location
145 .protocol.concat("//") 147 .protocol.concat("//")
146 .concat(window.location.hostname) 148 .concat(window.location.hostname)
147 .concat("/") 149 .concat("/")
-   150 .concat(data.timestamp)
148 .concat(data.timestamp) 151 .concat("/")
149 .concat("/") 152 .concat(data.hash)
150 .concat(data.hash) 153 );
151 ); 154 });
152 }); 155 });
153 }); 156 });
154 157
155 // Enable the Clipboard button. 158 // Enable the Clipboard button.
156 new Clipboard('#copy-url'); 159 new Clipboard('#copy-url');
157 new Clipboard('#delete-url'); 160 new Clipboard('#delete-url');
158 161
159 // Scroll to the panel. 162 // Scroll to the panel.
160 $('html, body').animate({ 163 $('html, body').animate({
161 scrollTop: $('#main-panel').offset().top 164 scrollTop: $('#main-panel').offset().top
162 }, 'slow'); 165 }, 'slow');
163 }); 166 });
164 </script> 167 </script>
165 <!-- Jumbotron parallax effect --> 168 <!-- Jumbotron parallax effect -->
166 <script> 169 <script>
167 var jumboHeight = $('.jumbotron').outerHeight(); 170 var jumboHeight = $('.jumbotron').outerHeight();
168 function parallax(){ 171 function parallax(){
169 var scrolled = $(window).scrollTop(); 172 var scrolled = $(window).scrollTop();
170 $('.paralax-background').css('height', (jumboHeight-scrolled) + 'px'); 173 $('.paralax-background').css('height', (jumboHeight-scrolled) + 'px');
171 } 174 }
172   175  
173 $(window).scroll(function(e){ 176 $(window).scroll(function(e){
174 parallax(); 177 parallax();
175 }); 178 });
176 </script> 179 </script>
177 </body> 180 </body>
178 </html> 181 </html>
179   182