Skip to content
Snippets Groups Projects
Commit fd1c7126 authored by Giuseppe Cavallaro's avatar Giuseppe Cavallaro Committed by Frank Naegler
Browse files

[BUGFIX] Change the order of the AJAX Request for image cropping 

It ensures that the request will not be overwritten by the spinning icon
on fast servers.

Before the changes, the image cropping tool triggered a Console Error
"Uncaught TypeError: Cannot read property 'cropArea' of undefined at
ImageManipulation.init (ImageManipulation.js)."

Resolves: #84499
Releases: master, 8.7
Change-Id: Ic2208ba43d0976a1ba9674d68e5d861e89619d1a
Reviewed-on: https://review.typo3.org/56469


Reviewed-by: default avatarAndreas Fernandez <a.fernandez@scripting-base.de>
Tested-by: default avatarAndreas Fernandez <a.fernandez@scripting-base.de>
Reviewed-by: default avatarChristian Kuhn <lolli@schwarzbu.ch>
Tested-by: default avatarChristian Kuhn <lolli@schwarzbu.ch>
Tested-by: default avatarTYPO3com <no-reply@typo3.com>
Reviewed-by: default avatarFrank Naegler <frank.naegler@typo3.org>
Tested-by: default avatarFrank Naegler <frank.naegler@typo3.org>
parent 24779fb9
Branches
Tags
No related merge requests found
Hide whitespace changes
Inline Side-by-side
typo3/sysext/backend/Resources/Private/TypeScript/Modal.ts
+ 21
− 14
View file @ fd1c7126
......@@ -341,20 +341,27 @@ class Modal {
});
if (configuration.type === 'ajax') {
$.get(
<string>configuration.content,
(response: string): void => {
this.currentModal.find(configuration.ajaxTarget ? configuration.ajaxTarget : Identifiers.body).empty().append(response);
if (configuration.ajaxCallback) {
configuration.ajaxCallback();
}
this.currentModal.trigger('modal-loaded');
},
'html'
);
Icons.getIcon('spinner-circle', Icons.sizes.default, null, null, Icons.markupIdentifiers.inline).done((icon: string): void => {
currentModal.find(Identifiers.body).html('<div class="modal-loading">' + icon + '</div>');
});
const contentTarget = configuration.ajaxTarget ? configuration.ajaxTarget : Identifiers.body;
const $loaderTarget = currentModal.find(contentTarget);
if (!$loaderTarget.hasClass('modal-content-loaded')) {
Icons.getIcon('spinner-circle', Icons.sizes.default, null, null, Icons.markupIdentifiers.inline).done((icon: string): void => {
$loaderTarget.html('<div class="modal-loading">' + icon + '</div>');
$.get(
<string>configuration.content,
(response: string): void => {
this.currentModal.find(contentTarget)
.addClass('modal-content-loaded')
.empty()
.append(response);
if (configuration.ajaxCallback) {
configuration.ajaxCallback();
}
this.currentModal.trigger('modal-loaded');
},
'html'
);
});
}
} else if (configuration.type === 'iframe') {
currentModal.find(Identifiers.body).append(
$('<iframe />', {
......
typo3/sysext/backend/Resources/Public/JavaScript/Modal.js
+ 1
− 1
View file @ fd1c7126
......@@ -10,4 +10,4 @@
*
* The TYPO3 project - inspiring people to share!
*/
var __values=this&&this.__values||function(t){var e="function"==typeof Symbol&&t[Symbol.iterator],a=0;return e?e.call(t):{next:function(){return t&&a>=t.length&&(t=void 0),{value:t&&t[a++],done:!t}}}};define(["require","exports","./Enum/Severity","jquery","./Icons","./Severity","bootstrap"],function(t,e,a,n,o,i){"use strict";var l,s,r,d,c,u,f,m;(s=l||(l={})).modal=".t3js-modal",s.content=".t3js-modal-content",s.title=".t3js-modal-title",s.close=".t3js-modal-close",s.body=".t3js-modal-body",s.footer=".t3js-modal-footer",s.iframe=".t3js-modal-iframe",s.iconPlaceholder=".t3js-modal-icon-placeholder",(d=r||(r={})).small="small",d.default="default",d.medium="medium",d.large="large",d.full="full",(u=c||(c={})).default="default",u.light="light",u.dark="dark",(m=f||(f={})).default="default",m.ajax="ajax",m.iframe="iframe";var g=function(){function t(){this.sizes=r,this.styles=c,this.types=f,this.currentModal=null,this.instances=[],this.$template=n('<div class="t3js-modal modal fade"><div class="modal-dialog"><div class="t3js-modal-content modal-content"><div class="modal-header"><button class="t3js-modal-close close"><span aria-hidden="true"><span class="t3js-modal-icon-placeholder" data-icon="actions-close"></span></span><span class="sr-only"></span></button><h4 class="t3js-modal-title modal-title"></h4></div><div class="t3js-modal-body modal-body"></div><div class="t3js-modal-footer modal-footer"></div></div></div></div>'),this.defaultConfiguration={type:f.default,title:"Information",content:"No content provided, please check your <code>Modal</code> configuration.",severity:a.SeverityEnum.notice,buttons:[],style:c.default,size:r.default,additionalCssClasses:[],callback:n.noop(),ajaxCallback:n.noop(),ajaxTarget:null},n(document).on("modal-dismiss",this.dismiss),this.initializeMarkupTrigger(document)}return t.prototype.dismiss=function(){this.currentModal&&this.currentModal.modal("hide")},t.prototype.confirm=function(t,e,o,l,s){return void 0===o&&(o=a.SeverityEnum.warning),void 0===l&&(l=[]),0===l.length&&l.push({text:n(this).data("button-close-text")||TYPO3.lang["button.cancel"]||"Cancel",active:!0,btnClass:"btn-default",name:"cancel"},{text:n(this).data("button-ok-text")||TYPO3.lang["button.ok"]||"OK",btnClass:"btn-"+i.getCssClass(o),name:"ok"}),this.advanced({title:t,content:e,severity:o,buttons:l,additionalCssClasses:s,callback:function(t){t.on("button.clicked",function(t){"cancel"===t.target.getAttribute("name")?n(t.currentTarget).trigger("confirm.button.cancel"):"ok"===t.target.getAttribute("name")&&n(t.currentTarget).trigger("confirm.button.ok")})}})},t.prototype.loadUrl=function(t,e,n,o,i,l){return void 0===e&&(e=a.SeverityEnum.info),this.advanced({type:f.ajax,title:t,severity:e,buttons:n,ajaxCallback:i,ajaxTarget:l})},t.prototype.show=function(t,e,n,o,i){return void 0===n&&(n=a.SeverityEnum.info),this.advanced({type:f.default,title:t,content:e,buttons:o,additionalCssClasses:i})},t.prototype.advanced=function(t){return t.type="string"==typeof t.type&&t.type in f?t.type:this.defaultConfiguration.type,t.title="string"==typeof t.title?t.title:this.defaultConfiguration.title,t.content="string"==typeof t.content||"object"==typeof t.content?t.content:this.defaultConfiguration.content,t.severity=void 0!==t.severity?t.severity:this.defaultConfiguration.severity,t.buttons=t.buttons||this.defaultConfiguration.buttons,t.size="string"==typeof t.size&&t.size in r?t.size:this.defaultConfiguration.size,t.style="string"==typeof t.style&&t.style in c?t.style:this.defaultConfiguration.style,t.additionalCssClasses=t.additionalCssClasses||this.defaultConfiguration.additionalCssClasses,t.callback="function"==typeof t.callback?t.callback:this.defaultConfiguration.callback,t.ajaxCallback="function"==typeof t.ajaxCallback?t.ajaxCallback:this.defaultConfiguration.ajaxCallback,t.ajaxTarget="string"==typeof t.ajaxTarget?t.ajaxTarget:this.defaultConfiguration.ajaxTarget,this.generate(t)},t.prototype.initializeMarkupTrigger=function(t){var e=this;n(t).on("click",".t3js-modal-trigger",function(t){t.preventDefault();var o=n(t.currentTarget),l=o.data("content")||"Are you sure?",s=void 0!==a.SeverityEnum[o.data("severity")]?a.SeverityEnum[o.data("severity")]:a.SeverityEnum.info,r=o.data("url")||null;null!==r&&(r=r+(r.indexOf("?")>-1?"&":"?")+n.param({data:o.data()}));e.advanced({type:null!==r?f.ajax:f.default,title:o.data("title")||"Alert",content:null!==r?r:l,severity:s,buttons:[{text:o.data("button-close-text")||"Close",active:!0,btnClass:"btn-default",trigger:function(){e.currentModal.trigger("modal-dismiss")}},{text:o.data("button-ok-text")||"OK",btnClass:"btn-"+i.getCssClass(s),trigger:function(){e.currentModal.trigger("modal-dismiss"),t.target.ownerDocument.location.href=o.data("href")||o.attr("href")}}]})})},t.prototype.generate=function(t){var e,a,s=this,r=this.$template.clone();if(t.additionalCssClasses.length>0)try{for(var d=__values(t.additionalCssClasses),c=d.next();!c.done;c=d.next()){var u=c.value;r.addClass(u)}}catch(t){e={error:t}}finally{try{c&&!c.done&&(a=d.return)&&a.call(d)}finally{if(e)throw e.error}}if(r.addClass("modal-type-"+t.type),r.addClass("modal-severity-"+i.getCssClass(t.severity)),r.addClass("modal-style-"+t.style),r.addClass("modal-size-"+t.size),r.attr("tabindex","-1"),r.find(l.title).text(t.title),r.find(l.close).on("click",function(){r.modal("hide")}),"ajax"===t.type?(n.get(t.content,function(e){s.currentModal.find(t.ajaxTarget?t.ajaxTarget:l.body).empty().append(e),t.ajaxCallback&&t.ajaxCallback(),s.currentModal.trigger("modal-loaded")},"html"),o.getIcon("spinner-circle",o.sizes.default,null,null,o.markupIdentifiers.inline).done(function(t){r.find(l.body).html('<div class="modal-loading">'+t+"</div>")})):"iframe"===t.type?(r.find(l.body).append(n("<iframe />",{src:t.content,name:"modal_frame",class:"modal-iframe t3js-modal-iframe"})),r.find(l.iframe).on("load",function(){r.find(l.title).text(r.find(l.iframe).get(0).contentDocument.title)})):("string"==typeof t.content&&(/^<[a-z][\s\S]*>/i.test(t.content)||(t.content=n("<p />").html(t.content))),r.find(l.body).append(t.content)),t.buttons.length>0){for(var f=function(e){var a=t.buttons[e],o=n("<button />",{class:"btn"});o.html("<span>"+a.text+"</span>"),a.active&&o.addClass("t3js-active"),""!==a.btnClass&&o.addClass(a.btnClass),""!==a.name&&o.attr("name",a.name),a.trigger&&o.on("click",a.trigger),a.dataAttributes&&Object.keys(a.dataAttributes).length>0&&Object.keys(a.dataAttributes).map(function(t){o.attr("data-"+t,a.dataAttributes[t])}),a.icon&&o.prepend('<span class="t3js-modal-icon-placeholder" data-icon="'+a.icon+'"></span>'),r.find(l.footer).append(o)},m=0;m<t.buttons.length;m++)f(m);r.find(l.footer).find("button").on("click",function(t){n(t.currentTarget).trigger("button.clicked")})}else r.find(l.footer).remove();return r.on("shown.bs.modal",function(t){var e=n(t.currentTarget);e.find(l.footer).find(".t3js-active").first().focus(),e.find(l.iconPlaceholder).each(function(t,e){o.getIcon(n(e).data("icon"),o.sizes.small,null,null,o.markupIdentifiers.inline).done(function(t){s.currentModal.find(l.iconPlaceholder+"[data-icon="+n(t).data("identifier")+"]").replaceWith(t)})})}),r.on("hidden.bs.modal",function(t){if(s.instances.length>0){var e=s.instances.length-1;s.instances.splice(e,1),s.currentModal=s.instances[e-1]}r.trigger("modal-destroyed"),n(t.currentTarget).remove(),s.instances.length>0&&n("body").addClass("modal-open")}),r.on("show.bs.modal",function(t){s.currentModal=n(t.currentTarget),s.instances.push(s.currentModal)}),r.on("modal-dismiss",function(t){n(t.currentTarget).modal("hide")}),t.callback&&t.callback(r),r.modal()},t}(),p=null;try{parent&&parent.window.TYPO3&&parent.window.TYPO3.Modal?(parent.window.TYPO3.Modal.initializeMarkupTrigger(document),p=parent.window.TYPO3.Modal):top&&top.TYPO3.Modal&&(top.TYPO3.Modal.initializeMarkupTrigger(document),p=top.TYPO3.Modal)}catch(t){}return p||(p=new g,TYPO3.Modal=p),p});
\ No newline at end of file
var __values=this&&this.__values||function(t){var e="function"==typeof Symbol&&t[Symbol.iterator],a=0;return e?e.call(t):{next:function(){return t&&a>=t.length&&(t=void 0),{value:t&&t[a++],done:!t}}}};define(["require","exports","./Enum/Severity","jquery","./Icons","./Severity","bootstrap"],function(t,e,a,n,o,i){"use strict";var l,s,r,d,c,u,f,m;(s=l||(l={})).modal=".t3js-modal",s.content=".t3js-modal-content",s.title=".t3js-modal-title",s.close=".t3js-modal-close",s.body=".t3js-modal-body",s.footer=".t3js-modal-footer",s.iframe=".t3js-modal-iframe",s.iconPlaceholder=".t3js-modal-icon-placeholder",(d=r||(r={})).small="small",d.default="default",d.medium="medium",d.large="large",d.full="full",(u=c||(c={})).default="default",u.light="light",u.dark="dark",(m=f||(f={})).default="default",m.ajax="ajax",m.iframe="iframe";var g=function(){function t(){this.sizes=r,this.styles=c,this.types=f,this.currentModal=null,this.instances=[],this.$template=n('<div class="t3js-modal modal fade"><div class="modal-dialog"><div class="t3js-modal-content modal-content"><div class="modal-header"><button class="t3js-modal-close close"><span aria-hidden="true"><span class="t3js-modal-icon-placeholder" data-icon="actions-close"></span></span><span class="sr-only"></span></button><h4 class="t3js-modal-title modal-title"></h4></div><div class="t3js-modal-body modal-body"></div><div class="t3js-modal-footer modal-footer"></div></div></div></div>'),this.defaultConfiguration={type:f.default,title:"Information",content:"No content provided, please check your <code>Modal</code> configuration.",severity:a.SeverityEnum.notice,buttons:[],style:c.default,size:r.default,additionalCssClasses:[],callback:n.noop(),ajaxCallback:n.noop(),ajaxTarget:null},n(document).on("modal-dismiss",this.dismiss),this.initializeMarkupTrigger(document)}return t.prototype.dismiss=function(){this.currentModal&&this.currentModal.modal("hide")},t.prototype.confirm=function(t,e,o,l,s){return void 0===o&&(o=a.SeverityEnum.warning),void 0===l&&(l=[]),0===l.length&&l.push({text:n(this).data("button-close-text")||TYPO3.lang["button.cancel"]||"Cancel",active:!0,btnClass:"btn-default",name:"cancel"},{text:n(this).data("button-ok-text")||TYPO3.lang["button.ok"]||"OK",btnClass:"btn-"+i.getCssClass(o),name:"ok"}),this.advanced({title:t,content:e,severity:o,buttons:l,additionalCssClasses:s,callback:function(t){t.on("button.clicked",function(t){"cancel"===t.target.getAttribute("name")?n(t.currentTarget).trigger("confirm.button.cancel"):"ok"===t.target.getAttribute("name")&&n(t.currentTarget).trigger("confirm.button.ok")})}})},t.prototype.loadUrl=function(t,e,n,o,i,l){return void 0===e&&(e=a.SeverityEnum.info),this.advanced({type:f.ajax,title:t,severity:e,buttons:n,ajaxCallback:i,ajaxTarget:l})},t.prototype.show=function(t,e,n,o,i){return void 0===n&&(n=a.SeverityEnum.info),this.advanced({type:f.default,title:t,content:e,buttons:o,additionalCssClasses:i})},t.prototype.advanced=function(t){return t.type="string"==typeof t.type&&t.type in f?t.type:this.defaultConfiguration.type,t.title="string"==typeof t.title?t.title:this.defaultConfiguration.title,t.content="string"==typeof t.content||"object"==typeof t.content?t.content:this.defaultConfiguration.content,t.severity=void 0!==t.severity?t.severity:this.defaultConfiguration.severity,t.buttons=t.buttons||this.defaultConfiguration.buttons,t.size="string"==typeof t.size&&t.size in r?t.size:this.defaultConfiguration.size,t.style="string"==typeof t.style&&t.style in c?t.style:this.defaultConfiguration.style,t.additionalCssClasses=t.additionalCssClasses||this.defaultConfiguration.additionalCssClasses,t.callback="function"==typeof t.callback?t.callback:this.defaultConfiguration.callback,t.ajaxCallback="function"==typeof t.ajaxCallback?t.ajaxCallback:this.defaultConfiguration.ajaxCallback,t.ajaxTarget="string"==typeof t.ajaxTarget?t.ajaxTarget:this.defaultConfiguration.ajaxTarget,this.generate(t)},t.prototype.initializeMarkupTrigger=function(t){var e=this;n(t).on("click",".t3js-modal-trigger",function(t){t.preventDefault();var o=n(t.currentTarget),l=o.data("content")||"Are you sure?",s=void 0!==a.SeverityEnum[o.data("severity")]?a.SeverityEnum[o.data("severity")]:a.SeverityEnum.info,r=o.data("url")||null;null!==r&&(r=r+(r.indexOf("?")>-1?"&":"?")+n.param({data:o.data()}));e.advanced({type:null!==r?f.ajax:f.default,title:o.data("title")||"Alert",content:null!==r?r:l,severity:s,buttons:[{text:o.data("button-close-text")||"Close",active:!0,btnClass:"btn-default",trigger:function(){e.currentModal.trigger("modal-dismiss")}},{text:o.data("button-ok-text")||"OK",btnClass:"btn-"+i.getCssClass(s),trigger:function(){e.currentModal.trigger("modal-dismiss"),t.target.ownerDocument.location.href=o.data("href")||o.attr("href")}}]})})},t.prototype.generate=function(t){var e,a,s=this,r=this.$template.clone();if(t.additionalCssClasses.length>0)try{for(var d=__values(t.additionalCssClasses),c=d.next();!c.done;c=d.next()){var u=c.value;r.addClass(u)}}catch(t){e={error:t}}finally{try{c&&!c.done&&(a=d.return)&&a.call(d)}finally{if(e)throw e.error}}if(r.addClass("modal-type-"+t.type),r.addClass("modal-severity-"+i.getCssClass(t.severity)),r.addClass("modal-style-"+t.style),r.addClass("modal-size-"+t.size),r.attr("tabindex","-1"),r.find(l.title).text(t.title),r.find(l.close).on("click",function(){r.modal("hide")}),"ajax"===t.type){var f=t.ajaxTarget?t.ajaxTarget:l.body,m=r.find(f);m.hasClass("modal-content-loaded")||o.getIcon("spinner-circle",o.sizes.default,null,null,o.markupIdentifiers.inline).done(function(e){m.html('<div class="modal-loading">'+e+"</div>"),n.get(t.content,function(e){s.currentModal.find(f).addClass("modal-content-loaded").empty().append(e),t.ajaxCallback&&t.ajaxCallback(),s.currentModal.trigger("modal-loaded")},"html")})}else"iframe"===t.type?(r.find(l.body).append(n("<iframe />",{src:t.content,name:"modal_frame",class:"modal-iframe t3js-modal-iframe"})),r.find(l.iframe).on("load",function(){r.find(l.title).text(r.find(l.iframe).get(0).contentDocument.title)})):("string"==typeof t.content&&(/^<[a-z][\s\S]*>/i.test(t.content)||(t.content=n("<p />").html(t.content))),r.find(l.body).append(t.content));if(t.buttons.length>0){for(var g=function(e){var a=t.buttons[e],o=n("<button />",{class:"btn"});o.html("<span>"+a.text+"</span>"),a.active&&o.addClass("t3js-active"),""!==a.btnClass&&o.addClass(a.btnClass),""!==a.name&&o.attr("name",a.name),a.trigger&&o.on("click",a.trigger),a.dataAttributes&&Object.keys(a.dataAttributes).length>0&&Object.keys(a.dataAttributes).map(function(t){o.attr("data-"+t,a.dataAttributes[t])}),a.icon&&o.prepend('<span class="t3js-modal-icon-placeholder" data-icon="'+a.icon+'"></span>'),r.find(l.footer).append(o)},p=0;p<t.buttons.length;p++)g(p);r.find(l.footer).find("button").on("click",function(t){n(t.currentTarget).trigger("button.clicked")})}else r.find(l.footer).remove();return r.on("shown.bs.modal",function(t){var e=n(t.currentTarget);e.find(l.footer).find(".t3js-active").first().focus(),e.find(l.iconPlaceholder).each(function(t,e){o.getIcon(n(e).data("icon"),o.sizes.small,null,null,o.markupIdentifiers.inline).done(function(t){s.currentModal.find(l.iconPlaceholder+"[data-icon="+n(t).data("identifier")+"]").replaceWith(t)})})}),r.on("hidden.bs.modal",function(t){if(s.instances.length>0){var e=s.instances.length-1;s.instances.splice(e,1),s.currentModal=s.instances[e-1]}r.trigger("modal-destroyed"),n(t.currentTarget).remove(),s.instances.length>0&&n("body").addClass("modal-open")}),r.on("show.bs.modal",function(t){s.currentModal=n(t.currentTarget),s.instances.push(s.currentModal)}),r.on("modal-dismiss",function(t){n(t.currentTarget).modal("hide")}),t.callback&&t.callback(r),r.modal()},t}(),p=null;try{parent&&parent.window.TYPO3&&parent.window.TYPO3.Modal?(parent.window.TYPO3.Modal.initializeMarkupTrigger(document),p=parent.window.TYPO3.Modal):top&&top.TYPO3.Modal&&(top.TYPO3.Modal.initializeMarkupTrigger(document),p=top.TYPO3.Modal)}catch(t){}return p||(p=new g,TYPO3.Modal=p),p});
\ No newline at end of file
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment