##// END OF EJS Templates
List custom fields fielters: multiple select filter wider (#15073)....
Jean-Philippe Lang -
r11985:b071a937b3e0
parent child
Show More
@@ -1,591 +1,596
1 1 /* Redmine - project management software
2 2 Copyright (C) 2006-2013 Jean-Philippe Lang */
3 3
4 4 function checkAll(id, checked) {
5 5 if (checked) {
6 6 $('#'+id).find('input[type=checkbox]').attr('checked', true);
7 7 } else {
8 8 $('#'+id).find('input[type=checkbox]').removeAttr('checked');
9 9 }
10 10 }
11 11
12 12 function toggleCheckboxesBySelector(selector) {
13 13 var all_checked = true;
14 14 $(selector).each(function(index) {
15 15 if (!$(this).is(':checked')) { all_checked = false; }
16 16 });
17 17 $(selector).attr('checked', !all_checked);
18 18 }
19 19
20 20 function showAndScrollTo(id, focus) {
21 21 $('#'+id).show();
22 22 if (focus !== null) {
23 23 $('#'+focus).focus();
24 24 }
25 25 $('html, body').animate({scrollTop: $('#'+id).offset().top}, 100);
26 26 }
27 27
28 28 function toggleRowGroup(el) {
29 29 var tr = $(el).parents('tr').first();
30 30 var n = tr.next();
31 31 tr.toggleClass('open');
32 32 while (n.length && !n.hasClass('group')) {
33 33 n.toggle();
34 34 n = n.next('tr');
35 35 }
36 36 }
37 37
38 38 function collapseAllRowGroups(el) {
39 39 var tbody = $(el).parents('tbody').first();
40 40 tbody.children('tr').each(function(index) {
41 41 if ($(this).hasClass('group')) {
42 42 $(this).removeClass('open');
43 43 } else {
44 44 $(this).hide();
45 45 }
46 46 });
47 47 }
48 48
49 49 function expandAllRowGroups(el) {
50 50 var tbody = $(el).parents('tbody').first();
51 51 tbody.children('tr').each(function(index) {
52 52 if ($(this).hasClass('group')) {
53 53 $(this).addClass('open');
54 54 } else {
55 55 $(this).show();
56 56 }
57 57 });
58 58 }
59 59
60 60 function toggleAllRowGroups(el) {
61 61 var tr = $(el).parents('tr').first();
62 62 if (tr.hasClass('open')) {
63 63 collapseAllRowGroups(el);
64 64 } else {
65 65 expandAllRowGroups(el);
66 66 }
67 67 }
68 68
69 69 function toggleFieldset(el) {
70 70 var fieldset = $(el).parents('fieldset').first();
71 71 fieldset.toggleClass('collapsed');
72 72 fieldset.children('div').toggle();
73 73 }
74 74
75 75 function hideFieldset(el) {
76 76 var fieldset = $(el).parents('fieldset').first();
77 77 fieldset.toggleClass('collapsed');
78 78 fieldset.children('div').hide();
79 79 }
80 80
81 81 function initFilters() {
82 82 $('#add_filter_select').change(function() {
83 83 addFilter($(this).val(), '', []);
84 84 });
85 85 $('#filters-table td.field input[type=checkbox]').each(function() {
86 86 toggleFilter($(this).val());
87 87 });
88 88 $('#filters-table td.field input[type=checkbox]').live('click', function() {
89 89 toggleFilter($(this).val());
90 90 });
91 91 $('#filters-table .toggle-multiselect').live('click', function() {
92 92 toggleMultiSelect($(this).siblings('select'));
93 93 });
94 94 $('#filters-table input[type=text]').live('keypress', function(e) {
95 95 if (e.keyCode == 13) submit_query_form("query_form");
96 96 });
97 97 }
98 98
99 99 function addFilter(field, operator, values) {
100 100 var fieldId = field.replace('.', '_');
101 101 var tr = $('#tr_'+fieldId);
102 102 if (tr.length > 0) {
103 103 tr.show();
104 104 } else {
105 105 buildFilterRow(field, operator, values);
106 106 }
107 107 $('#cb_'+fieldId).attr('checked', true);
108 108 toggleFilter(field);
109 109 $('#add_filter_select').val('').children('option').each(function() {
110 110 if ($(this).attr('value') == field) {
111 111 $(this).attr('disabled', true);
112 112 }
113 113 });
114 114 }
115 115
116 116 function buildFilterRow(field, operator, values) {
117 117 var fieldId = field.replace('.', '_');
118 118 var filterTable = $("#filters-table");
119 119 var filterOptions = availableFilters[field];
120 120 var operators = operatorByType[filterOptions['type']];
121 121 var filterValues = filterOptions['values'];
122 122 var i, select;
123 123
124 124 var tr = $('<tr class="filter">').attr('id', 'tr_'+fieldId).html(
125 125 '<td class="field"><input checked="checked" id="cb_'+fieldId+'" name="f[]" value="'+field+'" type="checkbox"><label for="cb_'+fieldId+'"> '+filterOptions['name']+'</label></td>' +
126 126 '<td class="operator"><select id="operators_'+fieldId+'" name="op['+field+']"></td>' +
127 127 '<td class="values"></td>'
128 128 );
129 129 filterTable.append(tr);
130 130
131 131 select = tr.find('td.operator select');
132 132 for (i = 0; i < operators.length; i++) {
133 133 var option = $('<option>').val(operators[i]).text(operatorLabels[operators[i]]);
134 134 if (operators[i] == operator) { option.attr('selected', true); }
135 135 select.append(option);
136 136 }
137 137 select.change(function(){ toggleOperator(field); });
138 138
139 139 switch (filterOptions['type']) {
140 140 case "list":
141 141 case "list_optional":
142 142 case "list_status":
143 143 case "list_subprojects":
144 144 tr.find('td.values').append(
145 145 '<span style="display:none;"><select class="value" id="values_'+fieldId+'_1" name="v['+field+'][]"></select>' +
146 146 ' <span class="toggle-multiselect">&nbsp;</span></span>'
147 147 );
148 148 select = tr.find('td.values select');
149 149 if (values.length > 1) { select.attr('multiple', true); }
150 150 for (i = 0; i < filterValues.length; i++) {
151 151 var filterValue = filterValues[i];
152 152 var option = $('<option>');
153 153 if ($.isArray(filterValue)) {
154 154 option.val(filterValue[1]).text(filterValue[0]);
155 155 if ($.inArray(filterValue[1], values) > -1) {option.attr('selected', true);}
156 156 } else {
157 157 option.val(filterValue).text(filterValue);
158 158 if ($.inArray(filterValue, values) > -1) {option.attr('selected', true);}
159 159 }
160 160 select.append(option);
161 161 }
162 162 break;
163 163 case "date":
164 164 case "date_past":
165 165 tr.find('td.values').append(
166 166 '<span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'_1" size="10" class="value date_value" /></span>' +
167 167 ' <span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'_2" size="10" class="value date_value" /></span>' +
168 168 ' <span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'" size="3" class="value" /> '+labelDayPlural+'</span>'
169 169 );
170 170 $('#values_'+fieldId+'_1').val(values[0]).datepicker(datepickerOptions);
171 171 $('#values_'+fieldId+'_2').val(values[1]).datepicker(datepickerOptions);
172 172 $('#values_'+fieldId).val(values[0]);
173 173 break;
174 174 case "string":
175 175 case "text":
176 176 tr.find('td.values').append(
177 177 '<span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'" size="30" class="value" /></span>'
178 178 );
179 179 $('#values_'+fieldId).val(values[0]);
180 180 break;
181 181 case "relation":
182 182 tr.find('td.values').append(
183 183 '<span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'" size="6" class="value" /></span>' +
184 184 '<span style="display:none;"><select class="value" name="v['+field+'][]" id="values_'+fieldId+'_1"></select></span>'
185 185 );
186 186 $('#values_'+fieldId).val(values[0]);
187 187 select = tr.find('td.values select');
188 188 for (i = 0; i < allProjects.length; i++) {
189 189 var filterValue = allProjects[i];
190 190 var option = $('<option>');
191 191 option.val(filterValue[1]).text(filterValue[0]);
192 192 if (values[0] == filterValue[1]) { option.attr('selected', true); }
193 193 select.append(option);
194 194 }
195 195 case "integer":
196 196 case "float":
197 197 tr.find('td.values').append(
198 198 '<span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'_1" size="6" class="value" /></span>' +
199 199 ' <span style="display:none;"><input type="text" name="v['+field+'][]" id="values_'+fieldId+'_2" size="6" class="value" /></span>'
200 200 );
201 201 $('#values_'+fieldId+'_1').val(values[0]);
202 202 $('#values_'+fieldId+'_2').val(values[1]);
203 203 break;
204 204 }
205 205 }
206 206
207 207 function toggleFilter(field) {
208 208 var fieldId = field.replace('.', '_');
209 209 if ($('#cb_' + fieldId).is(':checked')) {
210 210 $("#operators_" + fieldId).show().removeAttr('disabled');
211 211 toggleOperator(field);
212 212 } else {
213 213 $("#operators_" + fieldId).hide().attr('disabled', true);
214 214 enableValues(field, []);
215 215 }
216 216 }
217 217
218 218 function enableValues(field, indexes) {
219 219 var fieldId = field.replace('.', '_');
220 220 $('#tr_'+fieldId+' td.values .value').each(function(index) {
221 221 if ($.inArray(index, indexes) >= 0) {
222 222 $(this).removeAttr('disabled');
223 223 $(this).parents('span').first().show();
224 224 } else {
225 225 $(this).val('');
226 226 $(this).attr('disabled', true);
227 227 $(this).parents('span').first().hide();
228 228 }
229 229
230 230 if ($(this).hasClass('group')) {
231 231 $(this).addClass('open');
232 232 } else {
233 233 $(this).show();
234 234 }
235 235 });
236 236 }
237 237
238 238 function toggleOperator(field) {
239 239 var fieldId = field.replace('.', '_');
240 240 var operator = $("#operators_" + fieldId);
241 241 switch (operator.val()) {
242 242 case "!*":
243 243 case "*":
244 244 case "t":
245 245 case "ld":
246 246 case "w":
247 247 case "lw":
248 248 case "l2w":
249 249 case "m":
250 250 case "lm":
251 251 case "y":
252 252 case "o":
253 253 case "c":
254 254 enableValues(field, []);
255 255 break;
256 256 case "><":
257 257 enableValues(field, [0,1]);
258 258 break;
259 259 case "<t+":
260 260 case ">t+":
261 261 case "><t+":
262 262 case "t+":
263 263 case ">t-":
264 264 case "<t-":
265 265 case "><t-":
266 266 case "t-":
267 267 enableValues(field, [2]);
268 268 break;
269 269 case "=p":
270 270 case "=!p":
271 271 case "!p":
272 272 enableValues(field, [1]);
273 273 break;
274 274 default:
275 275 enableValues(field, [0]);
276 276 break;
277 277 }
278 278 }
279 279
280 280 function toggleMultiSelect(el) {
281 281 if (el.attr('multiple')) {
282 282 el.removeAttr('multiple');
283 el.attr('size', 1);
283 284 } else {
284 285 el.attr('multiple', true);
286 if (el.children().length > 10)
287 el.attr('size', 10);
288 else
289 el.attr('size', 4);
285 290 }
286 291 }
287 292
288 293 function submit_query_form(id) {
289 294 selectAllOptions("selected_columns");
290 295 $('#'+id).submit();
291 296 }
292 297
293 298 function showTab(name, url) {
294 299 $('div#content .tab-content').hide();
295 300 $('div.tabs a').removeClass('selected');
296 301 $('#tab-content-' + name).show();
297 302 $('#tab-' + name).addClass('selected');
298 303 //replaces current URL with the "href" attribute of the current link
299 304 //(only triggered if supported by browser)
300 305 if ("replaceState" in window.history) {
301 306 window.history.replaceState(null, document.title, url);
302 307 }
303 308 return false;
304 309 }
305 310
306 311 function moveTabRight(el) {
307 312 var lis = $(el).parents('div.tabs').first().find('ul').children();
308 313 var tabsWidth = 0;
309 314 var i = 0;
310 315 lis.each(function() {
311 316 if ($(this).is(':visible')) {
312 317 tabsWidth += $(this).width() + 6;
313 318 }
314 319 });
315 320 if (tabsWidth < $(el).parents('div.tabs').first().width() - 60) { return; }
316 321 while (i<lis.length && !lis.eq(i).is(':visible')) { i++; }
317 322 lis.eq(i).hide();
318 323 }
319 324
320 325 function moveTabLeft(el) {
321 326 var lis = $(el).parents('div.tabs').first().find('ul').children();
322 327 var i = 0;
323 328 while (i < lis.length && !lis.eq(i).is(':visible')) { i++; }
324 329 if (i > 0) {
325 330 lis.eq(i-1).show();
326 331 }
327 332 }
328 333
329 334 function displayTabsButtons() {
330 335 var lis;
331 336 var tabsWidth = 0;
332 337 var el;
333 338 $('div.tabs').each(function() {
334 339 el = $(this);
335 340 lis = el.find('ul').children();
336 341 lis.each(function(){
337 342 if ($(this).is(':visible')) {
338 343 tabsWidth += $(this).width() + 6;
339 344 }
340 345 });
341 346 if ((tabsWidth < el.width() - 60) && (lis.first().is(':visible'))) {
342 347 el.find('div.tabs-buttons').hide();
343 348 } else {
344 349 el.find('div.tabs-buttons').show();
345 350 }
346 351 });
347 352 }
348 353
349 354 function setPredecessorFieldsVisibility() {
350 355 var relationType = $('#relation_relation_type');
351 356 if (relationType.val() == "precedes" || relationType.val() == "follows") {
352 357 $('#predecessor_fields').show();
353 358 } else {
354 359 $('#predecessor_fields').hide();
355 360 }
356 361 }
357 362
358 363 function showModal(id, width) {
359 364 var el = $('#'+id).first();
360 365 if (el.length === 0 || el.is(':visible')) {return;}
361 366 var title = el.find('h3.title').text();
362 367 el.dialog({
363 368 width: width,
364 369 modal: true,
365 370 resizable: false,
366 371 dialogClass: 'modal',
367 372 title: title
368 373 });
369 374 el.find("input[type=text], input[type=submit]").first().focus();
370 375 }
371 376
372 377 function hideModal(el) {
373 378 var modal;
374 379 if (el) {
375 380 modal = $(el).parents('.ui-dialog-content');
376 381 } else {
377 382 modal = $('#ajax-modal');
378 383 }
379 384 modal.dialog("close");
380 385 }
381 386
382 387 function submitPreview(url, form, target) {
383 388 $.ajax({
384 389 url: url,
385 390 type: 'post',
386 391 data: $('#'+form).serialize(),
387 392 success: function(data){
388 393 $('#'+target).html(data);
389 394 }
390 395 });
391 396 }
392 397
393 398 function collapseScmEntry(id) {
394 399 $('.'+id).each(function() {
395 400 if ($(this).hasClass('open')) {
396 401 collapseScmEntry($(this).attr('id'));
397 402 }
398 403 $(this).hide();
399 404 });
400 405 $('#'+id).removeClass('open');
401 406 }
402 407
403 408 function expandScmEntry(id) {
404 409 $('.'+id).each(function() {
405 410 $(this).show();
406 411 if ($(this).hasClass('loaded') && !$(this).hasClass('collapsed')) {
407 412 expandScmEntry($(this).attr('id'));
408 413 }
409 414 });
410 415 $('#'+id).addClass('open');
411 416 }
412 417
413 418 function scmEntryClick(id, url) {
414 419 el = $('#'+id);
415 420 if (el.hasClass('open')) {
416 421 collapseScmEntry(id);
417 422 el.addClass('collapsed');
418 423 return false;
419 424 } else if (el.hasClass('loaded')) {
420 425 expandScmEntry(id);
421 426 el.removeClass('collapsed');
422 427 return false;
423 428 }
424 429 if (el.hasClass('loading')) {
425 430 return false;
426 431 }
427 432 el.addClass('loading');
428 433 $.ajax({
429 434 url: url,
430 435 success: function(data) {
431 436 el.after(data);
432 437 el.addClass('open').addClass('loaded').removeClass('loading');
433 438 }
434 439 });
435 440 return true;
436 441 }
437 442
438 443 function randomKey(size) {
439 444 var chars = '0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz';
440 445 var key = '';
441 446 for (var i = 0; i < size; i++) {
442 447 key += chars.charAt(Math.floor(Math.random() * chars.length));
443 448 }
444 449 return key;
445 450 }
446 451
447 452 function updateIssueFrom(url) {
448 453 $('#all_attributes input, #all_attributes textarea, #all_attributes select').each(function(){
449 454 $(this).data('valuebeforeupdate', $(this).val());
450 455 });
451 456 $.ajax({
452 457 url: url,
453 458 type: 'post',
454 459 data: $('#issue-form').serialize()
455 460 });
456 461 }
457 462
458 463 function replaceIssueFormWith(html){
459 464 var replacement = $(html);
460 465 $('#all_attributes input, #all_attributes textarea, #all_attributes select').each(function(){
461 466 var object_id = $(this).attr('id');
462 467 if (object_id && $(this).data('valuebeforeupdate')!=$(this).val()) {
463 468 replacement.find('#'+object_id).val($(this).val());
464 469 }
465 470 });
466 471 $('#all_attributes').empty();
467 472 $('#all_attributes').prepend(replacement);
468 473 }
469 474
470 475 function updateBulkEditFrom(url) {
471 476 $.ajax({
472 477 url: url,
473 478 type: 'post',
474 479 data: $('#bulk_edit_form').serialize()
475 480 });
476 481 }
477 482
478 483 function observeAutocompleteField(fieldId, url, options) {
479 484 $(document).ready(function() {
480 485 $('#'+fieldId).autocomplete($.extend({
481 486 source: url,
482 487 minLength: 2,
483 488 search: function(){$('#'+fieldId).addClass('ajax-loading');},
484 489 response: function(){$('#'+fieldId).removeClass('ajax-loading');}
485 490 }, options));
486 491 $('#'+fieldId).addClass('autocomplete');
487 492 });
488 493 }
489 494
490 495 function observeSearchfield(fieldId, targetId, url) {
491 496 $('#'+fieldId).each(function() {
492 497 var $this = $(this);
493 498 $this.addClass('autocomplete');
494 499 $this.attr('data-value-was', $this.val());
495 500 var check = function() {
496 501 var val = $this.val();
497 502 if ($this.attr('data-value-was') != val){
498 503 $this.attr('data-value-was', val);
499 504 $.ajax({
500 505 url: url,
501 506 type: 'get',
502 507 data: {q: $this.val()},
503 508 success: function(data){ if(targetId) $('#'+targetId).html(data); },
504 509 beforeSend: function(){ $this.addClass('ajax-loading'); },
505 510 complete: function(){ $this.removeClass('ajax-loading'); }
506 511 });
507 512 }
508 513 };
509 514 var reset = function() {
510 515 if (timer) {
511 516 clearInterval(timer);
512 517 timer = setInterval(check, 300);
513 518 }
514 519 };
515 520 var timer = setInterval(check, 300);
516 521 $this.bind('keyup click mousemove', reset);
517 522 });
518 523 }
519 524
520 525 function initMyPageSortable(list, url) {
521 526 $('#list-'+list).sortable({
522 527 connectWith: '.block-receiver',
523 528 tolerance: 'pointer',
524 529 update: function(){
525 530 $.ajax({
526 531 url: url,
527 532 type: 'post',
528 533 data: {'blocks': $.map($('#list-'+list).children(), function(el){return $(el).attr('id');})}
529 534 });
530 535 }
531 536 });
532 537 $("#list-top, #list-left, #list-right").disableSelection();
533 538 }
534 539
535 540 var warnLeavingUnsavedMessage;
536 541 function warnLeavingUnsaved(message) {
537 542 warnLeavingUnsavedMessage = message;
538 543 $('form').live('submit', function(){
539 544 $('textarea').removeData('changed');
540 545 });
541 546 $('textarea').live('change', function(){
542 547 $(this).data('changed', 'changed');
543 548 });
544 549 window.onbeforeunload = function(){
545 550 var warn = false;
546 551 $('textarea').blur().each(function(){
547 552 if ($(this).data('changed')) {
548 553 warn = true;
549 554 }
550 555 });
551 556 if (warn) {return warnLeavingUnsavedMessage;}
552 557 };
553 558 }
554 559
555 560 function setupAjaxIndicator() {
556 561 $('#ajax-indicator').bind('ajaxSend', function(event, xhr, settings) {
557 562 if ($('.ajax-loading').length === 0 && settings.contentType != 'application/octet-stream') {
558 563 $('#ajax-indicator').show();
559 564 }
560 565 });
561 566 $('#ajax-indicator').bind('ajaxStop', function() {
562 567 $('#ajax-indicator').hide();
563 568 });
564 569 }
565 570
566 571 function hideOnLoad() {
567 572 $('.hol').hide();
568 573 }
569 574
570 575 function addFormObserversForDoubleSubmit() {
571 576 $('form[method=post]').each(function() {
572 577 if (!$(this).hasClass('multiple-submit')) {
573 578 $(this).submit(function(form_submission) {
574 579 if ($(form_submission.target).attr('data-submitted')) {
575 580 form_submission.preventDefault();
576 581 } else {
577 582 $(form_submission.target).attr('data-submitted', true);
578 583 }
579 584 });
580 585 }
581 586 });
582 587 }
583 588
584 589 function blockEventPropagation(event) {
585 590 event.stopPropagation();
586 591 event.preventDefault();
587 592 }
588 593
589 594 $(document).ready(setupAjaxIndicator);
590 595 $(document).ready(hideOnLoad);
591 596 $(document).ready(addFormObserversForDoubleSubmit);
General Comments 0
You need to be logged in to leave comments. Login now