import { tryReference, types } from "mobx-state-tree";
|
import Registry from "../core/Registry";
|
import { AreaMixin } from "../mixins/AreaMixin";
|
import { HighlightMixin } from "../mixins/HighlightMixin";
|
import NormalizationMixin from "../mixins/Normalization";
|
import RegionsMixin from "../mixins/Regions";
|
import { RichTextModel } from "../tags/object/RichText/model";
|
import { isDefined } from "../utils/utilities";
|
|
const GlobalOffsets = types
|
.model("GlobalOffset", {
|
start: types.number,
|
end: types.number,
|
// distinguish loaded globalOffsets from user's annotation and internally calculated one;
|
// we should rely only on calculated offsets to find ranges, see initRangeAndOffsets();
|
// it should be in the model to avoid reinit on undo/redo.
|
calculated: false,
|
})
|
.views((self) => ({
|
get serialized() {
|
// should never get to serialized result
|
return { start: self.start, end: self.end };
|
},
|
}));
|
|
const Model = types
|
.model("RichTextRegionModel", {
|
type: "richtextregion",
|
object: types.late(() => types.reference(RichTextModel)),
|
|
startOffset: types.integer,
|
endOffset: types.integer,
|
start: types.string,
|
end: types.string,
|
text: types.maybeNull(types.string),
|
isText: types.optional(types.boolean, false),
|
globalOffsets: types.maybeNull(GlobalOffsets),
|
})
|
.volatile(() => ({
|
hideable: true,
|
}))
|
.views((self) => ({
|
get parent() {
|
return tryReference(() => self.object);
|
},
|
getRegionElement() {
|
return self._spans?.[0];
|
},
|
get displayValue() {
|
return self.text;
|
},
|
}))
|
.actions((self) => ({
|
beforeDestroy() {
|
try {
|
self.removeHighlight();
|
} catch (e) {
|
console.warn(e);
|
}
|
},
|
|
/**
|
* Applies additional data from the given result.
|
* In the results we have almost all data meaningful stored in value but in regions we have two places for it:
|
* - region itself (fields in model)
|
* - related results (in results array)
|
* so for some fields we should control more if we want to apply fields that could be in both places into the region.
|
* This method also helps to avoid region type detection at the deserialization stage.
|
*
|
* @param {Object} result - The result object containing additional data.
|
* @returns {void}
|
*/
|
applyAdditionalDataFromResult(result) {
|
const isMainResult = result?.type?.endsWith("labels");
|
const hasText = isDefined(result?.value?.text);
|
|
if (isMainResult && hasText) {
|
self.text = result.value.text;
|
}
|
},
|
|
serialize() {
|
const res = {
|
value: {},
|
};
|
|
if (self.isText) {
|
Object.assign(res.value, {
|
start: self.startOffset,
|
end: self.endOffset,
|
});
|
} else {
|
try {
|
const xpathRange = self.parent.globalOffsetsToRelativeOffsets(self.globalOffsets);
|
|
Object.assign(res.value, {
|
...xpathRange,
|
globalOffsets: self.globalOffsets.serialized,
|
});
|
} catch (e) {
|
// regions may be broken, so they don't have globalOffsets
|
// or they can't be applied on current html, so just keep them untouched
|
const { start, end, startOffset, endOffset } = self;
|
|
Object.assign(res.value, { start, end, startOffset, endOffset });
|
|
if (self.globalOffsets) {
|
Object.assign(res.value, {
|
globalOffsets: self.globalOffsets.serialized,
|
});
|
}
|
}
|
}
|
|
if (self.object.savetextresult === "yes" && isDefined(self.text)) {
|
res.value.text = self.text;
|
}
|
|
return res;
|
},
|
|
// text regions have only start/end, so we should update start/endOffsets with these values
|
updateTextOffsets(startOffset, endOffset) {
|
Object.assign(self, { startOffset, endOffset });
|
},
|
|
updateGlobalOffsets(start, end) {
|
self.globalOffsets = GlobalOffsets.create({
|
start,
|
end,
|
calculated: true,
|
});
|
},
|
|
updateXPathsFromGlobalOffsets() {
|
const xPathRange = self.parent.globalOffsetsToRelativeOffsets(self.globalOffsets);
|
|
if (xPathRange) {
|
self._setXPaths(xPathRange);
|
}
|
},
|
|
/**
|
* Main method to detect HTML range and its offsets for LSF region
|
* globalOffsets are used for:
|
* - internal use (get ranges to highlight quickly)
|
* - end users convenience
|
* - for emergencies (xpath invalid)
|
*/
|
initRangeAndOffsets() {
|
if (self.globalOffsets?.calculated) return;
|
|
// 0. Text regions are simple — just get range by offsets
|
if (self.isText) {
|
const { startOffset: start, endOffset: end } = self;
|
|
self.globalOffsets = { start, end, calculated: true };
|
return;
|
}
|
|
// 1. first try to find range by xpath in the original layout
|
|
const offsets = self.parent.relativeOffsetsToGlobalOffsets(
|
self.start,
|
self.startOffset,
|
self.end,
|
self.endOffset,
|
);
|
|
if (offsets) {
|
const [start, end] = offsets;
|
|
self.globalOffsets = { start, end, calculated: true };
|
return;
|
}
|
|
// 2. then try to find range on dynamically changed document
|
// @todo or not todo?
|
|
// 3. if xpaths are broken use globalOffsets if given
|
if (self.globalOffsets) {
|
self.updateXPathsFromGlobalOffsets();
|
|
return;
|
}
|
|
// 4. out of options — region is broken
|
// @todo show error in console and regions list
|
return undefined;
|
},
|
|
_setXPaths(value) {
|
self.start = value.start;
|
self.end = value.end;
|
self.startOffset = value.startOffset;
|
self.endOffset = value.endOffset;
|
},
|
}));
|
|
const RichTextRegionModel = types.compose(
|
"RichTextRegionModel",
|
RegionsMixin,
|
AreaMixin,
|
NormalizationMixin,
|
Model,
|
HighlightMixin,
|
);
|
|
Registry.addRegionType(RichTextRegionModel, "text");
|
Registry.addRegionType(RichTextRegionModel, "hypertext");
|
Registry.addRegionType(RichTextRegionModel, "richtext");
|
|
export { RichTextRegionModel };
|
