// New Room
// チャットルーム生成ボタン処理
$("#createChatRoom").on("click", function () {
  //loadingIndicatorを表示
  CHAT_UI.showLoadingIndicator();

  let isInvite = false;
  CHAT.globalIsInvite = isInvite;
  socket.emit("getGroupList", isInvite);
});

// Room Delete
// チャットルーム削除ボタン処理
$("#roomDeleteButton").on("click", function (e) {
  if ($(".deleteBox").is(":visible")) {
    // チャットルーム削除アイコンが表示されている時、ブラインド処理を行う
    $(".deleteBox")
      .finish()
      .show()
      .fadeTo("slow", 0, function () {
        $(this).hide();
      });
    // チャットリストについてクリックイベントを与える
    $(".chat_list").off("click");
    $(".chat_list:not(.active_chat)").on("click", function (e) {
      //loadingIndicatorを表示
      CHAT_UI.showLoadingIndicator();
      let roomId = $(this).data("roomId");
      let roomName = $(this).data("roomname");
      socket.emit("joinRoom", roomId, roomName, function () {
        $("#messages").html("");
        $(".titleRoomName").text(roomName).data("roomName", roomName);
        $("#pills-chat-tab").tab("show");
        $("#message-search").attr(
          "placeholder",
          getLocalizedString("chat_search_placeholder")
        );
      });
    });

    let roomListTitle = getLocalizedString("roomListTitle");
    $(".titleRoomName").text(roomListTitle);

    $(".chat_list.active_chat").on("click", function (e) {
      $("#pills-chat-tab").tab("show");
    });
  } else {
    // チャットルーム削除アイコンが表示されていない場合、表示する
    $(".deleteBox").finish().hide().fadeTo("slow", 1).show();
    // #36129に対応
    let deleteRoomTitle = getLocalizedString("deleteRoomTitle");
    $(".titleRoomName").text(deleteRoomTitle);
    // 重複処理を防ぐためにチャットリストのクリックイベントを消す
    $(".chat_list").off("click");

    // チャットルームの削除アイコンにクリックイベントを与える
    $(".deleteBox").off("click");
    $(".deleteBox").on("click", function (e) {
      // #36174
      let roomId = $(this).data("roomId");
      let activeRoom = $(this).data("activeRoom");
      $("#roomDeleteTitle").text(getLocalizedString("roomDeleteTitle"));
      $("#roomDelete").text(getLocalizedString("roomDelete"));
      $("#cancelTitle").text(getLocalizedString("cancelTitle"));

      // #36128
      $("#roomDeleteConfirm")
        .appendTo("body")
        .modal({
          backdrop: "static",
          keyboard: false,
        })
        .on("click", "#roomDelete", function (e) {
          //loadingIndicatorを表示
          CHAT_UI.showLoadingIndicator();
          // 現在接続されているチャットルームを離れるとメッセージテップを初期化する
          if (activeRoom) {
            $("#messages").html("");
            CHAT.saveRoomInfo("", "");
          }
          // チャットルームから退場する
          socket.emit("exitRoom", roomId);

          // #36129に対応
          let roomListTitle = getLocalizedString("roomListTitle");
          $(".titleRoomName").text(roomListTitle);
        });
    });
  }
});

$("#room-search").on("input", function (event) {
  if ($("#room-search").val().length > 0) {
    // 検索結果が有る場合、結果を表示する
    socket.emit("roomSearch", encodeURIComponent($("#room-search").val()));
  } else {
    if (IS_ONLINE == "true") {
      if (typeof android != "undefined") {
        android.updateRoomList();
      } else {
        webkit.messageHandlers.updateRoomList.postMessage({});
      }
      CHAT_UI.refreshRoomList(ChatRoomType.DM);
      CHAT_UI.dismissLoadingIndicator();
    }
  }
});

//メッセージ送信
$("#messageInput").on("keypress", function (event) {
  if (event.which == 13) {
    // Enterキーの処理
    $("#messageSend").click();
  }
});

// 写真アップロード
$("#imageInputButton").on("click", function () {
  $("#imageInputTag").click();
});

// 動画アップロード
$("#videoUploadButton").on("click", function () {
  $("#videoInputTag").click();
});

$("#imageInputTag").on("change", function () {
  $("#image-form").submit();
  // reset the value of form
  $("#imageInputTag").val("");
});

$("#videoInputTag").on("change", function () {
  $("#video-form").submit();
  // reset the value of form
  $("#videoInputTag").val("");
});

$("#image-form").on("submit", function (e) {
  e.preventDefault();
  const imageInputTag = $("#imageInputTag");
  const file = imageInputTag.prop("files")[0];
  if (file) {
    $(".overlay").addClass("active undismissable");
    $(".loader").addClass("active");
    CHAT_UI.showLoadingIndicator();
    var fd = new FormData($(this)[0]);
    console.log($(this)[0]);
    //画像の大きさが500pixelより大きかったら、thumbnailを生成
    CHAT.createThumbnailAndUpload(
      file,
      function (resizeFile, thumbnailCreated) {
        if (resizeFile && thumbnailCreated) {
          //ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
          fd.append("thumb", resizeFile);
        }

        // イメージをアップロード
        CHAT.uploadImage(fd);
      }
    );
  }
});

$("#video-form").on("submit", function (e) {
  e.preventDefault();
  const videoInputTag = $("#videoInputTag");
  const file = videoInputTag.prop("files")[0];
  if (file) {
    $(".overlay").addClass("active undismissable");
    $(".loader").addClass("active");
    CHAT_UI.showLoadingIndicator();
    var fd = new FormData($(this)[0]);

    if (!file.type.includes("image")) {
      // video 保存
      // CHAT.createVideoThumbnailAndUpload(file, function(resizeFile, thumbnailCreated) {
      //     if(resizeFile && thumbnailCreated) {
      //         //ただ、画像の大きさが500pixel以下の場合はthumbnailは生成されない
      //         fd.append('thumb', resizeFile)
      //     }
      //     CHAT.uploadImage(fd);
      // })
      CHAT.uploadImage(fd);
      return;
    }
  }
});

$("#message-search").on("input", function (event) {
  // チャットキーワードを入力するとページ内にある単語をハイライトする。(mark.js 使用)
  if ($(this).val()) {
    $(".message_content").unmark();
    $(".message_content").mark($(this).val());

    if ($("[data-markjs=true]").length > 0) {
      // マーキングされている単語があった場合、最後の単語にスクロールを移動する。
      CHAT_UI.scrollToLastMarkedUnseen($(this).val());
    } else {
      // マーキングされている単語がない場合、下段にスクロールする。
      CHAT_UI.scrollToBottom();
    }
  } else {
    // チャットキーワードが空欄になるとマーキングを解除し、下段にスクロールする。
    $(".message_content").unmark();
    CHAT_UI.scrollToBottom();
  }
});

//次のマーキングされた単語にスクロールを移動する。
$("#pre-search").on("click", function (event) {
  CHAT_UI.scrollToLastMarkedUnseen(jQuery("#message-search").val());
});

// Exit Room
$("#exitRoom").on("click", function (event) {
  // 36174
  $("#exitRoomTitle").text(getLocalizedString("exitRoomTitle"));
  $("#exitRoomOk").text(getLocalizedString("yesTitle"));
  $("#noExit").text(getLocalizedString("cancelTitle"));

  $("#exitRoomConfirm")
    .appendTo("body")
    .modal({
      backdrop: "static",
      keyboard: false,
    })
    .on("click", "#exitRoomOk", function (e) {
      //loadingIndicatorを表示
      CHAT_UI.showLoadingIndicator();
      // チャットルームから退場する
      socket.emit("exitRoom");
      $("#dismiss").click();
      CHAT.saveRoomInfo("", "");
    });
});

// Side Bar
$("#sidebarCollapse").on("click", function () {
  // open sidebar
  $("#sidebar").addClass("active");
  // fade in the overlay
  $(".overlay").addClass("active");
  $(".collapse.in").toggleClass("in");
  $("a[aria-expanded=true]").attr("aria-expanded", "false");
});

$("#dismiss, .overlay").on("click", function () {
  // hide sidebar
  $("#sidebar").removeClass("active");
  // hide overlay if dismissable
  $(".overlay:not(.undismissable)").removeClass("active");
});

//Invite User
//招待ボタンを押すとグループリストを持ってくる。(ボタンを動的に追加して微動作中)
$("#addUser").on("click", function (event) {
  //loadingIndicatorを表示
  CHAT_UI.showLoadingIndicator();
  let isInvite = true;
  CHAT.globalIsInvite = isInvite;
  socket.emit("getGroupList", isInvite);
});

//グループ画面での検索
$("#groupListKeyword").on("input", function (event) {
  // data-name値で当該キーワードが入っているグループのみを表示する。
  if ($(this).val()) {
    $('.group_list:not([data-name*="' + $(this).val() + '" i])').hide();
    $('.group_list[data-name*="' + $(this).val() + '" i]').show();
  } else {
    $(".group_list").show();
  }
});

$("#userListKeyword").on("input", function (event) {
  // data-name値で当該キーワードが入っているユーザーのみを表示する。
  if ($(this).val()) {
    $('.user_list:not([data-name*="' + $(this).val() + '" i])').hide();
    $('.user_list[data-name*="' + $(this).val() + '" i]').show();
  } else {
    $(".user_list").show();
  }
});

$("#selectListKeyword").on("input", function (event) {
  if ($(this).val()) {
    $('.select_user_list:not([data-name*="' + $(this).val() + '" i])').hide();
    $('.select_user_list[data-name*="' + $(this).val() + '" i]').show();
  } else {
    $(".select_user_list").show();
  }
});

$("#contactButton").on("click", function (event) {
  CHAT_UI.refreshContactScreen();
});

$("#chatButton").on("click", function (event) {
  CHAT_UI.refreshRoomList(ChatRoomType.DM);
});

$("#tabDM").on("click", function (e) {
  CHAT_UI.refreshRoomList(ChatRoomType.DM);
});

$("#tabGroup").on("click", function (e) {
  CHAT_UI.refreshRoomList(ChatRoomType.GROUP);
});

$("#tabAllGroup").on("click", function (e) {
  CHAT_UI.refreshAllGroupSearch("0");
});

$("#tabMyGroup").on("click", function (e) {
  $("#contactSearch").attr("placeholder", getLocalizedString("userSearch"));
  CHAT_UI.refreshContactScreen();
});

$("#tabMyGroupOnMakeRoom").on("click", function (e) {
  CHAT_UI.refreshMyGroupForMakeRoom();
});

$("#tabAllGroupOnMakeRoom").on("click", function (e) {
  CHAT_UI.refreshAllGroupForMakeRoom("0");
});

$("#tabMyGroupOnAddUser").on("click", function (e) {
  CHAT_UI.refreshMyGroupForAddUser();
});

$("#tabAllGroupOnAddUser").on("click", function (e) {
  CHAT_UI.refreshAllGroupForAddUser("0");
});

$("#tabMyGroupOnAddUserInCollaboration").on("click", function (e) {
  CHAT_UI.refreshMyGroupForAddUserInCollaboration();
});

$("#tabAllGroupOnAddUserInCollaboration").on("click", function (e) {
  CHAT_UI.refreshAllGroupForAddUserInCollaboration("0");
});

$("#makeRoomConfirmBtn").on("click", function (e) {
  if (typeof android != "undefined") {
    android.saveSelectedUserList(CHAT.globalSelectedUserList.join(","));
  } else {
    webkit.messageHandlers.saveSelectedUserList.postMessage(
      CHAT.globalSelectedUserList.join(",")
    );
  }
  $("#makeRoomForm").submit();
});

$("#addUserConfirmBtn").on("click", function (e) {
  if (typeof android != "undefined") {
    android.saveSelectedUserList(CHAT.globalSelectedUserList.join(","));
  } else {
    webkit.messageHandlers.saveSelectedUserList.postMessage(
      CHAT.globalSelectedUserList.join(",")
    );
  }
  $("#addUserForm").submit();
});
