Mercurial > hg > rr-repo
comparison sites/all/modules/imce/js/imce_extras.js @ 0:ff03f76ab3fe
initial version
author | danieleb <danielebarchiesi@me.com> |
---|---|
date | Wed, 21 Aug 2013 18:51:11 +0100 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 0:ff03f76ab3fe |
---|---|
1 //This pack implemets: keyboard shortcuts, file sorting, resize bars, and inline thumbnail preview. | |
2 | |
3 (function($) { | |
4 | |
5 // add scale calculator for resizing. | |
6 imce.hooks.load.push(function () { | |
7 $('#edit-width, #edit-height').focus(function () { | |
8 var fid, r, w, isW, val; | |
9 if (fid = imce.vars.prvfid) { | |
10 isW = this.id == 'edit-width', val = imce.el(isW ? 'edit-height' : 'edit-width').value*1; | |
11 if (val && (w = imce.isImage(fid)) && (r = imce.fids[fid].cells[3].innerHTML*1 / w)) | |
12 this.value = Math.round(isW ? val/r : val*r); | |
13 } | |
14 }); | |
15 }); | |
16 | |
17 // Shortcuts | |
18 var F = null; | |
19 imce.initiateShortcuts = function () { | |
20 $(imce.NW).attr('tabindex', '0').keydown(function (e) { | |
21 if (F = imce.dirKeys['k'+ e.keyCode]) return F(e); | |
22 }); | |
23 $(imce.FLW).attr('tabindex', '0').keydown(function (e) { | |
24 if (F = imce.fileKeys['k'+ e.keyCode]) return F(e); | |
25 }).focus(); | |
26 }; | |
27 | |
28 //shortcut key-function pairs for directories | |
29 imce.dirKeys = { | |
30 k35: function (e) {//end-home. select first or last dir | |
31 var L = imce.tree['.'].li; | |
32 if (e.keyCode == 35) while (imce.hasC(L, 'expanded')) L = L.lastChild.lastChild; | |
33 $(L.childNodes[1]).click().focus(); | |
34 }, | |
35 k37: function (e) {//left-right. collapse-expand directories.(right may also move focus on files) | |
36 var L, B = imce.tree[imce.conf.dir], right = e.keyCode == 39; | |
37 if (B.ul && (right ^ imce.hasC(L = B.li, 'expanded')) ) $(L.firstChild).click(); | |
38 else if (right) $(imce.FLW).focus(); | |
39 }, | |
40 k38: function (e) {//up. select the previous directory | |
41 var B = imce.tree[imce.conf.dir]; | |
42 if (L = B.li.previousSibling) { | |
43 while (imce.hasC(L, 'expanded')) L = L.lastChild.lastChild; | |
44 $(L.childNodes[1]).click().focus(); | |
45 } | |
46 else if ((L = B.li.parentNode.parentNode) && L.tagName == 'LI') $(L.childNodes[1]).click().focus(); | |
47 }, | |
48 k40: function (e) {//down. select the next directory | |
49 var B = imce.tree[imce.conf.dir], L = B.li, U = B.ul; | |
50 if (U && imce.hasC(L, 'expanded')) $(U.firstChild.childNodes[1]).click().focus(); | |
51 else do {if (L.nextSibling) return $(L.nextSibling.childNodes[1]).click().focus(); | |
52 }while ((L = L.parentNode.parentNode).tagName == 'LI'); | |
53 } | |
54 }; | |
55 //add equal keys | |
56 imce.dirKeys.k36 = imce.dirKeys.k35; | |
57 imce.dirKeys.k39 = imce.dirKeys.k37; | |
58 | |
59 //shortcut key-function pairs for files | |
60 imce.fileKeys = { | |
61 k38: function (e) {//up-down. select previous-next row | |
62 var fid = imce.lastFid(), i = fid ? imce.fids[fid].rowIndex+e.keyCode-39 : 0; | |
63 imce.fileClick(imce.findex[i], e.ctrlKey, e.shiftKey); | |
64 }, | |
65 k35: function (e) {//end-home. select first or last row | |
66 imce.fileClick(imce.findex[e.keyCode == 35 ? imce.findex.length-1 : 0], e.ctrlKey, e.shiftKey); | |
67 }, | |
68 k13: function (e) {//enter-insert. send file to external app. | |
69 imce.send(imce.vars.prvfid); | |
70 return false; | |
71 }, | |
72 k37: function (e) {//left. focus on directories | |
73 $(imce.tree[imce.conf.dir].a).focus(); | |
74 }, | |
75 k65: function (e) {//ctrl+A to select all | |
76 if (e.ctrlKey && imce.findex.length) { | |
77 var fid = imce.findex[0].id; | |
78 imce.selected[fid] ? (imce.vars.lastfid = fid) : imce.fileClick(fid);//select first row | |
79 imce.fileClick(imce.findex[imce.findex.length-1], false, true);//shift+click last row | |
80 return false; | |
81 } | |
82 } | |
83 }; | |
84 //add equal keys | |
85 imce.fileKeys.k40 = imce.fileKeys.k38; | |
86 imce.fileKeys.k36 = imce.fileKeys.k35; | |
87 imce.fileKeys.k45 = imce.fileKeys.k13; | |
88 //add default operation keys. delete, R(esize), T(humbnails), U(pload) | |
89 $.each({k46: 'delete', k82: 'resize', k84: 'thumb', k85: 'upload'}, function (k, op) { | |
90 imce.fileKeys[k] = function (e) { | |
91 if (imce.ops[op] && !imce.ops[op].disabled) imce.opClick(op); | |
92 }; | |
93 }); | |
94 | |
95 //prepare column sorting | |
96 imce.initiateSorting = function() { | |
97 //add cache hook. cache the old directory's sort settings before the new one replaces it. | |
98 imce.hooks.cache.push(function (cache, newdir) { | |
99 cache.cid = imce.vars.cid, cache.dsc = imce.vars.dsc; | |
100 }); | |
101 //add navigation hook. refresh sorting after the new directory content is loaded. | |
102 imce.hooks.navigate.push(function (data, olddir, cached) { | |
103 cached ? imce.updateSortState(data.cid, data.dsc) : imce.firstSort(); | |
104 }); | |
105 imce.vars.cid = imce.cookie('imcecid') * 1; | |
106 imce.vars.dsc = imce.cookie('imcedsc') * 1; | |
107 imce.cols = imce.el('file-header').rows[0].cells; | |
108 $(imce.cols).click(function () {imce.columnSort(this.cellIndex, imce.hasC(this, 'asc'));}); | |
109 imce.firstSort(); | |
110 }; | |
111 | |
112 //sort the list for the first time | |
113 imce.firstSort = function() { | |
114 imce.columnSort(imce.vars.cid, imce.vars.dsc); | |
115 }; | |
116 | |
117 //sort file list according to column index. | |
118 imce.columnSort = function(cid, dsc) { | |
119 if (imce.findex.length < 2) return; | |
120 var func = 'sort'+ (cid == 0 ? 'Str' : 'Num') + (dsc ? 'Dsc' : 'Asc'); | |
121 var prop = cid == 2 || cid == 3 ? 'innerHTML' : 'id'; | |
122 //sort rows | |
123 imce.findex.sort(cid ? function(r1, r2) {return imce[func](r1.cells[cid][prop], r2.cells[cid][prop])} : function(r1, r2) {return imce[func](r1.id, r2.id)}); | |
124 //insert sorted rows | |
125 for (var row, i=0; row = imce.findex[i]; i++) { | |
126 imce.tbody.appendChild(row); | |
127 } | |
128 imce.updateSortState(cid, dsc); | |
129 }; | |
130 | |
131 //update column states | |
132 imce.updateSortState = function(cid, dsc) { | |
133 $(imce.cols[imce.vars.cid]).removeClass(imce.vars.dsc ? 'desc' : 'asc'); | |
134 $(imce.cols[cid]).addClass(dsc ? 'desc' : 'asc'); | |
135 imce.vars.cid != cid && imce.cookie('imcecid', imce.vars.cid = cid); | |
136 imce.vars.dsc != dsc && imce.cookie('imcedsc', (imce.vars.dsc = dsc) ? 1 : 0); | |
137 }; | |
138 | |
139 //sorters | |
140 imce.sortStrAsc = function(a, b) {return a.toLowerCase() < b.toLowerCase() ? -1 : 1;}; | |
141 imce.sortStrDsc = function(a, b) {return imce.sortStrAsc(b, a);}; | |
142 imce.sortNumAsc = function(a, b) {return a-b;}; | |
143 imce.sortNumDsc = function(a, b) {return b-a}; | |
144 | |
145 //set resizers for resizable areas and recall previous dimensions | |
146 imce.initiateResizeBars = function () { | |
147 imce.setResizer('#navigation-resizer', 'X', imce.NW, null, 1, function(p1, p2, m) { | |
148 p1 != p2 && imce.cookie('imcenww', p2); | |
149 }); | |
150 imce.setResizer('#browse-resizer', 'Y', imce.BW, imce.PW, 50, function(p1, p2, m) { | |
151 p1 != p2 && imce.cookie('imcebwh', p2); | |
152 }); | |
153 imce.recallDimensions(); | |
154 }; | |
155 | |
156 //set a resize bar | |
157 imce.setResizer = function (resizer, axis, area1, area2, Min, callback) { | |
158 var opt = axis == 'X' ? {pos: 'pageX', func: 'width'} : {pos: 'pageY', func: 'height'}; | |
159 var Min = Min || 0; | |
160 var $area1 = $(area1), $area2 = area2 ? $(area2) : null, $doc = $(document); | |
161 $(resizer).mousedown(function(e) { | |
162 var pos = e[opt.pos]; | |
163 var end = start = $area1[opt.func](); | |
164 var Max = $area2 ? start + $area2[opt.func]() : 1200; | |
165 var drag = function(e) { | |
166 end = Math.min(Max - Min, Math.max(start + e[opt.pos] - pos, Min)); | |
167 $area1[opt.func](end); | |
168 $area2 && $area2[opt.func](Max - end); | |
169 return false; | |
170 }; | |
171 var undrag = function(e) { | |
172 $doc.unbind('mousemove', drag).unbind('mouseup', undrag); | |
173 callback && callback(start, end, Max); | |
174 }; | |
175 $doc.mousemove(drag).mouseup(undrag); | |
176 return false; | |
177 }); | |
178 }; | |
179 | |
180 //get&set area dimensions of the last session from the cookie | |
181 imce.recallDimensions = function() { | |
182 var $body = $(document.body); | |
183 if (!$body.is('.imce')) return; | |
184 //row heights | |
185 imce.recallHeights(imce.cookie('imcebwh') * 1); | |
186 $(window).resize(function(){imce.recallHeights()}); | |
187 //navigation wrapper | |
188 var nwOldWidth = imce.cookie('imcenww') * 1; | |
189 nwOldWidth && $(imce.NW).width(Math.min(nwOldWidth, $body.width() - 10)); | |
190 }; | |
191 | |
192 //set row heights with respect to window height | |
193 imce.recallHeights = function(bwFixedHeight) { | |
194 //window & body dimensions | |
195 var winHeight = $.browser.opera ? window.innerHeight : $(window).height(); | |
196 var bodyHeight = $(document.body).outerHeight(true); | |
197 var diff = winHeight - bodyHeight; | |
198 var bwHeight = $(imce.BW).height(), pwHeight = $(imce.PW).height(); | |
199 if (bwFixedHeight) { | |
200 //row heights | |
201 diff -= bwFixedHeight - bwHeight; | |
202 bwHeight = bwFixedHeight; | |
203 pwHeight += diff; | |
204 } | |
205 else { | |
206 diff = parseInt(diff/2); | |
207 bwHeight += diff; | |
208 pwHeight += diff; | |
209 } | |
210 $(imce.BW).height(bwHeight); | |
211 $(imce.PW).height(pwHeight); | |
212 }; | |
213 | |
214 //cookie get & set | |
215 imce.cookie = function (name, value) { | |
216 if (typeof(value) == 'undefined') {//get | |
217 return unescape((document.cookie.match(new RegExp('(^|;) *'+ name +'=([^;]*)(;|$)')) || ['', '', ''])[2]); | |
218 } | |
219 document.cookie = name +'='+ escape(value) +'; expires='+ (new Date(new Date() * 1 + 15 * 86400000)).toGMTString() +'; path=' + Drupal.settings.basePath + 'imce';//set | |
220 }; | |
221 | |
222 //view thumbnails(smaller than tMaxW x tMaxH) inside the rows. | |
223 //Large images can also be previewed by setting imce.vars.prvstyle to a valid image style(imagecache preset) | |
224 imce.thumbRow = function (row) { | |
225 var w = row.cells[2].innerHTML * 1; | |
226 if (!w) return; | |
227 var h = row.cells[3].innerHTML * 1; | |
228 if (imce.vars.tMaxW < w || imce.vars.tMaxH < h) { | |
229 if (!imce.vars.prvstyle || imce.conf.dir.indexOf('styles') == 0) return; | |
230 var img = new Image(); | |
231 img.src = imce.imagestyleURL(imce.getURL(row.id), imce.vars.prvstyle); | |
232 img.className = 'imagestyle-' + imce.vars.prvstyle; | |
233 } | |
234 else { | |
235 var prvH = h, prvW = w; | |
236 if (imce.vars.prvW < w || imce.vars.prvH < h) { | |
237 if (h < w) { | |
238 prvW = imce.vars.prvW; | |
239 prvH = prvW*h/w; | |
240 } | |
241 else { | |
242 prvH = imce.vars.prvH; | |
243 prvW = prvH*w/h; | |
244 } | |
245 } | |
246 var img = new Image(prvW, prvH); | |
247 img.src = imce.getURL(row.id); | |
248 } | |
249 var cell = row.cells[0]; | |
250 cell.insertBefore(img, cell.firstChild); | |
251 }; | |
252 | |
253 //convert a file URL returned by imce.getURL() to an image style(imagecache preset) URL | |
254 imce.imagestyleURL = function (url, stylename) { | |
255 var len = imce.conf.furl.length - 1; | |
256 return url.substr(0, len) + '/styles/' + stylename + '/' + imce.conf.scheme + url.substr(len); | |
257 }; | |
258 | |
259 // replace table view with box view for file list | |
260 imce.boxView = function () { | |
261 var w = imce.vars.boxW, h = imce.vars.boxH; | |
262 if (!w || !h || $.browser.msie && parseFloat($.browser.version) < 8) return; | |
263 var $body = $(document.body); | |
264 var toggle = function() { | |
265 $body.toggleClass('box-view'); | |
266 // refresh dom. required by all except FF. | |
267 !$.browser.mozilla && $('#file-list').appendTo(imce.FW).appendTo(imce.FLW); | |
268 }; | |
269 $body.append('<style type="text/css">.box-view #file-list td.name {width: ' + w + 'px;height: ' + h + 'px;} .box-view #file-list td.name span {width: ' + w + 'px;word-wrap: normal;text-overflow: ellipsis;}</style>'); | |
270 imce.hooks.load.push(function() { | |
271 toggle(); | |
272 imce.SBW.scrollTop = 0; | |
273 imce.opAdd({name: 'changeview', title: Drupal.t('Change view'), func: toggle}); | |
274 }); | |
275 imce.hooks.list.push(imce.boxViewRow); | |
276 }; | |
277 | |
278 // process a row for box view. include all data in box title. | |
279 imce.boxViewRow = function (row) { | |
280 var s = ' | ', w = row.cells[2].innerHTML * 1, dim = w ? s + w + 'x' + row.cells[3].innerHTML * 1 : ''; | |
281 row.cells[0].title = imce.decode(row.id) + s + row.cells[1].innerHTML + (dim) + s + row.cells[4].innerHTML; | |
282 }; | |
283 | |
284 })(jQuery); |