datasync-blob 1.1.18 → 1.1.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/DsBlob.js +72 -4
- package/package.json +1 -1
|
@@ -17,7 +17,7 @@ class DsBlob extends _react.Component {
|
|
|
17
17
|
}
|
|
18
18
|
|
|
19
19
|
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
20
|
-
|
|
20
|
+
reduceBinaryImage = e => {
|
|
21
21
|
let imageSource = e.path && e.path[0] || e.srcElement; //Safari compliancy
|
|
22
22
|
|
|
23
23
|
if (this.debugging) console.log("imageSource = ", imageSource);
|
|
@@ -91,11 +91,79 @@ class DsBlob extends _react.Component {
|
|
|
91
91
|
});
|
|
92
92
|
}
|
|
93
93
|
};
|
|
94
|
+
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
95
|
+
reduceBinaryImage = e => {
|
|
96
|
+
let imageSource = e.path && e.path[0] || e.srcElement; //Safari compliancy
|
|
97
|
+
|
|
98
|
+
alert("reduceBinaryImage !");
|
|
99
|
+
if (this.debugging) console.log("imageSource = ", imageSource);
|
|
100
|
+
var canvas = document.createElement('canvas'),
|
|
101
|
+
context,
|
|
102
|
+
width = imageSource.width,
|
|
103
|
+
height = imageSource.height;
|
|
104
|
+
|
|
105
|
+
//Exact size props are set
|
|
106
|
+
if (this.props.width && this.props.height) {
|
|
107
|
+
//Check image size
|
|
108
|
+
if (width > this.props.width || height > this.props.height) {
|
|
109
|
+
alert("L'image est trop grande, le format requis est " + this.props.width + "x" + this.props.height);
|
|
110
|
+
return;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
//Check image size
|
|
114
|
+
if (width < this.props.width || height < this.props.height) {
|
|
115
|
+
alert("L'image est trop petite, le format requis est " + this.props.width + "x" + this.props.height);
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
//Max size props are set
|
|
121
|
+
if (this.props.maxWidth && this.props.maxHeight) {
|
|
122
|
+
if (width > height) {
|
|
123
|
+
//Check resize is enabled
|
|
124
|
+
if (!this.props.reduceImage) {
|
|
125
|
+
alert("L'image est trop large ! la largeur maximale est de " + this.props.maxWidth);
|
|
126
|
+
return;
|
|
127
|
+
}
|
|
128
|
+
if (width > this.props.maxWidth) {
|
|
129
|
+
height *= this.props.maxWidth / width;
|
|
130
|
+
width = this.props.maxWidth;
|
|
131
|
+
}
|
|
132
|
+
} else {
|
|
133
|
+
if (height > this.props.maxHeight) {
|
|
134
|
+
//Check resize is enabled
|
|
135
|
+
if (!this.props.reduceImage) {
|
|
136
|
+
alert("L'image est trop haute, la hauteur maximale est de " + this.props.maxHeight);
|
|
137
|
+
return;
|
|
138
|
+
}
|
|
139
|
+
width *= this.props.maxHeight / height;
|
|
140
|
+
height = this.props.maxHeight;
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
//Build 2d picture
|
|
146
|
+
canvas.width = width;
|
|
147
|
+
canvas.height = height;
|
|
148
|
+
context = canvas.getContext('2d');
|
|
149
|
+
context.drawImage(imageSource, 0, 0, width, height);
|
|
150
|
+
|
|
151
|
+
//Jpeg conversion
|
|
152
|
+
let jpegCompressionRatio = this.props.jpegQuality && this.props.jpegQuality > 0 && this.props.jpegQuality < 1 ? this.props.jpegQuality : 1;
|
|
153
|
+
let canvasData = canvas.toDataURL('image/jpg', jpegCompressionRatio); //Jpeg conversion
|
|
154
|
+
|
|
155
|
+
console.log("canvasData = ", canvasData);
|
|
156
|
+
if (this.debugging) console.log("jpegCompressionRatio->", jpegCompressionRatio, " canvasData.length = ", canvasData.length);
|
|
157
|
+
this.props.uploadPicture({
|
|
158
|
+
data: canvasData ? canvasData : "",
|
|
159
|
+
item_id: this.props.item_id
|
|
160
|
+
});
|
|
161
|
+
};
|
|
94
162
|
|
|
95
163
|
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
96
164
|
storeBase64ImageToImg = e => {
|
|
97
165
|
var image = document.createElement('img');
|
|
98
|
-
image.onload = this.
|
|
166
|
+
image.onload = this.reduceBinaryImage;
|
|
99
167
|
console.log("storeImageToImg:e.currentTarget.result = ", e.currentTarget.result);
|
|
100
168
|
alert("storeImageToImg !");
|
|
101
169
|
image.src = e.currentTarget.result;
|
|
@@ -104,7 +172,7 @@ class DsBlob extends _react.Component {
|
|
|
104
172
|
//-----------------------------------------------------------------------------------------------------------------------------------------
|
|
105
173
|
storeBinaryImageToImg = e => {
|
|
106
174
|
var image = document.createElement('img');
|
|
107
|
-
image.onload = this.reduceImage;
|
|
175
|
+
//2Do DEBUG image.onload = this.reduceImage;
|
|
108
176
|
console.log("storeBinaryImageToImg:e.currentTarget.result = ", e.currentTarget.result);
|
|
109
177
|
alert("storeBinaryImageToImg !");
|
|
110
178
|
// Convert ArrayBuffer to Blob URL since image.src cannot accept ArrayBuffer directly
|
|
@@ -118,7 +186,7 @@ class DsBlob extends _react.Component {
|
|
|
118
186
|
|
|
119
187
|
// Clean up blob URL after image loads to prevent memory leaks
|
|
120
188
|
image.onload = loadEvent => {
|
|
121
|
-
this.
|
|
189
|
+
this.reduceBinaryImage(loadEvent);
|
|
122
190
|
URL.revokeObjectURL(blobUrl);
|
|
123
191
|
// Clear the stored image type
|
|
124
192
|
this.currentImageType = null;
|