$(function () {
  // メニューオーバーレイ表示
  $(".menu_btn").click(function () {
    var w = $(this).width();

    $(this).toggleClass("hide");
    $("#overlay_menu.overlay")
      .toggleClass("slidein")
      .css({ transform: "translateX(" & -w & ")" });
    $("#collabo_main").toggleClass("noscroll");

    // 他のボタンを非表示
    $(".user_btn").toggleClass("none");
    $(".add_user_btn").toggleClass("none");
  });

  // ユーザーリストオーバーレイ表示
  $(".user_btn").click(function () {
    var w = $(this).width();

    $(this).toggleClass("hide");
    $("#overlay_user_list.overlay")
      .toggleClass("slidein")
      .css({ transform: "translateX(" & -w & ")" });
    $("#collabo_main").toggleClass("noscroll");

    // 他のボタンを非表示
    $(".add_user_btn").toggleClass("none");
    $(".menu_btn").toggleClass("none");

    if ($("#overlay_user_list.overlay").hasClass("noscroll")) {
      $("#overlay_user_list.overlay").removeClass("noscroll");
    } else {
      $("#overlay_user_list.overlay").addClass("noscroll");
    }
  });

  // フッターメニュー アコーディオン
  $(".footer_menu_btn").click(function () {
    var h_active = $("#collabo_footer").height();
    var h_hide = h_active - $("#collabo_footer_menu").height();
    
    // 非アクティブ時
    if ($(this).hasClass("hide")) {
      $(this).removeClass("hide");
      $("#collabo_footer_menu").css({ bottom: h_active });
      // アクティブ時
    } else {
      $(this).addClass("hide");
      $("#collabo_footer_menu").css({ bottom: h_hide });
    }
  });

  // モーダルonモーダル(前のモーダルを非表示に)
  // ホスト変更ボタン押下イベント
  $(".ch_host_btn").click(function () {
    var target = $(this).val();
    changeModal(target, "changeHostModal");
  });

  /* モーダルの切り替え */
  function changeModal(beforeModal, afterModal) {
    $(beforeModal).modal("hide");
    $(afterModal).modal("show");
  }

  // 閉じるイベント
  $(".close_btn").click(function () {
    $("#overlay_add_user_list").addClass("none");
  });

  // ユーザー追加イベント
  $(".inv_btn").click(function () {
    $("#overlay_add_user_list").addClass("none");
  });

  // ユーザー招待メンバー検索
  $(".add_user_btn").click(function () {
    $("#overlay_add_user_list").removeClass("none");
    $.ajax({
      url: "collaboration_overlay_add_user_list.html",
      type: "POST",
      datatype: "html",
    }).done(function (data) {
      $("#add_user_list").html(data);
    });
  });
});