12 lines
4.2 KiB
JavaScript
12 lines
4.2 KiB
JavaScript
|
/**
|
||
|
|
* BSDialog4
|
||
|
|
* @version v0.1.0.001 (2019/12/27 0531)
|
||
|
|
*/
|
||
|
|
var BSDialog={Create:function(id,title,url,size){var a=this;a.id=id;a.title=title;a.url=url;a.size=((typeof(size)=="undefined")?"md":size);if(!a.Exists(id)){a.renderContent(null)}
|
||
|
|
if(url!=null){$.ajax({url:url,cache:!1,xhrFields:{withCredentials:!0},timeout:20000,success:function(result,status,xhr){if((xhr.status==200)||(xhr.status==302)||(xhr.status==301)){a.updateContentBody(id,result)}else{a.updateContentBody(id,xhr.statusText+" ("+xhr.status+")")}},error:function(xhr){a.updateContentBody(id,xhr.statusText+" ("+xhr.status+")")},complete:function(xhr,status){}})}
|
||
|
|
a.initialiseComponents()},Close:function(id){$("#dlg"+id).modal('hide')},Clear:function(){$("body > div[class~='modal'][role='dialog']").remove();$("body > div[class~='modal-backdrop']").remove();$("body").removeClass("modal-open")},ShowToast:function(id,title,message,size){var a=this;if(a.Exists(id)){return}
|
||
|
|
a.id=id;a.title=title;a.url=null;a.size=((typeof(size)=="undefined")?"md":size);a.renderContent(message);a.initialiseComponents()},Exists:function(id){return($("body > div[id='dlg"+id+"']").length>0)},generateModalHtml:function(message){var a=this;var html="";html+="<div class=\"modal fade\" id=\"dlg"+a.id+"\" tabindex=\"-1\" role=\"dialog\">";html+=" <div class=\"modal-dialog modal-"+a.size+"\">";html+=" <div class=\"modal-content\">";html+=" <div class=\"modal-header\">";html+=" <strong class=\"modal-title\" style=\"cursor:default; \">"+a.title+"</strong>";html+=" <button type=\"button\" class=\"close\" data-modal-action=\"restore\" aria-hidden=\"true\">−</button>";html+=" <button type=\"button\" class=\"close ml-0\" data-dismiss=\"modal\" aria-hidden=\"true\">×</button>";html+=" </div>";if($.trim(message).length<=0){html+=" <div class=\"modal-body\">";html+=" <div class=\"text-center\">";html+=" <div class=\"spinner-border text-secondary text-center\" role=\"status\">";html+=" <span class=\"sr-only\">Loading...</span>";html+=" </div>";html+=" </div>";html+=" </div>"}else{html+=" <div class=\"modal-body\">"+message+"</div>"}
|
||
|
|
html+=" <div class=\"modal-footer\">";html+=" <button type=\"button\" class=\"btn btn-outline-dark\" data-dismiss=\"modal\">Close</button>";html+=" </div>";html+=" </div>";html+=" </div>";html+="</div>";return html},renderContent:function(content){$("body").append(this.generateModalHtml(content))},initialiseComponents:function(){var a=this;var dialog=a.getElement();var btnToggleSize=$(dialog).find("button[data-modal-action='restore']");if($(btnToggleSize).length>0){$(btnToggleSize).off('click');$(btnToggleSize).on('click',function(){a.toggleSize()})}
|
||
|
|
$(dialog).modal('show');$(dialog).off('hide.bs.modal');$(dialog).on('hide.bs.modal',function(){if($(dialog).next().is("div[class~='modal-backdrop']")){$(dialog).next().remove()}
|
||
|
|
$(dialog).remove()});$(dialog).find(".modal-header").off("mousedown");$(dialog).find(".modal-header").on("mousedown",function(e){var posX=e.pageX-$(this).offset().left;var posY=e.pageY-$(this).offset().top;$("body").off("mousemove.draggable");$("body").on("mousemove.draggable",function(e2){$(dialog).children(".modal-dialog").offset({"left":(e2.pageX-posX),"top":(e2.pageY-posY)})});$("body").off("mouseup");$("body").on("mouseup",function(){$("body").off("mousemove.draggable")});$(dialog).off("bs.modal.hide");$(dialog).on("bs.modal.hide",function(){$("body").off("mousemove.draggable")})})},updateContentBody:function(id,text){var body=$("#dlg"+id).find(".modal-body");if($(body).hasClass("custom-loading"))$(body).removeClass("custom-loading");$(body).html(text)},getElement:function(){return $("#dlg"+this.id)},toggleSize:function(){var div=$(this.getElement()).find("div[class^='modal-dialog']");if($(div).length<=0){return}
|
||
|
|
if($(div).hasClass("modal-md")){$(div).removeClass("modal-md");$(div).addClass("modal-lg")}else if($(div).hasClass("modal-lg")){$(div).removeClass("modal-lg");$(div).addClass("modal-xl")}else if($(div).hasClass("modal-xl")){$(div).removeClass("modal-xl");$(div).addClass("modal-sm")}else if($(div).hasClass("modal-sm")){$(div).removeClass("modal-sm");$(div).addClass("modal-md")}}}
|