80 lines
2.2 KiB
JavaScript
80 lines
2.2 KiB
JavaScript
class CropperInterop {
|
|
static initCropper(imgId, options, dotNetObject) {
|
|
const image = document.getElementById(imgId);
|
|
if (!image) return;
|
|
|
|
// Clean up existing instance if any
|
|
if (image.cropper) {
|
|
image.cropper.destroy();
|
|
}
|
|
|
|
new Cropper(image, {
|
|
...options,
|
|
ready() {
|
|
// Optional: notify dotnet that it's ready
|
|
}
|
|
});
|
|
}
|
|
|
|
static getCroppedCanvasData(imgId) {
|
|
const image = document.getElementById(imgId);
|
|
if (!image || !image.cropper) return null;
|
|
|
|
return image.cropper.getCroppedCanvas().toDataURL();
|
|
}
|
|
|
|
static setAspectRatio(imgId, ratio) {
|
|
const image = document.getElementById(imgId);
|
|
if (!image || !image.cropper) return;
|
|
|
|
image.cropper.setAspectRatio(ratio);
|
|
}
|
|
|
|
static destroy(imgId) {
|
|
const image = document.getElementById(imgId);
|
|
if (image && image.cropper) {
|
|
image.cropper.destroy();
|
|
}
|
|
}
|
|
|
|
static setFullWidth(imgId) {
|
|
const image = document.getElementById(imgId);
|
|
if (!image || !image.cropper) return;
|
|
const data = image.cropper.getImageData();
|
|
// Use setData for natural dimensions
|
|
image.cropper.setData({ x: 0, width: data.naturalWidth });
|
|
}
|
|
|
|
static setFullHeight(imgId) {
|
|
const image = document.getElementById(imgId);
|
|
if (!image || !image.cropper) return;
|
|
const data = image.cropper.getImageData();
|
|
// Use setData for natural dimensions
|
|
image.cropper.setData({ y: 0, height: data.naturalHeight });
|
|
}
|
|
}
|
|
|
|
window.initCropper = (imgId, options, dotNetHelper) => {
|
|
CropperInterop.initCropper(imgId, options, dotNetHelper);
|
|
};
|
|
|
|
window.getCroppedImage = (imgId) => {
|
|
return CropperInterop.getCroppedCanvasData(imgId);
|
|
};
|
|
|
|
window.setCropperAspectRatio = (imgId, ratio) => {
|
|
CropperInterop.setAspectRatio(imgId, ratio);
|
|
};
|
|
|
|
window.destroyCropper = (imgId) => {
|
|
CropperInterop.destroy(imgId);
|
|
};
|
|
|
|
window.setCropperFullWidth = (imgId) => {
|
|
CropperInterop.setFullWidth(imgId);
|
|
};
|
|
|
|
window.setCropperFullHeight = (imgId) => {
|
|
CropperInterop.setFullHeight(imgId);
|
|
};
|