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