corrade-http-templates – Diff between revs 17 and 18

Subversion Repositories:
Rev:
Only display areas with differencesIgnore whitespace
Rev 17 Rev 18
1 <!DOCTYPE html> 1 <!DOCTYPE html>
2 <html> 2 <html>
3   3  
4 <head> 4 <head>
5 <meta charset="utf-8"> 5 <meta charset="utf-8">
6 <meta name="viewport" content="width=device-width, initial-scale=1"> 6 <meta name="viewport" content="width=device-width, initial-scale=1">
7 <title>Corrade Inventory Browser</title> 7 <title>Corrade Inventory Browser</title>
-   8 <link rel="stylesheet" href="css/jquery-ui.css" />
8 <link rel="stylesheet" href="js/jstree/themes/default/style.min.css" /> 9 <link rel="stylesheet" href="js/jstree/themes/default/style.min.css" />
9 <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" /> -  
-   10  
10 <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 11 <script src="js/jquery-1.12.4.js"></script>
11 <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 12 <script src="js/jquery-ui.js"></script>
12 <script src="js/jstree/jstree.min.js"></script> 13 <script src="js/jstree/jstree.min.js"></script>
13 <script src="js/json-to-table.js"></script> 14 <script src="js/json-to-table.js"></script>
14 <script src="js/jquery.base64.js"></script> 15 <script src="js/jquery.base64.js"></script>
15 </head> 16 </head>
16   17  
17 <body> 18 <body>
18   19  
19 <!-- Will hold the inventory tree (completed dynamically). --> 20 <!-- Will hold the inventory tree (completed dynamically). -->
20 <div id="tree"> 21 <div id="tree">
21 </div> 22 </div>
22   23  
23 <!-- Used for various pup-up controls and information (completed dynamically). --> 24 <!-- Used for various pup-up controls and information (completed dynamically). -->
24 <div id="popup"> 25 <div id="popup">
25 <div id="content"> 26 <div id="content">
26 </div> 27 </div>
27 </div> 28 </div>
28   29  
29 <!-- Main script --> 30 <!-- Main script -->
30 <script type="text/javascript"> 31 <script type="text/javascript">
31 $(function() { 32 $(function() {
32 function customMenu(node) { 33 function customMenu(node) {
33 // The default set of menu items for all types 34 // The default set of menu items for all types
34 var items = { 35 var items = {
35 // Grab information about the item. 36 // Grab information about the item.
36 infoItem: { 37 infoItem: {
37 label: "Get Info", 38 label: "Get Info",
38 action: function(obj) { 39 action: function(obj) {
39 $('#popup').dialog({ 40 $('#popup').dialog({
40 width: 800, 41 width: 800,
41 height: 600, 42 height: 600,
42 modal: true, 43 modal: true,
43 resizable: false, 44 resizable: false,
44 dialogClass: 'no-close texture-dialog' 45 dialogClass: 'no-close texture-dialog'
45 }).on('dialogclose', function(event) { 46 }).on('dialogclose', function(event) {
46 $('#content').html(''); 47 $('#content').html('');
47 }); 48 });
48 $.ajax({ 49 $.ajax({
49 type: 'POST', 50 type: 'POST',
50 url: "getInventoryData.php?t=" + Math.random(), 51 url: "getInventoryData.php?t=" + Math.random(),
51 dataType: 'json', 52 dataType: 'json',
52 data: { 53 data: {
53 uuid: node.id.split(/[\/]+/).pop(), 54 uuid: node.id.split(/[\/]+/).pop(),
54 data: [ 55 data: [
55 'AssetUUID', 56 'AssetUUID',
56 'CreationDate', 57 'CreationDate',
57 'Description', 58 'Description',
58 'Permissions', 59 'Permissions',
59 'UUID' // part of InventoryBase 60 'UUID' // part of InventoryBase
60 ] 61 ]
61 } 62 }
62 }).done(function(data) { 63 }).done(function(data) {
63 $('#content').html(ConvertJsonToTable(data, null, null, null)); 64 $('#content').html(ConvertJsonToTable(data, null, null, null));
64 }); 65 });
65 } 66 }
66 } 67 }
67 }; 68 };
68   69  
69 // Give inventory items menu for anything but folders. 70 // Give inventory items menu for anything but folders.
70 // They could be supported too but would require first 71 // They could be supported too but would require first
71 // counting the number of items inside the folder and 72 // counting the number of items inside the folder and
72 // only accepting to send if the number is below max. 73 // only accepting to send if the number is below max.
73 if (node.data.type != "folder") { 74 if (node.data.type != "folder") {
74 $.extend(items, { 75 $.extend(items, {
75 giveItem: { 76 giveItem: {
76 label: "Give", 77 label: "Give",
77 action: function(obj) { 78 action: function(obj) {
78 $("#content").html('<form><fieldset class="ui-helper-reset"><label for="firstname">Firstname</label><input type="text" name="firstname" id="firstname" value="" class="ui-widget-content ui-corner-all"><br/><label for="lastname">Lastname</label><input type="text" name="lastname" id="lastname" value="" class="ui-widget-content ui-corner-all"></fieldset></form>'); 79 $("#content").html('<form><fieldset class="ui-helper-reset"><label for="firstname">Firstname</label><input type="text" name="firstname" id="firstname" value="" class="ui-widget-content ui-corner-all"><br/><label for="lastname">Lastname</label><input type="text" name="lastname" id="lastname" value="" class="ui-widget-content ui-corner-all"></fieldset></form>');
79 $("#popup").dialog({ 80 $("#popup").dialog({
80 width: 320, 81 width: 320,
81 height: 180, 82 height: 180,
82 modal: true, 83 modal: true,
83 resizable: false, 84 resizable: false,
84 buttons: { 85 buttons: {
85 Select: function() { 86 Select: function() {
86 if ($.trim($("#firstname").val()) == '' || 87 if ($.trim($("#firstname").val()) == '' ||
87 $.trim($("#lastname").val()) == '') 88 $.trim($("#lastname").val()) == '')
88 return; 89 return;
89 var firstName = $("#firstname").val(); 90 var firstName = $("#firstname").val();
90 var lastName = $("#lastname").val(); 91 var lastName = $("#lastname").val();
91 $.ajax({ 92 $.ajax({
92 type: 'POST', 93 type: 'POST',
93 url: "giveInventoryItem.php?t=" + Math.random(), 94 url: "giveInventoryItem.php?t=" + Math.random(),
94 data: { 95 data: {
95 uuid: node.id.split(/[\/]+/).pop(), 96 uuid: node.id.split(/[\/]+/).pop(),
96 firstname: firstName, 97 firstname: firstName,
97 lastname: lastName 98 lastname: lastName
98 } 99 }
99 }).done(function(data) { 100 }).done(function(data) {
100 $("#popup").dialog("close"); 101 $("#popup").dialog("close");
101 if ($.trim(data) != '') 102 if ($.trim(data) != '')
102 alert(data); 103 alert(data);
103 }); 104 });
104 }, 105 },
105 Cancel: function() { 106 Cancel: function() {
106 $("#popup").dialog("close"); 107 $("#popup").dialog("close");
107 } 108 }
108 } 109 }
109 }).on('dialogclose', function(event) { 110 }).on('dialogclose', function(event) {
110 $('#content').html(''); 111 $('#content').html('');
111 $('#popup').dialog('option', 'buttons', {}); 112 $('#popup').dialog('option', 'buttons', {});
112 }); 113 });
113 } 114 }
114 } 115 }
115 }); 116 });
116 } 117 }
117   118  
118 // The "download" menu item for textures. 119 // The "download" menu item for textures.
119 if (node.data.type == "texture") { 120 if (node.data.type == "texture") {
120 $.extend(items, { 121 $.extend(items, {
121 downloadItem: { 122 downloadItem: {
122 label: "Download", 123 label: "Download",
123 "action": function(obj) { 124 "action": function(obj) {
124 $('#texture').attr('src', 'images/loader.gif'); 125 $('#texture').attr('src', 'images/loader.gif');
125 $('#popup').dialog({ 126 $('#popup').dialog({
126 width: 800, 127 width: 800,
127 height: 600, 128 height: 600,
128 modal: true, 129 modal: true,
129 resizable: false, 130 resizable: false,
130 dialogClass: 'no-close texture-dialog' 131 dialogClass: 'no-close texture-dialog'
131 }).on('dialogclose', function(event) { 132 }).on('dialogclose', function(event) {
132 $('#content').html(''); 133 $('#content').html('');
133 }); 134 });
134 $.ajax({ 135 $.ajax({
135 type: 'POST', 136 type: 'POST',
136 url: "downloadTexture.php?t=" + Math.random(), 137 url: "downloadTexture.php?t=" + Math.random(),
137 data: { 138 data: {
138 uuid: node.id.split(/[\/]+/).pop() 139 uuid: node.id.split(/[\/]+/).pop()
139 } 140 }
140 }).done(function(data) { 141 }).done(function(data) {
141 $('#content').html('<img src="" align="middle" id="texture">'); 142 $('#content').html('<img src="" align="middle" id="texture">');
142 $('#texture').attr('src', "data:image/png;base64," + data); 143 $('#texture').attr('src', "data:image/png;base64," + data);
143 }); 144 });
144 } 145 }
145 } 146 }
146 }); 147 });
147 } 148 }
148   149  
149 // The "download" menu item for notecards. 150 // The "download" menu item for notecards.
150 if (node.data.type == "notecard") { 151 if (node.data.type == "notecard") {
151 $.extend(items, { 152 $.extend(items, {
152 downloadItem: { 153 downloadItem: {
153 label: "Download", 154 label: "Download",
154 "action": function(obj) { 155 "action": function(obj) {
155 $('#texture').attr('src', 'images/loader.gif'); 156 $('#texture').attr('src', 'images/loader.gif');
156 $('#popup').dialog({ 157 $('#popup').dialog({
157 width: 800, 158 width: 800,
158 height: 600, 159 height: 600,
159 modal: true, 160 modal: true,
160 resizable: false, 161 resizable: false,
161 dialogClass: 'no-close texture-dialog' 162 dialogClass: 'no-close texture-dialog'
162 }).on('dialogclose', function(event) { 163 }).on('dialogclose', function(event) {
163 $('#content').html(''); 164 $('#content').html('');
164 }); 165 });
165 $.ajax({ 166 $.ajax({
166 type: 'POST', 167 type: 'POST',
167 url: "downloadNotecard.php?t=" + Math.random(), 168 url: "downloadNotecard.php?t=" + Math.random(),
168 data: { 169 data: {
169 uuid: node.id.split(/[\/]+/).pop() 170 uuid: node.id.split(/[\/]+/).pop()
170 } 171 }
171 }).done(function(data) { 172 }).done(function(data) {
172 $.base64.utf8decode = true; 173 $.base64.utf8decode = true;
173 $('#content').html($.base64.atob(data)); 174 $('#content').html($.base64.atob(data));
174 }); 175 });
175 } 176 }
176 } 177 }
177 }); 178 });
178 } 179 }
179   180  
180 // The "download" menu item for sounds. 181 // The "download" menu item for sounds.
181 if (node.data.type == "sound") { 182 if (node.data.type == "sound") {
182 $.extend(items, { 183 $.extend(items, {
183 downloadItem: { 184 downloadItem: {
184 label: "Download", 185 label: "Download",
185 "action": function(obj) { 186 "action": function(obj) {
186 $('#texture').attr('src', 'images/loader.gif'); 187 $('#texture').attr('src', 'images/loader.gif');
187 $('#popup').dialog({ 188 $('#popup').dialog({
188 width: 800, 189 width: 800,
189 height: 600, 190 height: 600,
190 modal: true, 191 modal: true,
191 resizable: false, 192 resizable: false,
192 dialogClass: 'no-close texture-dialog' 193 dialogClass: 'no-close texture-dialog'
193 }).on('dialogclose', function(event) { 194 }).on('dialogclose', function(event) {
194 $('#content').html(''); 195 $('#content').html('');
195 }); 196 });
196 $.ajax({ 197 $.ajax({
197 type: 'POST', 198 type: 'POST',
198 url: "downloadSound.php?t=" + Math.random(), 199 url: "downloadSound.php?t=" + Math.random(),
199 data: { 200 data: {
200 uuid: node.id.split(/[\/]+/).pop() 201 uuid: node.id.split(/[\/]+/).pop()
201 } 202 }
202 }).done(function(data) { 203 }).done(function(data) {
203 $('#content').html('<audio controls="controls"><source id="source" src="" type="audio/mp3"></source></audio>'); 204 $('#content').html('<audio controls="controls"><source id="source" src="" type="audio/mp3"></source></audio>');
204 $('#source').attr('src', "data:audio/mp3;base64," + data); 205 $('#source').attr('src', "data:audio/mp3;base64," + data);
205 }); 206 });
206 } 207 }
207 } 208 }
208 }); 209 });
209 } 210 }
210   211  
211 return items; 212 return items;
212 } 213 }
213   214  
214 $("#tree").jstree({ 215 $("#tree").jstree({
215 // - sort will sort items by date 216 // - sort will sort items by date
216 // - state will store the open / closed state of the jstree 217 // - state will store the open / closed state of the jstree
217 'plugins': ["themes", "json_data", "ui", "contextmenu", "sort", "dnd", "state"], 218 'plugins': ["themes", "json_data", "ui", "contextmenu", "sort", "dnd", "state"],
218 'contextmenu': { 219 'contextmenu': {
219 "items": function(node) { 220 "items": function(node) {
220 return customMenu(node); 221 return customMenu(node);
221 } 222 }
222 }, 223 },
223 'dnd': { 224 'dnd': {
224 // Do not copy items. 225 // Do not copy items.
225 'copy': false, 226 'copy': false,
226 // Do not execute the check callback whilst dragging. 227 // Do not execute the check callback whilst dragging.
227 'check_while_dragging': false 228 'check_while_dragging': false
228 }, 229 },
229 'sort': function(a, b) { 230 'sort': function(a, b) {
230 return Date.parse(this.get_node(a).data.time) < Date.parse(this.get_node(b).data.time) ? 1 : -1; 231 return Date.parse(this.get_node(a).data.time) < Date.parse(this.get_node(b).data.time) ? 1 : -1;
231 }, 232 },
232 'core': { 233 'core': {
233 'check_callback': function(operation, node, parent, position, more) { 234 'check_callback': function(operation, node, parent, position, more) {
234 // Do not allow moves above the root node. 235 // Do not allow moves above the root node.
235 if (parent.id == "#") 236 if (parent.id == "#")
236 return false; 237 return false;
237   238  
238 var moved = false; 239 var moved = false;
239 $.ajax({ 240 $.ajax({
240 // A synchronous reply is needed so we know what to tell the tree. 241 // A synchronous reply is needed so we know what to tell the tree.
241 async: false, 242 async: false,
242 type: 'POST', 243 type: 'POST',
243 url: "moveInventoryItem.php?t=" + Math.random(), 244 url: "moveInventoryItem.php?t=" + Math.random(),
244 data: { 245 data: {
245 source: node.id, 246 source: node.id,
246 target: parent.id 247 target: parent.id
247 } 248 }
248 }).done(function(data) { 249 }).done(function(data) {
249 if ($.trim(data) != 'success') { 250 if ($.trim(data) != 'success') {
250 if ($.trim(data) != '') 251 if ($.trim(data) != '')
251 alert(data); 252 alert(data);
252 return; 253 return;
253 } 254 }
254 moved = true; 255 moved = true;
255 }); 256 });
256 return moved; 257 return moved;
257 }, 258 },
258 'data': { 259 'data': {
259 "url": "getInventoryNode.php", 260 "url": "getInventoryNode.php",
260 "type": "POST", 261 "type": "POST",
261 "dataType": "JSON", 262 "dataType": "JSON",
262 "data": function(node) { 263 "data": function(node) {
263 return node.id == "#" ? "folder=init" : "folder=" + node.id; 264 return node.id == "#" ? "folder=init" : "folder=" + node.id;
264 } 265 }
265 } 266 }
266 } 267 }
267 }).bind('move_node.jstree', function(e, data) { 268 }).bind('move_node.jstree', function(e, data) {
268 // Once the node is moved, update the node ID to reflect the path change. 269 // Once the node is moved, update the node ID to reflect the path change.
269 var parentPath = data.parent != '/' ? data.parent : ""; 270 var parentPath = data.parent != '/' ? data.parent : "";
270 var item = data.node.id.split(/[\/]+/).pop(); 271 var item = data.node.id.split(/[\/]+/).pop();
271 data.instance.set_id(data.node, parentPath + '/' + item); 272 data.instance.set_id(data.node, parentPath + '/' + item);
272 }); 273 });
273 }); 274 });
274 </script> 275 </script>
275 </body> 276 </body>
276   277  
277 </html> 278 </html>
278   279  
279
Generated by GNU Enscript 1.6.5.90.
280
Generated by GNU Enscript 1.6.5.90.
280   281  
281   282  
282   283