xref: /webtrees/resources/js/webtrees.js (revision 2145828ba5a1541af8ce5bc9c55659f079a30406) 
1/**
2 * webtrees: online genealogy
3 * Copyright (C) 2019 webtrees development team
4 * This program is free software: you can redistribute it and/or modify
5 * it under the terms of the GNU General Public License as published by
6 * the Free Software Foundation, either version 3 of the License, or
7 * (at your option) any later version.
8 * This program is distributed in the hope that it will be useful,
9 * but WITHOUT ANY WARRANTY; without even the implied warranty of
10 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
11 * GNU General Public License for more details.
12 * You should have received a copy of the GNU General Public License
13 * along with this program. If not, see <http://www.gnu.org/licenses/>.
14 */
15
16'use strict';
17
18(function (webtrees) {
19  const lang = document.documentElement.lang;
20
21  // Identify the script used by some text.
22  const scriptRegexes = {
23    Han: /[\u3400-\u9FCC]/,
24    Grek: /[\u0370-\u03FF]/,
25    Cyrl: /[\u0400-\u04FF]/,
26    Hebr: /[\u0590-\u05FF]/,
27    Arab: /[\u0600-\u06FF]/
28  };
29
30  /**
31   * Tidy the whitespace in a string.
32   * @param {string} str
33   * @returns {string}
34   */
35  function trim (str) {
36    return str.replace(/\s+/g, ' ').trim();
37  }
38
39  /**
40   * Look for non-latin characters in a string.
41   * @param {string} str
42   * @returns {string}
43   */
44  webtrees.detectScript = function (str) {
45    for (const script in scriptRegexes) {
46      if (str.match(scriptRegexes[script])) {
47        return script;
48      }
49    }
50
51    return 'Latn';
52  };
53
54  /**
55   * In some languages, the SURN uses a male/default form, but NAME uses a gender-inflected form.
56   * @param {string} surname
57   * @param {string} sex
58   * @returns {string}
59   */
60  function inflectSurname (surname, sex) {
61    if (lang === 'pl' && sex === 'F') {
62      return surname
63        .replace(/ski$/, 'ska')
64        .replace(/cki$/, 'cka')
65        .replace(/dzki$/, 'dzka')
66        .replace(/żki$/, 'żka');
67    }
68
69    return surname;
70  }
71
72  /**
73   * Build a NAME from a NPFX, GIVN, SPFX, SURN and NSFX parts.
74   * Assumes the language of the document is the same as the language of the name.
75   * @param {string} npfx
76   * @param {string} givn
77   * @param {string} spfx
78   * @param {string} surn
79   * @param {string} nsfx
80   * @param {string} sex
81   * @returns {string}
82   */
83  webtrees.buildNameFromParts = function (npfx, givn, spfx, surn, nsfx, sex) {
84    const usesCJK = webtrees.detectScript(npfx + givn + spfx + givn + surn + nsfx) === 'Han';
85    const separator = usesCJK ? '' : ' ';
86    const surnameFirst = usesCJK || ['hu', 'jp', 'ko', 'vi', 'zh-Hans', 'zh-Hant'].indexOf(lang) !== -1;
87    const patronym = ['is'].indexOf(lang) !== -1;
88    const slash = patronym ? '' : '/';
89
90    // GIVN and SURN may be a comma-separated lists.
91    npfx = trim(npfx);
92    givn = trim(givn.replace(',', separator));
93    spfx = trim(spfx);
94    surn = inflectSurname(trim(surn.replace(',', separator)), sex);
95    nsfx = trim(nsfx);
96
97    const surname = trim(spfx + separator + surn);
98
99    const name = surnameFirst ? slash + surname + slash + separator + givn : givn + separator + slash + surname + slash;
100
101    return trim(npfx + separator + name + separator + nsfx);
102  };
103
104  // Insert text at the current cursor position in a text field.
105  webtrees.pasteAtCursor = function (element, text) {
106    if (element !== null) {
107      const caret_pos = element.selectionStart + text.length;
108      const textBefore = element.value.substring(0, element.selectionStart);
109      const textAfter = element.value.substring(element.selectionEnd);
110      element.value = textBefore + text + textAfter;
111      element.setSelectionRange(caret_pos, caret_pos);
112      element.focus();
113    }
114  };
115}(window.webtrees = window.webtrees || {}));
116
117/**
118 * @param {string} sid
119 * @returns {boolean}
120 */
121function expand_layer (sid) {
122  $('#' + sid + '_img').toggleClass('icon-plus icon-minus');
123  $('#' + sid).slideToggle('fast');
124  $('#' + sid + '-alt').toggle(); // hide something when we show the layer - and vice-versa
125  return false;
126}
127
128var pastefield;
129
130/**
131 * @param {string} datefield
132 * @param {string} dmy
133 */
134function valid_date (datefield, dmy) {
135  var months = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC'];
136  var hijri_months = ['MUHAR', 'SAFAR', 'RABIA', 'RABIT', 'JUMAA', 'JUMAT', 'RAJAB', 'SHAAB', 'RAMAD', 'SHAWW', 'DHUAQ', 'DHUAH'];
137  var hebrew_months = ['TSH', 'CSH', 'KSL', 'TVT', 'SHV', 'ADR', 'ADS', 'NSN', 'IYR', 'SVN', 'TMZ', 'AAV', 'ELL'];
138  var french_months = ['VEND', 'BRUM', 'FRIM', 'NIVO', 'PLUV', 'VENT', 'GERM', 'FLOR', 'PRAI', 'MESS', 'THER', 'FRUC', 'COMP'];
139  var jalali_months = ['FARVA', 'ORDIB', 'KHORD', 'TIR', 'MORDA', 'SHAHR', 'MEHR', 'ABAN', 'AZAR', 'DEY', 'BAHMA', 'ESFAN'];
140
141  var datestr = datefield.value;
142  // if a date has a date phrase marked by () this has to be excluded from altering
143  var datearr = datestr.split('(');
144  var datephrase = '';
145  if (datearr.length > 1) {
146    datestr = datearr[0];
147    datephrase = datearr[1];
148  }
149
150  // Gedcom dates are upper case
151  datestr = datestr.toUpperCase();
152  // Gedcom dates have no leading/trailing/repeated whitespace
153  datestr = datestr.replace(/\s+/g, ' ');
154  datestr = datestr.replace(/(^\s)|(\s$)/, '');
155  // Gedcom dates have spaces between letters and digits, e.g. "01JAN2000" => "01 JAN 2000"
156  datestr = datestr.replace(/(\d)([A-Z])/g, '$1 $2');
157  datestr = datestr.replace(/([A-Z])(\d)/g, '$1 $2');
158
159  // Shortcut for quarter format, "Q1 1900" => "BET JAN 1900 AND MAR 1900". See [ 1509083 ]
160  if (datestr.match(/^Q ([1-4]) (\d\d\d\d)$/)) {
161    datestr = 'BET ' + months[RegExp.$1 * 3 - 3] + ' ' + RegExp.$2 + ' AND ' + months[RegExp.$1 * 3 - 1] + ' ' + RegExp.$2;
162  }
163
164  // Shortcut for @#Dxxxxx@ 01 01 1400, etc.
165  if (datestr.match(/^(@#DHIJRI@|HIJRI)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) {
166    datestr = '@#DHIJRI@' + RegExp.$2 + hijri_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4;
167  }
168  if (datestr.match(/^(@#DJALALI@|JALALI)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) {
169    datestr = '@#DJALALI@' + RegExp.$2 + jalali_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4;
170  }
171  if (datestr.match(/^(@#DHEBREW@|HEBREW)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) {
172    datestr = '@#DHEBREW@' + RegExp.$2 + hebrew_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4;
173  }
174  if (datestr.match(/^(@#DFRENCH R@|FRENCH)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) {
175    datestr = '@#DFRENCH R@' + RegExp.$2 + french_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4;
176  }
177
178  // e.g. 17.11.1860, 03/04/2005 or 1999-12-31. Use locale settings where DMY order is ambiguous.
179  var qsearch = /^([^\d]*)(\d+)[^\d](\d+)[^\d](\d+)$/i;
180  if (qsearch.exec(datestr)) {
181    var f0 = RegExp.$1;
182    var f1 = parseInt(RegExp.$2, 10);
183    var f2 = parseInt(RegExp.$3, 10);
184    var f3 = parseInt(RegExp.$4, 10);
185    var yyyy = new Date().getFullYear();
186    var yy = yyyy % 100;
187    var cc = yyyy - yy;
188    if (dmy === 'DMY' && f1 <= 31 && f2 <= 12 || f1 > 13 && f1 <= 31 && f2 <= 12 && f3 > 31) {
189      datestr = f0 + f1 + ' ' + months[f2 - 1] + ' ' + (f3 >= 100 ? f3 : (f3 <= yy ? f3 + cc : f3 + cc - 100));
190    } else {
191      if (dmy === 'MDY' && f1 <= 12 && f2 <= 31 || f2 > 13 && f2 <= 31 && f1 <= 12 && f3 > 31) {
192        datestr = f0 + f2 + ' ' + months[f1 - 1] + ' ' + (f3 >= 100 ? f3 : (f3 <= yy ? f3 + cc : f3 + cc - 100));
193      } else {
194        if (dmy === 'YMD' && f2 <= 12 && f3 <= 31 || f3 > 13 && f3 <= 31 && f2 <= 12 && f1 > 31) {
195          datestr = f0 + f3 + ' ' + months[f2 - 1] + ' ' + (f1 >= 100 ? f1 : (f1 <= yy ? f1 + cc : f1 + cc - 100));
196        }
197      }
198    }
199  }
200
201  // Shortcuts for date ranges
202  datestr = datestr.replace(/^[>]([\w ]+)$/, 'AFT $1');
203  datestr = datestr.replace(/^[<]([\w ]+)$/, 'BEF $1');
204  datestr = datestr.replace(/^([\w ]+)[-]$/, 'FROM $1');
205  datestr = datestr.replace(/^[-]([\w ]+)$/, 'TO $1');
206  datestr = datestr.replace(/^[~]([\w ]+)$/, 'ABT $1');
207  datestr = datestr.replace(/^[*]([\w ]+)$/, 'EST $1');
208  datestr = datestr.replace(/^[#]([\w ]+)$/, 'CAL $1');
209  datestr = datestr.replace(/^([\w ]+) ?- ?([\w ]+)$/, 'BET $1 AND $2');
210  datestr = datestr.replace(/^([\w ]+) ?~ ?([\w ]+)$/, 'FROM $1 TO $2');
211
212  // Convert full months to short months
213  datestr = datestr.replace(/(JANUARY)/, 'JAN');
214  datestr = datestr.replace(/(FEBRUARY)/, 'FEB');
215  datestr = datestr.replace(/(MARCH)/, 'MAR');
216  datestr = datestr.replace(/(APRIL)/, 'APR');
217  datestr = datestr.replace(/(MAY)/, 'MAY');
218  datestr = datestr.replace(/(JUNE)/, 'JUN');
219  datestr = datestr.replace(/(JULY)/, 'JUL');
220  datestr = datestr.replace(/(AUGUST)/, 'AUG');
221  datestr = datestr.replace(/(SEPTEMBER)/, 'SEP');
222  datestr = datestr.replace(/(OCTOBER)/, 'OCT');
223  datestr = datestr.replace(/(NOVEMBER)/, 'NOV');
224  datestr = datestr.replace(/(DECEMBER)/, 'DEC');
225
226  // Americans frequently enter dates as SEP 20, 1999
227  // No need to internationalise this, as this is an english-language issue
228  datestr = datestr.replace(/(JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC)\.? (\d\d?)[, ]+(\d\d\d\d)/, '$2 $1 $3');
229
230  // Apply leading zero to day numbers
231  datestr = datestr.replace(/(^| )(\d [A-Z]{3,5} \d{4})/, '$10$2');
232
233  if (datephrase) {
234    datestr = datestr + ' (' + datephrase;
235  }
236  // Only update it if is has been corrected - otherwise input focus
237  // moves to the end of the field unnecessarily
238  if (datefield.value !== datestr) {
239    datefield.value = datestr;
240  }
241}
242
243var monthLabels = [];
244monthLabels[1] = 'January';
245monthLabels[2] = 'February';
246monthLabels[3] = 'March';
247monthLabels[4] = 'April';
248monthLabels[5] = 'May';
249monthLabels[6] = 'June';
250monthLabels[7] = 'July';
251monthLabels[8] = 'August';
252monthLabels[9] = 'September';
253monthLabels[10] = 'October';
254monthLabels[11] = 'November';
255monthLabels[12] = 'December';
256
257var monthShort = [];
258monthShort[1] = 'JAN';
259monthShort[2] = 'FEB';
260monthShort[3] = 'MAR';
261monthShort[4] = 'APR';
262monthShort[5] = 'MAY';
263monthShort[6] = 'JUN';
264monthShort[7] = 'JUL';
265monthShort[8] = 'AUG';
266monthShort[9] = 'SEP';
267monthShort[10] = 'OCT';
268monthShort[11] = 'NOV';
269monthShort[12] = 'DEC';
270
271var daysOfWeek = [];
272daysOfWeek[0] = 'S';
273daysOfWeek[1] = 'M';
274daysOfWeek[2] = 'T';
275daysOfWeek[3] = 'W';
276daysOfWeek[4] = 'T';
277daysOfWeek[5] = 'F';
278daysOfWeek[6] = 'S';
279
280var weekStart = 0;
281
282/**
283 * @param {string} jan
284 * @param {string} feb
285 * @param {string} mar
286 * @param {string} apr
287 * @param {string} may
288 * @param {string} jun
289 * @param {string} jul
290 * @param {string} aug
291 * @param {string} sep
292 * @param {string} oct
293 * @param {string} nov
294 * @param {string} dec
295 */
296function cal_setMonthNames (jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec) {
297  monthLabels[1] = jan;
298  monthLabels[2] = feb;
299  monthLabels[3] = mar;
300  monthLabels[4] = apr;
301  monthLabels[5] = may;
302  monthLabels[6] = jun;
303  monthLabels[7] = jul;
304  monthLabels[8] = aug;
305  monthLabels[9] = sep;
306  monthLabels[10] = oct;
307  monthLabels[11] = nov;
308  monthLabels[12] = dec;
309}
310
311/**
312 * @param {string} sun
313 * @param {string} mon
314 * @param {string} tue
315 * @param {string} wed
316 * @param {string} thu
317 * @param {string} fri
318 * @param {string} sat
319 */
320function cal_setDayHeaders (sun, mon, tue, wed, thu, fri, sat) {
321  daysOfWeek[0] = sun;
322  daysOfWeek[1] = mon;
323  daysOfWeek[2] = tue;
324  daysOfWeek[3] = wed;
325  daysOfWeek[4] = thu;
326  daysOfWeek[5] = fri;
327  daysOfWeek[6] = sat;
328}
329
330/**
331 * @param {number} day
332 */
333function cal_setWeekStart (day) {
334  if (day >= 0 && day < 7) {
335    weekStart = day;
336  }
337}
338
339/**
340 * @param {string} dateDivId
341 * @param {string} dateFieldId
342 * @returns {boolean}
343 */
344function calendarWidget (dateDivId, dateFieldId) {
345  var dateDiv = document.getElementById(dateDivId);
346  var dateField = document.getElementById(dateFieldId);
347
348  if (dateDiv.style.visibility === 'visible') {
349    dateDiv.style.visibility = 'hidden';
350    return false;
351  }
352  if (dateDiv.style.visibility === 'show') {
353    dateDiv.style.visibility = 'hide';
354    return false;
355  }
356
357  /* Javascript calendar functions only work with precise gregorian dates "D M Y" or "Y" */
358  var greg_regex = /((\d+ (JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC) )?\d+)/i;
359  var date;
360  if (greg_regex.exec(dateField.value)) {
361    date = new Date(RegExp.$1);
362  } else {
363    date = new Date();
364  }
365
366  dateDiv.innerHTML = cal_generateSelectorContent(dateFieldId, dateDivId, date);
367  if (dateDiv.style.visibility === 'hidden') {
368    dateDiv.style.visibility = 'visible';
369    return false;
370  }
371  if (dateDiv.style.visibility === 'hide') {
372    dateDiv.style.visibility = 'show';
373    return false;
374  }
375
376  return false;
377}
378
379/**
380 * @param {string} dateFieldId
381 * @param {string} dateDivId
382 * @param {Date} date
383 * @returns {string}
384 */
385function cal_generateSelectorContent (dateFieldId, dateDivId, date) {
386  var i, j;
387  var content = '<table border="1"><tr>';
388  content += '<td><select class="form-control" id="' + dateFieldId + '_daySelect" onchange="return cal_updateCalendar(\'' + dateFieldId + '\', \'' + dateDivId + '\');">';
389  for (i = 1; i < 32; i++) {
390    content += '<option value="' + i + '"';
391    if (date.getDate() === i) {
392      content += ' selected="selected"';
393    }
394    content += '>' + i + '</option>';
395  }
396  content += '</select></td>';
397  content += '<td><select class="form-control" id="' + dateFieldId + '_monSelect" onchange="return cal_updateCalendar(\'' + dateFieldId + '\', \'' + dateDivId + '\');">';
398  for (i = 1; i < 13; i++) {
399    content += '<option value="' + i + '"';
400    if (date.getMonth() + 1 === i) {
401      content += ' selected="selected"';
402    }
403    content += '>' + monthLabels[i] + '</option>';
404  }
405  content += '</select></td>';
406  content += '<td><input class="form-control" type="text" id="' + dateFieldId + '_yearInput" size="5" value="' + date.getFullYear() + '" onchange="return cal_updateCalendar(\'' + dateFieldId + '\', \'' + dateDivId + '\');" /></td></tr>';
407  content += '<tr><td colspan="3">';
408  content += '<table width="100%">';
409  content += '<tr>';
410  j = weekStart;
411  for (i = 0; i < 7; i++) {
412    content += '<td ';
413    content += 'class="descriptionbox"';
414    content += '>';
415    content += daysOfWeek[j];
416    content += '</td>';
417    j++;
418    if (j > 6) {
419      j = 0;
420    }
421  }
422  content += '</tr>';
423
424  var tdate = new Date(date.getFullYear(), date.getMonth(), 1);
425  var day = tdate.getDay();
426  day = day - weekStart;
427  var daymilli = 1000 * 60 * 60 * 24;
428  tdate = tdate.getTime() - (day * daymilli) + (daymilli / 2);
429  tdate = new Date(tdate);
430
431  for (j = 0; j < 6; j++) {
432    content += '<tr>';
433    for (i = 0; i < 7; i++) {
434      content += '<td ';
435      if (tdate.getMonth() === date.getMonth()) {
436        if (tdate.getDate() === date.getDate()) {
437          content += 'class="descriptionbox"';
438        } else {
439          content += 'class="optionbox"';
440        }
441      } else {
442        content += 'style="background-color:#EAEAEA; border: solid #AAAAAA 1px;"';
443      }
444      content += '><a href="#" onclick="return cal_dateClicked(\'' + dateFieldId + '\', \'' + dateDivId + '\', ' + tdate.getFullYear() + ', ' + tdate.getMonth() + ', ' + tdate.getDate() + ');">';
445      content += tdate.getDate();
446      content += '</a></td>';
447      var datemilli = tdate.getTime() + daymilli;
448      tdate = new Date(datemilli);
449    }
450    content += '</tr>';
451  }
452  content += '</table>';
453  content += '</td></tr>';
454  content += '</table>';
455
456  return content;
457}
458
459/**
460 * @param {string} dateFieldId
461 * @param {number} year
462 * @param {number} month
463 * @param {number} day
464 * @returns {boolean}
465 */
466function cal_setDateField (dateFieldId, year, month, day) {
467  var dateField = document.getElementById(dateFieldId);
468  if (!dateField) {
469    return false;
470  }
471  if (day < 10) {
472    day = '0' + day;
473  }
474  dateField.value = day + ' ' + monthShort[month + 1] + ' ' + year;
475  return false;
476}
477
478/**
479 * @param {string} dateFieldId
480 * @param {string} dateDivId
481 * @returns {boolean}
482 */
483function cal_updateCalendar (dateFieldId, dateDivId) {
484  var dateSel = document.getElementById(dateFieldId + '_daySelect');
485  if (!dateSel) {
486    return false;
487  }
488  var monthSel = document.getElementById(dateFieldId + '_monSelect');
489  if (!monthSel) {
490    return false;
491  }
492  var yearInput = document.getElementById(dateFieldId + '_yearInput');
493  if (!yearInput) {
494    return false;
495  }
496
497  var month = parseInt(monthSel.options[monthSel.selectedIndex].value, 10);
498  month = month - 1;
499
500  var date = new Date(yearInput.value, month, dateSel.options[dateSel.selectedIndex].value);
501  cal_setDateField(dateFieldId, date.getFullYear(), date.getMonth(), date.getDate());
502
503  var dateDiv = document.getElementById(dateDivId);
504  if (!dateDiv) {
505    alert('no dateDiv ' + dateDivId);
506    return false;
507  }
508  dateDiv.innerHTML = cal_generateSelectorContent(dateFieldId, dateDivId, date);
509
510  return false;
511}
512
513/**
514 * @param {string} dateFieldId
515 * @param {string} dateDivId
516 * @param {number} year
517 * @param {number} month
518 * @param {number} day
519 * @returns {boolean}
520 */
521function cal_dateClicked (dateFieldId, dateDivId, year, month, day) {
522  cal_setDateField(dateFieldId, year, month, day);
523  calendarWidget(dateDivId, dateFieldId);
524  return false;
525}
526
527/**
528 * @param {string} id
529 */
530function openerpasteid (id) {
531  if (window.opener.paste_id) {
532    window.opener.paste_id(id);
533  }
534  window.close();
535}
536
537/**
538 * @param {string} value
539 */
540function paste_id (value) {
541  pastefield.value = value;
542}
543
544/**
545 * @param {string} name
546 */
547function pastename (name) {
548  if (nameElement) {
549    nameElement.innerHTML = name;
550  }
551  if (remElement) {
552    remElement.style.display = 'block';
553  }
554}
555
556/**
557 * @param {string} value
558 */
559function paste_char (value) {
560  if (document.selection) {
561    // IE
562    pastefield.focus();
563    document.selection.createRange().text = value;
564  } else if (pastefield.selectionStart || pastefield.selectionStart === 0) {
565    // Mozilla/Chrome/Safari
566    pastefield.value =
567        pastefield.value.substring(0, pastefield.selectionStart) +
568        value +
569        pastefield.value.substring(pastefield.selectionEnd, pastefield.value.length);
570    pastefield.selectionStart = pastefield.selectionEnd = pastefield.selectionStart + value.length;
571  } else {
572    // Fallback? - just append
573    pastefield.value += value;
574  }
575
576  if (pastefield.id === 'NPFX' || pastefield.id === 'GIVN' || pastefield.id === 'SPFX' || pastefield.id === 'SURN' || pastefield.id === 'NSFX') {
577    updatewholename();
578  }
579}
580
581/**
582 * Persistant checkbox options to hide/show extra data.
583 * @param element_id
584 */
585function persistent_toggle (element_id) {
586  const element = document.getElementById(element_id);
587  const key = 'state-of-' + element_id;
588  const state = localStorage.getItem(key);
589
590  // Previously selected?
591  if (state === 'true') {
592    $(element).click();
593  }
594
595  // Remember state for the next page load.
596  $(element).on('change', function () { localStorage.setItem(key, element.checked); });
597}
598
599/**
600 * @param {string} field
601 * @param {string} pos
602 * @param {string} neg
603 */
604function valid_lati_long (field, pos, neg) {
605  // valid LATI or LONG according to Gedcom standard
606  // pos (+) : N or E
607  // neg (-) : S or W
608  var txt = field.value.toUpperCase();
609  txt = txt.replace(/(^\s*)|(\s*$)/g, ''); // trim
610  txt = txt.replace(/ /g, ':'); // N12 34 ==> N12.34
611  txt = txt.replace(/\+/g, ''); // +17.1234 ==> 17.1234
612  txt = txt.replace(/-/g, neg); // -0.5698 ==> W0.5698
613  txt = txt.replace(/,/g, '.'); // 0,5698 ==> 0.5698
614  // 0°34'11 ==> 0:34:11
615  txt = txt.replace(/\u00b0/g, ':'); // °
616  txt = txt.replace(/\u0027/g, ':'); // '
617  // 0:34:11.2W ==> W0.5698
618  txt = txt.replace(/^([0-9]+):([0-9]+):([0-9.]+)(.*)/g, function ($0, $1, $2, $3, $4) {
619    var n = parseFloat($1);
620    n += ($2 / 60);
621    n += ($3 / 3600);
622    n = Math.round(n * 1E4) / 1E4;
623    return $4 + n;
624  });
625  // 0:34W ==> W0.5667
626  txt = txt.replace(/^([0-9]+):([0-9]+)(.*)/g, function ($0, $1, $2, $3) {
627    var n = parseFloat($1);
628    n += ($2 / 60);
629    n = Math.round(n * 1E4) / 1E4;
630    return $3 + n;
631  });
632  // 0.5698W ==> W0.5698
633  txt = txt.replace(/(.*)([N|S|E|W]+)$/g, '$2$1');
634  // 17.1234 ==> N17.1234
635  if (txt && txt.charAt(0) !== neg && txt.charAt(0) !== pos) {
636    txt = pos + txt;
637  }
638  field.value = txt;
639}
640
641/**
642 * Initialize autocomplete elements.
643 * @param {string} selector
644 */
645function autocomplete (selector) {
646  // Use typeahead/bloodhound for autocomplete
647  $(selector).each(function () {
648    const that = this;
649    $(this).typeahead(null, {
650      display: 'value',
651      limit: 0,
652      source: new Bloodhound({
653        datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'),
654        queryTokenizer: Bloodhound.tokenizers.whitespace,
655        remote: {
656          url: this.dataset.autocompleteUrl,
657          replace: function (url, uriEncodedQuery) {
658            if (that.dataset.autocompleteExtra) {
659              const extra = $(document.querySelector(that.dataset.autocompleteExtra)).val();
660              return url.replace('QUERY', uriEncodedQuery) + '&extra=' + encodeURIComponent(extra);
661            }
662            return url.replace('QUERY', uriEncodedQuery);
663          },
664          wildcard: 'QUERY'
665
666        }
667      })
668    });
669  });
670}
671
672/**
673 * Insert text at the current cursor position in an input field.
674 * @param {Element} e The input element.
675 * @param {string} t The text to insert.
676 */
677function insertTextAtCursor (e, t) {
678  var scrollTop = e.scrollTop;
679  var selectionStart = e.selectionStart;
680  var prefix = e.value.substring(0, selectionStart);
681  var suffix = e.value.substring(e.selectionEnd, e.value.length);
682  e.value = prefix + t + suffix;
683  e.selectionStart = selectionStart + t.length;
684  e.selectionEnd = e.selectionStart;
685  e.focus();
686  e.scrollTop = scrollTop;
687}
688
689// Send the CSRF token on all AJAX requests
690$.ajaxSetup({
691  headers: {
692    'X-CSRF-TOKEN': $('meta[name=csrf]').attr('content')
693  }
694});
695
696/**
697 * Initialisation
698 */
699$(function () {
700  // Page elements that load automaticaly via AJAX.
701  // This prevents bad robots from crawling resource-intensive pages.
702  $('[data-ajax-url]').each(function () {
703    $(this).load($(this).data('ajaxUrl'));
704  });
705
706  /**
707   * Select2 - format entries in the select list
708   * @param {Object} data
709   * @returns {string}
710   */
711  function templateOptionForSelect2 (data) {
712    // This could be a "waiting..." message (data.loading is true) or a response from the server.
713    // Both are already HTML, so no need to reformat it.
714    return data.text;
715  }
716
717  // Autocomplete
718  autocomplete('input[data-autocomplete-url]');
719
720  // Select2 - activate autocomplete fields
721  const lang = document.documentElement.lang;
722  const select2_languages = {
723    'zh-Hans': 'zh-CN',
724    'zh-Hant': 'zh-TW'
725  };
726  $('select.select2').select2({
727    language: select2_languages[lang] || lang,
728    // Needed for elements that are initially hidden.
729    width: '100%',
730    // Do not escape - we do it on the server.
731    escapeMarkup: function (x) {
732      return x;
733    }
734  });
735
736  // If we clear the select (using the "X" button), we need an empty value
737  // (rather than no value at all) for (non-multiple) selects with name="array[]"
738  $('select.select2:not([multiple])')
739    .on('select2:unselect', function (evt) {
740      $(evt.delegateTarget).html('<option value="" selected></option>');
741    });
742
743  // Datatables - locale aware sorting
744  $.fn.dataTableExt.oSort['text-asc'] = function (x, y) {
745    return x.localeCompare(y, document.documentElement.lang, { sensitivity: 'base' });
746  };
747  $.fn.dataTableExt.oSort['text-desc'] = function (x, y) {
748    return y.localeCompare(x, document.documentElement.lang, { sensitivity: 'base' });
749  };
750
751  // DataTables - start hidden to prevent FOUC.
752  $('table.datatables').each(function () {
753    $(this).DataTable();
754    $(this).removeClass('d-none');
755  });
756
757  // Save button state between pages
758  document.querySelectorAll('[data-toggle=button][data-persist]').forEach((element) => {
759    // Previously selected?
760    if (localStorage.getItem('state-of-' + element.dataset.persist) === 'T') {
761      element.click();
762    }
763    // Save state on change
764    element.addEventListener('click', (event) => {
765      // Event occurs *before* the state changes, so reverse T/F.
766      localStorage.setItem('state-of-' + event.target.dataset.persist, event.target.classList.contains('active') ? 'F' : 'T');
767    });
768  });
769
770  // Activate the on-screen keyboard
771  var osk_focus_element;
772  $('.wt-osk-trigger').click(function () {
773    // When a user clicks the icon, set focus to the corresponding input
774    osk_focus_element = document.getElementById($(this).data('id'));
775    osk_focus_element.focus();
776    $('.wt-osk').show();
777  });
778  $('.wt-osk-script-button').change(function () {
779    $('.wt-osk-script').prop('hidden', true);
780    $('.wt-osk-script-' + $(this).data('script')).prop('hidden', false);
781  });
782  $('.wt-osk-shift-button').click(function () {
783    document.querySelector('.wt-osk-keys').classList.toggle('shifted');
784  });
785  $('.wt-osk-keys').on('click', '.wt-osk-key', function () {
786    var key = $(this).contents().get(0).nodeValue;
787    var shift_state = $('.wt-osk-shift-button').hasClass('active');
788    var shift_key = $('sup', this)[0];
789    if (shift_state && shift_key !== undefined) {
790      key = shift_key.innerText;
791    }
792    webtrees.pasteAtCursor(osk_focus_element, key);
793    if ($('.wt-osk-pin-button').hasClass('active') === false) {
794      $('.wt-osk').hide();
795    }
796  });
797
798  $('.wt-osk-close').on('click', function () {
799    $('.wt-osk').hide();
800  });
801});
802
803// Convert data-confirm and data-post-url attributes into useful behavior.
804document.addEventListener('click', (event) => {
805  const target = event.target.closest('a');
806
807  if (target === null) {
808    return;
809  }
810
811  if ('confirm' in target.dataset && !confirm(target.dataset.confirm)) {
812    event.preventDefault();
813    return;
814  }
815
816  if ('postUrl' in target.dataset) {
817    const request = new XMLHttpRequest();
818    const token = document.querySelector('meta[name=csrf]').content;
819    request.open('POST', target.dataset.postUrl, true);
820    request.setRequestHeader('X-CSRF-TOKEN', token);
821    request.onreadystatechange = () => {
822      if (request.readyState === request.DONE) {
823        document.location.reload();
824      }
825    };
826    request.send();
827    event.preventDefault();
828  }
829});
830