Wadhefa+

Wadhefa Tool by SLPMods

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey, Greasemonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Violentmonkey.

Voor het installeren van scripts heb je een extensie nodig, zoals Tampermonkey of Userscripts.

Voor het installeren van scripts heb je een extensie nodig, zoals {tampermonkey_link:Tampermonkey}.

Voor het installeren van scripts heb je een gebruikersscriptbeheerder nodig.

(Ik heb al een user script manager, laat me het downloaden!)

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een extensie nodig, zoals {stylus_link:Stylus}.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

Voor het installeren van gebruikersstijlen heb je een gebruikersstijlbeheerder nodig.

(Ik heb al een beheerder - laat me doorgaan met de installatie!)

// ==UserScript==
// @name         Wadhefa+
// @namespace    http://tampermonkey.net/
// @version      1.0
// @description  Wadhefa Tool by SLPMods
// @author       SLPMods
// @match        https://www.wadhefa.com/*
// @icon         https://www.wadhefa.com/icons/favicon.ico
// @grant        GM_addStyle
// @license      MIT
// @run-at       document-end
// ==/UserScript==

(function() {
    'use strict';

    const fa = document.createElement('link');
    fa.rel = 'stylesheet';
    fa.href = 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css';
    document.head.appendChild(fa);

    const css = `
        .slp-btn {
            position: relative;
            display: inline-flex; justify-content: center; align-items: center; gap: 8px;
            background: linear-gradient(135deg, #d75b00 0%, #ff8c00 100%);
            color: white; padding: 10px 24px; border-radius: 50px;
            font-family: 'Tahoma', sans-serif; font-weight: bold; font-size: 13px;
            border: none; cursor: pointer; margin-top: 15px;
            box-shadow: 0 4px 10px rgba(215, 91, 0, 0.3);
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            overflow: hidden; z-index: 1;
            text-decoration: none !important;
            transform: scale(1);
        }
        .slp-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 20px rgba(215, 91, 0, 0.4);
        }
        .slp-btn:active { transform: scale(0.95); }

        .slp-btn.saved {
            background: linear-gradient(135deg, #27ae60 0%, #2ecc71 100%);
            box-shadow: 0 4px 10px rgba(39, 174, 96, 0.3);
            pointer-events: none;
            padding-right: 20px;
            padding-left: 20px;
        }

        .slp-btn i { font-size: 15px; transition: transform 0.3s; }

        .pop-in {
            animation: checkPop 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards;
        }

        @keyframes checkPop {
            0% { transform: scale(0) rotate(-45deg); opacity: 0; }
            50% { transform: scale(1.5) rotate(10deg); }
            100% { transform: scale(1) rotate(0); opacity: 1; }
        }

        .slp-popup {
            position: absolute; background: #fff; width: 300px;
            border-radius: 8px; box-shadow: 0 10px 25px rgba(0,0,0,0.1);
            z-index: 99999; display: none; border: 1px solid #eee;
            font-family: 'Tahoma', sans-serif; overflow: hidden;
            animation: slpFade 0.2s ease-out;
            border-top: 3px solid #d75b00;
        }
        @keyframes slpFade { from {opacity:0; transform:translateY(5px);} to {opacity:1; transform:translateY(0);} }

        .slp-header {
            background: #fdfdfd; padding: 12px 15px;
            border-bottom: 1px solid #f0f0f0;
            display: flex; justify-content: space-between; align-items: center;
        }
        .slp-title { font-weight: bold; color: #d75b00; font-size: 14px; }
        .slp-close { cursor: pointer; color: #bbb; transition: 0.2s; }
        .slp-close:hover { color: #d75b00; }

        .slp-list { list-style: none; margin: 0; padding: 0; max-height: 250px; overflow-y: auto; }

        .slp-item {
            padding: 10px 15px; border-bottom: 1px solid #f9f9f9;
            display: flex; align-items: center; justify-content: space-between;
            cursor: pointer; transition: 0.2s;
        }
        .slp-item:hover { background: #fff5eb; }

        .slp-info { width: 85%; }
        .slp-id {
            display: inline-block; background: #e8f5e9; color: #27ae60;
            padding: 2px 6px; border-radius: 4px; font-size: 10px; font-weight: bold; margin-bottom: 3px;
        }
        .slp-text { display: block; font-size: 12px; color: #444; line-height: 1.3; }

        .slp-del {
            color: #e74c3c; width: 25px; height: 25px;
            display: flex; align-items: center; justify-content: center;
            border-radius: 50%; transition: 0.2s; opacity: 0.7;
        }
        .slp-del:hover { background: #ffeaea; opacity: 1; }

        .slp-empty { padding: 25px; text-align: center; color: #999; font-size: 12px; }
    `;
    GM_addStyle(css);

    const STORAGE = 'slp_wadhefa_plus';

    const getDB = () => JSON.parse(localStorage.getItem(STORAGE) || '[]');
    const setDB = (data) => localStorage.setItem(STORAGE, JSON.stringify(data));

    if (window.location.href.includes('/news/')) {
        const h1 = document.querySelector('h1');
        const urlParts = window.location.pathname.split('/');
        const id = urlParts.find(p => /^\d+$/.test(p));

        if (h1 && id) {
            const btn = document.createElement('button');
            btn.className = 'slp-btn';

            if (getDB().some(x => x.id === id)) {
                btn.classList.add('saved');
                btn.innerHTML = '<i class="fa-solid fa-check pop-in"></i> تم الحفظ';
            } else {
                btn.innerHTML = '<i class="fa-regular fa-bookmark"></i> حفظ الإعلان';
                btn.onclick = (e) => {
                    e.preventDefault();

                    btn.style.transform = "scale(0.9)";
                    setTimeout(() => {
                        const db = getDB();
                        if (!db.some(x => x.id === id)) {
                            db.unshift({ id, title: h1.innerText.trim() });
                            setDB(db);

                            btn.classList.add('saved');
                            btn.innerHTML = '<i class="fa-solid fa-check pop-in"></i> تم الحفظ';
                            btn.style.transform = "scale(1)";
                        }
                    }, 200);
                };
            }
            h1.parentNode.appendChild(btn);
        }
    }

    const input = document.getElementById('indx');
    if (input) {
        const popup = document.createElement('div');
        popup.className = 'slp-popup';
        popup.innerHTML = `
            <div class="slp-header">
                <span class="slp-title"><i class="fa-solid fa-briefcase"></i> وظيفه +</span>
                <span class="slp-close" id="slp-x"><i class="fa-solid fa-xmark"></i></span>
            </div>
            <ul class="slp-list"></ul>
        `;
        document.body.appendChild(popup);

        const render = () => {
            const list = popup.querySelector('.slp-list');
            list.innerHTML = '';
            const db = getDB();

            if (db.length === 0) {
                list.innerHTML = '<li class="slp-empty">لا توجد إعلانات محفوظه</li>';
                return;
            }

            db.forEach(item => {
                const li = document.createElement('li');
                li.className = 'slp-item';
                li.innerHTML = `
                    <div class="slp-info">
                        <span class="slp-id">#${item.id}</span>
                        <span class="slp-text">${item.title}</span>
                    </div>
                    <div class="slp-del"><i class="fa-regular fa-trash-can"></i></div>
                `;

                li.querySelector('.slp-del').onclick = (e) => {
                    e.stopPropagation();
                    setDB(getDB().filter(x => x.id !== item.id));
                    render();
                };

                li.onclick = (e) => {
                    if (!e.target.closest('.slp-del')) {
                        input.value = item.id;
                        popup.style.display = 'none';
                    }
                };
                list.appendChild(li);
            });
        };

        const toggle = () => {
            render();
            popup.style.display = 'block';
            const rect = input.getBoundingClientRect();
            popup.style.top = (window.scrollY + rect.bottom + 5) + 'px';
            popup.style.left = (window.scrollX + rect.left) + 'px';
        };

        input.addEventListener('focus', toggle);
        input.addEventListener('click', toggle);
        document.getElementById('slp-x').onclick = () => popup.style.display = 'none';

        document.addEventListener('click', (e) => {
            if (!popup.contains(e.target) && e.target !== input) {
                popup.style.display = 'none';
            }
        });
    }
})();