freekode / Fold jobs on pracuj.pl

// ==UserScript==
// @name         Fold jobs on pracuj.pl
// @namespace    http://freekode.org/
// @version      0.1
// @description  you can fold a job in the main offer list
// @author       freekode
// @match        http://*.pracuj.pl/praca/*
// @grant        GM_setValue
// @grant        GM_getValue
// ==/UserScript==

(function() {
    'use strict';

    console.log('Hide jobs script start');

    var foldedOffers = new Set(GM_getValue('foldedOffers', []));
    console.log('folded offer = ', foldedOffers.size);


    addGlobalStyle('.monkey__offer--folded {height:20px !important}');
    addGlobalStyle('.monkey__fold-btn {float: right;margin-right: 30px;}');
    addGlobalStyle('.monkey__info {float: left;}');
    addGlobalStyle('.monkey__info--content {display: inline-block;max-width: 400px;max-height: 18px;overflow-y: hidden;}');
    addGlobalStyle('.monkey__info__offer-title {margin-right: 10px;font-weight: bold !important;}');
    addGlobalStyle('.monkey__info__employer-title {max-width: 250px}');

    var offers = $('#mainOfferList li');
    offers.each(function(i) {
        var $elem = $(this);

        var offerId = $elem.find('span.o-list_star').attr('data-id');

        if (offerId) {
            // it's an offer, so let's go

            var controls = $(
                '<div class="monkey__controls" data-offer-id="' + offerId + '">' +
                '<div class="monkey__info">' +
                '<div class="monkey__info--content monkey__info__offer-title"></div>' +
                '<div class="monkey__info--content monkey__info__employer-title"></div>' +
                '</div>' +
                '<a class="monkey__fold-btn">Fold</a>' +
                '</div>');

            controls.find('.monkey__fold-btn').click(fold);

            var offerBlock = $('<div class="monkey__offer"></div>');
            $elem.children().appendTo(offerBlock);

            $elem.prepend(offerBlock);
            $elem.prepend(controls);


            if (foldedOffers.has(offerId)) {
                $elem.find('.monkey__fold-btn').trigger('click');
            }
        }
    });


    function fold(e) {
        var $elem = $(e.target);
        var li = $elem.closest('li');
        var offer = li.find('.monkey__offer');
        var offerId = li.find('.monkey__controls').attr('data-offer-id');
        var offerTitle = li.find('.monkey__info__offer-title');
        var emloyerTitle = li.find('.monkey__info__employer-title');

        offer.toggle('fold');
        li.toggleClass('monkey__offer--folded');

        if (li.hasClass('monkey__offer--folded')) {
            $elem.text('Unfold');
            offerTitle.text(li.find('.o-list_item_link_name').text());
            emloyerTitle.text(li.find('.o-list_item_link_emp').text());

            foldedOffers.add(offerId);
            GM_setValue('foldedOffers', [...foldedOffers]);
            console.log('folded offer = ', foldedOffers.size);
        } else {
            $elem.text('Fold');
            offerTitle.text('');
            emloyerTitle.text('');

            foldedOffers.delete(offerId);
            GM_setValue('foldedOffers', [...foldedOffers]);
            console.log('folded offer = ', foldedOffers.size);
        }
    }

    function addGlobalStyle(css) {
        var head = document.getElementsByTagName('head')[0];
        if (!head) { return; }
        var style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = css;
        head.appendChild(style);
    }
})();