Master mysterious egg 2 nby #4234
Conversation
|
This PR targets the un-managed branch odoo-dev/odoo:master-mysterious-egg, it needs to be retargeted before it can be merged. |
Goaman
force-pushed
the
master-mysterious-egg-2-nby
branch
from
6edce45 to
05b6911
Compare
| process_image_warmup_handlers: this.processImageWarmup.bind(this), | ||
| process_image_post_handlers: this.processImagePost.bind(this), |
There was a problem hiding this comment.
The shared method processImage.
Without the plugin shape, processImage will look at all the dataset that it understand and process the image accordingly.
With the plugin shape, if an image has a shape, it will need to be processed sligthly differently and be wrapped in a svg.
process_image_warmup_handlers allow to change how the image will be processed.
process_image_post_handlers will wrap the image in a svg and return the base64 of that svg.
| apply: ({ loadResult: updateImageAttributes }) => { | ||
| updateImageAttributes(); |
There was a problem hiding this comment.
The method processImage need to change the dataset of the img. In order to make the mutations outside the processImage (for history purposes), processImage returns a method that apply the attributes.
| const { svg, svgAspectRatio, svgWidth } = processContext; | ||
| if (!svg) { | ||
| return; | ||
| } | ||
| svg.querySelectorAll("image").forEach((image) => { | ||
| image.setAttribute("xlink:href", b64url); | ||
| }); | ||
| // Force natural width & height (note: loading the original image is | ||
| // needed for Safari where natural width & height of SVG does not return | ||
| // the correct values). | ||
| const loadedImage = await loadImage(b64url); | ||
| // If the svg forces the size of the shape we still want to have the resized | ||
| // width | ||
| if (!svg.dataset.forcedSize) { | ||
| svg.setAttribute("width", loadedImage.naturalWidth); | ||
| svg.setAttribute("height", loadedImage.naturalHeight); | ||
| } else { | ||
| const imageWidth = Math.trunc(svgWidth); | ||
| const newHeight = imageWidth / svgAspectRatio; | ||
| svg.setAttribute("width", imageWidth); | ||
| svg.setAttribute("height", newHeight); | ||
| } |
There was a problem hiding this comment.
What do you mean? Are you talking about the svg.setAttribute ? The svg is not in the dom.
| onSave: async (newDataset) => { | ||
| // todo: should use the mutex if there is one? | ||
| const updateImageAttributes = | ||
| await this.dependencies.imagePostProcess.processImage( | ||
| selectedImg, | ||
| newDataset | ||
| ); | ||
| updateImageAttributes(); | ||
| this.dependencies.history.addStep(); | ||
| }, | ||
| document: this.document, |
There was a problem hiding this comment.
I adapted the previous code that used the method applyModification as the equivalent now is processImage.
While adapting the code, I noticed that the mutation made by updateImageAttributes will not be mutexified with the OperationPlugin and will corrupt the history in some circumstance.
In practice, I don't think this method will be called in the html_builder so we're safe for now.
| const cropper = await activateCropper(originalImg, aspectRatio, data); | ||
| const croppedCanvas = cropper.getCroppedCanvas(width, height); | ||
| cropper.destroy(); | ||
| const processedCanvas = (await postProcessCroppedCanvas?.(croppedCanvas)) || croppedCanvas; |
There was a problem hiding this comment.
Why about what?
-
We re-use the logic of the cropper to crop an image.
If an image has some crop attributes (data-x/y/height/width/aspectRatio), the crop will be performed.
You have to understand that for any modification of an image, all the transformation are re-applied from the original src. -
postProcessCroppedCanvaswill be used by the svg plugin because some svg shape require to crop the cropped image.
No description provided.