Userscript pour ajouter une catégorie favoris dans la sidebar des projets

42project-to-favorite.user.js

// ==UserScript==
// @name         42project-to-favorite
// @namespace    https://gist.github.com/GlaceCoding/c5d6d9b2f9f1784d198f79d15fc7d2cf
// @version      0.4
// @description  Add favorites category for project
// @author       GlaceCoding
// @match        https://projects.intra.42.fr/*
// @icon         https://www.google.com/s2/favicons?domain=42.fr
// @downloadURL  https://gist.github.com/GlaceCoding/c5d6d9b2f9f1784d198f79d15fc7d2cf/raw/42project-to-favorite.user.js
// @updateURL    https://gist.github.com/GlaceCoding/c5d6d9b2f9f1784d198f79d15fc7d2cf/raw/42project-to-favorite.user.js
// @grant        none
// ==/UserScript==

function getStorage() {
    const blank = { projects: [] }
    const storage = localStorage.GLACE_favorite_project
    if (!storage) {
        return blank
    }
    try {
        return JSON.parse(storage)
    } catch (e) {
        return blank
    }
    return blank
}

function saveStorage(storage) {
    localStorage.GLACE_favorite_project = JSON.stringify(storage)
}

(function() {
    'use strict';
    const $ = window.$

    const createSidebarItem = (item) =>
        $(`<a class="project-item sidebar-item" href="/projects/${item.slug}"><span class="icon-box-2 project-status-icon"></span>${item.name}</a>`)
    const getIsFav = (storage, slug) => (storage.projects.findIndex((item) => item.slug === slug) !== -1)
    const getLabel = (storage, slug) => (!getIsFav(storage, slug)) ? 'Add to favorite' : 'Remove from favorite'

    const storage = getStorage()

    $('head').append('<style>a.pointer { cursor:pointer; }</style>')
    const $sidebar = $('body > div.page > div.page-sidebar > div.app-sidebar-left')
    $sidebar.append('<div class="marked-title">Favorites</div>')
    const $list = $('<div class="projects-menu-list"></div>').appendTo($sidebar)
    if ($sidebar[0]) {
        storage.projects && storage.projects.forEach(function (item) {
            $list.append(createSidebarItem(item))
        });
    }

    function clickFavoriteHandler() {
        const slug = $(this).attr('data-slug');
        const name = $(this).attr('data-name');
        if (!name || !slug) {
            return console.error('gphilipp undefined slug/name onclick');
        }
        console.log(slug, name);
        const storage = getStorage()
        const index = storage.projects.findIndex((item) => item.slug === slug)
        if (index === -1) {
            const item = { slug: slug, name: name }
            storage.projects.push(item)
            $list.append(createSidebarItem(item))
            $(this).parents('li.project-item').find('div.project-status').prepend('<span class=label style=background:orange>fav</span>')
        } else {
            storage.projects.splice(index, 1);
            $list.children(`a[href="/projects/${slug}"]`).remove()
            $(this).parents('li.project-item').find('div.project-status > span.label').remove()
        }
        saveStorage(storage)
        $(`.gphilipp-fav[data-slug=${slug}]`).text(getLabel(storage, slug))
    }

    $('#projects-list-container > ul > li > div.project-actions > div > ul > li:nth-child(1)').each(function () {
        const storage = getStorage()
        const slug = $(this).parents('li.project-item').attr("data-name")
        const name = $(this).parents('li.project-item').attr('div.project-name')
        getIsFav(storage) && $(this).parents('li.project-item').find('div.project-status').prepend('<span class=label _c style=background:orange>fav</span>')
        $(`<li><a class="pointer gphilipp-fav" data-slug="${slug}" data-name="${name}"></a></li>`)
            .insertAfter(this)
            .children('a.pointer').text(getLabel(storage, slug)).click(clickFavoriteHandler)
    })
    const regProjectPage = /^https:\/\/projects.intra.42.fr\/projects\/([A-z0-9\-]+)(?:\/|$)/
    let match = null
    if ((match = window.location.href.match(regProjectPage)) && $("div#project-show div.project-header h3")[0]) {
        const slug = match[1]
        const name = $("div#project-show div.project-header h3").text().replace(/\s/g, '')
        $('div#project-show div.project-main div.project-summary').append(`<div class="project-summary-item">
            <button class="btn btn-primary gphilipp-fav" data-slug="${slug}" data-name="${name}"></button>
        </div>`).find('.gphilipp-fav').text(getLabel(storage, slug)).click(clickFavoriteHandler)
    }
    if (window.location.href.indexOf('https://projects.intra.42.fr/projects/graph') === 0) {
        console.log("I will transform your holygraph")
        let html = $('script.graph_description_template').html()
        html = html.replace('<%= name %>', '<%= state == "fav" ? "<span class=label _c style=background:orange>fav</span> " : "" %><%= name %>')
        $('script.graph_description_template').html(html)
        window.Graph.description.refresh_vars()
        const gParse = JSON.parse
        JSON.parse = function (data) {
            const obj = gParse.apply(this, arguments)
            if (obj && Array.isArray(obj) && obj.length > 120
                && obj[0].duration && obj[0].kind && obj[0].name && obj[0].by && obj[0].project_id
                && window.$('#graph_campus').val() == '41')
            {
                try {
                    window.Graph.colors.fav = {
                        fill: "orange",
                        stroke: "orange",
                        strokeSize: 10,
                        text: "white",
                        link: "orange"
                    }
                    window.Graph.styles.fav = {
                        strokeColor: window.Graph.colors.fav.stroke,
                        strokeWidth: 10,
                        fillColor: window.Graph.colors.fav.fill,
                        text: {
                            fontFamily: 'Noto Sans',
                            fontWeight: 'bold',
                            fontSize: 20,
                            fillColor: window.Graph.colors.fav.text,
                            justification: 'center'
                        }
                    }
                    const storage = getStorage();
                    window._.each(obj, (el) => {
                        if (getIsFav(storage, el.slug)) {
                            el.state = 'fav'
                        }
                    })
                } catch (e) { console.error('gphilipp', e) }
            }
            return obj
        }
    }
})();