@syncfusion/ej2-pdfviewer
Version:
Essential JS 2 PDF viewer Component
371 lines (370 loc) • 16.7 kB
JavaScript
import { isNullOrUndefined, Browser, getComponent } from '@syncfusion/ej2-base';
import { enableDisableToolbarItems, updateSelectAllCheckbox } from './organize-toolbar';
import { setTileButtonEnableState } from './organize-thumbnail';
import { deleteTempPage } from './organize-undoredoutils';
import { updatePageNumber, updateTotalPageCount } from './organize-initialization';
import { formatPageRanges } from './organize-extract';
/**
* @private
* @param {number} startIndex - It's describe about a page start index.
* @param {number} endIndex - It's describe about a page end index.
* @returns { void }
*/
export function selectRange(startIndex, endIndex) {
var minIndex = Math.min(startIndex, endIndex);
var maxIndex = Math.max(startIndex, endIndex);
for (var i = minIndex; i <= maxIndex; i++) {
var tile = this.tileAreaDiv.children[parseInt(i.toString(), 10)];
selectTile.call(this, tile);
}
}
/**
* @private
* @param {HTMLElement} tile - It's describe about a select tile div.
* @returns { void }
*/
export function selectTile(tile) {
if (!isNullOrUndefined(tile)) {
var checkbox = tile.closest('.e-pv-organize-anchor-node').querySelector('.e-pv-organize-tile-checkbox');
if (checkbox) {
checkbox.checked = true;
setSelectionRingStyle.call(this, checkbox, tile);
}
}
}
/**
* @private
* @param {HTMLElement} tile - It's describe about a deselect tile div.
* @returns { void }
*/
export function deselectTile(tile) {
if (!isNullOrUndefined(tile)) {
var checkbox = tile.closest('.e-pv-organize-anchor-node').querySelector('.e-pv-organize-tile-checkbox');
if (checkbox) {
checkbox.checked = false;
setSelectionRingStyle.call(this, checkbox, tile);
}
}
}
/**
* @private
* @returns { void }
*/
export function clearSelection() {
var _this = this;
var selectedTiles = document.querySelectorAll('.e-pv-organize-node-selection-ring');
selectedTiles.forEach(function (tile) {
var checkbox = tile.closest('.e-pv-organize-anchor-node').querySelector('.e-pv-organize-tile-checkbox');
checkbox.checked = false;
setSelectionRingStyle.call(_this, checkbox, tile);
});
updateSelectAllCheckbox.call(this);
enableDisableToolbarItems.call(this);
}
/**
* @private
* @returns { void }
*/
export function selectAllTiles() {
var _this = this;
Array.from(this.tileAreaDiv.children).forEach(function (tile) {
selectTile.call(_this, tile);
});
updateSelectAllCheckbox.call(this);
enableDisableToolbarItems.call(this);
}
/**
* @private
* @returns { void }
*/
export function disableTileDeleteButton() {
if (this.tileAreaDiv.childElementCount === 1) {
var mainTileElement = this.tileAreaDiv.querySelector('.e-pv-organize-anchor-node');
var deleteButton = mainTileElement.querySelector('.e-pv-delete-button');
if (!isNullOrUndefined(deleteButton)) {
deleteButton.setAttribute('disabled', 'disabled');
deleteButton.firstElementChild.classList.add('e-disabled');
}
}
else {
for (var i = 0; i < this.tileAreaDiv.childElementCount; i++) {
var mainTileElement = void 0;
if (this.tileAreaDiv.childNodes[parseInt(i.toString(), 10)].classList.contains('e-pv-organize-anchor-node')) {
mainTileElement = this.tileAreaDiv.childNodes[parseInt(i.toString(), 10)];
}
else {
mainTileElement = this.tileAreaDiv.childNodes[parseInt(i.toString(), 10)].querySelector('.e-pv-organize-anchor-node');
}
var deleteButton = mainTileElement.querySelector('.e-pv-delete-button');
if (!isNullOrUndefined(deleteButton) && this.pdfViewer.pageOrganizerSettings.canDelete) {
deleteButton.removeAttribute('disabled');
deleteButton.firstElementChild.classList.remove('e-disabled');
}
}
}
}
/**
* @private
* @returns { void }
*/
export function disableTileCopyRotateButton() {
for (var i = 0; i < this.tempOrganizePagesCollection.length; i++) {
var pageInfo = this.tempOrganizePagesCollection[parseInt(i.toString(), 10)];
if (pageInfo.isImportedDoc && !pageInfo.isDeleted && !pageInfo.currentPageIndex != null) {
var mainTileElement = this.tileAreaDiv.querySelector("[data-page-order=\"" + pageInfo.currentPageIndex.toString() + "\"]");
var rotateLeftButton = mainTileElement.querySelector('.e-pv-rotate-left-button');
var rotateRightButton = mainTileElement.querySelector('.e-pv-rotate-right-button');
var copyButton = mainTileElement.querySelector('.e-pv-copy-button');
if (!isNullOrUndefined(rotateLeftButton)) {
rotateLeftButton.setAttribute('disabled', 'disabled');
rotateLeftButton.firstElementChild.classList.add('e-disabled');
}
if (!isNullOrUndefined(rotateRightButton)) {
rotateRightButton.setAttribute('disabled', 'disabled');
rotateRightButton.firstElementChild.classList.add('e-disabled');
}
if (!isNullOrUndefined(copyButton)) {
copyButton.setAttribute('disabled', 'disabled');
copyButton.firstElementChild.classList.add('e-disabled');
}
}
}
}
/**
* @private
* @returns { void }
*/
export function disableTileCopyButton() {
for (var i = 0; i < this.tempOrganizePagesCollection.length; i++) {
var pageInfo = this.tempOrganizePagesCollection[parseInt(i.toString(), 10)];
if (pageInfo.isInserted && !pageInfo.isDeleted && !pageInfo.currentPageIndex != null) {
var mainTileElement = this.tileAreaDiv.querySelector("[data-page-order=\"" + pageInfo.currentPageIndex.toString() + "\"]");
var copyButton = mainTileElement.querySelector('.e-pv-copy-button');
if (!isNullOrUndefined(copyButton)) {
copyButton.setAttribute('disabled', 'disabled');
copyButton.firstElementChild.classList.add('e-disabled');
}
}
}
}
/**
* @private
* @param {any} args - It's describe about a event.
* @returns { void }
*/
export function onSelectClick(args) {
var checkboxElement = event.currentTarget.querySelector('.e-pv-organize-tile-checkbox');
var pageElement = checkboxElement.closest('.e-pv-organize-anchor-node');
if (args.event.pointerType === 'mouse' || (!this.isTouchEvent && !(Browser.isDevice && !this.pdfViewer.enableDesktopMode))) {
if (this.isClickedOnCheckBox && !isNullOrUndefined(checkboxElement) && !isNullOrUndefined(pageElement)) {
if (pageElement) {
setSelectionRingStyle.call(this, checkboxElement, pageElement);
}
}
else if (!isNullOrUndefined(checkboxElement) && !isNullOrUndefined(pageElement)) {
if (!(this.ctrlKey || this.shiftKey)) {
var previouslySelectedTiles = document.querySelectorAll('.e-pv-organize-node-selection-ring');
if (previouslySelectedTiles.length > 0) {
for (var i = 0; i < previouslySelectedTiles.length; i++) {
var previousCheckbox = previouslySelectedTiles[parseInt(i.toString(), 10)].closest('.e-pv-organize-anchor-node').querySelector('.e-pv-organize-tile-checkbox');
previousCheckbox.checked = false;
setSelectionRingStyle.call(this, previousCheckbox, previouslySelectedTiles[parseInt(i.toString(), 10)]);
}
}
if (!this.isClickedOnCheckBox) {
checkboxElement.checked = true;
}
}
if (this.shiftKey) {
checkboxElement.checked = true;
}
setSelectionRingStyle.call(this, checkboxElement, pageElement);
}
}
else if (args.event.pointerType === 'touch' || this.isTouchEvent || (Browser.isDevice && !this.pdfViewer.enableDesktopMode)) {
if (!isNullOrUndefined(checkboxElement) && !isNullOrUndefined(pageElement)) {
if (pageElement) {
setSelectionRingStyle.call(this, checkboxElement, pageElement);
}
var buttonDiv = pageElement.querySelector('.e-pv-organize-buttondiv');
if (!isNullOrUndefined(buttonDiv) && buttonDiv.childElementCount > 1) {
if (checkboxElement.checked) {
buttonDiv.style.display = 'flex';
}
else {
buttonDiv.style.display = 'none';
}
for (var _i = 0, _a = Array.from(buttonDiv.children); _i < _a.length; _i++) {
var button = _a[_i];
setTileButtonEnableState.call(this, button);
}
}
}
}
updateSelectAllCheckbox.call(this);
enableDisableToolbarItems.call(this);
if (this.totalCheckedCount > 1) {
for (var i = 0; i < pageElement.querySelector('.e-pv-organize-buttondiv').childElementCount; i++) {
var id = pageElement.querySelector('.e-pv-organize-buttondiv').children[parseInt(i.toString(), 10)].id;
if (id.split('_')[1] === 'insert') {
pageElement.querySelector('.e-pv-organize-buttondiv').children[parseInt(i.toString(), 10)].style.display = 'flex';
}
else {
pageElement.querySelector('.e-pv-organize-buttondiv').children[parseInt(i.toString(), 10)].style.display = 'none';
}
}
}
}
/**
* @private
* @param {HTMLInputElement} checkbox - It's describe about a check box element.
* @param {HTMLInputElement} anchornode - It's describe about a anchornode element.
* @returns { void }
*/
export function setSelectionRingStyle(checkbox, anchornode) {
if (!checkbox.checked) {
anchornode.classList.remove('e-pv-organize-node-selection-ring');
}
else {
anchornode.classList.add('e-pv-organize-node-selection-ring');
}
var childrenArray = Array.from(anchornode.children);
for (var _i = 0, childrenArray_1 = childrenArray; _i < childrenArray_1.length; _i++) {
var child = childrenArray_1[_i];
var childArray = Array.from(child.children);
for (var _a = 0, childArray_1 = childArray; _a < childArray_1.length; _a++) {
var subchild = childArray_1[_a];
if (subchild.classList.contains('e-checkbox-wrapper')) {
var id = (subchild.getElementsByClassName('e-control e-checkbox e-lib')[0]).id;
var cbObj = getComponent(document.getElementById(id), 'checkbox');
if (checkbox.checked) {
subchild.style.display = 'block';
subchild.children[0].style.display = 'block';
cbObj.checked = true;
}
else {
subchild.style.display = 'none';
subchild.children[0].style.display = 'none';
cbObj.checked = false;
if (!isNullOrUndefined(subchild.parentElement) && !isNullOrUndefined(subchild.parentElement.lastElementChild) && subchild.parentElement.lastElementChild.classList.contains('e-pv-organize-buttondiv')) {
subchild.parentElement.lastElementChild.style.display = 'none';
}
}
}
}
}
// If extract secondary toolbar is visible, sync the selected pages to the input box (only in client-side mode)
if (this.pdfViewerBase && this.pdfViewerBase.clientSideRendering && this.isExtractToolbarVisible && this.extractPagesInput &&
this.tileAreaDiv) {
var selectedNodes = this.tileAreaDiv.querySelectorAll('.e-pv-organize-node-selection-ring');
var selectedPages_1 = [];
selectedNodes.forEach(function (selectedElement) {
var mainTileElement = selectedElement.closest('.e-pv-organize-anchor-node');
if (mainTileElement) {
var pageOrderAttr = mainTileElement.getAttribute('data-page-order');
if (pageOrderAttr !== null) {
selectedPages_1.push(parseInt(pageOrderAttr, 10) + 1);
}
}
});
var formatted = formatPageRanges(selectedPages_1.join(','), this.tileAreaDiv.childElementCount);
this.extractPagesInput.value = formatted;
if (this.extractPagesInput.element) {
this.extractPagesInput.element.value = formatted;
}
// Ensure Extract button enabled/disabled reflects current input value
var createBtn = document.getElementsByClassName('e-pv-extractbtn')[0];
if (createBtn) {
createBtn.disabled = (formatted.trim() === '');
}
}
}
/**
* @private
* @param {number} currentPageIndex - It's describe about a current page index.
* @param {number} currentRotation - It's describe about a current page rotation.
* @returns { void }
*/
export function updateTempRotationDetail(currentPageIndex, currentRotation) {
if (this.pdfViewer.pageOrganizerSettings.canRotate) {
var tempIndex = this.tempOrganizePagesCollection.findIndex(function (item) { return item.currentPageIndex === currentPageIndex; });
if (tempIndex !== -1) {
var rotateAngle = this.tempOrganizePagesCollection[parseInt(tempIndex.toString(), 10)].rotateAngle +
currentRotation;
if (rotateAngle === -90) {
rotateAngle = 0;
}
// If the pageIndex is found in the array
this.tempOrganizePagesCollection[parseInt(tempIndex.toString(), 10)].rotateAngle =
Math.abs((this.tempOrganizePagesCollection[parseInt(tempIndex.toString(), 10)].rotateAngle +
currentRotation + 360) % 360);
}
}
organizeWindowFocus.call(this);
}
/**
* @private
* @returns { void }
*/
export function organizeWindowFocus() {
var elementID = this.pdfViewer.element.id;
document.getElementById(elementID + '_organize_window').focus();
}
/**
* @private
* @param {number[]} selectedPageIndexes - It's describe about a selected page indexes.
* @param {number} hoveredIndex - It's describe about a hover page index.
* @returns { void }
*/
export function isHoveredOnSelectedPages(selectedPageIndexes, hoveredIndex) {
var isHoveredOnSelectedPageIndex = false;
for (var i = 0; i < selectedPageIndexes.length; i++) {
if (selectedPageIndexes[parseInt(i.toString(), 10)] === hoveredIndex) {
isHoveredOnSelectedPageIndex = true;
break;
}
}
return isHoveredOnSelectedPageIndex;
}
/**
* @private
* @param {HTMLInputElement} mainTileElement - It's describe about a main tile element.
* @returns { void }
*/
export function deletePageElement(mainTileElement) {
if (this.pdfViewer.pageOrganizerSettings.canDelete && this.tileAreaDiv.childElementCount > 1) {
var pageOrder = parseInt(mainTileElement.getAttribute('data-page-order'), 10);
deleteTempPage.call(this, pageOrder, mainTileElement);
var deleteButton = mainTileElement.querySelector('.e-pv-delete-button');
if (!isNullOrUndefined(deleteButton) && !isNullOrUndefined(deleteButton.ej2_instances) &&
deleteButton.ej2_instances.length > 0) {
// We are destroying the button component to remove tooltip
deleteButton.ej2_instances[0].destroy();
}
this.tileAreaDiv.removeChild(mainTileElement);
updateTotalPageCount.call(this);
updatePageNumber.call(this);
updateSelectAllCheckbox.call(this);
disableTileDeleteButton.call(this);
}
}
/**
* @private
* @returns { void }
*/
export function updateTileButtons() {
var _this = this;
if (!isNullOrUndefined(this.organizeDialog) && this.organizeDialog.visible) {
var selectedTiles = Array.from(this.organizeDialog.element.querySelectorAll('.e-pv-organize-node-selection-ring'));
if (selectedTiles.length >= 1) {
selectedTiles.forEach(function (tile) {
var anchor = tile;
var buttonDiv = anchor.querySelector('.e-pv-organize-buttondiv');
if (buttonDiv && (buttonDiv.style.display !== 'none')) {
var buttons = Array.from(buttonDiv.children);
buttons.forEach(function (button) { return setTileButtonEnableState.call(_this, button); });
}
});
}
}
}