bsdialog/bsdialog.js

/**
 * BSDialog
 * @version v0.1.0.024 (2019/07/05 2210)
 */
var BSDialog = {
  Create: function(id, title, url, is_big, update_body) {
    var a = this;
    var isBig = ((typeof(is_big) == "undefined") ? false : (is_big == true) ? true : false);
    var updateBody = ((typeof(update_body) == "undefined") ? false : (update_body == true) ? true : false);

    if (!a.hasDialog(id)) {
      var html = a.generateModalHtml(id, title, null, isBig);

      $("body").append(html);
    }

    $.ajax({
      url: url,
      cache: false,
      timeout: 10000,
      success: function(result, status, xhr){
        if ((xhr.status == 200) || (xhr.status == 302) || (xhr.status == 301))
        {
          if (updateBody)
          {
            a.updateContentBody(id, result);
          } else {
            $("#dlg" + id).find(".modal-content").html(result);
          }
        } else {
          a.updateContentBody(id, xhr.statusText + " (" + xhr.status + ")");
        }
      },
      error: function(xhr){
        a.updateContentBody(id, xhr.statusText + " (" + xhr.status + ")");
      },
      complete: function(xhr, status){
        // do nothing yet
      }
    });

    a.show(id);
  },
  Close: function(id) {
    if (!this.hasDialog(id)) return;

    $("#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, is_big) {
    if (this.hasDialog(id)) return;

    var html = this.generateModalHtml(id, title, message, is_big);
    $("body").append(html);

    this.show(id);
  },
  hasDialog: function(id) {
    return ($("body > div[id='dlg" + id + "']").length > 0);
  },
  generateModalHtml: function(id, title, message, is_big) {
    var size = ((typeof(is_big) == "undefined") ? "sm" : (is_big == true ? "lg" : "sm"));

    var html = "";
    html += "<div class=\"modal fade\" id=\"dlg" + id + "\" tabindex=\"-1\" role=\"dialog\" aria-labelledby=\"dlg" + id + "Label\" aria-hidden=\"true\">";
    html += "  <div class=\"modal-dialog modal-" + size + "\">";
    html += "    <div class=\"modal-content\">";
    html += "      <div class=\"modal-header\">";
    html += "        <button type=\"button\" class=\"close\" data-dismiss=\"modal\" aria-hidden=\"true\">&times;</button>";
    html += "        <strong class=\"modal-title\">" + title + "</strong>";
    html += "      </div>";

    if ($.trim(message).length <= 0)
    {
      html += "      <div class=\"modal-body custom-loading\"></div>";
    } else {
      html += "      <div class=\"modal-body\">" + message + "</div>";
    }

    html += "      <div class=\"modal-footer\">";
    html += "        <button type=\"button\" class=\"btn btn-default\" data-dismiss=\"modal\">Close</button>";
    html += "      </div>";
    html += "    </div>";
    html += "  </div>";
    html += "</div>";

    return html;
  },
  show: function(id) {
    $("#dlg" + id).modal('show');
    $("#dlg" + id).off('hide.bs.modal');
    $("#dlg" + id).on('hide.bs.modal', function() {
      if ($("body > div[id='dlg" + id + "']").next().is("div[class~='modal-backdrop']")) {
        $("body > div[id='dlg" + id + "']").next().remove();
      }

      $("body > div[id='dlg" + id + "']").remove();

    });
  },
  updateContentBody: function(id, text) {
    var body = $("#dlg" + id).find(".modal-body");

    if ($(body).hasClass("custom-loading")) $(body).removeClass("custom-loading");

    $(body).html(text);
  }
};