1if (!Element.prototype.matches) { 2 Element.prototype.matches = 3 Element.prototype.msMatchesSelector || 4 Element.prototype.webkitMatchesSelector; 5} 6 7if (!Element.prototype.closest) { 8 Element.prototype.closest = function (s) { 9 var el = this; 10 11 do { 12 if (el.matches(s)) return el; 13 el = el.parentElement || el.parentNode; 14 } while (el !== null && el.nodeType === 1); 15 return null; 16 }; 17} 18 19if (document.fonts && document.body) { 20 document.body.classList.add('rz-icons-loading'); 21 document.fonts.load('16px Material Symbols').then(() => { 22 document.body.classList.remove('rz-icons-loading'); 23 }) 24} 25 26var resolveCallbacks = []; 27var rejectCallbacks = []; 28var radzenRecognition; 29 30window.Radzen = { 31 isRTL: function (el) { 32 return el && getComputedStyle(el).direction == 'rtl'; 33 }, 34 throttle: function (callback, delay) { 35 var timeout = null; 36 return function () { 37 var args = arguments; 38 var ctx = this; 39 if (!timeout) { 40 timeout = setTimeout(function () { 41 callback.apply(ctx, args); 42 timeout = null; 43 }, delay); 44 } 45 }; 46 }, 47 mask: function (id, mask, pattern, characterPattern) { 48 var el = document.getElementById(id); 49 if (el) { 50 var format = function (value, mask, pattern, characterPattern) { 51 var chars = !characterPattern ? value.replace(new RegExp(pattern, "g"), "").split('') : value.match(new RegExp(characterPattern, "g")); 52 var count = 0; 53 54 var formatted = ''; 55 for (var i = 0; i < mask.length; i++) { 56 const c = mask[i]; 57 if (chars && chars[count]) { 58 if (c === '*' || c == chars[count]) { 59 formatted += chars[count]; 60 count++; 61 } else { 62 formatted += c; 63 } 64 } 65 } 66 return formatted; 67 } 68 69 if (window.safari !== undefined) { 70 el.onblur = function (e) { 71 el.dispatchEvent(new Event('change')); 72 }; 73 } 74 75 var start = el.selectionStart != el.value.length ? el.selectionStart : -1; 76 var end = el.selectionEnd != el.value.length ? el.selectionEnd : -1; 77 78 el.value = format(el.value, mask, pattern, characterPattern); 79 80 el.selectionStart = start != -1 ? start : el.selectionStart; 81 el.selectionEnd = end != -1 ? end : el.selectionEnd; 82 } 83 }, 84 addContextMenu: function (id, ref) { 85 var el = document.getElementById(id); 86 if (el) { 87 var handler = function (e) { 88 e.stopPropagation(); 89 e.preventDefault(); 90 ref.invokeMethodAsync('RadzenComponent.RaiseContextMenu', 91 { 92 ClientX: e.clientX, 93 ClientY: e.clientY, 94 ScreenX: e.screenX, 95 ScreenY: e.screenY, 96 AltKey: e.altKey, 97 ShiftKey: e.shiftKey, 98 CtrlKey: e.ctrlKey, 99 MetaKey: e.metaKey, 100 Button: e.button, 101 Buttons: e.buttons, 102 }); 103 return false; 104 }; 105 Radzen[id + 'contextmenu'] = handler; 106 el.addEventListener('contextmenu', handler, false); 107 } 108 }, 109 addMouseEnter: function (id, ref) { 110 var el = document.getElementById(id); 111 if (el) { 112 var handler = function (e) { 113 ref.invokeMethodAsync('RadzenComponent.RaiseMouseEnter'); 114 }; 115 Radzen[id + 'mouseenter'] = handler; 116 el.addEventListener('mouseenter', handler, false); 117 } 118 }, 119 addMouseLeave: function (id, ref) { 120 var el = document.getElementById(id); 121 if (el) { 122 var handler = function (e) { 123 ref.invokeMethodAsync('RadzenComponent.RaiseMouseLeave');; 124 }; 125 Radzen[id + 'mouseleave'] = handler; 126 el.addEventListener('mouseleave', handler, false); 127 } 128 }, 129 removeContextMenu: function (id) { 130 var el = document.getElementById(id); 131 if (el && Radzen[id + 'contextmenu']) { 132 el.removeEventListener('contextmenu', Radzen[id + 'contextmenu']); 133 } 134 }, 135 removeMouseEnter: function (id) { 136 var el = document.getElementById(id); 137 if (el && Radzen[id + 'mouseenter']) { 138 el.removeEventListener('mouseenter', Radzen[id + 'mouseenter']); 139 } 140 }, 141 removeMouseLeave: function (id) { 142 var el = document.getElementById(id); 143 if (el && Radzen[id + 'mouseleave']) { 144 el.removeEventListener('mouseleave', Radzen[id + 'mouseleave']); 145 } 146 }, 147 adjustDataGridHeader: function (scrollableHeader, scrollableBody) { 148 if (scrollableHeader && scrollableBody) { 149 scrollableHeader.style.cssText = 150 scrollableBody.clientHeight < scrollableBody.scrollHeight 151 ? 'margin-left:0px;padding-right: ' + 152 (scrollableBody.offsetWidth - scrollableBody.clientWidth) + 153 'px' 154 : 'margin-left:0px;'; 155 } 156 }, 157 preventDefaultAndStopPropagation: function (e) { 158 e.preventDefault(); 159 e.stopPropagation(); 160 }, 161 preventArrows: function (el) { 162 var preventDefault = function (e) { 163 if (e.keyCode === 38 || e.keyCode === 40) { 164 e.preventDefault(); 165 return false; 166 } 167 }; 168 if (el) { 169 el.addEventListener('keydown', preventDefault, false); 170 } 171 }, 172 selectTab: function (id, index) { 173 var el = document.getElementById(id); 174 if (el && el.parentNode && el.parentNode.previousElementSibling) { 175 var count = el.parentNode.children.length; 176 for (var i = 0; i < count; i++) { 177 var content = el.parentNode.children[i]; 178 if (content) { 179 content.style.display = i == index ? '' : 'none'; 180 } 181 var header = el.parentNode.previousElementSibling.children[i]; 182 if (header) { 183 if (i == index) { 184 header.classList.add('rz-tabview-selected'); 185 header.classList.add('rz-state-focused'); 186 } 187 else { 188 header.classList.remove('rz-tabview-selected'); 189 header.classList.remove('rz-state-focused'); 190 } 191 } 192 } 193 } 194 }, 195 loadGoogleMaps: function (defaultView, apiKey, resolve, reject, language) { 196 resolveCallbacks.push(resolve); 197 rejectCallbacks.push(reject); 198 199 if (defaultView['rz_map_init']) { 200 return; 201 } 202 203 defaultView['rz_map_init'] = function () { 204 for (var i = 0;
204 i < resolveCallbacks.length; i++) { 205 resolveCallbacks[i](defaultView.google); 206 } 207 }; 208 209 var document = defaultView.document; 210 var script = document.createElement('script'); 211 212 script.src = 213 'https://maps.googleapis.com/maps/api/js?' + 214 (language ? 'language=' + language + '&' : '') + 215 (apiKey ? 'key=' + apiKey + '&' : '') + 216 'callback=rz_map_init&libraries=marker'; 217 218 script.async = true; 219 script.defer = true; 220 script.onerror = function (err) { 221 for (var i = 0; i < rejectCallbacks.length; i++) { 222 rejectCallbacks[i](err); 223 } 224 }; 225 226 document.body.appendChild(script); 227 }, 228 createMap: function (wrapper, ref, id, apiKey, mapId, zoom, center, markers, options, fitBoundsToMarkersOnUpdate, language) { 229 var api = function () { 230 var defaultView = document.defaultView; 231 232 return new Promise(function (resolve, reject) { 233 if (defaultView.google && defaultView.google.maps) { 234 return resolve(defaultView.google); 235 } 236 237 Radzen.loadGoogleMaps(defaultView, apiKey, resolve, reject, language); 238 }); 239 }; 240 241 api().then(function (google) { 242 Radzen[id] = ref; 243 Radzen[id].google = google; 244 245 Radzen[id].instance = new google.maps.Map(wrapper, { 246 center: center, 247 zoom: zoom, 248 mapId: mapId 249 }); 250 251 Radzen[id].instance.addListener('click', function (e) { 252 Radzen[id].invokeMethodAsync('RadzenGoogleMap.OnMapClick', { 253 Position: {Lat: e.latLng.lat(), Lng: e.latLng.lng()} 254 }); 255 }); 256 257 Radzen.updateMap(id, apiKey, zoom, center, markers, options, fitBoundsToMarkersOnUpdate, language); 258 }); 259 }, 260 updateMap: function (id, apiKey, zoom, center, markers, options, fitBoundsToMarkersOnUpdate, language) { 261 var api = function () { 262 var defaultView = document.defaultView; 263 264 return new Promise(function (resolve, reject) { 265 if (defaultView.google && defaultView.google.maps) { 266 return resolve(defaultView.google); 267 } 268 269 Radzen.loadGoogleMaps(defaultView, apiKey, resolve, reject, language); 270 }); 271 }; 272 api().then(function (google) { 273 let markerBounds = new google.maps.LatLngBounds(); 274 275 if (Radzen[id] && Radzen[id].instance) { 276 if (Radzen[id].instance.markers && Radzen[id].instance.markers.length) { 277 for (var i = 0; i < Radzen[id].instance.markers.length; i++) { 278 Radzen[id].instance.markers[i].setMap(null); 279 } 280 } 281 282 if (markers) { 283 Radzen[id].instance.markers = []; 284 285 markers.forEach(function (m) { 286 var content; 287 288 if (m.label) { 289 content = document.createElement('span'); 290 content.innerHTML = m.label; 291 } 292 293 var marker = new this.google.maps.marker.AdvancedMarkerElement({ 294 position: m.position, 295 title: m.title, 296 content: content 297 }); 298 299 marker.addListener('click', function (e) { 300 Radzen[id].invokeMethodAsync('RadzenGoogleMap.OnMarkerClick', { 301 Title: marker.title, 302 Label: marker.content.innerText, 303 Position: marker.position 304 }); 305 }); 306 307 marker.setMap(Radzen[id].instance); 308 309 Radzen[id].instance.markers.push(marker); 310 311 markerBounds.extend(marker.position); 312 }); 313 } 314 315 if (zoom) { 316 Radzen[id].instance.setZoom(zoom); 317 } 318 319 if (center) { 320 Radzen[id].instance.setCenter(center); 321 } 322 323 if (options) { 324 Radzen[id].instance.setOptions(options); 325 } 326 327 if (markers && fitBoundsToMarkersOnUpdate) { 328 Radzen[id].instance.fitBounds(markerBounds); 329 } 330 } 331 });
332 }, 333 destroyMap: function (id) { 334 if (Radzen[id].instance) { 335 delete Radzen[id].instance; 336 } 337 }, 338 focusSecurityCode: function (el) { 339 if (!el) return; 340 var firstInput = el.querySelector('.rz-security-code-input'); 341 if (firstInput) { 342 setTimeout(function () { firstInput.focus() }, 500); 343 } 344 }, 345 destroySecurityCode: function (id, el) { 346 if (!Radzen[id]) return; 347 348 var inputs = el.getElementsByTagName('input'); 349 350 if (Radzen[id].keyPress && Radzen[id].paste) { 351 for (var i = 0; i < inputs.length; i++) { 352 inputs[i].removeEventListener('keypress', Radzen[id].keyPress); 353 inputs[i].removeEventListener('keydown', Radzen[id].keyDown); 354 inputs[i].removeEventListener('paste', Radzen[id].paste); 355 } 356 delete Radzen[id].keyPress; 357 delete Radzen[id].paste; 358 } 359 360 Radzen[id] = null; 361 }, 362 createSecurityCode: function (id, ref, el, isNumber) { 363 if (!el || !ref) return; 364 365 var hidden = el.querySelector('input[type="hidden"]'); 366 367 Radzen[id] = {}; 368 369 Radzen[id].inputs = [...el.querySelectorAll('.rz-security-code-input')]; 370 371 Radzen[id].paste = function (e) { 372 if (e.clipboardData) { 373 var value = e.clipboardData.getData('text'); 374 375 if (value) { 376 for (var i = 0; i < value.length; i++) { 377 if (isNumber && isNaN(+value[i])) { 378 continue; 379 } 380 Radzen[id].inputs[i].value = value[i]; 381 } 382 383 var code = Radzen[id].inputs.map(i => i.value).join('').trim(); 384 hidden.value = code; 385 386 ref.invokeMethodAsync('RadzenSecurityCode.OnValueChange', code); 387 388 Radzen[id].inputs[Radzen[id].inputs.length - 1].focus(); 389 } 390 391 e.preventDefault(); 392 } 393 } 394 Radzen[id].keyPress = function (e) { 395 var keyCode = e.data ? e.data.charCodeAt(0) : e.which; 396 var ch = e.data || String.fromCharCode(e.which); 397 398 if (e.metaKey || 399 e.ctrlKey || 400 keyCode == 9 || 401 keyCode == 8 || 402 keyCode == 13 403 ) { 404 return; 405 } 406 407 if (isNumber && (keyCode < 48 || keyCode > 57)) { 408 e.preventDefault(); 409 return; 410 } 411 412 if (e.currentTarget.value == ch) { 413 return; 414 } 415 416 e.currentTarget.value = ch; 417 418 var value = Radzen[id].inputs.map(i => i.value).join('').trim(); 419 hidden.value = value; 420 421 ref.invokeMethodAsync('RadzenSecurityCode.OnValueChange', value); 422 423 var index = Radzen[id].inputs.indexOf(e.currentTarget); 424 if (index < Radzen[id].inputs.length - 1) { 425 Radzen[id].inputs[index + 1].focus(); 426 } 427 } 428 429 Radzen[id].keyDown = function (e) { 430 var keyCode = e.data ? e.data.charCodeAt(0) : e.which; 431 if (keyCode == 8) { 432 e.currentTarget.value = ''; 433 434 var value = Radzen[id].inputs.map(i => i.value).join('').trim(); 435 hidden.value = value; 436 437 ref.invokeMethodAsync('RadzenSecurityCode.OnValueChange', value); 438 439 var index = Radzen[id].inputs.indexOf(e.currentTarget); 440 if (index > 0) { 441 Radzen[id].inputs[index - 1].focus(); 442 } 443 } 444 } 445 446 for (var i = 0; i < Radzen[id].inputs.length; i++) { 447 Radzen[id].inputs[i].addEventListener(navigator.userAgent.match(/Android/i) ? 'textInput' : 'keypress', Radzen[id].keyPress); 448 Radzen[id].inputs[i].addEventListener(navigator.userAgent.match(/Android/i) ? 'textInput' : 'keydown', Radzen[id].keyDown); 449 Radzen[id].inputs[i].addEventListener('paste', Radzen[id].paste); 450 } 451 }, 452 createSlider: function ( 453 id, 454 slider, 455 parent, 456 range, 457 minHandle, 458 maxHandle, 459 min, 460 max, 461 value, 462 step, 463 isVertical 464 ) { 465 Radzen[id] = {}; 466 Radzen[id].mouseMoveHandler = function (e) { 467 e.preventDefault(); 468 469 var handle = slider.isMin ? minHandle : maxHandle; 470 471 if (!slider.canChange) return; 472 473 var offsetX = 474 e.targetTouches && e.targetTouches[0] 475 ? e.targetTouches[0].pageX - e.target.getBoundingClientRect().left 476 : e.pageX - handle.getBoundingClientRect().left; 477 478 var offsetY = 479 e.targetTouches && e.targetTouches[0] 480 ? e.targetTouches[0].pageY - e.target.getBoundingClientRect().top 481 : e.pageY - handle.getBoundingClientRect().top; 482 483 var percent = isVertical ? (parent.offsetHeight - handle.offsetTop - offsetY) / parent.offsetHeight 484 : (Radzen.isRTL(handle) ? parent.offsetWidth - handle.offsetLeft - offsetX : handle.offsetLeft + offsetX) / parent.offsetWidth; 485 486 if (percent > 1) { 487 percent = 1; 488 } else if (percent < 0) { 489 percent = 0; 490 } 491 492 var newValue = percent * (max - min) + min; 493 494 if ( 495 slider.canChange && 496 newValue >= min && 497 newValue <= max 498 ) { 499 slider.invokeMethodAsync( 500 'RadzenSlider.OnValueChange', 501 newValue, 502 !!slider.isMin 503 ); 504 } 505 }; 506 507 Radzen[id].mouseDownHandler = function (e) { 508 if (parent.classList.contains('rz-state-disabled')) return; 509 510 document.addEventListener('mousemove', Radzen[id].mouseMoveHandler); 511 document.addEventListener('touchmove', Radzen[id].mouseMoveHandler, { 512 passive: false, capture: true 513 }); 514 515 document.addEventListener('mouseup', Radzen[id].mouseUpHandler); 516 document.addEventListener('touchend', Radzen[id].mouseUpHandler, { 517 passive: true 518 }); 519 520 if (minHandle == e.target || maxHandle == e.target) { 521 slider.canChange = true; 522 slider.isMin = minHandle == e.target; 523 } else { 524 525 var offsetX = 526 e.targetTouches && e.targetTouches[0] 527 ? e.targetTouches[0].pageX - e.target.getBoundingClientRect().left 528 : e.offsetX; 529 530 var percent = offsetX / parent.offsetWidth; 531 532 var newValue = percent * (max - min) + min; 533 var oldValue = range ? value[slider.isMin ? 0 : 1] : value; 534 if (newValue >= min && newValue <= max && newValue != oldValue) { 535 slider.invokeMethodAsync( 536 'RadzenSlider.OnValueChange', 537 newValue, 538 !!slider.isMin 539 ); 540 } 541 } 542 }; 543 544 Radzen[id].mouseUpHandler = function (e) { 545 slider.canChange = false; 546 document.removeEventListener('mousemove', Radzen[id].mouseMoveHandler); 547 document.removeEventListener('touchmove', Radzen[id].mouseMoveHandler, { 548 passive: false, capture: true 549 }); 550 document.removeEventListener('mouseup', Radzen[id].mouseUpHandler); 551 document.removeEventListener('touchend', Radzen[id].mouseUpHandler, { 552 passive: true 553 }); 554 }; 555 556 parent.addEventListener('mousedown', Radzen[id].mouseDownHandler); 557 parent.addEventListener('touchstart', Radzen[id].mouseDownHandler, { 558 passive: true 559 });
560 }, 561 destroySlider: function (id, parent) { 562 if (!Radzen[id]) return; 563 564 if (Radzen[id].mouseMoveHandler) { 565 document.removeEventListener('mousemove', Radzen[id].mouseMoveHandler); 566 document.removeEventListener('touchmove', Radzen[id].mouseMoveHandler); 567 delete Radzen[id].mouseMoveHandler; 568 } 569 if (Radzen[id].mouseUpHandler) { 570 document.removeEventListener('mouseup', Radzen[id].mouseUpHandler); 571 document.removeEventListener('touchend', Radzen[id].mouseUpHandler); 572 delete Radzen[id].mouseUpHandler; 573 } 574 if (Radzen[id].mouseDownHandler) { 575 parent.removeEventListener('mousedown', Radzen[id].mouseDownHandler); 576 parent.removeEventListener('touchstart', Radzen[id].mouseDownHandler); 577 delete Radzen[id].mouseDownHandler; 578 } 579 580 Radzen[id] = null; 581 }, 582 prepareDrag: function (el) { 583 if (el) { 584 el.ondragover = function (e) { e.preventDefault(); }; 585 el.ondragstart = function (e) { e.dataTransfer.setData('', e.target.id); }; 586 } 587 }, 588 focusElement: function (elementId) { 589 var el = document.getElementById(elementId); 590 if (el) { 591 el.focus(); 592 } 593 }, 594 scrollCarouselItem: function (el) { 595 el.parentElement.scroll(el.offsetLeft, 0); 596 }, 597 scrollIntoViewIfNeeded: function (ref, selector) { 598 var el = selector ? ref.getElementsByClassName(selector)[0] : ref; 599 if (el && el.scrollIntoViewIfNeeded) { 600 el.scrollIntoViewIfNeeded(); 601 } else if (el && el.scrollIntoView) { 602 el.scrollIntoView(); 603 } 604 }, 605 selectListItem: function (input, ul, index) { 606 if (!input || !ul) return; 607 608 var childNodes = ul.getElementsByTagName('LI'); 609 610 var highlighted = ul.querySelectorAll('.rz-state-highlight'); 611 if (highlighted.length) { 612 for (var i = 0; i < highlighted.length; i++) { 613 highlighted[i].classList.remove('rz-state-highlight'); 614 } 615 } 616 617 ul.nextSelectedIndex = index; 618 619 if ( 620 ul.nextSelectedIndex >= 0 && 621 ul.nextSelectedIndex <= childNodes.length - 1 622 ) { 623 childNodes[ul.nextSelectedIndex].classList.add('rz-state-highlight'); 624 childNodes[ul.nextSelectedIndex].scrollIntoView({block:'nearest'}); 625 } 626 }, 627 focusListItem: function (input, ul, isDown, startIndex) { 628 if (!input || !ul) return; 629 var childNodes = ul.getElementsByTagName('LI'); 630 631 if (!childNodes || childNodes.length == 0) return; 632 633 if (startIndex == undefined || startIndex == null) { 634 startIndex = -1; 635 } 636 637 ul.nextSelectedIndex = startIndex; 638 if (isDown) { 639 while (ul.nextSelectedIndex < childNodes.length - 1) { 640 ul.nextSelectedIndex++; 641 if (!childNodes[ul.nextSelectedIndex].classList.contains('rz-state-disabled')) 642 break; 643 } 644 } else { 645 while (ul.nextSelectedIndex >= 0) { 646 ul.nextSelectedIndex--; 647 if (!childNodes[ul.nextSelectedIndex] || !childNodes[ul.nextSelectedIndex].classList.contains('rz-state-disabled')) 648 break; 649 } 650 } 651 652 var highlighted = ul.querySelectorAll('.rz-state-highlight'); 653 if (highlighted.length) { 654 for (var i = 0; i < highlighted.length; i++) { 655 highlighted[i].classList.remove('rz-state-highlight'); 656 } 657 } 658 659 if ( 660 ul.nextSelectedIndex >= 0 && 661 ul.nextSelectedIndex <= childNodes.length - 1 662 ) { 663 childNodes[ul.nextSelectedIndex].classList.add('rz-state-highlight'); 664 Radzen.scrollIntoViewIfNeeded(childNodes[ul.nextSelectedIndex]); 665 } 666 667 return ul.nextSelectedIndex; 668 }, 669 clearFocusedHeaderCell: function (gridId) { 670 var grid = document.getElementById(gridId); 671 if (!grid) return; 672 673 var table = grid.querySelector('.rz-grid-table'); 674 var thead = table.getElementsByTagName("thead")[0]; 675 var highlightedCells = thead.querySelectorAll('.rz-state-focused'); 676 if (highlightedCells.length) { 677 for (var i = 0; i < highlightedCells.length; i++) { 678 highlightedCells[i].classList.remove('rz-state-focused'); 679 } 680 } 681 }, 682 focusTableRow: function (gridId, key, rowIndex, cellIndex, isVirtual) { 683 var grid = document.getElementById(gridId); 684 if (!grid) return; 685 686 var table = grid.querySelector('.rz-grid-table'); 687 var tbody = table.tBodies[0]; 688 var thead = table.tHead;
689 690 var rows = (cellIndex != null && thead && thead.rows && thead.rows.length ? [...thead.rows] : []).concat(tbody && tbody.rows && tbody.rows.length ? [...tbody.rows] : []); 691 692 if (isVirtual && (key == 'ArrowUp' || key == 'ArrowDown' || key == 'PageUp' || key == 'PageDown' || key == 'Home' || key == 'End')) { 693 if (rowIndex == 0 && (key == 'End' || key == 'PageDown')) { 694 var highlightedCells = thead.querySelectorAll('.rz-state-focused'); 695 if (highlightedCells.length) { 696 for (var i = 0; i < highlightedCells.length; i++) { 697 highlightedCells[i].classList.remove('rz-state-focused'); 698 } 699 } 700 } 701 if (key == 'ArrowUp' || key == 'ArrowDown' || key == 'PageUp' || key == 'PageDown') { 702 var rowHeight = rows[rows.length - 1] ? rows[rows.length - 1].offsetHeight : 40; 703 var factor = key == 'PageUp' || key == 'PageDown' ? 10 : 1; 704 table.parentNode.scrollTop = table.parentNode.scrollTop + (factor * (key == 'ArrowDown' || key == 'PageDown' ? rowHeight : -rowHeight)); 705 } 706 else { 707 table.parentNode.scrollTop = key == 'Home' ? 0 : table.parentNode.scrollHeight; 708 } 709 } 710 711 table.nextSelectedIndex = rowIndex || 0; 712 table.nextSelectedCellIndex = cellIndex || 0; 713 714 if (key == 'ArrowDown') { 715 while (table.nextSelectedIndex < rows.length - 1) { 716 table.nextSelectedIndex++; 717 if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].classList.contains('rz-state-disabled')) 718 break; 719 } 720 } else if (key == 'ArrowUp') { 721 while (table.nextSelectedIndex > 0) { 722 table.nextSelectedIndex--; 723 if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].classList.contains('rz-state-disabled')) 724 break; 725 } 726 } else if (key == 'ArrowRight') { 727 while (table.nextSelectedCellIndex < rows[table.nextSelectedIndex].cells.length - 1) { 728 table.nextSelectedCellIndex++; 729 if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex].classList.contains('rz-state-disabled')) 730 break; 731 } 732 } else if (key == 'ArrowLeft') { 733 while (table.nextSelectedCellIndex > 0) { 734 table.nextSelectedCellIndex--; 735 if (!rows[table.nextSelectedIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex] || !rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex].classList.contains('rz-state-disabled')) 736 break; 737 } 738 } else if (isVirtual && (key == 'PageDown' || key == 'End')) { 739 table.nextSelectedIndex = rows.length - 1; 740 } else if (isVirtual && (key == 'PageUp' || key == 'Home')) { 741 table.nextSelectedIndex = 1; 742 } 743 744 if (key == 'ArrowLeft' || key == 'ArrowRight' || (key == 'ArrowUp' && cellIndex != null && table.nextSelectedIndex == 0 && table.parentNode.scrollTop == 0)) { 745 var highlightedCells = rows[table.nextSelectedIndex].querySelectorAll('.rz-state-focused'); 746 if (highlightedCells.length) { 747 for (var i = 0; i < highlightedCells.length; i++) { 748 highlightedCells[i].classList.remove('rz-state-focused'); 749 } 750 } 751 752 if ( 753 table.nextSelectedCellIndex >= 0 && 754 table.nextSelectedCellIndex <= rows[table.nextSelectedIndex].cells.length - 1 755 ) { 756 var cell = rows[table.nextSelectedIndex].cells[table.nextSelectedCellIndex]; 757 758 if (!cell.classList.contains('rz-state-focused')) { 759 cell.classList.add('rz-state-focused'); 760 if (!isVirtual && table.parentElement.scrollWidth > table.parentElement.clientWidth) { 761 Radzen.scrollIntoViewIfNeeded(cell); 762 } 763 } 764 } 765 } else if (key == 'ArrowDown' || key == 'ArrowUp') { 766 var highlighted = table.querySelectorAll('.rz-state-focused'); 767 if (highlighted.length) { 768 for (var i = 0; i < highlighted.length; i++) { 769 highlighted[i].classList.remove('rz-state-focused'); 770 } 771 } 772 773 if (table.nextSelectedIndex >= 0 && 774 table.nextSelectedIndex <= rows.length - 1 775 ) { 776 var row = rows[table.nextSelectedIndex]; 777 778 if (!row.classList.contains('rz-state-focused')) { 779 row.classList.add('rz-state-focused'); 780 if (!isVirtual && table.parentElement.scrollHeight > table.parentElement.clientHeight) { 781 Radzen.scrollIntoViewIfNeeded(row);
782 } 783 } 784 } 785 } 786 787 return [table.nextSelectedIndex, table.nextSelectedCellIndex]; 788 }, 789 uploadInputChange: function (e, url, auto, multiple, clear, parameterName) { 790 if (auto) { 791 Radzen.upload(e.target, url, multiple, clear, parameterName); 792 e.target.value = ''; 793 } else { 794 Radzen.uploadChange(e.target); 795 } 796 }, 797 uploads: function (uploadComponent, id) { 798 if (!Radzen.uploadComponents) { 799 Radzen.uploadComponents = {}; 800 } 801 Radzen.uploadComponents[id] = uploadComponent; 802 }, 803 uploadChange: function (fileInput) { 804 var files = []; 805 for (var i = 0; i < fileInput.files.length; i++) { 806 var file = fileInput.files[i]; 807 files.push({ 808 Name: file.name, 809 Size: file.size, 810 Url: URL.createObjectURL(file) 811 }); 812 } 813 814 var uploadComponent = 815 Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id]; 816 if (uploadComponent) { 817 if (uploadComponent.localFiles) { 818 // Clear any previously created preview URL(s) 819 for (var i = 0; i < uploadComponent.localFiles.length; i++) { 820 var file = uploadComponent.localFiles[i]; 821 if (file.Url) { 822 URL.revokeObjectURL(file.Url); 823 } 824 } 825 } 826 827 uploadComponent.files = Array.from(fileInput.files); 828 uploadComponent.localFiles = files; 829 uploadComponent.invokeMethodAsync('RadzenUpload.OnChange', files); 830 } 831 832 for (var i = 0; i < fileInput.files.length; i++) { 833 var file = fileInput.files[i]; 834 if (file.Url) { 835 URL.revokeObjectURL(file.Url); 836 } 837 } 838 }, 839 removeFileFromUpload: function (fileInput, name) { 840 var uploadComponent = Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id]; 841 if (!uploadComponent) return; 842 var file = uploadComponent.files.find(function (f) { return f.name == name; }) 843 if (!file) { return; } 844 var localFile = uploadComponent.localFiles.find(function (f) { return f.Name == name; }); 845 if (localFile) { 846 URL.revokeObjectURL(localFile.Url); 847 } 848 var index = uploadComponent.files.indexOf(file) 849 if (index != -1) { 850 uploadComponent.files.splice(index, 1); 851 } 852 fileInput.value = ''; 853 }, 854 removeFileFromFileInput: function (fileInput) { 855 fileInput.value = ''; 856 }, 857 upload: function (fileInput, url, multiple, clear, parameterName) { 858 var uploadComponent = Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id]; 859 if (!uploadComponent) { return; } 860 if (!uploadComponent.files || clear) { 861 uploadComponent.files = Array.from(fileInput.files); 862 } 863 var data = new FormData(); 864 var files = []; 865 var cancelled = false; 866 for (var i = 0; i < uploadComponent.files.length; i++) { 867 var file = uploadComponent.files[i]; 868 data.append(parameterName || (multiple ? 'files' : 'file'), file, file.name); 869 files.push({Name: file.name, Size: file.size}); 870 } 871 var xhr = new XMLHttpRequest(); 872 xhr.withCredentials = true; 873 xhr.upload.onprogress = function (e) { 874 if (e.lengthComputable) { 875 var uploadComponent = 876 Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id]; 877 if (uploadComponent) { 878 var progress = parseInt((e.loaded / e.total) * 100); 879 uploadComponent.invokeMethodAsync( 880 'RadzenUpload.OnProgress', 881 progress, 882 e.loaded, 883 e.total, 884 files, 885 cancelled 886 ).then(function (cancel) { 887 if (cancel) { 888 cancelled = true; 889 xhr.abort(); 890 } 891 }); 892 } 893 } 894 }; 895 xhr.onreadystatechange = function (e) { 896 if (xhr.readyState === XMLHttpRequest.DONE) { 897 var status = xhr.status; 898 var uploadComponent = 899 Radzen.uploadComponents && Radzen.uploadComponents[fileInput.id]; 900 if (uploadComponent) { 901 if (status === 0 || (status >= 200 && status < 400)) { 902 uploadComponent.invokeMethodAsync( 903 'RadzenUpload.OnComplete', 904 xhr.responseText, 905 cancelled 906 ); 907 } else { 908 uploadComponent.invokeMethodAsync( 909 'RadzenUpload.OnError', 910 xhr.responseText 911 ); 912 } 913 } 914 } 915 }; 916 uploadComponent.invokeMethodAsync('GetHeaders').then(function (headers) { 917 xhr.open('POST', url, true); 918 for (var name in headers) { 919 xhr.setRequestHeader(name, headers[name]); 920 } 921 xhr.send(data); 922 });
923 }, 924 getCookie: function (name) { 925 var value = '; ' + decodeURIComponent(document.cookie); 926 var parts = value.split('; ' + name + '='); 927 if (parts.length == 2) return parts.pop().split(';').shift(); 928 }, 929 getCulture: function () { 930 var cultureCookie = Radzen.getCookie('.AspNetCore.Culture'); 931 var uiCulture = cultureCookie 932 ? cultureCookie.split('|').pop().split('=').pop() 933 : null; 934 return uiCulture || 'en-US'; 935 }, 936 numericOnPaste: function (e, min, max) { 937 if (e.clipboardData) { 938 var value = e.clipboardData.getData('text'); 939 940 if (value && !isNaN(+value)) { 941 var numericValue = +value; 942 if (min != null && numericValue >= min) { 943 return; 944 } 945 if (max != null && numericValue <= max) { 946 return; 947 } 948 } 949 950 e.preventDefault(); 951 } 952 }, 953 numericOnInput: function (e, min, max, isNullable) { 954 var value = e.target.value; 955 956 if (!isNullable && value == '' && min != null) { 957 e.target.value = min; 958 } 959 960 if (value && !isNaN(+value)) { 961 var numericValue = +value; 962 if (min != null && !isNaN(+min) && numericValue < min) { 963 e.target.value = min; 964 } 965 if (max != null && !isNaN(+max) && numericValue > max) { 966 e.target.value = max; 967 } 968 } 969 }, 970 numericKeyPress: function (e, isInteger, decimalSeparator) { 971 if ( 972 e.metaKey || 973 e.ctrlKey || 974 e.keyCode == 9 || 975 e.keyCode == 8 || 976 e.keyCode == 13 977 ) { 978 return; 979 } 980 981 if (e.code === 'NumpadDecimal' && !isInteger) { 982 var cursorPosition = e.target.selectionEnd; 983 e.target.value = [e.target.value.slice(0, e.target.selectionStart), decimalSeparator, e.target.value.slice(e.target.selectionEnd)].join(''); 984 e.target.selectionStart = ++cursorPosition; 985 e.target.selectionEnd = cursorPosition; 986 e.preventDefault(); 987 return; 988 } 989 990 var ch = String.fromCharCode(e.charCode); 991 992 if ((isInteger ? /^[-\d]$/ : /^[-\d,.]$/).test(ch)) { 993 return; 994 } 995 996 e.preventDefault(); 997 }, 998 openContextMenu: function (x,y,id, instance, callback) { 999 Radzen.closePopup(id); 1000 1001 Radzen.openPopup(null, id, false, null, x, y, instance, callback); 1002 1003 setTimeout(function () { 1004 var popup = document.getElementById(id); 1005 if (popup) { 1006 var menu = popup.querySelector('.rz-menu'); 1007 if (menu) { 1008 menu.focus(); 1009 } 1010 } 1011 }, 500); 1012 }, 1013 openTooltip: function (target, id, delay, duration, position, closeTooltipOnDocumentClick, instance, callback) { 1014 Radzen.closeTooltip(id); 1015 1016 if (delay) { 1017 Radzen[id + 'delay'] = setTimeout(Radzen.openPopup, delay, target, id, false, position, null, null, instance, callback, closeTooltipOnDocumentClick); 1018 } else { 1019 Radzen.openPopup(target, id, false, position, null, null, instance, callback, closeTooltipOnDocumentClick); 1020 } 1021 1022 if (duration) { 1023 Radzen[id + 'duration'] = setTimeout(Radzen.closePopup, duration, id, instance, callback); 1024 } 1025 }, 1026 closeTooltip(id) { 1027 Radzen.activeElement = null; 1028 Radzen.closePopup(id); 1029 1030 if (Radzen[id + 'delay']) { 1031 clearTimeout(Radzen[id + 'delay']); 1032 } 1033 1034 if (Radzen[id + 'duration']) { 1035 clearTimeout(Radzen[id + 'duration']); 1036 } 1037 }, 1038 destroyDatePicker(id) { 1039 var el = document.getElementById(id); 1040 if (!el) return; 1041 1042 var button = el.querySelector('.rz-datepicker-trigger'); 1043 if (button) { 1044 button.onclick = null; 1045 } 1046 var input = el.querySelector('.rz-inputtext'); 1047 if (input) { 1048 input.onclick = null; 1049 } 1050 }, 1051 createDatePicker(el, popupId) { 1052 if(!el) return; 1053 var handler = function (e, condition) { 1054 if (condition) { 1055 Radzen.togglePopup(e.currentTarget.parentNode, popupId, false, null, null, true, false); 1056 } 1057 }; 1058 1059 var input = el.querySelector('.rz-inputtext'); 1060 var button = el.querySelector('.rz-datepicker-trigger'); 1061 if (button) { 1062 button.onclick = function (e) { 1063 handler(e, !e.currentTarget.classList.contains('rz-state-disabled') && (input ? !input.classList.contains('rz-readonly') : true)); 1064 }; 1065 } 1066 1067 if (input) { 1068 input.onclick = function (e) { 1069 handler(e, e.currentTarget.classList.contains('rz-input-trigger') && !e.currentTarget.classList.contains('rz-readonly')); 1070 }; 1071 } 1072 }, 1073 findPopup: function (id) { 1074 var popups = []; 1075 for (var i = 0; i < document.body.children.length; i++) { 1076 if (document.body.children[i].id == id) { 1077 popups.push(document.body.children[i]); 1078 } 1079 } 1080 return popups; 1081 }, 1082 repositionPopup: function (parent, id) { 1083 var popup = document.getElementById(id); 1084 if (!popup) return; 1085 1086 var rect = popup.getBoundingClientRect(); 1087 var parentRect = parent ? parent.getBoundingClientRect() : { top: 0, bottom: 0, left: 0, right: 0, width: 0, height: 0 }; 1088 1089 if (/Edge/.test(navigator.userAgent)) { 1090 var scrollTop = document.body.scrollTop; 1091 } else { 1092 var scrollTop = document.documentElement.scrollTop; 1093 } 1094 1095 var top = parentRect.bottom + scrollTop; 1096 1097 if (top + rect.height > window.innerHeight + scrollTop && parentRect.top > rect.height) { 1098 top = parentRect.top - rect.height + scrollTop; 1099 } 1100 1101 popup.style.top = top + 'px'; 1102 }, 1103 openPopup: function (parent, id, syncWidth, position, x, y, instance, callback, closeOnDocumentClick = true, autoFocusFirstElement = false, disableSmartPosition = false) { 1104 var popup = document.getElementById(id); 1105 if (!popup) return; 1106 1107 Radzen.activeElement = document.activeElement; 1108 1109 var parentRect = parent ? parent.getBoundingClientRect() : { top: y || 0, bottom: 0, left: x || 0, right: 0, width: 0, height: 0 }; 1110 1111 if (/Edge/.test(navigator.userAgent)) { 1112 var scrollLeft = document.body.scrollLeft; 1113 var scrollTop = document.body.scrollTop; 1114 } else { 1115 var scrollLeft = document.documentElement.scrollLeft; 1116 var scrollTop = document.documentElement.scrollTop; 1117 } 1118 1119 var top = y ? y : parentRect.bottom; 1120 var left = x ? x : parentRect.left; 1121 1122 if (syncWidth) { 1123 popup.style.width = parentRect.width + 'px'; 1124 if (!popup.style.minWidth) { 1125 popup.minWidth = true; 1126 popup.style.minWidth = parentRect.width + 'px'; 1127 } 1128 } 1129 1130 if (window.chrome) { 1131 var closestFrozenCell = popup.closest('.rz-frozen-cell'); 1132 if (closestFrozenCell) { 1133 Radzen[id + 'FZL'] = { cell: closestFrozenCell, left: closestFrozenCell.style.left }; 1134 closestFrozenCell.style.left = ''; 1135 } 1136 } 1137 1138 popup.style.display = 'block'; 1139 1140 var rect = popup.getBoundingClientRect(); 1141 rect.width = x ? rect.width + 20 : rect.width; 1142 rect.height = y ? rect.height + 20 : rect.height; 1143 1144 var smartPosition = !position || position == 'bottom'; 1145 1146 if (smartPosition && top + rect.height > window.innerHeight && parentRect.top > rect.height) { 1147 if (disableSmartPosition !== true) { 1148 top = parentRect.top - rect.height; 1149 } 1150 1151 if (position) { 1152 top = top - 40; 1153 var tooltipContent = popup.children[0]; 1154 var tooltipContentClassName = 'rz-' + position + '-tooltip-content'; 1155 if (tooltipContent.classList.contains(tooltipContentClassName)) { 1156 tooltipContent.classList.remove(tooltipContentClassName); 1157 tooltipContent.classList.add('rz-top-tooltip-content'); 1158 position = 'top'; 1159 if (instance && callback) { 1160 try { instance.invokeMethodAsync(callback, position); } catch { } 1161 } 1162 } 1163 } 1164 } 1165 1166 if (smartPosition && left + rect.width > window.innerWidth && window.innerWidth > rect.width) { 1167 left = !position ? window.innerWidth - rect.width : rect.left; 1168 1169 if (position) { 1170 top = y || parentRect.top; 1171 var tooltipContent = popup.children[0]; 1172 var tooltipContentClassName = 'rz-' + position + '-tooltip-content'; 1173 if (tooltipContent.classList.contains(tooltipContentClassName)) { 1174 tooltipContent.classList.remove(tooltipContentClassName); 1175 tooltipContent.classList.add('rz-left-tooltip-content'); 1176 position = 'left'; 1177 if (instance && callback) { 1178 try { instance.invokeMethodAsync(callback, position); } catch { } 1179 } 1180 } 1181 } 1182 } 1183 1184 if (smartPosition) { 1185 if (position) { 1186 top = top + 20; 1187 } 1188 } 1189 1190 if (position == 'left') { 1191 left = parentRect.left - rect.width - 5; 1192 top = parentRect.top; 1193 } 1194 1195 if (position == 'right') { 1196 left = parentRect.right + 10; 1197 top = parentRect.top; 1198 } 1199 1200 if (position == 'top') { 1201 top = parentRect.top - rect.height + 5; 1202 left = parentRect.left; 1203 } 1204 1205 popup.style.zIndex = 2000; 1206 popup.style.left = left + scrollLeft + 'px'; 1207 popup.style.top = top + scrollTop + 'px'; 1208 1209 if (!popup.classList.contains('rz-overlaypanel')) { 1210 popup.classList.add('rz-popup'); 1211 } 1212 1213 Radzen[id] = function (e) { 1214 var lastPopup = Radzen.popups && Radzen.popups[Radzen.popups.length - 1]; 1215 var currentPopup = lastPopup != null && document.getElementById(lastPopup.id) || popup; 1216 1217 if (lastPopup) { 1218 currentPopup.instance = lastPopup.instance; 1219 currentPopup.callback = lastPopup.callback; 1220 currentPopup.parent = lastPopup.parent; 1221 } 1222 1223 if(e.type == 'contextmenu' || !e.target || !closeOnDocumentClick) return; 1224 if (!/Android/i.test(navigator.userAgent) && 1225 !['input', 'textarea'].includes(document.activeElement ? document.activeElement.tagName.toLowerCase() : '') && e.type == 'resize') { 1226 Radzen.closePopup(currentPopup.id, currentPopup.instance, currentPopup.callback, e); 1227 return; 1228 } 1229 1230 var closestLink = e.target.closest && (e.target.closest('.rz-link') || e.target.closest('.rz-navigation-item-link')); 1231 if (e.type == 'resize' && !/Android/i.test(navigator.userAgent) || closestLink && closestLink.closest && closestLink.closest('a')) { 1232 if (Radzen.closeAllPopups) { 1233 Radzen.closeAllPopups(); 1234 } 1235 } 1236 if (currentPopup.parent) { 1237 if (e.type == 'mousedown' && !currentPopup.parent.contains(e.target) && !currentPopup.contains(e.target)) { 1238 Radzen.closePopup(currentPopup.id, currentPopup.instance, currentPopup.callback, e); 1239 } 1240 } else { 1241 if (e.target.nodeType && !currentPopup.contains(e.target)) { 1242 Radzen.closePopup(currentPopup.id, currentPopup.instance, currentPopup.callback, e); 1243 } 1244 } 1245 }; 1246 1247 if (!Radzen.popups) { 1248 Radzen.popups = []; 1249 } 1250 1251 Radzen.popups.push({ id, instance, callback, parent }); 1252
1253 document.body.appendChild(popup); 1254 document.removeEventListener('mousedown', Radzen[id]); 1255 document.addEventListener('mousedown', Radzen[id]); 1256 window.removeEventListener('resize', Radzen[id]); 1257 window.addEventListener('resize', Radzen[id]); 1258 1259 var p = parent; 1260 while (p && p != document.body) { 1261 if (p.scrollWidth > p.clientWidth || p.scrollHeight > p.clientHeight) { 1262 p.removeEventListener('scroll', Radzen.closeAllPopups); 1263 p.addEventListener('scroll', Radzen.closeAllPopups); 1264 } 1265 p = p.parentElement; 1266 } 1267 1268 if (!parent) { 1269 document.removeEventListener('contextmenu', Radzen[id]); 1270 document.addEventListener('contextmenu', Radzen[id]); 1271 } 1272 1273 if (autoFocusFirstElement) { 1274 setTimeout(function () { 1275 popup.removeEventListener('keydown', Radzen.focusTrap); 1276 popup.addEventListener('keydown', Radzen.focusTrap); 1277 1278 var focusable = Radzen.getFocusableElements(popup); 1279 var firstFocusable = focusable[0]; 1280 if (firstFocusable) { 1281 firstFocusable.focus(); 1282 } 1283 }, 200); 1284 } 1285 }, 1286 closeAllPopups: function (e, id) { 1287 if (!Radzen.popups) return; 1288 var el = e && e.target || id && documentElement.getElementById(id); 1289 var popups = Radzen.popups; 1290 for (var i = 0; i < popups.length; i++) { 1291 var p = popups[i]; 1292 1293 var closestPopup = el && el.closest && (el.closest('.rz-popup') || el.closest('.rz-overlaypanel')); 1294 if (closestPopup && closestPopup != p) { 1295 return; 1296 } 1297 1298 Radzen.closePopup(p.id, p.instance, p.callback, e); 1299 } 1300 Radzen.popups = []; 1301 }, 1302 closePopup: function (id, instance, callback, e) { 1303 var popup = document.getElementById(id); 1304 if (!popup) return; 1305 if (popup.style.display == 'none') { 1306 var popups = Radzen.findPopup(id); 1307 if (popups.length > 1) { 1308 for (var i = 0; i < popups.length; i++) { 1309 if (popups[i].style.display == 'none') { 1310 popups[i].parentNode.removeChild(popups[i]); 1311 } else { 1312 popup = popups[i]; 1313 } 1314 } 1315 } else { 1316 return; 1317 } 1318 } 1319 1320 if (popup) { 1321 if (popup.minWidth) { 1322 popup.style.minWidth = ''; 1323 } 1324 1325 if (window.chrome && Radzen[id + 'FZL']) { 1326 Radzen[id + 'FZL'].cell.style.left = Radzen[id + 'FZL'].left; 1327 Radzen[id + 'FZL'] = null; 1328 } 1329 1330 popup.style.display = 'none'; 1331 } 1332 document.removeEventListener('mousedown', Radzen[id]); 1333 window.removeEventListener('resize', Radzen[id]); 1334 Radzen[id] = null; 1335 1336 if (instance && callback) { 1337 if (callback.includes('RadzenTooltip')) { 1338 try { instance.invokeMethodAsync(callback, null); } catch { } 1339 } else { 1340 try { instance.invokeMethodAsync(callback); } catch { } 1341 } 1342 } 1343 Radzen.popups = (Radzen.popups || []).filter(function (obj) { 1344 return obj.id !== id; 1345 }); 1346 1347 if (Radzen.activeElement && Radzen.activeElement == document.activeElement || 1348 Radzen.activeElement && document.activeElement == document.body || 1349 Radzen.activeElement && document.activeElement && 1350 (document.activeElement.classList.contains('rz-dropdown-filter') || document.activeElement.classList.contains('rz-lookup-search-input'))) { 1351 setTimeout(function () { 1352 if (e && e.target && e.target.tabIndex != -1) { 1353 Radzen.activeElement = e.target; 1354 } 1355 if (Radzen.activeElement) { 1356 Radzen.activeElement.focus(); 1357 } 1358 Radzen.activeElement = null; 1359 }, 100); 1360 } 1361 }, 1362 popupOpened: function (id) { 1363 var popup = document.getElementById(id); 1364 if (popup) { 1365 return popup.style.display != 'none'; 1366 } 1367 return false; 1368 }, 1369 togglePopup: function (parent, id, syncWidth, instance, callback, closeOnDocumentClick = true, autoFocusFirstElement = false) { 1370 var popup = document.getElementById(id); 1371 if (!popup) return; 1372 if (popup.style.display == 'block') { 1373 Radzen.closePopup(id, instance, callback); 1374 } else { 1375 Radzen.openPopup(parent, id, syncWidth, null, null, null, instance, callback, closeOnDocumentClick, autoFocusFirstElement); 1376 } 1377 }, 1378 destroyPopup: function (id) { 1379 var popup = document.getElementById(id); 1380 if (popup) { 1381 popup.parentNode.removeChild(popup); 1382 } 1383 document.removeEventListener('mousedown', Radzen[id]); 1384 }, 1385 scrollDataGrid: function (e) { 1386 var scrollLeft = 1387 (e.target.scrollLeft ? '-' + e.target.scrollLeft : 0) + 'px'; 1388 1389 e.target.previousElementSibling.style.marginLeft = scrollLeft; 1390 e.target.previousElementSibling.firstElementChild.style.paddingRight = 1391 e.target.clientHeight < e.target.scrollHeight ? (e.target.offsetWidth - e.target.clientWidth) + 'px' : '0px'; 1392 1393 if (e.target.nextElementSibling) { 1394 e.target.nextElementSibling.style.marginLeft = scrollLeft; 1395 e.target.nextElementSibling.firstElementChild.style.paddingRight = 1396 e.target.clientHeight < e.target.scrollHeight ? (e.target.offsetWidth - e.target.clientWidth) + 'px' : '0px'; 1397 } 1398 1399 for (var i = 0; i < document.body.children.length; i++) { 1400 if (document.body.children[i].classList.contains('rz-overlaypanel')) { 1401 document.body.children[i].style.display = 'none'; 1402 } 1403 } 1404 }, 1405 focusFirstFocusableElement: function (el) { 1406 var focusable = Radzen.getFocusableElements(el); 1407 var editor = el.querySelector('.rz-html-editor'); 1408 1409 if (editor && !focusable.includes(editor.previousElementSibling)) { 1410 var editable = el.querySelector('.rz-html-editor-content'); 1411 if (editable) { 1412 var selection = window.getSelection(); 1413 var range = document.createRange(); 1414 range.setStart(editable, 0); 1415 range.setEnd(editable, 0); 1416 selection.removeAllRanges(); 1417 selection.addRange(range); 1418 } 1419 } else { 1420 var firstFocusable = focusable[0]; 1421 if (firstFocusable) { 1422 firstFocusable.focus(); 1423 } 1424 } 1425 }, 1426 openSideDialog: function (options) { 1427 setTimeout(function () { 1428 if (options.autoFocusFirstElement) { 1429 var dialogs = document.querySelectorAll('.rz-dialog-side-content'); 1430 if (dialogs.length == 0) return; 1431 var lastDialog = dialogs[dialogs.length - 1]; 1432 Radzen.focusFirstFocusableElement(lastDialog); 1433 } 1434 }, 500); 1435 }, 1436 openDialog: function (options, dialogService, dialog) { 1437 if (Radzen.closeAllPopups) { 1438 Radzen.closeAllPopups(); 1439 } 1440 Radzen.dialogService = dialogService; 1441 if ( 1442 document.documentElement.scrollHeight > 1443 document.documentElement.clientHeight 1444 ) { 1445 document.body.classList.add('no-scroll'); 1446 } 1447 1448 setTimeout(function () { 1449 var dialogs = document.querySelectorAll('.rz-dialog-content'); 1450 if (dialogs.length == 0) return; 1451 var lastDialog = dialogs[dialogs.length - 1]; 1452 1453 if (lastDialog) { 1454 lastDialog.options = options; 1455 lastDialog.removeEventListener('keydown', Radzen.focusTrap); 1456 lastDialog.addEventListener('keydown', Radzen.focusTrap); 1457 1458 if (options.resizable) { 1459 dialog.offsetWidth = lastDialog.parentElement.offsetWidth; 1460 dialog.offsetHeight = lastDialog.parentElement.offsetHeight; 1461 var dialogResize = function (e) { 1462 if (!dialog) return; 1463 if (dialog.offsetWidth != e[0].target.offsetWidth || dialog.offsetHeight != e[0].target.offsetHeight) { 1464 1465 dialog.offsetWidth = e[0].target.offsetWidth; 1466 dialog.offsetHeight = e[0].target.offsetHeight; 1467 1468 dialog.invokeMethodAsync( 1469 'RadzenDialog.OnResize', 1470 e[0].target.offsetWidth, 1471 e[0].target.offsetHeight 1472 ); 1473 } 1474 }; 1475 Radzen.dialogResizer = new ResizeObserver(dialogResize).observe(lastDialog.parentElement); 1476 } 1477 1478 if (options.draggable) { 1479 var dialogTitle = lastDialog.parentElement.querySelector('.rz-dialog-titlebar'); 1480 if (dialogTitle) {
1481 Radzen[dialogTitle] = function (e) { 1482 var rect = lastDialog.parentElement.getBoundingClientRect(); 1483 var offsetX = e.clientX - rect.left; 1484 var offsetY = e.clientY - rect.top; 1485 1486 var move = function (e) { 1487 var left = e.clientX - offsetX; 1488 var top = e.clientY - offsetY; 1489 1490 lastDialog.parentElement.style.left = left + 'px'; 1491 lastDialog.parentElement.style.top = top + 'px'; 1492 1493 dialog.invokeMethodAsync('RadzenDialog.OnDrag', top, left); 1494 }; 1495 1496 var stop = function () { 1497 document.removeEventListener('mousemove', move); 1498 document.removeEventListener('mouseup', stop); 1499 }; 1500 1501 document.addEventListener('mousemove', move); 1502 document.addEventListener('mouseup', stop); 1503 }; 1504 1505 dialogTitle.addEventListener('mousedown', Radzen[dialogTitle]); 1506 } 1507 } 1508 1509 if (options.autoFocusFirstElement) { 1510 Radzen.focusFirstFocusableElement(lastDialog); 1511 } 1512 } 1513 }, 500); 1514 1515 document.removeEventListener('keydown', Radzen.closePopupOrDialog); 1516 if (options.closeDialogOnEsc) { 1517 document.addEventListener('keydown', Radzen.closePopupOrDialog); 1518 } 1519 }, 1520 closeDialog: function () { 1521 Radzen.dialogResizer = null; 1522 document.body.classList.remove('no-scroll'); 1523 var dialogs = document.querySelectorAll('.rz-dialog-content'); 1524 1525 var lastDialog = dialogs.length && dialogs[dialogs.length - 1]; 1526 if (lastDialog) { 1527 var dialogTitle = lastDialog.parentElement.querySelector('.rz-dialog-titlebar'); 1528 if (dialogTitle) { 1529 dialogTitle.removeEventListener('mousedown', Radzen[dialogTitle]); 1530 Radzen[dialogTitle] = null; 1531 delete Radzen[dialogTitle]; 1532 } 1533 } 1534 1535 if (dialogs.length <= 1) { 1536 document.removeEventListener('keydown', Radzen.closePopupOrDialog); 1537 delete Radzen.dialogService; 1538 } 1539 }, 1540 disableKeydown: function (e) { 1541 e = e || window.event; 1542 e.preventDefault(); 1543 }, 1544 getFocusableElements: function (element) { 1545 return [...element.querySelectorAll('a, button, input, textarea, select, details, iframe, embed, object, summary dialog, audio[controls], video[controls], [contenteditable], [tabindex]')] 1546 .filter(el => el && el.tabIndex > -1 && !el.hasAttribute('disabled') && el.offsetParent !== null); 1547 }, 1548 focusTrap: function (e) { 1549 e = e || window.event; 1550 var isTab = false; 1551 if ("key" in e) { 1552 isTab = (e.key === "Tab"); 1553 } else { 1554 isTab = (e.keyCode === 9); 1555 } 1556 if (isTab) { 1557 var focusable = Radzen.getFocusableElements(e.currentTarget); 1558 var firstFocusable = focusable[0]; 1559 var lastFocusable = focusable[focusable.length - 1]; 1560 1561 if (firstFocusable && lastFocusable && e.shiftKey && document.activeElement === firstFocusable) { 1562 e.preventDefault(); 1563 lastFocusable.focus(); 1564 } else if (firstFocusable && lastFocusable && !e.shiftKey && document.activeElement === lastFocusable) { 1565 e.preventDefault(); 1566 firstFocusable.focus(); 1567 } 1568 } 1569 }, 1570 closePopupOrDialog: function (e) { 1571 e = e || window.event; 1572 var isEscape = false; 1573 if ("key" in e) { 1574 isEscape = (e.key === "Escape" || e.key === "Esc"); 1575 } else { 1576 isEscape = (e.keyCode === 27); 1577 } 1578 if (isEscape && Radzen.dialogService) { 1579 var popups = document.querySelectorAll('.rz-popup,.rz-overlaypanel'); 1580 for (var i = 0; i < popups.length; i++) { 1581 if (popups[i].style.display != 'none') { 1582 return; 1583 } 1584 } 1585 1586 var dialogs = document.querySelectorAll('.rz-dialog-content'); 1587 if (dialogs.length == 0) return; 1588 var lastDialog = dialogs[dialogs.length - 1]; 1589 1590 if (lastDialog && lastDialog.options && lastDialog.options.closeDialogOnEsc) { 1591 Radzen.dialogService.invokeMethodAsync('DialogService.Close', null); 1592 1593 if (dialogs.length <= 1) { 1594 document.removeEventListener('keydown', Radzen.closePopupOrDialog); 1595 delete Radzen.dialogService; 1596 var layout = document.querySelector('.rz-layout'); 1597 if (layout) { 1598 layout.removeEventListener('keydown', Radzen.disableKeydown); 1599 } 1600 } 1601 } 1602 } 1603 }, 1604 getNumericValue: function (arg) { 1605 var el = 1606 arg instanceof Element || arg instanceof HTMLDocument 1607 ? arg 1608 : document.getElementById(arg); 1609 return el ? Radzen.getInputValue(el.children[0]) : null; 1610 }, 1611 getInputValue: function (arg) { 1612 var input = 1613 arg instanceof Element || arg instanceof HTMLDocument 1614 ? arg 1615 : document.getElementById(arg); 1616 return input && input.value != '' ? input.value : null; 1617 }, 1618 setInputValue: function (arg, value) { 1619 var input = 1620 arg instanceof Element || arg instanceof HTMLDocument 1621 ? arg 1622 : document.getElementById(arg); 1623 if (input) { 1624 input.value = value; 1625 } 1626 }, 1627 blur: function (el, e) { 1628 if (el) { 1629 e.preventDefault(); 1630 el.dispatchEvent(new KeyboardEvent('keydown', { bubbles: true, cancelable: true, keyCode: 9 })); 1631 } 1632 }, 1633 readFileAsBase64: function (fileInput, maxFileSize, maxWidth, maxHeight) { 1634 var calculateWidthAndHeight = function (img) { 1635 var width = img.width;
1636 var height = img.height; 1637 // Change the resizing logic 1638 if (width > height) { 1639 if (width > maxWidth) { 1640 height = height * (maxWidth / width); 1641 width = maxWidth; 1642 } 1643 } else { 1644 if (height > maxHeight) { 1645 width = width * (maxHeight / height); 1646 height = maxHeight; 1647 } 1648 } 1649 return { width, height }; 1650 }; 1651 var readAsDataURL = function (fileInput) { 1652 return new Promise(function (resolve, reject) { 1653 var reader = new FileReader(); 1654 reader.onerror = function () { 1655 reader.abort(); 1656 reject('Error reading file.'); 1657 }; 1658 reader.addEventListener( 1659 'load', 1660 function () { 1661 if (fileInput.files[0] && fileInput.files[0].type.includes('image') && maxWidth > 0 && maxHeight > 0) { 1662 var img = document.createElement("img"); 1663 img.onload = function (event) { 1664 // Dynamically create a canvas element 1665 var canvas = document.createElement("canvas"); 1666 var res = calculateWidthAndHeight(img); 1667 canvas.width = res.width; 1668 canvas.height = res.height; 1669 var ctx = canvas.getContext("2d"); 1670 ctx.drawImage(img, 0, 0, res.width, res.height); 1671 resolve(canvas.toDataURL(fileInput.type)); 1672 } 1673 img.src = reader.result; 1674 } else { 1675 resolve(reader.result); 1676 } 1677 }, 1678 false 1679 ); 1680 var file = fileInput.files[0]; 1681 if (!file) return; 1682 if (file.size <= maxFileSize) { 1683 reader.readAsDataURL(file); 1684 } else { 1685 reject('File too large.'); 1686 } 1687 }); 1688 }; 1689 1690 return readAsDataURL(fileInput); 1691 }, 1692 toggleMenuItem: function (target, event, defaultActive, clickToOpen) { 1693 var item = target.closest('.rz-navigation-item'); 1694 1695 var active = defaultActive != undefined ? defaultActive : !item.classList.contains('rz-navigation-item-active'); 1696 1697 function toggle(active) { 1698 item.classList.toggle('rz-navigation-item-active', active); 1699 1700 target.classList.toggle('rz-navigation-item-wrapper-active', active); 1701 1702 var children = item.querySelector('.rz-navigation-menu'); 1703 1704 if (children) { 1705 children.style.display = active ? '' : 'none'; 1706 } 1707 1708 var icon = item.querySelector('.rz-navigation-item-icon-children'); 1709 1710 if (icon) { 1711 var deg = active ? '180deg' : 0; 1712 icon.style.transform = 'rotate(' + deg + ')'; 1713 } 1714 } 1715 1716 if (clickToOpen === false && item.parentElement && item.parentElement.closest('.rz-navigation-item') && !defaultActive) { 1717 return; 1718 }; 1719 1720 toggle(active); 1721 1722 document.removeEventListener('click', target.clickHandler); 1723 1724 target.clickHandler = function (event) { 1725 if (item.contains(event.target)) { 1726 var child = event.target.closest('.rz-navigation-item'); 1727 if (child && child.querySelector('.rz-navigation-menu')) { 1728 return; 1729 } 1730 } 1731 toggle(false); 1732 } 1733 1734 document.addEventListener('click', target.clickHandler); 1735 }, 1736 destroyChart: function (ref) { 1737 if(!ref) return; 1738 ref.removeEventListener('mouseleave', ref.mouseLeaveHandler); 1739 delete ref.mouseLeaveHandler; 1740 ref.removeEventListener('mouseenter', ref.mouseEnterHandler); 1741 delete ref.mouseEnterHandler; 1742 ref.removeEventListener('mousemove', ref.mouseMoveHandler); 1743 delete ref.mouseMoveHandler; 1744 ref.removeEventListener('click', ref.clickHandler); 1745 delete ref.clickHandler; 1746 this.destroyResizable(ref); 1747 }, 1748 destroyGauge: function (ref) { 1749 this.destroyResizable(ref); 1750 }, 1751 destroyResizable: function (ref) { 1752 if (ref.resizeObserver) { 1753 ref.resizeObserver.disconnect(); 1754 delete ref.resizeObserver; 1755 } 1756 if (ref.resizeHandler) { 1757 window.removeEventListener('resize', ref.resizeHandler); 1758 delete ref.resizeHandler; 1759 } 1760 }, 1761 createResizable: function (ref, instance) { 1762 ref.resizeHandler = function () { 1763 var rect = ref.getBoundingClientRect(); 1764 1765 instance.invokeMethodAsync('Resize', rect.width, rect.height); 1766 }; 1767 1768 if (window.ResizeObserver) { 1769 ref.resizeObserver = new ResizeObserver(ref.resizeHandler); 1770 ref.resizeObserver.observe(ref); 1771 } else { 1772 window.addEventListener('resize', ref.resizeHandler); 1773 } 1774 1775 var rect = ref.getBoundingClientRect(); 1776 1777 return {width: rect.width, height: rect.height}; 1778 }, 1779 createChart: function (ref, instance) { 1780 var inside = false; 1781 ref.mouseMoveHandler = this.throttle(function (e) { 1782 if (inside) { 1783 var rect = ref.getBoundingClientRect(); 1784 var x = e.clientX - rect.left; 1785 var y = e.clientY - rect.top; 1786 instance.invokeMethodAsync('MouseMove', x, y); 1787 } 1788 }, 100); 1789 ref.mouseEnterHandler = function () { 1790 inside = true; 1791 }; 1792 ref.mouseLeaveHandler = function (e) { 1793 if (e.relatedTarget && (e.relatedTarget.matches('.rz-chart-tooltip') || e.relatedTarget.closest('.rz-chart-tooltip'))) { 1794 return; 1795 } 1796 inside = false; 1797 instance.invokeMethodAsync('MouseMove', -1, -1); 1798 }; 1799 ref.clickHandler = function (e) { 1800 var rect = ref.getBoundingClientRect(); 1801 var x = e.clientX - rect.left; 1802 var y = e.clientY - rect.top; 1803 if (!e.target.closest('.rz-marker')) { 1804 instance.invokeMethodAsync('Click', x, y); 1805 } 1806 }; 1807 1808 ref.addEventListener('mouseenter', ref.mouseEnterHandler); 1809 ref.addEventListener('mouseleave', ref.mouseLeaveHandler); 1810 ref.addEventListener('mousemove', ref.mouseMoveHandler); 1811 ref.addEventListener('click', ref.clickHandler); 1812 1813 return this.createResizable(ref, instance); 1814 }, 1815 createGauge: function (ref, instance) { 1816 return this.createResizable(ref, instance); 1817 }, 1818 destroyScheduler: function (ref) { 1819 if (ref && ref.resizeHandler) { 1820 window.removeEventListener('resize', ref.resizeHandler); 1821 delete ref.resizeHandler; 1822 } 1823 }, 1824 createScheduler: function (ref, instance) { 1825 ref.resizeHandler = function () { 1826 var rect = ref.getBoundingClientRect(); 1827 1828 instance.invokeMethodAsync('Resize', rect.width, rect.height); 1829 }; 1830 1831 window.addEventListener('resize', ref.resizeHandler); 1832 1833 var rect = ref.getBoundingClientRect(); 1834 return {width: rect.width, height: rect.height}; 1835 }, 1836 innerHTML: function (ref, value) { 1837 if (value != undefined) { 1838 if (ref != null) { 1839 ref.innerHTML = value; 1840 } 1841 } else { 1842 return ref.innerHTML; 1843 } 1844 }, 1845 execCommand: function (ref, name, value) { 1846 if (document.activeElement != ref && ref) { 1847 ref.focus(); 1848 } 1849 document.execCommand(name, false, value); 1850 return this.queryCommands(ref); 1851 }, 1852 queryCommands: function (ref) { 1853 return { 1854 html: ref != null ? ref.innerHTML : null, 1855 fontName: document.queryCommandValue('fontName'), 1856 fontSize: document.queryCommandValue('fontSize'), 1857 formatBlock: document.queryCommandValue('formatBlock'), 1858 bold: document.queryCommandState('bold'), 1859 underline: document.queryCommandState('underline'), 1860 justifyRight: document.queryCommandState('justifyRight'), 1861 justifyLeft: document.queryCommandState('justifyLeft'), 1862 justifyCenter: document.queryCommandState('justifyCenter'), 1863 justifyFull: document.queryCommandState('justifyFull'), 1864 italic: document.queryCommandState('italic'),
1865 strikeThrough: document.queryCommandState('strikeThrough'), 1866 superscript: document.queryCommandState('superscript'), 1867 subscript: document.queryCommandState('subscript'), 1868 unlink: document.queryCommandEnabled('unlink'), 1869 undo: document.queryCommandEnabled('undo'), 1870 redo: document.queryCommandEnabled('redo') 1871 }; 1872 }, 1873 mediaQueries: {}, 1874 mediaQuery: function(query, instance) { 1875 if (instance) { 1876 function callback(event) { 1877 instance.invokeMethodAsync('OnChange', event.matches) 1878 }; 1879 var query = matchMedia(query); 1880 this.mediaQueries[instance._id] = function() { 1881 query.removeListener(callback); 1882 } 1883 query.addListener(callback); 1884 return query.matches; 1885 } else { 1886 instance = query; 1887 if (this.mediaQueries[instance._id]) { 1888 this.mediaQueries[instance._id](); 1889 delete this.mediaQueries[instance._id]; 1890 } 1891 } 1892 }, 1893 createEditor: function (ref, uploadUrl, paste, instance, shortcuts) { 1894 ref.inputListener = function () { 1895 instance.invokeMethodAsync('OnChange', ref.innerHTML); 1896 }; 1897 ref.keydownListener = function (e) { 1898 var key = ''; 1899 if (e.ctrlKey || e.metaKey) { 1900 key += 'Ctrl+'; 1901 } 1902 if (e.altKey) { 1903 key += 'Alt+'; 1904 } 1905 if (e.shiftKey) { 1906 key += 'Shift+'; 1907 } 1908 key += e.code.replace('Key', '').replace('Digit', '').replace('Numpad', ''); 1909 1910 if (shortcuts.includes(key)) { 1911 e.preventDefault(); 1912 instance.invokeMethodAsync('ExecuteShortcutAsync', key); 1913 } 1914 }; 1915 1916 ref.clickListener = function (e) { 1917 if (e.target) { 1918 if (e.target.matches('a,button')) { 1919 e.preventDefault(); 1920 } 1921 1922 for (var img of ref.querySelectorAll('img.rz-state-selected')) { 1923 img.classList.remove('rz-state-selected'); 1924 } 1925 1926 if (e.target.matches('img')) { 1927 e.target.classList.add('rz-state-selected'); 1928 var range = document.createRange(); 1929 range.selectNode(e.target); 1930 getSelection().removeAllRanges(); 1931 getSelection().addRange(range); 1932 } 1933 } 1934 } 1935 1936 ref.selectionChangeListener = function () { 1937 if (document.activeElement == ref) { 1938 instance.invokeMethodAsync('OnSelectionChange'); 1939 } 1940 }; 1941 ref.pasteListener = function (e) { 1942 var item = e.clipboardData.items[0]; 1943 1944 if (item.kind == 'file') { 1945 e.preventDefault(); 1946 var file = item.getAsFile(); 1947 1948 if (uploadUrl) { 1949 var xhr = new XMLHttpRequest(); 1950 var data = new FormData(); 1951 data.append("file", file); 1952 xhr.onreadystatechange = function (e) { 1953 if (xhr.readyState === XMLHttpRequest.DONE) { 1954 var status = xhr.status; 1955 if (status === 0 || (status >= 200 && status < 400)) { 1956 var result = JSON.parse(xhr.responseText); 1957 var html = '<img src="' + result.url + '">'; 1958 if (paste) { 1959 instance.invokeMethodAsync('OnPaste', html) 1960 .then(function (html) { 1961 document.execCommand("insertHTML", false, html); 1962 }); 1963 } else { 1964 document.execCommand("insertHTML", false, '<img src="' + result.url + '">'); 1965 } 1966 instance.invokeMethodAsync('OnUploadComplete', xhr.responseText); 1967 } else { 1968 instance.invokeMethodAsync('OnError', xhr.responseText); 1969 } 1970 } 1971 } 1972 instance.invokeMethodAsync('GetHeaders').then(function (headers) { 1973 xhr.open('POST', uploadUrl, true); 1974 for (var name in headers) { 1975 xhr.setRequestHeader(name, headers[name]); 1976 } 1977 xhr.send(data); 1978 }); 1979 } else { 1980 var reader = new FileReader(); 1981 reader.onload = function (e) { 1982 var html = '<img src="' + e.target.result + '">'; 1983 1984 if (paste) { 1985 instance.invokeMethodAsync('OnPaste', html) 1986 .then(function (html) { 1987 document.execCommand("insertHTML", false, html); 1988 }); 1989 } else { 1990 document.execCommand("insertHTML", false, html); 1991 } 1992 };
1993 reader.readAsDataURL(file); 1994 } 1995 } else if (paste) { 1996 e.preventDefault(); 1997 var data = e.clipboardData.getData('text/html') || e.clipboardData.getData('text/plain'); 1998 1999 instance.invokeMethodAsync('OnPaste', data) 2000 .then(function (html) { 2001 document.execCommand("insertHTML", false, html); 2002 }); 2003 } 2004 }; 2005 ref.addEventListener('input', ref.inputListener); 2006 ref.addEventListener('paste', ref.pasteListener); 2007 ref.addEventListener('keydown', ref.keydownListener); 2008 ref.addEventListener('click', ref.clickListener); 2009 document.addEventListener('selectionchange', ref.selectionChangeListener); 2010 document.execCommand('styleWithCSS', false, true); 2011 }, 2012 saveSelection: function (ref) { 2013 if (document.activeElement == ref) { 2014 var selection = getSelection(); 2015 if (selection.rangeCount > 0) { 2016 ref.range = selection.getRangeAt(0); 2017 } 2018 } 2019 }, 2020 restoreSelection: function (ref) { 2021 var range = ref.range; 2022 if (range) { 2023 delete ref.range; 2024 if(ref) { 2025 ref.focus(); 2026 } 2027 var selection = getSelection(); 2028 selection.removeAllRanges(); 2029 selection.addRange(range); 2030 } 2031 }, 2032 selectionAttributes: function (selector, attributes, container) { 2033 var selection = getSelection(); 2034 var range = selection.rangeCount > 0 && selection.getRangeAt(0); 2035 var parent = range && range.commonAncestorContainer; 2036 var img = container.querySelector('img.rz-state-selected'); 2037 var inside = img && selector == 'img'; 2038 while (parent) { 2039 if (parent == container) { 2040 inside = true; 2041 break; 2042 } 2043 parent = parent.parentNode; 2044 } 2045 if (!inside) { 2046 return {}; 2047 } 2048 var target = selection.focusNode; 2049 var innerHTML; 2050 2051 if (img && selector == 'img') { 2052 target = img; 2053 } else if (target) { 2054 if (target.nodeType == 3) { 2055 target = target.parentElement; 2056 } else { 2057 target = target.childNodes[selection.focusOffset]; 2058 if (target) { 2059 innerHTML = target.outerHTML; 2060 } 2061 } 2062 if (target && target.matches && !target.matches(selector)) { 2063 target = target.closest(selector); 2064 } 2065 } 2066 2067 return attributes.reduce(function (result, name) { 2068 if (target) { 2069 result[name] = name == 'innerText' ? target[name] : target.getAttribute(name); 2070 } 2071 return result; 2072 }, { innerText: selection.toString(), innerHTML: innerHTML }); 2073 }, 2074 destroyEditor: function (ref) { 2075 if (ref) { 2076 ref.removeEventListener('input', ref.inputListener); 2077 ref.removeEventListener('paste', ref.pasteListener); 2078 ref.removeEventListener('keydown', ref.keydownListener); 2079 ref.removeEventListener('click', ref.clickListener); 2080 document.removeEventListener('selectionchange', ref.selectionChangeListener); 2081 } 2082 }, 2083 startDrag: function (ref, instance, handler) { 2084 if (!ref) { 2085 return { left: 0, top: 0, width: 0, height: 0 }; 2086 } 2087 ref.mouseMoveHandler = function (e) { 2088 instance.invokeMethodAsync(handler, { clientX: e.clientX, clientY: e.clientY }); 2089 }; 2090 ref.touchMoveHandler = function (e) { 2091 if (e.targetTouches[0] && ref.contains(e.targetTouches[0].target)) { 2092 instance.invokeMethodAsync(handler, { clientX: e.targetTouches[0].clientX, clientY: e.targetTouches[0].clientY }); 2093 } 2094 }; 2095 ref.mouseUpHandler = function (e) { 2096 Radzen.endDrag(ref); 2097 }; 2098 document.addEventListener('mousemove', ref.mouseMoveHandler); 2099 document.addEventListener('mouseup', ref.mouseUpHandler); 2100 document.addEventListener('touchmove', ref.touchMoveHandler, { passive: true, capture: true }) 2101 document.addEventListener('touchend', ref.mouseUpHandler, { passive: true }); 2102 return Radzen.clientRect(ref); 2103 }, 2104 submit: function (form) { 2105 form.submit(); 2106 }, 2107 clientRect: function (arg) { 2108 var el = arg instanceof Element || arg instanceof HTMLDocument 2109 ? arg 2110 : document.getElementById(arg); 2111 var rect = el.getBoundingClientRect(); 2112 return { left: rect.left, top: rect.top, width: rect.width, height: rect.height }; 2113 }, 2114 endDrag: function (ref) { 2115 document.removeEventListener('mousemove', ref.mouseMoveHandler); 2116 document.removeEventListener('mouseup', ref.mouseUpHandler); 2117 document.removeEventListener('touchmove', ref.touchMoveHandler) 2118 document.removeEventListener('touchend', ref.mouseUpHandler); 2119 }, 2120 startColumnReorder: function(id) { 2121 var el = document.getElementById(id + '-drag'); 2122 var cell = el.parentNode.parentNode; 2123 var visual = document.createElement("th"); 2124 visual.className = cell.className + ' rz-column-draggable'; 2125 visual.style = cell.style; 2126 visual.style.display = 'none'; 2127 visual.style.position = 'absolute'; 2128 visual.style.height = cell.offsetHeight + 'px'; 2129 visual.style.width = cell.offsetWidth + 'px'; 2130 visual.style.zIndex = 2000; 2131 visual.innerHTML = cell.firstChild.outerHTML; 2132 visual.id = id + 'visual'; 2133 document.body.appendChild(visual); 2134 2135 var resizers = cell.parentNode.querySelectorAll('.rz-column-resizer'); 2136 for (let i = 0; i < resizers.length; i++) { 2137 resizers[i].style.display = 'none'; 2138 } 2139 2140 Radzen[id + 'end'] = function (e) { 2141 var el = document.getElementById(id + 'visual'); 2142 if (el) { 2143 document.body.removeChild(el); 2144 Radzen[id + 'end'] = null; 2145 Radzen[id + 'move'] = null; 2146 var resizers = cell.parentNode.querySelectorAll('.rz-column-resizer'); 2147 for (let i = 0; i < resizers.length; i++) { 2148 resizers[i].style.display = 'block'; 2149 } 2150 } 2151 } 2152 document.removeEventListener('click', Radzen[id + 'end']); 2153 document.addEventListener('click', Radzen[id + 'end']); 2154 2155 Radzen[id + 'move'] = function (e) { 2156 var el = document.getElementById(id + 'visual'); 2157 if (el) { 2158 el.style.display = 'block'; 2159 2160 if (/Edge/.test(navigator.userAgent)) { 2161 var scrollLeft = document.body.scrollLeft; 2162 var scrollTop = document.body.scrollTop; 2163 } else { 2164 var scrollLeft = document.documentElement.scrollLeft; 2165 var scrollTop = document.documentElement.scrollTop; 2166 } 2167 2168 el.style.top = e.clientY + scrollTop + 10 + 'px'; 2169 el.style.left = e.clientX + scrollLeft + 10 + 'px'; 2170 } 2171 } 2172 document.removeEventListener('mousemove', Radzen[id + 'move']); 2173 document.addEventListener('mousemove', Radzen[id + 'move']); 2174 }, 2175 stopColumnResize: function (id, grid, columnIndex) { 2176 var el = document.getElementById(id + '-resizer'); 2177 if(!el) return; 2178 var cell = el.parentNode.parentNode; 2179 if (!cell) return; 2180 if (Radzen[el]) { 2181 grid.invokeMethodAsync( 2182 'RadzenGrid.OnColumnResized', 2183 columnIndex, 2184 cell.getBoundingClientRect().width 2185 ); 2186 el.style.width = null; 2187 document.removeEventListener('mousemove', Radzen[el].mouseMoveHandler); 2188 document.removeEventListener('mouseup', Radzen[el].mouseUpHandler); 2189 document.removeEventListener('touchmove', Radzen[el].touchMoveHandler) 2190 document.removeEventListener('touchend', Radzen[el].mouseUpHandler); 2191 Radzen[el] = null; 2192 } 2193 }, 2194 startColumnResize: function(id, grid, columnIndex, clientX) { 2195 var el = document.getElementById(id + '-resizer'); 2196 var cell = el.parentNode.parentNode; 2197 var col = document.getElementById(id + '-col'); 2198 var dataCol = document.getElementById(id + '-data-col'); 2199 var footerCol = document.getElementById(id + '-footer-col'); 2200 Radzen[el] = { 2201 clientX: clientX, 2202 width: cell.getBoundingClientRect().width, 2203 mouseUpHandler: function (e) { 2204 if (Radzen[el]) { 2205 grid.invokeMethodAsync( 2206 'RadzenGrid.OnColumnResized', 2207 columnIndex, 2208 cell.getBoundingClientRect().width 2209 ); 2210 el.style.width = null; 2211 document.removeEventListener('mousemove', Radzen[el].mouseMoveHandler); 2212 document.removeEventListener('mouseup', Radzen[el].mouseUpHandler); 2213 document.removeEventListener('touchmove', Radzen[el].touchMoveHandler) 2214 document.removeEventListener('touchend', Radzen[el].mouseUpHandler); 2215 Radzen[el] = null; 2216 } 2217 }, 2218 mouseMoveHandler: function (e) { 2219 if (Radzen[el]) { 2220 var widthFloat = (Radzen[el].width - (Radzen.isRTL(cell) ? -1 : 1) * (Radzen[el].clientX - e.clientX)); 2221 var minWidth = parseFloat(cell.style.minWidth || 0) 2222 var maxWidth = parseFloat(cell.style.maxWidth || 0) 2223 2224 if (widthFloat < minWidth) { 2225 widthFloat = minWidth; 2226 } 2227 2228 if (cell.style.maxWidth && widthFloat > maxWidth) { 2229 widthFloat = maxWidth; 2230 } 2231 2232 var width = widthFloat + 'px'; 2233 2234 if (cell) { 2235 cell.style.width = width; 2236 } 2237 if (col) { 2238 col.style.width = width; 2239 } 2240 if (dataCol) { 2241 dataCol.style.width = width; 2242 } 2243 if (footerCol) { 2244 footerCol.style.width = width; 2245 } 2246 } 2247 }, 2248 touchMoveHandler: function (e) { 2249 if (e.targetTouches[0]) { 2250 Radzen[el].mouseMoveHandler(e.targetTouches[0]); 2251 } 2252 } 2253 }; 2254 el.style.width = "100%"; 2255 document.addEventListener('mousemove', Radzen[el].mouseMoveHandler); 2256 document.addEventListener('mouseup', Radzen[el].mouseUpHandler); 2257 document.addEventListener('touchmove', Radzen[el].touchMoveHandler, { passive: true }) 2258 document.addEventListener('touchend', Radzen[el].mouseUpHandler, { passive: true });
2259 }, 2260 startSplitterResize: function(id, 2261 splitter, 2262 paneId, 2263 paneNextId, 2264 orientation, 2265 clientPos, 2266 minValue, 2267 maxValue, 2268 minNextValue, 2269 maxNextValue) { 2270 2271 var el = document.getElementById(id); 2272 var pane = document.getElementById(paneId); 2273 var paneNext = document.getElementById(paneNextId); 2274 var paneLength; 2275 var paneNextLength; 2276 var panePerc; 2277 var paneNextPerc; 2278 var isHOrientation=orientation == 'Horizontal'; 2279 2280 var totalLength = 0.0; 2281 Array.from(el.children).forEach(element => { 2282 totalLength += isHOrientation 2283 ? element.getBoundingClientRect().width 2284 : element.getBoundingClientRect().height; 2285 }); 2286 2287 if (pane) { 2288 paneLength = isHOrientation 2289 ? pane.getBoundingClientRect().width 2290 : pane.getBoundingClientRect().height; 2291 2292 panePerc = (paneLength / totalLength * 100) + '%'; 2293 } 2294 2295 if (paneNext) { 2296 paneNextLength = isHOrientation 2297 ? paneNext.getBoundingClientRect().width 2298 : paneNext.getBoundingClientRect().height; 2299 2300 paneNextPerc = (paneNextLength / totalLength * 100) + '%'; 2301 } 2302 2303 function ensurevalue(value) { 2304 if (!value) 2305 return null; 2306 2307 value=value.trim().toLowerCase(); 2308 2309 if (value.endsWith("%")) 2310 return totalLength*parseFloat(value)/100; 2311 2312 if (value.endsWith("px")) 2313 return parseFloat(value); 2314 2315 throw 'Invalid value'; 2316 } 2317 2318 minValue=ensurevalue(minValue); 2319 maxValue=ensurevalue(maxValue); 2320 minNextValue=ensurevalue(minNextValue); 2321 maxNextValue=ensurevalue(maxNextValue); 2322 2323 Radzen[el] = { 2324 clientPos: clientPos, 2325 panePerc: parseFloat(panePerc), 2326 paneNextPerc: isFinite(parseFloat(paneNextPerc)) ? parseFloat(paneNextPerc) : 0, 2327 paneLength: paneLength, 2328 paneNextLength: isFinite(paneNextLength) ? paneNextLength : 0, 2329 mouseUpHandler: function(e) { 2330 if (Radzen[el]) { 2331 splitter.invokeMethodAsync( 2332 'RadzenSplitter.OnPaneResized', 2333 parseInt(pane.getAttribute('data-index')), 2334 parseFloat(pane.style.flexBasis), 2335 paneNext ? parseInt(paneNext.getAttribute('data-index')) : null, 2336 paneNext ? parseFloat(paneNext.style.flexBasis) : null 2337 ); 2338 2339 document.removeEventListener('pointerup', Radzen[el].mouseUpHandler); 2340 document.removeEventListener('pointermove', Radzen[el].mouseMoveHandler); 2341 el.removeEventListener('touchmove', preventDefaultAndStopPropagation); 2342 Radzen[el] = null; 2343 } 2344 }, 2345 mouseMoveHandler: function(e) { 2346 if (Radzen[el]) { 2347 2348 splitter.invokeMethodAsync( 2349 'RadzenSplitter.OnPaneResizing' 2350 ); 2351 2352 var spacePerc = Radzen[el].panePerc + Radzen[el].paneNextPerc; 2353 var spaceLength = Radzen[el].paneLength + Radzen[el].paneNextLength; 2354 2355 var length = (Radzen[el].paneLength - 2356 (isHOrientation && Radzen.isRTL(e.target) ? -1 : 1) * (Radzen[el].clientPos - (isHOrientation ? e.clientX : e.clientY))); 2357 2358 if (length > spaceLength) 2359 length = spaceLength; 2360 2361 if (minValue && length < minValue) length = minValue; 2362 if (maxValue && length > maxValue) length = maxValue; 2363 2364 if (paneNext) { 2365 var nextSpace=spaceLength-length; 2366 if (minNextValue && nextSpace < minNextValue) length = spaceLength-minNextValue; 2367 if (maxNextValue && nextSpace >
2367 maxNextValue) length = spaceLength+maxNextValue; 2368 } 2369 2370 var perc = length / Radzen[el].paneLength; 2371 if (!isFinite(perc)) { 2372 perc = 1; 2373 Radzen[el].panePerc = 0.1; 2374 Radzen[el].paneLength =isHOrientation 2375 ? pane.getBoundingClientRect().width 2376 : pane.getBoundingClientRect().height; 2377 } 2378 2379 var newPerc = Radzen[el].panePerc * perc; 2380 if (newPerc < 0) newPerc = 0; 2381 if (newPerc > 100) newPerc = 100; 2382 2383 pane.style.flexBasis = newPerc + '%'; 2384 if (paneNext) 2385 paneNext.style.flexBasis = (spacePerc - newPerc) + '%'; 2386 } 2387 }, 2388 touchMoveHandler: function(e) { 2389 if (e.targetTouches[0]) { 2390 Radzen[el].mouseMoveHandler(e.targetTouches[0]); 2391 } 2392 } 2393 }; 2394 2395 const preventDefaultAndStopPropagation = (ev) => { 2396 ev.preventDefault(); 2397 ev.stopPropagation(); 2398 }; 2399 document.addEventListener('pointerup', Radzen[el].mouseUpHandler); 2400 document.addEventListener('pointermove', Radzen[el].mouseMoveHandler); 2401 el.addEventListener('touchmove', preventDefaultAndStopPropagation, { passive: false }); 2402 }, 2403 resizeSplitter(id, e) { 2404 var el = document.getElementById(id); 2405 if (el && Radzen[el]) { 2406 Radzen[el].mouseMoveHandler(e); 2407 Radzen[el].mouseUpHandler(e); 2408 } 2409 }, 2410 openWaiting: function() { 2411 if (document.documentElement.scrollHeight > document.documentElement.clientHeight) { 2412 document.body.classList.add('no-scroll'); 2413 } 2414 if (Radzen.WaitingIntervalId != null) { 2415 clearInterval(Radzen.WaitingIntervalId); 2416 } 2417 2418 setTimeout(function() { 2419 var timerObj = document.getElementsByClassName('rz-waiting-timer'); 2420 if (timerObj.length == 0) return; 2421 var timerStart = new Date().getTime(); 2422 Radzen.WaitingIntervalId = setInterval(function() { 2423 if (timerObj == null || timerObj[0] == null) { 2424 clearInterval(Radzen.WaitingIntervalId); 2425 } else { 2426 var time = new Date(new Date().getTime() - timerStart); 2427 timerObj[0].innerHTML = Math.floor(time / 1000) + "." + Math.floor((time % 1000) / 100); 2428 } 2429 }, 2430 100); 2431 }, 2432 100); 2433 }, 2434 closeWaiting: function() { 2435 document.body.classList.remove('no-scroll'); 2436 if (Radzen.WaitingIntervalId != null) { 2437 clearInterval(Radzen.WaitingIntervalId); 2438 Radzen.WaitingIntervalId = null; 2439 } 2440 }, 2441 toggleDictation: function (componentRef, language) { 2442 function start() { 2443 const SpeechRecognition = window.SpeechRecognition || window.webkitSpeechRecognition; 2444 2445 if (!SpeechRecognition) { 2446 return; 2447 } 2448 2449 radzenRecognition = new SpeechRecognition(); 2450 radzenRecognition.componentRef = componentRef; 2451 radzenRecognition.continuous = true; 2452 2453 if (language) { 2454 radzenRecognition.lang = language; 2455 } 2456 2457 radzenRecognition.onresult = function (event) { 2458 if (event.results.length < 1) { 2459 return; 2460 } 2461 2462 let current = event.results[event.results.length - 1][0] 2463 let result = current.transcript; 2464 2465 componentRef.invokeMethodAsync("OnResult", result); 2466 }; 2467 radzenRecognition.onend = function (event) { 2468 componentRef.invokeMethodAsync("StopRecording"); 2469 radzenRecognition = null; 2470 }; 2471 radzenRecognition.start(); 2472 } 2473 2474 if (radzenRecognition) { 2475 if (radzenRecognition.componentRef._id != componentRef._id) { 2476 radzenRecognition.addEventListener('end', start); 2477 } 2478 radzenRecognition.stop(); 2479 } else { 2480 start(); 2481 } 2482 }, 2483 openChartTooltip: function (chart, x, y, id, instance, callback) { 2484 Radzen.closeTooltip(id); 2485 2486 var chartRect = chart.getBoundingClientRect(); 2487 x = Math.max(2, chartRect.left + x); 2488 y = Math.max(2, chartRect.top + y); 2489 Radzen.openPopup(chart, id, false, null, x, y, instance, callback, true, false, false); 2490 2491 var popup = document.getElementById(id); 2492 if (!popup) { 2493 return; 2494 } 2495 var tooltipContent = popup.children[0]; 2496 var tooltipContentRect = tooltipContent.getBoundingClientRect(); 2497 var tooltipContentClassName = 'rz-top-chart-tooltip'; 2498 if (y - tooltipContentRect.height < 0) { 2499 tooltipContentClassName = 'rz-bottom-chart-tooltip'; 2500 } 2501 tooltipContent.classList.remove('rz-top-chart-tooltip'); 2502 tooltipContent.classList.remove('rz-bottom-chart-tooltip'); 2503 tooltipContent.classList.add(tooltipContentClassName); 2504 } 2505};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.