2024-12-16 19:07:15 +00:00
|
|
|
import {Command} from './command.js';
|
2024-11-28 16:25:13 +02:00
|
|
|
|
|
|
|
export class AbstractMovePageCommand extends Command {
|
2024-12-16 19:07:15 +00:00
|
|
|
constructor(startElement, endElement, pagesContainer, pagesContainerWrapper, scrollTo = false) {
|
2024-11-28 16:25:13 +02:00
|
|
|
super();
|
|
|
|
|
|
|
|
this.pagesContainer = pagesContainer;
|
|
|
|
const childArray = Array.from(this.pagesContainer.childNodes);
|
|
|
|
|
|
|
|
this.startIndex = childArray.indexOf(startElement);
|
|
|
|
this.endIndex = childArray.indexOf(endElement);
|
|
|
|
|
|
|
|
this.startElement = startElement;
|
|
|
|
this.endElement = endElement;
|
|
|
|
|
|
|
|
this.scrollTo = scrollTo;
|
|
|
|
this.pagesContainerWrapper = pagesContainerWrapper;
|
|
|
|
}
|
|
|
|
|
|
|
|
execute() {
|
|
|
|
// Check & remove page number elements here too if they exist because Firefox doesn't fire the relevant event on page move.
|
2024-12-16 19:07:15 +00:00
|
|
|
const pageNumberElement = this.startElement.querySelector('.page-number');
|
2024-11-28 16:25:13 +02:00
|
|
|
if (pageNumberElement) {
|
|
|
|
this.startElement.removeChild(pageNumberElement);
|
|
|
|
}
|
|
|
|
|
|
|
|
this.pagesContainer.removeChild(this.startElement);
|
|
|
|
if (!this.endElement) {
|
|
|
|
this.pagesContainer.append(this.startElement);
|
|
|
|
} else {
|
|
|
|
this.pagesContainer.insertBefore(this.startElement, this.endElement);
|
|
|
|
}
|
|
|
|
|
|
|
|
if (this.scrollTo) {
|
2024-12-16 19:07:15 +00:00
|
|
|
const {width} = this.startElement.getBoundingClientRect();
|
|
|
|
const vector = this.endIndex !== -1 && this.startIndex > this.endIndex ? 0 - width : width;
|
2024-11-28 16:25:13 +02:00
|
|
|
|
|
|
|
this.pagesContainerWrapper.scroll({
|
|
|
|
left: this.pagesContainerWrapper.scrollLeft + vector,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
undo() {
|
|
|
|
// Requires overriding in child classes
|
|
|
|
}
|
|
|
|
|
|
|
|
redo() {
|
|
|
|
this.execute();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export class MovePageUpCommand extends AbstractMovePageCommand {
|
2024-12-16 19:07:15 +00:00
|
|
|
constructor(startElement, endElement, pagesContainer, pagesContainerWrapper, scrollTo = false) {
|
2024-11-28 16:25:13 +02:00
|
|
|
super(startElement, endElement, pagesContainer, pagesContainerWrapper, scrollTo);
|
|
|
|
}
|
|
|
|
|
|
|
|
undo() {
|
|
|
|
if (this.endElement) {
|
|
|
|
this.pagesContainer.removeChild(this.endElement);
|
2024-12-16 19:07:15 +00:00
|
|
|
this.startElement.insertAdjacentElement('beforebegin', this.endElement);
|
2024-11-28 16:25:13 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
if (this.scrollTo) {
|
2024-12-16 19:07:15 +00:00
|
|
|
const {width} = this.startElement.getBoundingClientRect();
|
|
|
|
const vector = this.endIndex === -1 || this.startIndex <= this.endIndex ? 0 - width : width;
|
2024-11-28 16:25:13 +02:00
|
|
|
|
|
|
|
this.pagesContainerWrapper.scroll({
|
|
|
|
left: this.pagesContainerWrapper.scrollLeft - vector,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
redo() {
|
|
|
|
this.execute();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
export class MovePageDownCommand extends AbstractMovePageCommand {
|
2024-12-16 19:07:15 +00:00
|
|
|
constructor(startElement, endElement, pagesContainer, pagesContainerWrapper, scrollTo = false) {
|
2024-11-28 16:25:13 +02:00
|
|
|
super(startElement, endElement, pagesContainer, pagesContainerWrapper, scrollTo);
|
|
|
|
}
|
|
|
|
|
|
|
|
undo() {
|
|
|
|
let previousElement = this.startElement.previousSibling;
|
|
|
|
|
|
|
|
if (this.startElement) {
|
|
|
|
this.pagesContainer.removeChild(this.startElement);
|
2024-12-16 19:07:15 +00:00
|
|
|
previousElement.insertAdjacentElement('beforebegin', this.startElement);
|
2024-11-28 16:25:13 +02:00
|
|
|
}
|
|
|
|
|
|
|
|
if (this.scrollTo) {
|
2024-12-16 19:07:15 +00:00
|
|
|
const {width} = this.startElement.getBoundingClientRect();
|
|
|
|
const vector = this.endIndex === -1 || this.startIndex <= this.endIndex ? 0 - width : width;
|
2024-11-28 16:25:13 +02:00
|
|
|
|
|
|
|
this.pagesContainerWrapper.scroll({
|
|
|
|
left: this.pagesContainerWrapper.scrollLeft - vector,
|
|
|
|
});
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
redo() {
|
|
|
|
this.execute();
|
|
|
|
}
|
|
|
|
}
|