0351cde8d114e6847ce6ca0851e43b5d309a4e90
[Plinn.git] / skins / ajax_scripts / folder_contents_script.js
1 // (c) BenoƮt PIN 2006-2007
2 // http://plinn.org
3 // Licence GPL
4 //
5 //
6
7 var FolderDDropControler;
8 var DropTarget;
9 var loadListing;
10 var DDFolderUploader;
11
12 (function(){
13
14 function getTargetRow(evt){
15 var target = getTargetedObject(evt);
16 while (target.nodeName !== "TR") {
17 target = target.parentNode; }
18 return target;
19 }
20
21 FolderDDropControler = function(listing) {
22 this.folderUrl = document.getElementById("FolderUrl").innerHTML;
23 this.targetRow = null;
24 this.lastOverPosition = null;
25 this.prevDirUp = null;
26 this.noOver = true;
27 this.listing = listing;
28 this.checkboxes = undefined;
29 this._updateCBIndex();
30 var thisControler = this;
31 this.listing.onmousedown = function(evt) {thisControler.drag(evt);};
32 this.listing.onmouseover = function(evt) {thisControler.moveRow(evt);};
33 this.listing.onmouseup = function(evt) {thisControler.drop(evt);};
34 addListener(this.listing, 'click', function(evt) {thisControler.disableClickAfterDrop(evt);});
35 addListener(this.listing, 'click', function(evt) {thisControler.selectCBRange(evt);});
36
37 if (browser.isIE) {
38 this.listing.ondragstart = function() { window.event.returnValue = false;};
39 }
40 };
41
42 FolderDDropControler.prototype._updateCBIndex = function() {
43 var cbs = this.listing.getElementsByTagName('INPUT');
44 var index = 0;
45 var cb, i;
46 this.checkboxes = [];
47 for (i=0 ; i < cbs.length ; i++) {
48 cb = cbs[i];
49 if (cb.type === 'checkbox') {
50 cb.position = index++;
51 this.checkboxes[cb.position] = cb;
52 }
53 }
54 };
55
56 FolderDDropControler.prototype.drag = function(evt){
57 var target = getTargetedObject(evt);
58 if (target.nodeName === "INPUT") { return true; }
59 disableDefault(evt);
60 var targetRow = getTargetRow(evt);
61 targetRow.style.backgroundColor = base_properties.highLightColor;
62 this.listing.style.cursor = "move";
63 this.targetRow = targetRow;
64 this.lastOverPosition = targetRow.pos;
65 };
66
67 FolderDDropControler.prototype.moveRow = function(evt){
68 var targetRow = this.targetRow;
69 if (targetRow !== null) {
70 this.noOver = false;
71 if (browser.isIE) {document.selection.clear();}
72 var overRow = getTargetRow(evt);
73
74 if (overRow.pos === targetRow.pos) {return;}
75
76 if (this.lastOverPosition < overRow.pos) { // move up
77 this.listing.insertBefore(targetRow, overRow.nextSibling);
78 this.prevDirUp = true;
79 this.lastOverPosition = overRow.pos;
80 }
81 else if (this.lastOverPosition > overRow.pos) { // move down
82 this.listing.insertBefore(targetRow, overRow);
83 this.prevDirUp = false;
84 this.lastOverPosition = overRow.pos;
85 }
86 else {
87 if (this.prevDirUp) {
88 this.prevDirUp = false;
89 this.listing.insertBefore(targetRow, overRow);
90 }
91 else {
92 this.prevDirUp = true;
93 this.listing.insertBefore(targetRow, overRow.nextSibling);
94 }
95 }
96 }
97 };
98
99 FolderDDropControler.prototype.drop = function(evt){
100 var targetRow = this.targetRow;
101 if (targetRow !== null) {
102 targetRow.style.backgroundColor="";
103 this.listing.style.cursor = "";
104 var thisControler = this;
105 if (this.noOver) {
106 setTimeout(function(){thisControler.reset();}, 50);
107 return;
108 }
109 if (this.lastOverPosition !== null) {
110 // get new object position.
111 var trim = 0;
112 if (targetRow.pos < this.lastOverPosition && !this.prevDirUp) {
113 trim = -1; }
114 else if (targetRow.pos > this.lastOverPosition && this.prevDirUp) {
115 trim = 1; }
116
117 // construct url
118 var object_id = targetRow.getElementsByTagName("INPUT")[0].getAttribute("value");
119 var url = this.folderUrl + "/moveObjectIdToPosition";
120 var form ="object_id=" + object_id + "&position:int=" +
121 String(this.lastOverPosition - 1 + trim);
122
123 // reinitialize positions
124 var rows = this.listing.getElementsByTagName("TR"), row;
125 var i;
126 for (i = 0 ; i < rows.length ; i++) {
127 row = rows[i];
128 row.pos = i+1;
129 if (i % 2 === 0){
130 row.className = "even";}
131 else{
132 row.className = "odd";}
133 }
134
135 // send request
136 var req = new XMLHttpRequest();
137 req.open("POST", url, true);
138 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
139 req.send(form);
140 setTimeout(function(){thisControler.reset();}, 50);
141 }
142 }
143 };
144
145 FolderDDropControler.prototype.disableClickAfterDrop = function(evt) {
146 var target = getTargetedObject(evt);
147 if (!this.noOver) {
148 disablePropagation(evt);
149 disableDefault(evt);
150 }
151 this.reset();
152 };
153
154 FolderDDropControler.prototype.selectCBRange = function(evt) {
155 };
156
157
158 FolderDDropControler.prototype.reset = function() {
159 this.targetRow = null;
160 this.lastOverPosition = null;
161 this.prevDirUp = null;
162 this.noOver = true;
163 };
164
165
166
167 DropTarget = function(node, folderDDControler) {
168 this.folderDDControler = folderDDControler;
169 this.batchSize = parseInt(document.getElementById("BatchNavigationSize").innerHTML, 10);
170 var thisControler = this;
171 node.onmouseup = function(evt){thisControler.drop(evt);};
172 node.onmouseover = function(evt) {thisControler.highlightTarget(evt);};
173 node.onmouseout = function(evt) {
174 var target = getTargetedObject(evt);
175 if (target.nodeName === "A" && target.className === "dropPageTarget"){
176 target.className = "";}
177 };
178 };
179
180 DropTarget.prototype.drop = function(evt) {
181 var target = getTargetedObject(evt);
182 if (target.nodeName === "A" &&
183 target.className !== "previous" &&
184 target.className !== "next") {
185 var pageNumber = parseInt(target.innerHTML, 10);
186 var targetRow = this.folderDDControler.targetRow;
187 if ( !isNaN(pageNumber) && targetRow) {
188 this.folderDDControler.reset();
189 var object_id = targetRow.getElementsByTagName("INPUT")[0].getAttribute("value");
190 var url = this.folderDDControler.folderUrl + "/moveObjectIdToPosition";
191 var form ="object_id=" + object_id + "&position:int=" + String(this.batchSize * (pageNumber-1));
192 // send request
193 var req = new XMLHttpRequest();
194 req.open("POST", url, true);
195 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8");
196 req.send(form);
197 req.onreadystatechange = function() {
198 if (req.readyState === 4) {
199 switch (req.status) {
200 case 200:
201 case 204:
202 case 1223:
203 raiseMouseEvent(target, "click");
204 break;
205 default:
206 alert('Error: ' + req.status);
207 }
208 }
209 };
210 }
211 }
212 };
213
214 DropTarget.prototype.highlightTarget = function(evt){
215 if (browser.isIE) {document.selection.clear();}
216 var target = getTargetedObject(evt);
217 if (this.folderDDControler.targetRow &&
218 target.nodeName === "A" &&
219 target.className !== "previous" &&
220 target.className !== "next"){
221 target.className = "dropPageTarget";}
222 };
223
224
225
226
227 loadListing = function(evt) {
228 var target = getTargetedObject(evt);
229 disableDefault(evt);
230 disablePropagation(evt);
231 var url;
232 switch (target.nodeName) {
233 case "A" :
234 var parts = target.href.split('?');
235 url = parts[0];
236 var query = '';
237 if (parts.length === 2){
238 query = parts[1];}
239
240 var urlParts = url.split("/");
241 url = urlParts.slice(0,urlParts.length-1).join("/");
242 if (query.search("template") === -1){
243 query += "&template=folder_contents_macros&macro=FolderListing&fragmentId=FolderListing";}
244 url = url + "/folder_contents?" + query;
245
246 var fi = new FragmentImporter(url);
247 fi.load();
248 break;
249
250 case "IMG" :
251 if (target.id === 'SetSortingAsDefault') {
252 var parent = target.parentNode;
253 url = parent.href;
254 url = url.replace("folder_contents", "folder_sort_control");
255 parent.parentNode.removeChild(parent);
256
257 var req = new XMLHttpRequest();
258 req.open("GET", url, true);
259 req.send(null);
260 }
261 break;
262 }
263 return false;
264 };
265
266 DDFolderUploader = function(dropbox, uploadUrl, listing) {
267 DDFileUploaderBase.apply(this, [dropbox, uploadUrl]);
268 this.listing = listing;
269 this.progressBarMaxSize = listing.clientWidth;
270 var thead = listing;
271 do {
272 thead = thead.previousSibling;
273 } while (thead.tagName !== 'THEAD');
274
275 var cells = thead.getElementsByTagName('th');
276 var cell, i;
277 this.tableSpan = 0;
278 for (i=0 ; i < cells.length ; i++) {
279 cell = cells[i];
280 this.tableSpan += cell.getAttribute('colspan') ? Number(cell.getAttribute('colspan')) : 1;
281 }
282 var lastRow = listing.lastChild;
283 while(lastRow && lastRow.tagName !== 'TR') {
284 lastRow = lastRow.previousSibling;
285 }
286 this.lastRowClassName = lastRow ? lastRow.className : 'even';
287 };
288
289 copyPrototype(DDFolderUploader, DDFileUploaderBase);
290
291
292 DDFolderUploader.prototype.createRow = function(file) {
293 var row = document.createElement('tr');
294 row.file = file;
295 row.className = this.lastRowClassName === 'even' ? 'odd' : 'even';
296 this.lastRowClassName = row.className;
297 var td = document.createElement('td');
298 td.setAttribute('colspan', this.tableSpan);
299 var relSpan = document.createElement('span');
300 relSpan.style.position = 'relative';
301 td.appendChild(relSpan);
302 var progressBar = document.createElement('span');
303 progressBar.className = 'upload-progress';
304 row.progressBar = progressBar;
305 relSpan.appendChild(progressBar);
306 var fileNameSpan = document.createElement('span');
307 fileNameSpan.innerHTML = file.name;
308 td.appendChild(fileNameSpan);
309 row.appendChild(td);
310 this.listing.appendChild(row);
311 this.progressBarMaxSize = row.clientWidth;
312 return row;
313 };
314
315 // Methods about upload
316 DDFolderUploader.prototype.handleFiles = function(files) {
317 var file, i, row;
318 for (i = 0; i < files.length; i++) {
319 file = files[i];
320 row = this.createRow(file);
321 this.uploadQueuePush(row);
322 }
323 };
324
325 DDFolderUploader.prototype.beforeUpload = function(item) {
326 this.uploadedItem = item;
327 this.progressBar = item.progressBar;
328 };
329
330 DDFolderUploader.prototype.uploadCompleteHandlerCB = function(req) {
331 var item = this.uploadedItem;
332 var row = getCopyOfNode(req.responseXML.documentElement.firstChild);
333 row.className = item.className;
334
335 if (req.status === 200) {
336 // update
337 console.log('todo');
338 }
339 else if(req.status === 201) {
340 // creation
341 this.listing.replaceChild(row, item);
342 this.progressBarMaxSize = row.clientWidth;
343 }
344 };
345
346 DDFolderUploader.prototype.progressHandlerCB = function(progress) {
347 // 0 <= progress <= 1
348 var size = this.progressBarMaxSize * progress;
349 size = Math.round(size);
350 this.progressBar.style.width = size + 'px';
351 };
352
353 }());