IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: components: AvatarEditor. compress picture on client

Browse Source
This commit is contained in:
NikolayRechkin 2020-01-24 11:03:50 +03:00
parent 9d6e70b599
commit bbe684d954
4 changed files with 25 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
web/ASC.Web.Components/package.json
View File

@ -120,7 +120,8 @@
"react-tooltip": "^3.11.2",
"react-virtualized-auto-sizer": "^1.0.2",
"react-window": "^1.8.5",
"react-window-infinite-loader": "^1.0.5"
"react-window-infinite-loader": "^1.0.5",
"resize-image": "^0.1.0"
},
"resolutions": {
"js-yaml": "3.13.1"

2
web/ASC.Web.Components/src/components/avatar-editor/index.js
View File

@ -149,7 +149,7 @@ AvatarEditor.propTypes = {
AvatarEditor.defaultProps = {
visible: false,
maxSize: 1, //1MB
maxSize: 10, //10MB
headerLabel: 'Edit Photo',
saveButtonLabel: 'Save',
accept: ['image/png', 'image/jpeg'],

23
web/ASC.Web.Components/src/components/avatar-editor/sub-components/avatar-editor-body.js
View File

@ -7,7 +7,7 @@ import { default as ASCAvatar } from '../../avatar/index'
import accepts from 'attr-accept'
import Text from '../../text'
import { tablet } from '../../../utils/device';
import resizeImage from 'resize-image'
const StyledErrorContainer = styled.div`
p{
text-align: center
@ -160,11 +160,22 @@ class AvatarEditorBody extends React.Component {
this.props.onLoadFileError(2);
}
onDropAccepted(acceptedFiles) {
this.setState({
image: acceptedFiles[0],
errorText: null
});
this.props.onLoadFile(acceptedFiles[0]);
const _this = this;
var fr = new FileReader();
fr.readAsDataURL(acceptedFiles[0]);
fr.onload = function () {
var img = new Image();
img.onload= function () {
var canvas = resizeImage.resize2Canvas(img, 1024);
var data = resizeImage.resize(canvas, 1024);
_this.setState({
image: data,
errorText: null
});
_this.props.onLoadFile(data);
};
img.src = fr.result;
};
}
deleteImage() {
this.setState({

5
web/ASC.Web.Components/yarn.lock
View File

@ -12348,6 +12348,11 @@ reserved-words@^0.1.2:
resolved "https://registry.yarnpkg.com/reserved-words/-/reserved-words-0.1.2.tgz#00a0940f98cd501aeaaac316411d9adc52b31ab1"
integrity sha1-AKCUD5jNUBrqqsMWQR2a3FKzGrE=
resize-image@^0.1.0:
version "0.1.0"
resolved "https://registry.yarnpkg.com/resize-image/-/resize-image-0.1.0.tgz#033d5f499cb7095def7827d48b8046f7e1c5776c"
integrity sha512-78cWCEX/IupMCwKi5Gg5gxjOZKoN6UXinL2eVOB4xzyG2QNjq64z6pJBnyBKg5/BsjEosLz1co5e3DHr99TgFg==
resize-observer-polyfill@^1.5.1:
version "1.5.1"
resolved "https://registry.yarnpkg.com/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz#0e9020dd3d21024458d4ebd27e23e40269810464"