aboutsummaryrefslogtreecommitdiffstats
path: root/library/cropperjs/src/js/preview.js
diff options
context:
space:
mode:
authorMario <mario@mariovavti.com>2020-01-11 10:30:12 +0000
committerMario <mario@mariovavti.com>2020-01-11 10:30:12 +0000
commitf645c6f3a57bf5f53bbb2bde362b2447f725c977 (patch)
tree9b37650aad46296c5d98a55969348ebb4ee2d097 /library/cropperjs/src/js/preview.js
parent4c1c6908165e5c4fb1b7238f66764f89faa2301a (diff)
downloadvolse-hubzilla-f645c6f3a57bf5f53bbb2bde362b2447f725c977.tar.gz
volse-hubzilla-f645c6f3a57bf5f53bbb2bde362b2447f725c977.tar.bz2
volse-hubzilla-f645c6f3a57bf5f53bbb2bde362b2447f725c977.zip
update cropperjs to the recent version
Diffstat (limited to 'library/cropperjs/src/js/preview.js')
-rw-r--r--library/cropperjs/src/js/preview.js66
1 files changed, 36 insertions, 30 deletions
diff --git a/library/cropperjs/src/js/preview.js b/library/cropperjs/src/js/preview.js
index c47d03f4b..b73ac391c 100644
--- a/library/cropperjs/src/js/preview.js
+++ b/library/cropperjs/src/js/preview.js
@@ -1,10 +1,7 @@
+import { DATA_PREVIEW } from './constants';
import {
- DATA_PREVIEW,
-} from './constants';
-import {
- each,
- empty,
- extend,
+ assign,
+ forEach,
getData,
getTransforms,
removeData,
@@ -14,9 +11,10 @@ import {
export default {
initPreview() {
- const { crossOrigin } = this;
+ const { element, crossOrigin } = this;
const { preview } = this.options;
const url = crossOrigin ? this.crossOriginUrl : this.url;
+ const alt = element.alt || 'The image to preview';
const image = document.createElement('img');
if (crossOrigin) {
@@ -24,25 +22,32 @@ export default {
}
image.src = url;
+ image.alt = alt;
this.viewBox.appendChild(image);
- this.image2 = image;
+ this.viewBoxImage = image;
if (!preview) {
return;
}
- const previews = preview.querySelector ? [preview] : document.querySelectorAll(preview);
+ let previews = preview;
+
+ if (typeof preview === 'string') {
+ previews = element.ownerDocument.querySelectorAll(preview);
+ } else if (preview.querySelector) {
+ previews = [preview];
+ }
this.previews = previews;
- each(previews, (element) => {
+ forEach(previews, (el) => {
const img = document.createElement('img');
// Save the original size for recover
- setData(element, DATA_PREVIEW, {
- width: element.offsetWidth,
- height: element.offsetHeight,
- html: element.innerHTML,
+ setData(el, DATA_PREVIEW, {
+ width: el.offsetWidth,
+ height: el.offsetHeight,
+ html: el.innerHTML,
});
if (crossOrigin) {
@@ -50,6 +55,7 @@ export default {
}
img.src = url;
+ img.alt = alt;
/**
* Override img element styles
@@ -58,23 +64,23 @@ export default {
* (Occur only when margin-top <= -height)
*/
img.style.cssText = (
- 'display:block;' +
- 'width:100%;' +
- 'height:auto;' +
- 'min-width:0!important;' +
- 'min-height:0!important;' +
- 'max-width:none!important;' +
- 'max-height:none!important;' +
- 'image-orientation:0deg!important;"'
+ 'display:block;'
+ + 'width:100%;'
+ + 'height:auto;'
+ + 'min-width:0!important;'
+ + 'min-height:0!important;'
+ + 'max-width:none!important;'
+ + 'max-height:none!important;'
+ + 'image-orientation:0deg!important;"'
);
- empty(element);
- element.appendChild(img);
+ el.innerHTML = '';
+ el.appendChild(img);
});
},
resetPreview() {
- each(this.previews, (element) => {
+ forEach(this.previews, (element) => {
const data = getData(element, DATA_PREVIEW);
setStyle(element, {
@@ -98,15 +104,15 @@ export default {
return;
}
- setStyle(this.image2, extend({
+ setStyle(this.viewBoxImage, assign({
width,
height,
- }, getTransforms(extend({
+ }, getTransforms(assign({
translateX: -left,
translateY: -top,
}, imageData))));
- each(this.previews, (element) => {
+ forEach(this.previews, (element) => {
const data = getData(element, DATA_PREVIEW);
const originalWidth = data.width;
const originalHeight = data.height;
@@ -130,10 +136,10 @@ export default {
height: newHeight,
});
- setStyle(element.getElementsByTagName('img')[0], extend({
+ setStyle(element.getElementsByTagName('img')[0], assign({
width: width * ratio,
height: height * ratio,
- }, getTransforms(extend({
+ }, getTransforms(assign({
translateX: -left * ratio,
translateY: -top * ratio,
}, imageData))));