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

Subversion Repositories:
Rev:
Only display areas with differences – Ignore whitespace
Rev 15 Rev 17
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="js/jstree/themes/default/style.min.css" /> 8 <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" /> 9 <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.0/themes/base/jquery-ui.css" />
10 <script src="https://code.jquery.com/jquery-1.12.4.js"></script> 10 <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
11 <script src="http://code.jquery.com/ui/1.12.1/jquery-ui.js"></script> 11 <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
12 <script src="js/jstree/jstree.min.js"></script> 12 <script src="js/jstree/jstree.min.js"></script>
13 <script src="js/json-to-table.js"></script> 13 <script src="js/json-to-table.js"></script>
14 <script src="js/jquery.base64.js"></script> 14 <script src="js/jquery.base64.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 != "folder") { 73 if (node.data.type != "folder") {
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 == "texture") { 119 if (node.data.type == "texture") {
120 $.extend(items, { 120 $.extend(items, {
121 downloadItem: { 121 downloadItem: {
122 label: "Download", 122 label: "Download",
123 "action": function(obj) { 123 "action": function(obj) {
124 $('#texture').attr('src', 'images/loader.gif'); 124 $('#texture').attr('src', 'images/loader.gif');
125 $('#popup').dialog({ 125 $('#popup').dialog({
126 width: 800, 126 width: 800,
127 height: 600, 127 height: 600,
128 modal: true, 128 modal: true,
129 resizable: false, 129 resizable: false,
130 dialogClass: 'no-close texture-dialog' 130 dialogClass: 'no-close texture-dialog'
131 }).on('dialogclose', function(event) { 131 }).on('dialogclose', function(event) {
132 $('#content').html(''); 132 $('#content').html('');
133 }); 133 });
134 $.ajax({ 134 $.ajax({
135 type: 'POST', 135 type: 'POST',
136 url: "downloadTexture.php?t=" + Math.random(), 136 url: "downloadTexture.php?t=" + Math.random(),
137 data: { 137 data: {
138 uuid: node.id.split(/[\/]+/).pop() 138 uuid: node.id.split(/[\/]+/).pop()
139 } 139 }
140 }).done(function(data) { 140 }).done(function(data) {
141 $('#content').html('<img src="" align="middle" id="texture">'); 141 $('#content').html('<img src="" align="middle" id="texture">');
142 $('#texture').attr('src', "data:image/png;base64," + data); 142 $('#texture').attr('src', "data:image/png;base64," + data);
143 }); 143 });
144 } 144 }
145 } 145 }
146 }); 146 });
147 } 147 }
148   148  
149 // The "download" menu item for notecards. 149 // The "download" menu item for notecards.
150 if (node.data.type == "notecard") { 150 if (node.data.type == "notecard") {
151 $.extend(items, { 151 $.extend(items, {
152 downloadItem: { 152 downloadItem: {
153 label: "Download", 153 label: "Download",
154 "action": function(obj) { 154 "action": function(obj) {
155 $('#texture').attr('src', 'images/loader.gif'); 155 $('#texture').attr('src', 'images/loader.gif');
156 $('#popup').dialog({ 156 $('#popup').dialog({
157 width: 800, 157 width: 800,
158 height: 600, 158 height: 600,
159 modal: true, 159 modal: true,
160 resizable: false, 160 resizable: false,
161 dialogClass: 'no-close texture-dialog' 161 dialogClass: 'no-close texture-dialog'
162 }).on('dialogclose', function(event) { 162 }).on('dialogclose', function(event) {
163 $('#content').html(''); 163 $('#content').html('');
164 }); 164 });
165 $.ajax({ 165 $.ajax({
166 type: 'POST', 166 type: 'POST',
167 url: "downloadNotecard.php?t=" + Math.random(), 167 url: "downloadNotecard.php?t=" + Math.random(),
168 data: { 168 data: {
169 uuid: node.id.split(/[\/]+/).pop() 169 uuid: node.id.split(/[\/]+/).pop()
170 } 170 }
171 }).done(function(data) { 171 }).done(function(data) {
172 $.base64.utf8decode = true; 172 $.base64.utf8decode = true;
173 $('#content').html($.base64.atob(data)); 173 $('#content').html($.base64.atob(data));
174 }); 174 });
175 } 175 }
176 } 176 }
177 }); 177 });
178 } 178 }
179   179  
180 // The "download" menu item for sounds. 180 // The "download" menu item for sounds.
181 if (node.data.type == "sound") { 181 if (node.data.type == "sound") {
182 $.extend(items, { 182 $.extend(items, {
183 downloadItem: { 183 downloadItem: {
184 label: "Download", 184 label: "Download",
185 "action": function(obj) { 185 "action": function(obj) {
186 $('#texture').attr('src', 'images/loader.gif'); 186 $('#texture').attr('src', 'images/loader.gif');
187 $('#popup').dialog({ 187 $('#popup').dialog({
188 width: 800, 188 width: 800,
189 height: 600, 189 height: 600,
190 modal: true, 190 modal: true,
191 resizable: false, 191 resizable: false,
192 dialogClass: 'no-close texture-dialog' 192 dialogClass: 'no-close texture-dialog'
193 }).on('dialogclose', function(event) { 193 }).on('dialogclose', function(event) {
194 $('#content').html(''); 194 $('#content').html('');
195 }); 195 });
196 $.ajax({ 196 $.ajax({
197 type: 'POST', 197 type: 'POST',
198 url: "downloadSound.php?t=" + Math.random(), 198 url: "downloadSound.php?t=" + Math.random(),
199 data: { 199 data: {
200 uuid: node.id.split(/[\/]+/).pop() 200 uuid: node.id.split(/[\/]+/).pop()
201 } 201 }
202 }).done(function(data) { 202 }).done(function(data) {
203 $('#content').html('<audio controls="controls"><source id="source" src="" type="audio/mp3"></source></audio>'); 203 $('#content').html('<audio controls="controls"><source id="source" src="" type="audio/mp3"></source></audio>');
204 $('#source').attr('src', "data:audio/mp3;base64," + data); 204 $('#source').attr('src', "data:audio/mp3;base64," + data);
205 }); 205 });
206 } 206 }
207 } 207 }
208 }); 208 });
209 } 209 }
210   210  
211 return items; 211 return items;
212 } 212 }
213   213  
214 $("#tree").jstree({ 214 $("#tree").jstree({
215 // - sort will sort items by date 215 // - sort will sort items by date
216 // - state will store the open / closed state of the jstree 216 // - state will store the open / closed state of the jstree
217 'plugins': ["themes", "json_data", "ui", "contextmenu", "sort", "dnd", "state"], 217 'plugins': ["themes", "json_data", "ui", "contextmenu", "sort", "dnd", "state"],
218 'contextmenu': { 218 'contextmenu': {
219 "items": function(node) { 219 "items": function(node) {
220 return customMenu(node); 220 return customMenu(node);
221 } 221 }
222 }, 222 },
223 'dnd': { 223 'dnd': {
224 // Do not copy items. 224 // Do not copy items.
225 'copy': false, 225 'copy': false,
226 // Do not execute the check callback whilst dragging. 226 // Do not execute the check callback whilst dragging.
227 'check_while_dragging': false 227 'check_while_dragging': false
228 }, 228 },
229 'sort': function(a, b) { 229 'sort': function(a, b) {
230 return Date.parse(this.get_node(a).data.time) < Date.parse(this.get_node(b).data.time) ? 1 : -1; 230 return Date.parse(this.get_node(a).data.time) < Date.parse(this.get_node(b).data.time) ? 1 : -1;
231 }, 231 },
232 'core': { 232 'core': {
233 'check_callback': function(operation, node, parent, position, more) { 233 'check_callback': function(operation, node, parent, position, more) {
234 // Do not allow moves above the root node. 234 // Do not allow moves above the root node.
235 if (parent.id == "#") 235 if (parent.id == "#")
236 return false; 236 return false;
237   237  
238 var moved = false; 238 var moved = false;
239 $.ajax({ 239 $.ajax({
240 // A synchronous reply is needed so we know what to tell the tree. 240 // A synchronous reply is needed so we know what to tell the tree.
241 async: false, 241 async: false,
242 type: 'POST', 242 type: 'POST',
243 url: "moveInventoryItem.php?t=" + Math.random(), 243 url: "moveInventoryItem.php?t=" + Math.random(),
244 data: { 244 data: {
245 source: node.id, 245 source: node.id,
246 target: parent.id 246 target: parent.id
247 } 247 }
248 }).done(function(data) { 248 }).done(function(data) {
249 if ($.trim(data) != 'success') { 249 if ($.trim(data) != 'success') {
250 if ($.trim(data) != '') 250 if ($.trim(data) != '')
251 alert(data); 251 alert(data);
252 return; 252 return;
253 } 253 }
254 moved = true; 254 moved = true;
255 }); 255 });
256 return moved; 256 return moved;
257 }, 257 },
258 'data': { 258 'data': {
259 "url": "getInventoryNode.php", 259 "url": "getInventoryNode.php",
260 "type": "POST", 260 "type": "POST",
261 "dataType": "JSON", 261 "dataType": "JSON",
262 "data": function(node) { 262 "data": function(node) {
263 return node.id == "#" ? "folder=init" : "folder=" + node.id; 263 return node.id == "#" ? "folder=init" : "folder=" + node.id;
264 } 264 }
265 } 265 }
266 } 266 }
267 }).bind('move_node.jstree', function(e, data) { 267 }).bind('move_node.jstree', function(e, data) {
268 // Once the node is moved, update the node ID to reflect the path change. 268 // Once the node is moved, update the node ID to reflect the path change.
269 var parentPath = data.parent != '/' ? data.parent : ""; 269 var parentPath = data.parent != '/' ? data.parent : "";
270 var item = data.node.id.split(/[\/]+/).pop(); 270 var item = data.node.id.split(/[\/]+/).pop();
271 data.instance.set_id(data.node, parentPath + '/' + item); 271 data.instance.set_id(data.node, parentPath + '/' + item);
272 }); 272 });
273 }); 273 });
274 </script> 274 </script>
275 </body> 275 </body>
276   276  
277 </html> 277 </html>
278   278  
279
Generated by GNU Enscript 1.6.5.90.
 279
Generated by GNU Enscript 1.6.5.90.
280   280  
281   281  
282   282