qwc2/utils/ImageEditor.js

QGIS Web Client

/**
 * Copyright 2024 Sourcepole AG
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree.
 */import Painterro from"painterro";import LocaleUtils from"../utils/LocaleUtils";import"../components/widgets/style/ModalDialog.css";export function showImageEditor(imageData,imageDataCallback){// Do old-school JS rather than react portal as portal event bubbling messes up Painterro
var modalDialogContainer=document.createElement("div");modalDialogContainer.className="modal-dialog-container";var modalDialog=document.createElement("div");modalDialog.className="modal-dialog";modalDialog.style.width="80%";var modalDialogTitle=document.createElement("div");modalDialogTitle.className="modal-dialog-title";var titleIcon=document.createElement("span");titleIcon.className="icon icon-paint";modalDialogTitle.appendChild(titleIcon);var titleLabel=document.createElement("span");titleLabel.innerText=LocaleUtils.tr("imageeditor.title");modalDialogTitle.appendChild(titleLabel);var closeIcon=document.createElement("span");closeIcon.className="icon icon_clickable icon-remove";modalDialogTitle.appendChild(closeIcon);modalDialog.appendChild(modalDialogTitle);var modalDialogBody=document.createElement("div");modalDialogBody.className="modal-dialog-body";modalDialogBody.id="painterro";modalDialogBody.addEventListener("keypress",function(ev){// Prevent i.e. +/- from triggering map zoom
ev.stopPropagation()});modalDialog.appendChild(modalDialogBody);modalDialogContainer.appendChild(modalDialog);document.body.appendChild(modalDialogContainer);// eslint-disable-next-line
window.ptro=Painterro({id:"painterro",hiddenTools:["open"],language:LocaleUtils.lang().slice(0,2).toLowerCase(),onBeforeClose:function onBeforeClose(hasUnsaved,doClose){if(hasUnsaved){// eslint-disable-next-line
if(confirm(LocaleUtils.tr("imageeditor.confirmclose"))){doClose()}}},onClose:function onClose(){window.ptro.hide();delete window.ptro;// Delay to next iteration to ensure ptro event handlers have executed
setTimeout(function(){document.body.removeChild(modalDialogContainer)},0)},saveHandler:function saveHandler(image,done){imageDataCallback(image.asDataURL("image/jpeg"));done(true);window.ptro.hide();delete window.ptro;// Delay to next iteration to ensure ptro event handlers have executed
setTimeout(function(){document.body.removeChild(modalDialogContainer)},0)}}).show(imageData);closeIcon.addEventListener("click",function(){// eslint-disable-next-line
if(confirm(LocaleUtils.tr("imageeditor.confirmclose"))){window.ptro.hide();delete window.ptro;// Delay to next iteration to ensure ptro event handlers have executed
setTimeout(function(){document.body.removeChild(modalDialogContainer)},0)}})}