# JS

import Axios from 'axios';

// get api url of the repos, call with Axios
// and add description and stars count updated

// links = all span elements with api url inside
const links = document.querySelectorAll('.repoApiUrl');
links.forEach(
    (elementNode) => {
        // link = text content/api url to call
        const link = elementNode.textContent;
        // starsEl = span element with star icon to add stars count
        const starsEl = elementNode.previousElementSibling;
        // descEl = element to add description
        const descEl = elementNode.parentElement.parentElement.lastElementChild;

        Axios.get(link).then(
            (res) => {
                // create text not with stars and description
                // and add in the element node
                const data = res.data;
                const stars = document.createTextNode(data.stargazers_count);
                const desc = document.createTextNode(data.description);
                starsEl.appendChild(stars);
                descEl.appendChild(desc);
            }
        )
    }
)

// listenner to send form on click in icon
// to delete repository
const deleteBtns = document.querySelectorAll('.cardrepos__del-btn');
deleteBtns.forEach(
    (deleteBtn) => {
        deleteBtn.addEventListener('click',
            () => {
                const parentForm = deleteBtn.parentElement;
                parentForm.submit();
            }
        )
    }
)

// Toggle Menu
const menuMobile = document.querySelector('.navbar__menu');
const toggleBtn = document.querySelector('.navbar__toggle');

function toggleMenu() {

    if (toggleBtn.innerText == 'menu') {
        toggleBtn.innerText = 'close';
        menuMobile.classList.add('open');
    } else {
        toggleBtn.innerText = 'menu';
        menuMobile.classList.remove('open');
    }
}

toggleBtn.addEventListener('click',
    toggleMenu
)

# view example

class RepoCreateView(generic.CreateView):
    template_name = "main/repo_add.html"
    success_url = reverse_lazy("main:repo_add")
    model = Repo
    fields = ("url",)

    def get_context_data(self, **kwargs):
        kwargs["repos"] = Repo.objects.filter(user=self.request.user).order_by("name")
        return super().get_context_data(**kwargs)

    def form_valid(self, form):
        form.instance.user = self.request.user
        data = get_github_data(form.instance.url)
        form.instance.name = data["name"]
        form.instance.owner = data["owner"]["login"]
        form.instance.url_api = data["url"]

        return super().form_valid(form)

# utils example

import requests, json, re

def get_github_data(url):
    # convert github link to
    # github api link and transform
    # json response in python dict
    url = re.sub("//", "//api.", url)
    url = re.sub("com/", "com/repos/", url)
    if url.endswith("/"):
        url = url[:-1]
    res = requests.get(url)
    obj = json.loads(res.content)

    return obj

# model example
User = get_user_model()


class Repo(models.Model):
    user = models.ForeignKey(User, on_delete=models.CASCADE, related_name="repos")
    url = models.URLField(max_length=600)
    url_api = models.URLField(max_length=600)
    slug = AutoSlugField(populate_from=["user__username","name", "owner"], overwrite=True)
    name = models.CharField(max_length=200)
    owner = models.CharField(max_length=200)

    def __str__(self):
        return f"{self.name} - {self.owner}"