corrade-http-templates – Diff between revs 57 and 58

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