diff --git a/dist/Views/CardElements/Image.js b/dist/Views/CardElements/Image.js index d25e108..c46ca70 100644 --- a/dist/Views/CardElements/Image.js +++ b/dist/Views/CardElements/Image.js @@ -63,6 +63,18 @@ export class ImageView extends React.Component { }); } }; + this.fetchImageSize = () => { + const { model, size, maxWidth, maxHeight } = this.props; + if (model) { + if (model.context) { + let handler = model.context.infoHandler; + if (handler) { + handler(`AdaptiveCard >> Start load img >> ${model.url}`); + } + } + ImageUtils.fetchSize(model.url, size || model.size, { width: maxWidth, height: maxHeight }, this.onImageSize, this.onImageSizeError); + } + }; this.state = { loaded: false, width: 0, @@ -71,16 +83,7 @@ export class ImageView extends React.Component { } componentDidMount() { this.mounted = true; - const { model, size, maxWidth, maxHeight } = this.props; - if (model) { - if (model.context) { - let handler = model.context.infoHandler; - if (handler) { - handler(`AdaptiveCard >> Start load img >> ${model.url}`); - } - } - ImageUtils.fetchSize(model.url, size || model.size, { width: maxWidth, height: maxHeight }, this.onImageSize, this.onImageSizeError); - } + setTimeout(this.fetchImageSize, 500); } componentWillUnmount() { this.mounted = false; diff --git a/examples/AdaptiveCards/Views/CardElements/Image.js b/examples/AdaptiveCards/Views/CardElements/Image.js index d25e108..c46ca70 100644 --- a/examples/AdaptiveCards/Views/CardElements/Image.js +++ b/examples/AdaptiveCards/Views/CardElements/Image.js @@ -63,6 +63,18 @@ export class ImageView extends React.Component { }); } }; + this.fetchImageSize = () => { + const { model, size, maxWidth, maxHeight } = this.props; + if (model) { + if (model.context) { + let handler = model.context.infoHandler; + if (handler) { + handler(`AdaptiveCard >> Start load img >> ${model.url}`); + } + } + ImageUtils.fetchSize(model.url, size || model.size, { width: maxWidth, height: maxHeight }, this.onImageSize, this.onImageSizeError); + } + }; this.state = { loaded: false, width: 0, @@ -71,16 +83,7 @@ export class ImageView extends React.Component { } componentDidMount() { this.mounted = true; - const { model, size, maxWidth, maxHeight } = this.props; - if (model) { - if (model.context) { - let handler = model.context.infoHandler; - if (handler) { - handler(`AdaptiveCard >> Start load img >> ${model.url}`); - } - } - ImageUtils.fetchSize(model.url, size || model.size, { width: maxWidth, height: maxHeight }, this.onImageSize, this.onImageSizeError); - } + setTimeout(this.fetchImageSize, 500); } componentWillUnmount() { this.mounted = false; diff --git a/src/Views/CardElements/Image.tsx b/src/Views/CardElements/Image.tsx index 9143013..dd7701b 100644 --- a/src/Views/CardElements/Image.tsx +++ b/src/Views/CardElements/Image.tsx @@ -39,24 +39,7 @@ export class ImageView extends React.Component { public componentDidMount() { this.mounted = true; - const { model, size, maxWidth, maxHeight } = this.props; - - if (model) { - if (model.context) { - let handler = model.context.infoHandler; - if (handler) { - handler(`AdaptiveCard >> Start load img >> ${model.url}`); - } - } - - ImageUtils.fetchSize( - model.url, - size || model.size, - { width: maxWidth, height: maxHeight }, - this.onImageSize, - this.onImageSizeError - ); - } + setTimeout(this.fetchImageSize, 500); } public componentWillUnmount() { @@ -167,6 +150,27 @@ export class ImageView extends React.Component { } } + private fetchImageSize = () => { + const { model, size, maxWidth, maxHeight } = this.props; + + if (model) { + if (model.context) { + let handler = model.context.infoHandler; + if (handler) { + handler(`AdaptiveCard >> Start load img >> ${model.url}`); + } + } + + ImageUtils.fetchSize( + model.url, + size || model.size, + { width: maxWidth, height: maxHeight }, + this.onImageSize, + this.onImageSizeError + ); + } + } + private get flex() { const { model, size } = this.props; diff --git a/tool/src/assets/AdaptiveCards/Views/CardElements/Image.js b/tool/src/assets/AdaptiveCards/Views/CardElements/Image.js index d25e108..c46ca70 100644 --- a/tool/src/assets/AdaptiveCards/Views/CardElements/Image.js +++ b/tool/src/assets/AdaptiveCards/Views/CardElements/Image.js @@ -63,6 +63,18 @@ export class ImageView extends React.Component { }); } }; + this.fetchImageSize = () => { + const { model, size, maxWidth, maxHeight } = this.props; + if (model) { + if (model.context) { + let handler = model.context.infoHandler; + if (handler) { + handler(`AdaptiveCard >> Start load img >> ${model.url}`); + } + } + ImageUtils.fetchSize(model.url, size || model.size, { width: maxWidth, height: maxHeight }, this.onImageSize, this.onImageSizeError); + } + }; this.state = { loaded: false, width: 0, @@ -71,16 +83,7 @@ export class ImageView extends React.Component { } componentDidMount() { this.mounted = true; - const { model, size, maxWidth, maxHeight } = this.props; - if (model) { - if (model.context) { - let handler = model.context.infoHandler; - if (handler) { - handler(`AdaptiveCard >> Start load img >> ${model.url}`); - } - } - ImageUtils.fetchSize(model.url, size || model.size, { width: maxWidth, height: maxHeight }, this.onImageSize, this.onImageSizeError); - } + setTimeout(this.fetchImageSize, 500); } componentWillUnmount() { this.mounted = false;