import "./assets/scss/app.scss";
import $ from "cash-dom";

export class App {
  initializeApp() {
    $(".load-username").on("click", e => {
      let userName = $(".username.input").val();
      const regex = /[a-z0-9-_]/;
      const re = /[A-Z]/;

      if (userName === "" || !regex.test(userName) || re.test(userName)) {
        $(".username").addClass(".input is-danger");
      } else {
        $(".username").removeClass(".input is-danger");
        console.log("pokazuje loader");
        $("#spinner").removeClass("is-hidden");
        fetch(`https://api.github.com/users/${userName}`)
          .then(response => {
            if (response.ok) {
              response.json().then(body => {
                this.profile = body;
                this.update_profile();
                $("#spinner").addClass("is-hidden");

                fetch(`https://api.github.com/users/${userName}/events/public`)
                  .then(res => res.json())
                  .then(data => {
                    this.events = data
                      .map(el => {
                        if (
                          el.type === "PullRequestEvent" ||
                          el.type === "PullRequestReviewCommentEvent"
                        ) {
                          return el;
                        }
                      })
                      .filter(el => typeof el !== "undefined");

                    console.log(this.events);

                    this.upadate_history();
                  })
                  .catch(err => console.log(err));
              });
            }
          })
          .catch(err => console.log(err));
      }
    });
  }

  update_profile() {
    $("#profile-name").text($(".username.input").val());
    $("#profile-image").attr("src", this.profile.avatar_url);
    $("#profile-url")
      .attr("href", this.profile.html_url)
      .text(this.profile.login);
    $("#profile-bio").text(this.profile.bio || "(no information)");
  }
  upadate_history() {
    if (this.events.legth > 0) {
      $("#avatar-is-1").attr("src", this.profile.avatar_url);
      $("#name-is-1")
        .attr("href", this.profile.html_url)
        .text(this.profile.login);

      $("#heading-is-1").text(this.events[0].created_at);
      $("#event-is-1").attr("href", this.events[0].payload.pull_request.url);
      $("#text-content-1-1").text(this.events[0].payload.action);

      $("#repo-is-1")
        .attr("href", this.events[0].repo.url)
        .text(this.events[0].repo.name);
      if (this.events[0].type === "PullRequestReviewCommentEvent") {
        $("#text-content-1-2").text("to");
        $("#comment-is-1")
          .attr("href", this.events[0].payload.comment.url)
          .text("comment");
      }

      $("#avatar-is-primary").attr("src", this.profile.avatar_url);
      $("#name-is-primary")
        .attr("href", this.profile.html_url)
        .text(this.profile.login);
      $("#heading-is-primary").text(this.events[1].created_at);
      $("#text-content-2-1").text(this.events[1].payload.action);
      $("#text-content-2-2").hide();
      $("#action-is-primary").hide();
      $("repo-is-primary")
        .attr("href", this.events[1].repo.url)
        .text(this.events[1].repo.name);
      $("#event-is-primary").attr(
        "href",
        this.events[1].payload.pull_request.url
      );
      if (this.events[1].type === "PullRequestReviewCommentEvent") {
        $("#text-content-2-2")
          .text("to")
          .show();
        $("#action-is-primary")
          .attr("href", this.events[0].payload.comment.url)
          .text("comment")
          .show();
      }

      $("#avatar-is-3").attr("src", this.profile.avatar_url);
      $("#name-is-3")
        .attr("href", this.profile.html_url)
        .text(this.profile.login);
      $("#heading-is-3").text(this.events[2].created_at);
      $("#text-content-3-1").text(this.events[2].payload.action);
      $("#repo-is-3")
        .attr("href", this.events[2].repo.url)
        .text(this.events[2].repo.name);
      $("event-is-3").attr("href", this.events[2].payload.pull_request.url);

      if (this.events[2].type === "PullRequestReviewCommentEvent") {
        $("#text-content-3-2").text("to");
        $("#comment-is-3")
          .attr("href", this.events[2].payload.comment.url)
          .text("comment");
      }
    } else {
      alert(`User don't have any pull request events!`);
    }
  }
}