1/** 2 * webtrees: online genealogy 3 * Copyright (C) 2020 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(/,/g, separator)); 93 spfx = trim(spfx); 94 surn = inflectSurname(trim(surn.replace(/,/g, 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 116 /** 117 * @param {Element} datefield 118 * @param {string} dmy 119 */ 120 webtrees.reformatDate = function (datefield, dmy) { 121 const months = ['JAN', 'FEB', 'MAR', 'APR', 'MAY', 'JUN', 'JUL', 'AUG', 'SEP', 'OCT', 'NOV', 'DEC']; 122 const hijri_months = ['MUHAR', 'SAFAR', 'RABIA', 'RABIT', 'JUMAA', 'JUMAT', 'RAJAB', 'SHAAB', 'RAMAD', 'SHAWW', 'DHUAQ', 'DHUAH']; 123 const hebrew_months = ['TSH', 'CSH', 'KSL', 'TVT', 'SHV', 'ADR', 'ADS', 'NSN', 'IYR', 'SVN', 'TMZ', 'AAV', 'ELL']; 124 const french_months = ['VEND', 'BRUM', 'FRIM', 'NIVO', 'PLUV', 'VENT', 'GERM', 'FLOR', 'PRAI', 'MESS', 'THER', 'FRUC', 'COMP']; 125 const jalali_months = ['FARVA', 'ORDIB', 'KHORD', 'TIR', 'MORDA', 'SHAHR', 'MEHR', 'ABAN', 'AZAR', 'DEY', 'BAHMA', 'ESFAN']; 126 127 let datestr = datefield.value; 128 // if a date has a date phrase marked by () this has to be excluded from altering 129 let datearr = datestr.split('('); 130 let datephrase = ''; 131 if (datearr.length > 1) { 132 datestr = datearr[0]; 133 datephrase = datearr[1]; 134 } 135 136 // Gedcom dates are upper case 137 datestr = datestr.toUpperCase(); 138 // Gedcom dates have no leading/trailing/repeated whitespace 139 datestr = datestr.replace(/\s+/g, ' '); 140 datestr = datestr.replace(/(^\s)|(\s$)/, ''); 141 // Gedcom dates have spaces between letters and digits, e.g. "01JAN2000" => "01 JAN 2000" 142 datestr = datestr.replace(/(\d)([A-Z])/g, '$1 $2'); 143 datestr = datestr.replace(/([A-Z])(\d)/g, '$1 $2'); 144 145 // Shortcut for quarter format, "Q1 1900" => "BET JAN 1900 AND MAR 1900". 146 if (datestr.match(/^Q ([1-4]) (\d\d\d\d)$/)) { 147 datestr = 'BET ' + months[RegExp.$1 * 3 - 3] + ' ' + RegExp.$2 + ' AND ' + months[RegExp.$1 * 3 - 1] + ' ' + RegExp.$2; 148 } 149 150 // Shortcut for @#Dxxxxx@ 01 01 1400, etc. 151 if (datestr.match(/^(@#DHIJRI@|HIJRI)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) { 152 datestr = '@#DHIJRI@' + RegExp.$2 + hijri_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4; 153 } 154 if (datestr.match(/^(@#DJALALI@|JALALI)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) { 155 datestr = '@#DJALALI@' + RegExp.$2 + jalali_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4; 156 } 157 if (datestr.match(/^(@#DHEBREW@|HEBREW)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) { 158 datestr = '@#DHEBREW@' + RegExp.$2 + hebrew_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4; 159 } 160 if (datestr.match(/^(@#DFRENCH R@|FRENCH)( \d?\d )(\d?\d)( \d?\d?\d?\d)$/)) { 161 datestr = '@#DFRENCH R@' + RegExp.$2 + french_months[parseInt(RegExp.$3, 10) - 1] + RegExp.$4; 162 } 163 164 // All digit dates 165 datestr = datestr.replace(/(\d\d)(\d\d)(\d\d)(\d\d)/g, function () { 166 if (RegExp.$1 > '12' && RegExp.$3 <= '12' && RegExp.$4 <= '31') { 167 return RegExp.$4 + ' ' + months[RegExp.$3 - 1] + ' ' + RegExp.$1 + RegExp.$2; 168 } 169 if (RegExp.$1 <= '31' && RegExp.$2 <= '12' && RegExp.$3 > '12') { 170 return RegExp.$1 + ' ' + months[RegExp.$2 - 1] + ' ' + RegExp.$3 + RegExp.$4; 171 } 172 return RegExp.$1 + RegExp.$2 + RegExp.$3 + RegExp.$4; 173 }); 174 175 // e.g. 17.11.1860, 2 4 1987, 3/4/2005, 1999-12-31. Use locale settings since DMY order is ambiguous. 176 datestr = datestr.replace(/(\d+)([ ./-])(\d+)(\2)(\d+)/g, function () { 177 let f1 = parseInt(RegExp.$1, 10); 178 let f2 = parseInt(RegExp.$3, 10); 179 let f3 = parseInt(RegExp.$5, 10); 180 let yyyy = new Date().getFullYear(); 181 let yy = yyyy % 100; 182 let cc = yyyy - yy; 183 if ((dmy === 'DMY' || f1 > 13 && f3 > 31) && f1 <= 31 && f2 <= 12) { 184 return f1 + ' ' + months[f2 - 1] + ' ' + (f3 >= 100 ? f3 : (f3 <= yy ? f3 + cc : f3 + cc - 100)); 185 } 186 if ((dmy === 'MDY' || f2 > 13 && f3 > 31) && f1 <= 12 && f2 <= 31) { 187 return f2 + ' ' + months[f1 - 1] + ' ' + (f3 >= 100 ? f3 : (f3 <= yy ? f3 + cc : f3 + cc - 100)); 188 } 189 if ((dmy === 'YMD' || f1 > 31) && f2 <= 12 && f3 <= 31) { 190 return f3 + ' ' + months[f2 - 1] + ' ' + (f1 >= 100 ? f1 : (f1 <= yy ? f1 + cc : f1 + cc - 100)); 191 } 192 return RegExp.$1 + RegExp.$2 + RegExp.$3 + RegExp.$4 + RegExp.$5; 193 }); 194 195 datestr = datestr 196 // Shortcuts for date ranges 197 .replace(/^[>]([\w ]+)$/, 'AFT $1') 198 .replace(/^[<]([\w ]+)$/, 'BEF $1') 199 .replace(/^([\w ]+)[-]$/, 'FROM $1') 200 .replace(/^[-]([\w ]+)$/, 'TO $1') 201 .replace(/^[~]([\w ]+)$/, 'ABT $1') 202 .replace(/^[*]([\w ]+)$/, 'EST $1') 203 .replace(/^[#]([\w ]+)$/, 'CAL $1') 204 .replace(/^([\w ]+) ?- ?([\w ]+)$/, 'BET $1 AND $2') 205 .replace(/^([\w ]+) ?~ ?([\w ]+)$/, 'FROM $1 TO $2') 206 // Convert full months to short months 207 .replace(/JANUARY/g, 'JAN') 208 .replace(/FEBRUARY/g, 'FEB') 209 .replace(/MARCH/g, 'MAR') 210 .replace(/APRIL/g, 'APR') 211 .replace(/JUNE/g, 'JUN') 212 .replace(/JULY/g, 'JUL') 213 .replace(/AUGUST/g, 'AUG') 214 .replace(/SEPTEMBER/g, 'SEP') 215 .replace(/OCTOBER/, 'OCT') 216 .replace(/NOVEMBER/g, 'NOV') 217 .replace(/DECEMBER/g, 'DEC') 218 // Americans enter dates as SEP 20, 1999 219 .replace(/(JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC)\.? (\d\d?)[, ]+(\d\d\d\d)/g, '$2 $1 $3') 220 // Apply leading zero to day numbers 221 .replace(/(^| )(\d [A-Z]{3,5} \d{4})/g, '$10$2'); 222 223 if (datephrase) { 224 datestr = datestr + ' (' + datephrase; 225 } 226 227 // Only update it if is has been corrected - otherwise input focus 228 // moves to the end of the field unnecessarily 229 if (datefield.value !== datestr) { 230 datefield.value = datestr; 231 } 232 }; 233 234 let monthLabels = []; 235 monthLabels[1] = 'January'; 236 monthLabels[2] = 'February'; 237 monthLabels[3] = 'March'; 238 monthLabels[4] = 'April'; 239 monthLabels[5] = 'May'; 240 monthLabels[6] = 'June'; 241 monthLabels[7] = 'July'; 242 monthLabels[8] = 'August'; 243 monthLabels[9] = 'September'; 244 monthLabels[10] = 'October'; 245 monthLabels[11] = 'November'; 246 monthLabels[12] = 'December'; 247 248 let monthShort = []; 249 monthShort[1] = 'JAN'; 250 monthShort[2] = 'FEB'; 251 monthShort[3] = 'MAR'; 252 monthShort[4] = 'APR'; 253 monthShort[5] = 'MAY'; 254 monthShort[6] = 'JUN'; 255 monthShort[7] = 'JUL'; 256 monthShort[8] = 'AUG'; 257 monthShort[9] = 'SEP'; 258 monthShort[10] = 'OCT'; 259 monthShort[11] = 'NOV'; 260 monthShort[12] = 'DEC'; 261 262 let daysOfWeek = []; 263 daysOfWeek[0] = 'S'; 264 daysOfWeek[1] = 'M'; 265 daysOfWeek[2] = 'T'; 266 daysOfWeek[3] = 'W'; 267 daysOfWeek[4] = 'T'; 268 daysOfWeek[5] = 'F'; 269 daysOfWeek[6] = 'S'; 270 271 let weekStart = 0; 272 273 /** 274 * @param {string} jan 275 * @param {string} feb 276 * @param {string} mar 277 * @param {string} apr 278 * @param {string} may 279 * @param {string} jun 280 * @param {string} jul 281 * @param {string} aug 282 * @param {string} sep 283 * @param {string} oct 284 * @param {string} nov 285 * @param {string} dec 286 * @param {string} sun 287 * @param {string} mon 288 * @param {string} tue 289 * @param {string} wed 290 * @param {string} thu 291 * @param {string} fri 292 * @param {string} sat 293 * @param {number} day 294 */ 295 webtrees.calLocalize = function (jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec, sun, mon, tue, wed, thu, fri, sat, day) { 296 monthLabels[1] = jan; 297 monthLabels[2] = feb; 298 monthLabels[3] = mar; 299 monthLabels[4] = apr; 300 monthLabels[5] = may; 301 monthLabels[6] = jun; 302 monthLabels[7] = jul; 303 monthLabels[8] = aug; 304 monthLabels[9] = sep; 305 monthLabels[10] = oct; 306 monthLabels[11] = nov; 307 monthLabels[12] = dec; 308 daysOfWeek[0] = sun; 309 daysOfWeek[1] = mon; 310 daysOfWeek[2] = tue; 311 daysOfWeek[3] = wed; 312 daysOfWeek[4] = thu; 313 daysOfWeek[5] = fri; 314 daysOfWeek[6] = sat; 315 316 if (day >= 0 && day < 7) { 317 weekStart = day; 318 } 319 }; 320 321 /** 322 * @param {string} dateDivId 323 * @param {string} dateFieldId 324 * @returns {boolean} 325 */ 326 webtrees.calendarWidget = function (dateDivId, dateFieldId) { 327 let dateDiv = document.getElementById(dateDivId); 328 let dateField = document.getElementById(dateFieldId); 329 330 if (dateDiv.style.visibility === 'visible') { 331 dateDiv.style.visibility = 'hidden'; 332 return false; 333 } 334 if (dateDiv.style.visibility === 'show') { 335 dateDiv.style.visibility = 'hide'; 336 return false; 337 } 338 339 /* Javascript calendar functions only work with precise gregorian dates "D M Y" or "Y" */ 340 let greg_regex = /(?:(\d*) ?(JAN|FEB|MAR|APR|MAY|JUN|JUL|AUG|SEP|OCT|NOV|DEC) )?(\d+)/i; 341 let date; 342 if (greg_regex.exec(dateField.value)) { 343 let day = RegExp.$1 || '1'; 344 let month = RegExp.$2 || 'JAN' 345 let year = RegExp.$3; 346 date = new Date(day + ' ' + month + ' ' + year); 347 } else { 348 date = new Date(); 349 } 350 351 dateDiv.innerHTML = calGenerateSelectorContent(dateFieldId, dateDivId, date); 352 if (dateDiv.style.visibility === 'hidden') { 353 dateDiv.style.visibility = 'visible'; 354 return false; 355 } 356 if (dateDiv.style.visibility === 'hide') { 357 dateDiv.style.visibility = 'show'; 358 return false; 359 } 360 361 return false; 362 }; 363 364 /** 365 * @param {string} dateFieldId 366 * @param {string} dateDivId 367 * @param {Date} date 368 * @returns {string} 369 */ 370 function calGenerateSelectorContent (dateFieldId, dateDivId, date) { 371 let i, j; 372 let content = '<table border="1"><tr>'; 373 content += '<td><select class="form-control" id="' + dateFieldId + '_daySelect" onchange="return webtrees.calUpdateCalendar(\'' + dateFieldId + '\', \'' + dateDivId + '\');">'; 374 for (i = 1; i < 32; i++) { 375 content += '<option value="' + i + '"'; 376 if (date.getDate() === i) { 377 content += ' selected="selected"'; 378 } 379 content += '>' + i + '</option>'; 380 } 381 content += '</select></td>'; 382 content += '<td><select class="form-control" id="' + dateFieldId + '_monSelect" onchange="return webtrees.calUpdateCalendar(\'' + dateFieldId + '\', \'' + dateDivId + '\');">'; 383 for (i = 1; i < 13; i++) { 384 content += '<option value="' + i + '"'; 385 if (date.getMonth() + 1 === i) { 386 content += ' selected="selected"'; 387 } 388 content += '>' + monthLabels[i] + '</option>'; 389 } 390 content += '</select></td>'; 391 content += '<td><input class="form-control" type="text" id="' + dateFieldId + '_yearInput" size="5" value="' + date.getFullYear() + '" onchange="return webtrees.calUpdateCalendar(\'' + dateFieldId + '\', \'' + dateDivId + '\');" /></td></tr>'; 392 content += '<tr><td colspan="3">'; 393 content += '<table width="100%">'; 394 content += '<tr>'; 395 j = weekStart; 396 for (i = 0; i < 7; i++) { 397 content += '<td '; 398 content += 'class="descriptionbox"'; 399 content += '>'; 400 content += daysOfWeek[j]; 401 content += '</td>'; 402 j++; 403 if (j > 6) { 404 j = 0; 405 } 406 } 407 content += '</tr>'; 408 409 let tdate = new Date(date.getFullYear(), date.getMonth(), 1); 410 let day = tdate.getDay(); 411 day = day - weekStart; 412 let daymilli = 1000 * 60 * 60 * 24; 413 tdate = tdate.getTime() - (day * daymilli) + (daymilli / 2); 414 tdate = new Date(tdate); 415 416 for (j = 0; j < 6; j++) { 417 content += '<tr>'; 418 for (i = 0; i < 7; i++) { 419 content += '<td '; 420 if (tdate.getMonth() === date.getMonth()) { 421 if (tdate.getDate() === date.getDate()) { 422 content += 'class="descriptionbox"'; 423 } else { 424 content += 'class="optionbox"'; 425 } 426 } else { 427 content += 'style="background-color:#EAEAEA; border: solid #AAAAAA 1px;"'; 428 } 429 content += '><a href="#" onclick="return webtrees.calDateClicked(\'' + dateFieldId + '\', \'' + dateDivId + '\', ' + tdate.getFullYear() + ', ' + tdate.getMonth() + ', ' + tdate.getDate() + ');">'; 430 content += tdate.getDate(); 431 content += '</a></td>'; 432 let datemilli = tdate.getTime() + daymilli; 433 tdate = new Date(datemilli); 434 } 435 content += '</tr>'; 436 } 437 content += '</table>'; 438 content += '</td></tr>'; 439 content += '</table>'; 440 441 return content; 442 } 443 444 /** 445 * @param {string} dateFieldId 446 * @param {number} year 447 * @param {number} month 448 * @param {number} day 449 * @returns {boolean} 450 */ 451 function calSetDateField (dateFieldId, year, month, day) { 452 let dateField = document.getElementById(dateFieldId); 453 dateField.value = (day < 10 ? '0' : '') + day + ' ' + monthShort[month + 1] + ' ' + year; 454 return false; 455 } 456 457 /** 458 * @param {string} dateFieldId 459 * @param {string} dateDivId 460 * @returns {boolean} 461 */ 462 webtrees.calUpdateCalendar = function (dateFieldId, dateDivId) { 463 let dateSel = document.getElementById(dateFieldId + '_daySelect'); 464 if (!dateSel) { 465 return false; 466 } 467 let monthSel = document.getElementById(dateFieldId + '_monSelect'); 468 if (!monthSel) { 469 return false; 470 } 471 let yearInput = document.getElementById(dateFieldId + '_yearInput'); 472 if (!yearInput) { 473 return false; 474 } 475 476 let month = parseInt(monthSel.options[monthSel.selectedIndex].value, 10); 477 month = month - 1; 478 479 let date = new Date(yearInput.value, month, dateSel.options[dateSel.selectedIndex].value); 480 calSetDateField(dateFieldId, date.getFullYear(), date.getMonth(), date.getDate()); 481 482 let dateDiv = document.getElementById(dateDivId); 483 if (!dateDiv) { 484 alert('no dateDiv ' + dateDivId); 485 return false; 486 } 487 dateDiv.innerHTML = calGenerateSelectorContent(dateFieldId, dateDivId, date); 488 489 return false; 490 }; 491 492 /** 493 * @param {string} dateFieldId 494 * @param {string} dateDivId 495 * @param {number} year 496 * @param {number} month 497 * @param {number} day 498 * @returns {boolean} 499 */ 500 webtrees.calDateClicked = function (dateFieldId, dateDivId, year, month, day) { 501 calSetDateField(dateFieldId, year, month, day); 502 webtrees.calendarWidget(dateDivId, dateFieldId); 503 return false; 504 }; 505 506 /** 507 * Persistent checkbox options to hide/show extra data. 508 * @param {string} element_id 509 */ 510 webtrees.persistentToggle = function (element_id) { 511 const element = document.getElementById(element_id); 512 const key = 'state-of-' + element_id; 513 const state = localStorage.getItem(key); 514 515 if (element instanceof HTMLInputElement && element.type === 'checkbox') { 516 // Previously selected? 517 if (state === 'true') { 518 element.click(); 519 } 520 521 // Remember state for the next page load. 522 element.addEventListener('change', function () { 523 localStorage.setItem(key, element.checked); 524 }); 525 } 526 }; 527 528 /** 529 * @param {Element} field 530 * @param {string} pos 531 * @param {string} neg 532 */ 533 function reformatLatLong (field, pos, neg) { 534 // valid LATI or LONG according to Gedcom standard 535 // pos (+) : N or E 536 // neg (-) : S or W 537 let txt = field.value.toUpperCase(); 538 txt = txt.replace(/(^\s*)|(\s*$)/g, ''); // trim 539 txt = txt.replace(/ /g, ':'); // N12 34 ==> N12.34 540 txt = txt.replace(/\+/g, ''); // +17.1234 ==> 17.1234 541 txt = txt.replace(/-/g, neg); // -0.5698 ==> W0.5698 542 txt = txt.replace(/,/g, '.'); // 0,5698 ==> 0.5698 543 // 0°34'11 ==> 0:34:11 544 txt = txt.replace(/\u00b0/g, ':'); // ° 545 txt = txt.replace(/\u0027/g, ':'); // ' 546 // 0:34:11.2W ==> W0.5698 547 txt = txt.replace(/^([0-9]+):([0-9]+):([0-9.]+)(.*)/g, function ($0, $1, $2, $3, $4) { 548 let n = parseFloat($1); 549 n += ($2 / 60); 550 n += ($3 / 3600); 551 n = Math.round(n * 1E4) / 1E4; 552 return $4 + n; 553 }); 554 // 0:34W ==> W0.5667 555 txt = txt.replace(/^([0-9]+):([0-9]+)(.*)/g, function ($0, $1, $2, $3) { 556 let n = parseFloat($1); 557 n += ($2 / 60); 558 n = Math.round(n * 1E4) / 1E4; 559 return $3 + n; 560 }); 561 // 0.5698W ==> W0.5698 562 txt = txt.replace(/(.*)(NSEW])$/g, '$2$1'); 563 // 17.1234 ==> N17.1234 564 if (txt && txt.charAt(0) !== neg && txt.charAt(0) !== pos) { 565 txt = pos + txt; 566 } 567 field.value = txt; 568 } 569 570 /** 571 * @param {Element} field 572 */ 573 webtrees.reformatLatitude = function (field) { 574 return reformatLatLong(field, 'N', 'S'); 575 }; 576 577 /** 578 * @param {Element} field 579 */ 580 webtrees.reformatLongitude = function (field) { 581 return reformatLatLong(field, 'E', 'W'); 582 }; 583 584 /** 585 * Initialize autocomplete elements. 586 * @param {string} selector 587 */ 588 webtrees.autocomplete = function (selector) { 589 // Use typeahead/bloodhound for autocomplete 590 $(selector).each(function () { 591 const that = this; 592 $(this).typeahead(null, { 593 display: 'value', 594 limit: 10, 595 minLength: 2, 596 source: new Bloodhound({ 597 datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value'), 598 queryTokenizer: Bloodhound.tokenizers.whitespace, 599 remote: { 600 url: this.dataset.autocompleteUrl, 601 replace: function (url, uriEncodedQuery) { 602 const symbol = (url.indexOf("?") > 0) ? '&' : '?'; 603 if (that.dataset.autocompleteExtra === 'SOUR') { 604 let row_group = that.closest('.form-group').previousElementSibling; 605 while (row_group.querySelector('select') === null) { 606 row_group = row_group.previousElementSibling; 607 } 608 const element = row_group.querySelector('select'); 609 const extra = element.options[element.selectedIndex].value.replace(/@/g, ''); 610 return url + symbol + "query=" + uriEncodedQuery + '&extra=' + encodeURIComponent(extra); 611 } 612 return url + symbol + "query=" + uriEncodedQuery 613 } 614 } 615 }) 616 }); 617 }); 618 }; 619 620 /** 621 * Create a LeafletJS map from a list of providers/layers. 622 * @param {string} id 623 * @param {object} config 624 * @returns Map 625 */ 626 webtrees.buildLeafletJsMap = function (id, config) { 627 const zoomControl = new L.control.zoom({ 628 zoomInTitle: config.i18n.zoomIn, 629 zoomoutTitle: config.i18n.zoomOut, 630 }); 631 632 let defaultLayer = null; 633 634 for (let [, provider] of Object.entries(config.mapProviders)) { 635 for (let [, child] of Object.entries(provider.children)) { 636 if ('bingMapsKey' in child) { 637 child.layer = L.tileLayer.bing(child); 638 } else { 639 child.layer = L.tileLayer(child.url, child); 640 } 641 if (provider.default && child.default) { 642 defaultLayer = child.layer; 643 } 644 } 645 } 646 647 if (defaultLayer === null) { 648 console.log('No default map layer defined - using the first one.'); 649 let defaultLayer = config.mapProviders[0].children[0].layer; 650 } 651 652 653 // Create the map with all controls and layers 654 return L.map(id, { 655 zoomControl: false, 656 }) 657 .addControl(zoomControl) 658 .addLayer(defaultLayer) 659 .addControl(L.control.layers.tree(config.mapProviders, null, { 660 closedSymbol: config.icons.expand, 661 openedSymbol: config.icons.collapse, 662 })); 663 664 }; 665}(window.webtrees = window.webtrees || {})); 666 667// Send the CSRF token on all AJAX requests 668$.ajaxSetup({ 669 headers: { 670 'X-CSRF-TOKEN': $('meta[name=csrf]').attr('content') 671 } 672}); 673 674/** 675 * Initialisation 676 */ 677$(function () { 678 // Page elements that load automatically via AJAX. 679 // This prevents bad robots from crawling resource-intensive pages. 680 $('[data-ajax-url]').each(function () { 681 $(this).load($(this).data('ajaxUrl')); 682 }); 683 684 // Autocomplete 685 webtrees.autocomplete('input[data-autocomplete-url]'); 686 687 // Select2 - activate autocomplete fields 688 const lang = document.documentElement.lang; 689 const select2_languages = { 690 'zh-Hans': 'zh-CN', 691 'zh-Hant': 'zh-TW' 692 }; 693 $('select.select2').select2({ 694 language: select2_languages[lang] || lang, 695 // Needed for elements that are initially hidden. 696 width: '100%', 697 // Do not escape - we do it on the server. 698 escapeMarkup: function (x) { 699 return x; 700 } 701 }); 702 703 // If we clear the select (using the "X" button), we need an empty value 704 // (rather than no value at all) for (non-multiple) selects with name="array[]" 705 $('select.select2:not([multiple])') 706 .on('select2:unselect', function (evt) { 707 $(evt.delegateTarget).html('<option value="" selected></option>'); 708 }); 709 710 // Datatables - locale aware sorting 711 $.fn.dataTableExt.oSort['text-asc'] = function (x, y) { 712 return x.localeCompare(y, document.documentElement.lang, { sensitivity: 'base' }); 713 }; 714 $.fn.dataTableExt.oSort['text-desc'] = function (x, y) { 715 return y.localeCompare(x, document.documentElement.lang, { sensitivity: 'base' }); 716 }; 717 718 // DataTables - start hidden to prevent FOUC. 719 $('table.datatables').each(function () { 720 $(this).DataTable(); 721 $(this).removeClass('d-none'); 722 }); 723 724 // Save button state between pages 725 document.querySelectorAll('[data-toggle=button][data-persist]').forEach((element) => { 726 // Previously selected? 727 if (localStorage.getItem('state-of-' + element.dataset.persist) === 'T') { 728 element.click(); 729 } 730 // Save state on change 731 element.addEventListener('click', (event) => { 732 // Event occurs *before* the state changes, so reverse T/F. 733 localStorage.setItem('state-of-' + event.target.dataset.persist, event.target.classList.contains('active') ? 'F' : 'T'); 734 }); 735 }); 736 737 // Activate the on-screen keyboard 738 let osk_focus_element; 739 $('.wt-osk-trigger').click(function () { 740 // When a user clicks the icon, set focus to the corresponding input 741 osk_focus_element = document.getElementById($(this).data('id')); 742 osk_focus_element.focus(); 743 $('.wt-osk').show(); 744 }); 745 $('.wt-osk-script-button').change(function () { 746 $('.wt-osk-script').prop('hidden', true); 747 $('.wt-osk-script-' + $(this).data('script')).prop('hidden', false); 748 }); 749 $('.wt-osk-shift-button').click(function () { 750 document.querySelector('.wt-osk-keys').classList.toggle('shifted'); 751 }); 752 $('.wt-osk-keys').on('click', '.wt-osk-key', function () { 753 let key = $(this).contents().get(0).nodeValue; 754 let shift_state = $('.wt-osk-shift-button').hasClass('active'); 755 let shift_key = $('sup', this)[0]; 756 if (shift_state && shift_key !== undefined) { 757 key = shift_key.innerText; 758 } 759 webtrees.pasteAtCursor(osk_focus_element, key); 760 if ($('.wt-osk-pin-button').hasClass('active') === false) { 761 $('.wt-osk').hide(); 762 } 763 osk_focus_element.dispatchEvent(new Event('input')); 764 }); 765 766 $('.wt-osk-close').on('click', function () { 767 $('.wt-osk').hide(); 768 }); 769 770 // Hide/Show password fields 771 $('input[type=password]').each(function () { 772 $(this).hideShowPassword('infer', true, { 773 states: { 774 shown: { 775 toggle: { 776 content: this.dataset.hideText, 777 attr: { 778 title: this.dataset.hideTitle, 779 'aria-label': this.dataset.hideTitle, 780 } 781 } 782 }, 783 hidden: { 784 toggle: { 785 content: this.dataset.showText, 786 attr: { 787 title: this.dataset.showTitle, 788 'aria-label': this.dataset.showTitle, 789 } 790 } 791 } 792 } 793 }); 794 }); 795}); 796 797// Prevent form re-submission via accidental double-click. 798document.addEventListener('submit', function (event) { 799 const form = event.target; 800 801 if (form.reportValidity()) { 802 form.addEventListener('submit', (event) => { 803 if (form.classList.contains('form-is-submitting')) { 804 event.preventDefault(); 805 } 806 807 form.classList.add('form-is-submitting'); 808 }); 809 } 810}); 811 812// Convert data-confirm and data-post-url attributes into useful behavior. 813document.addEventListener('click', (event) => { 814 const target = event.target.closest('a,button'); 815 816 if (target === null) { 817 return; 818 } 819 820 if ('confirm' in target.dataset && !confirm(target.dataset.confirm)) { 821 event.preventDefault(); 822 return; 823 } 824 825 if ('postUrl' in target.dataset) { 826 const token = document.querySelector('meta[name=csrf]').content; 827 828 fetch(target.dataset.postUrl, { 829 method: 'POST', 830 headers: { 831 'X-CSRF-TOKEN': token, 832 'X-Requested-with': 'XMLHttpRequest', 833 }, 834 }).then(() => { 835 if ('reloadUrl' in target.dataset) { 836 // Go somewhere else. e.g. home page after logout. 837 document.location = target.dataset.reloadUrl; 838 } else { 839 // Reload the current page. e.g. change language. 840 document.location.reload(); 841 } 842 }).catch((error) => { 843 alert(error); 844 }); 845 } 846}); 847