ui dialog Maximize/Minimize button

$(function() {
  function addButtons(dlg) {
    // Define Buttons
    var $close = dlg.find(".ui-dialog-titlebar-close");
    var $min = $("<button>", {
      class: "ui-button ui-corner-all ui-widget ui-button-icon-only ui-window-minimize",
      type: "button",
      title: "Minimize"
    }).insertBefore($close);
    $min.data("isMin", false);
    $("<span>", {
      class: "ui-button-icon ui-icon ui-icon-minusthick"
    }).appendTo($min);
    $("<span>", {
      class: "ui-button-icon-space"
    }).html(" ").appendTo($min);
    var $max = $("<button>", {
      class: "ui-button ui-corner-all ui-widget ui-button-icon-only ui-window-maximize",
      type: "button",
      title: "Maximize"
    }).insertBefore($close);
    $max.data("isMax", false);
    $("<span>", {
      class: "ui-button-icon ui-icon ui-icon-plusthick"
    }).appendTo($max);
    $("<span>", {
      class: "ui-button-icon-space"
    }).html(" ").appendTo($max);
    // Define Function
    $min.click(function(e) {
      if ($min.data("isMin") === false) {
        console.log("Minimize Window");
        $min.data("original-pos", dlg.position());
        $min.data("original-size", {
          width: dlg.width(),
          height: dlg.height()
        });
        $min.data("isMin", true);
        dlg.animate({
          height: '40px',
          top: $(window).height() - 50
        }, 200);
        dlg.find(".ui-dialog-content").hide();
      } else {
        console.log("Restore Window");
        $min.data("isMin", false);
        dlg.find(".ui-dialog-content").show();
        dlg.animate({
          height: $min.data("original-size").height + "px",
          top: $min.data("original-pos").top + "px"
        }, 200);
      }
    });
    $max.click(function(e) {
      if ($max.data("isMax") === false) {
        console.log("Maximize Window");
        $max.data("original-pos", dlg.position());
        $max.data("original-size", {
          width: dlg.width(),
          height: dlg.height()
        });
        $max.data("isMax", true);
        dlg.animate({
          height: $(window).height() + "px",
          width: $(window).width() - 20 + "px",
          top: 0,
          left: 0
        }, 200);
      } else {
        console.log("Restore Window");
        $max.data("isMax", false);
        dlg.animate({
          height: $max.data("original-size").height + "px",
          width: $max.data("original-size").width + "px",
          top: $max.data("original-pos").top + "px",
          left: $max.data("original-pos").top + "px"
        }, 200);
      }
    });
  }

  $('#window').dialog({
    draggable: true,
    autoOpen: true,
    classes: {
      "ui-dialog": "ui-window-options",
      "ui-dialog-titlebar": "ui-window-bar"
    },
    modal: true,
    responsive: true,
  });

  addButtons($(".ui-window-options"));

  $("#winOpener").click(function() {
    $("#window").dialog("open");
  })
});


css
.ui-window-bar .ui-button {
  position: absolute;
  top: 50%;
  width: 20px;
  margin: -10px 0 0 0;
  padding: 1px;
  height: 20px;
}

.ui-window-bar .ui-window-minimize {
  right: calc(.3em + 40px);
}

.ui-window-bar .ui-window-maximize {
  right: calc(.3em + 20px);
}

html
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<a href="#" id="winOpener">Open Window</a>

<div id="window" title="Test Window">window</div>


http://output.jsbin.com/ehagoy/154