קבצים ותוכנות לשימוש במערכות ימות המשיח

אA

@מה
ממש מוזר.
אצלי עובד חלק.
הטוקן ודאי תקין?!

מה

@אA כתב בקבצים ותוכנות לשימוש במערכות ימות המשיח:

הטוקן ודאי תקין?!

כן

אולי לא העלית את הגירסה הסופית של הקוד?

מה

עובד ב"ה

עשיתי קובץ HTML חדש ועובד.
עכשיו אני עובר על השיפורים שאפשר לשדרג

תודה!

אA

@מה
לא.
זו הגירסא הסופית.
גם לקחתי את מה שהעלתי ופתחתי שוב ועבד מצויין.

אA

@מה
בשמחה!
יישר כח.

ע.ג.

קוד משוכלל למעקב אחר נתוני האזנה של התלמידים במרחב הקולי
https://f2.freeivr.co.il/post/176080

מה

@אA

באג:
כשמסמנים או מסירים סימון מעמודות, השינויים חלים על עמודות אחרות (לדוג' אני מוריד סימון מעמודה 050, והעמודה 052 נמחקה)

שדרוגים:

טבלאות סיכום בצד שמאל של העמוד- כמו 'טבלת צירים' בגוגל שיטס, Pivot Table באקסל
אשפרות צפייה באותו ממשק, בנתונים של 2 שלוחות ויותר,
גלילת השורות ללא סוף - בלי לחלק לדפים נפרדים
אפשרות הורדה לאקסל
קרדיט למפתח התוכנה....

מה

עוד דבר אחד נחוץ ששכחתי:

שיתוף חבירים לצפות ברשימה.

אA

@מה
כלומר?
כל מי שיהיה לו את הטוקן יוכל לצפות.
או שאתה מתכוון בלי לתת להם את הטוקן?!

מה

@אA
בלי שאצטרך לתת להם טוקן

שאוכל לשתף אתו את הממשק כמות שהיא עם כל ההגדרות שאני מגדיר.

מתעניין

@ע.ג. כתב בקבצים ותוכנות לשימוש במערכות ימות המשיח:

קוד משוכלל למעקב אחר נתוני האזנה של התלמידים במרחב הקולי
https://f2.freeivr.co.il/post/176080

לא הבנתי לפי מה הוא מחשב את אחוזי האזנה, אם אדם אחד הקשיב לכל הקובץ זה 100%?
אולי תתן גם עמודה כמה הקשיבו לקובץ סה"כ דקות

אA

פוסט זה נמחק!

אA

הקוד המשודרג

<!DOCTYPE html>
<html lang="he" dir="rtl">
<head>
    <meta charset="UTF-8">
    <title>מערכת ניהול - ימות המשיח</title>
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css">
    <style>
        /* עיצוב כללי - לא נגענו */
        body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background: #f0f2f5; margin: 0; padding: 20px; direction: rtl; }
        .main-card { background: white; padding: 25px; border-radius: 12px; box-shadow: 0 5px 20px rgba(0,0,0,0.08); }
        
        .toolbar { display: flex; gap: 15px; margin-bottom: 25px; align-items: center; }
        .btn { padding: 9px 18px; cursor: pointer; background: #2563eb; color: white; border: none; border-radius: 6px; font-weight: 600; font-size: 14px; }
        
        .dropdown { position: relative; display: inline-block; }
        .dropdown-content { 
            display: none; position: absolute; background-color: white; min-width: 160px; 
            box-shadow: 0 8px 16px rgba(0,0,0,0.15); z-index: 2000; border-radius: 8px; overflow: hidden; top: 100%; right: 0;
        }
        .dropdown-content button { 
            width: 100%; padding: 12px; border: none; background: none; text-align: right; cursor: pointer; border-bottom: 1px solid #eee; 
        }
        .dropdown-content button:hover { background: #f8fafc; }
        .show { display: block; }

        /* טבלה ראשית - יישור מרכז */
        #data-table { width: 100% !important; border-collapse: collapse; }
        #data-table th, #data-table td { text-align: center !important; padding: 12px !important; border-bottom: 1px solid #e5e7eb; }
        #data-table thead th { background: #f1f5f9; color: #475569; }

        /* שינוי 1+3: הסרת חיצים ומיקום חיפוש */
        table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc { background-image: none !important; cursor: default !important; }
        .dataTables_filter { margin-bottom: 15px; text-align: right !important; float: none !important; display: flex; align-items: center; }
        .dataTables_filter input { padding: 8px; border: 1px solid #cbd5e1; border-radius: 6px; margin-right: 10px; width: 250px; }

        /* פאנל סיכום שמאלי (החלק ששונה) */
        #pivot-panel { position: fixed; left: -420px; top: 0; width: 400px; height: 100vh; background: white; box-shadow: 10px 0 30px rgba(0,0,0,0.2); transition: 0.4s ease; z-index: 5000; display: flex; flex-direction: column; }
        .pivot-active { left: 0 !important; }
        .pivot-tab { position: absolute; left: 100%; top: 80px; background: #1e293b; color: white; padding: 15px 10px; border-radius: 0 8px 8px 0; cursor: pointer; writing-mode: vertical-rl; font-weight: bold; }
        .pivot-body { flex: 1; overflow: auto; padding: 25px; }

        /* עיצוב טבלת הסיכום החדשה -> שונה לעיצוב רשימה (שינוי 2) */
        .summary-select { width: 100%; padding: 12px; border-radius: 8px; border: 1px solid #cbd5e1; font-size: 16px; margin-bottom: 20px; outline: none; }
        .summary-list { list-style: none; padding: 0; margin: 0; }
        .summary-list li { display: flex; justify-content: space-between; padding: 10px; border-bottom: 1px solid #e2e8f0; }
        .summary-list li:last-child { border-bottom: none; }
        .summary-count { background: #e2e8f0; padding: 2px 8px; border-radius: 12px; font-weight: bold; font-size: 14px; }

        .modal { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); z-index: 6000; }
        .modal-content { background: white; width: 400px; margin: 100px auto; padding: 25px; border-radius: 12px; }
    </style>
</head>
<body>

<div id="pivot-panel">
    <div class="pivot-tab" onclick="document.getElementById('pivot-panel').classList.toggle('pivot-active')">📊 סיכום נתונים מהיר</div>
    <div class="pivot-body">
        <h2 style="margin-top:0; font-size: 22px;">ניתוח כמויות</h2>
        <p style="color: #64748b;">בחר עמודה כדי לראות את כמות המופעים:</p>
        
        <select id="pivot-select" class="summary-select" onchange="updatePivotSummary(this.value)">
            <option value="">-- בחר עמודה לסיכום --</option>
        </select>

        <div id="pivot-summary-container">
            <p style="text-align:center; color:#94a3b8; margin-top:40px;">לא נבחרה עמודה</p>
        </div>
    </div>
</div>

<div class="main-card">
    <div class="toolbar">
        <button class="btn" style="background:#10b981" onclick="exportToExcel()">ייצוא אקסל 📥</button>
        
        <div class="dropdown">
            <button class="btn" onclick="toggleDropdown()">הגדרות ⚙️</button>
            <div id="settingsDrop" class="dropdown-content">
                <button onclick="openModal('token-modal')">ניהול טוקנים</button>
                <button onclick="openModal('col-modal')">ניהול עמודות</button>
            </div>
        </div>

        <input type="text" id="path-input" placeholder="נתיבים (למשל: 1, 2)" style="padding: 9px; width: 250px; border: 1px solid #cbd5e1; border-radius: 6px;">
        <button class="btn" onclick="initialLoad()">טען נתונים</button>
    </div>

    <table id="data-table" class="display">
        <thead><tr id="table-head"></tr></thead>
        <tbody></tbody>
    </table>
</div>

<div id="token-modal" class="modal"><div class="modal-content">
    <h3>ניהול טוקנים</h3>
    <div id="token-list"></div>
    <hr>
    <input type="text" id="new-token" placeholder="הכנס טוקן חדש" style="width:70%; padding:5px;">
    <button class="btn" onclick="addToken()">הוסף</button>
    <br><br>
    <button class="btn" style="background:#64748b" onclick="closeModal('token-modal')">סגור</button>
</div></div>

<div id="col-modal" class="modal"><div class="modal-content">
    <h3>ניהול עמודות</h3>
    <div id="col-list" style="max-height: 300px; overflow-y: auto;"></div>
    <br>
    <button class="btn" onclick="drawTable()">החל שינויים</button>
    <button class="btn" style="background:#64748b" onclick="closeModal('col-modal')">סגור</button>
</div></div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.18.5/xlsx.full.min.js"></script>

<script>
    let activeToken = localStorage.getItem('activeToken') || '';
    let rawDataStore = [];
    let allHeaders = new Set();

    function toggleDropdown() { document.getElementById("settingsDrop").classList.toggle("show"); }
    window.onclick = function(event) { if (!event.target.matches('.btn')) { 
        var d = document.getElementById("settingsDrop"); if(d && d.classList.contains('show')) d.classList.remove('show');
    }}

    function openModal(id) { document.getElementById(id).style.display = 'block'; }
    function closeModal(id) { document.getElementById(id).style.display = 'none'; }
    function exportToExcel() { XLSX.writeFile(XLSX.utils.table_to_book(document.getElementById('data-table')), 'DataReport.xlsx'); }

    function renderTokens() {
        const tokens = JSON.parse(localStorage.getItem('myTokens') || '[]');
        document.getElementById('token-list').innerHTML = tokens.map(t => `
            <div style="display:flex; justify-content:space-between; margin-bottom:10px; align-items:center;">
                <span onclick="setToken('${t}')" style="cursor:pointer; ${t===activeToken?'color:blue; font-weight:bold;':''}">${t.substring(0,12)}...</span>
                <button onclick="deleteToken('${t}')" style="background:#f87171; color:white; border:none; border-radius:4px; padding:2px 8px;">מחק</button>
            </div>`).join('');
    }
    function setToken(t) { activeToken = t; localStorage.setItem('activeToken', t); location.reload(); }
    function addToken() { const val = document.getElementById('new-token').value; if(val) { let tk = JSON.parse(localStorage.getItem('myTokens')||'[]'); tk.push(val); localStorage.setItem('myTokens', JSON.stringify(tk)); renderTokens(); } }
    function deleteToken(t) { let tk = JSON.parse(localStorage.getItem('myTokens')||'[]'); tk = tk.filter(x => x!==t); localStorage.setItem('myTokens', JSON.stringify(tk)); renderTokens(); }

    async function initialLoad() {
        rawDataStore = []; allHeaders.clear();
        const paths = document.getElementById('path-input').value.split(',');
        for(let p of paths) {
            let pT = p.trim(); if(!pT) continue;
            try {
                let iniMap = {};
                let resIni = await fetch(`https://www.call2all.co.il/ym/api/DownloadFile?token=${activeToken}&path=ivr2:${pT}/ApprovalAll.ini`);
                if (!resIni.ok) resIni = await fetch(`https://www.call2all.co.il/ym/api/DownloadFile?token=${activeToken}&path=ivr2:${pT}/Approval.ini`);
                if (resIni.ok) {
                    const text = await resIni.text();
                    text.split('\n').forEach(l => { if(l.includes('=')) { const pts = l.split('='); iniMap[pts[0].trim()] = pts[1].trim().replace(/['"\r]/g, ''); } });
                }
                const res = await fetch(`https://www.call2all.co.il/ym/api/DownloadFile?token=${activeToken}&path=ivr2:${pT}/ApprovalAll.ymgr`);
                const dataText = await res.text();
                dataText.split('\n').filter(l => l.includes('#')).forEach(l => {
                    const row = {};
                    l.split('%').forEach(part => { const [k, v] = part.split('#'); if(k) { const key = iniMap[k] || k; row[key] = v; allHeaders.add(key); } });
                    rawDataStore.push(row);
                });
            } catch(e) { console.error(e); }
        }
        if(rawDataStore.length > 0) {
            document.getElementById('col-list').innerHTML = Array.from(allHeaders).map(h => `<label style="display:block; padding:5px;"><input type="checkbox" class="col-filter" value="${h}" checked> ${h}</label>`).join('');
            drawTable();
        }
    }

    function drawTable() {
        const checkboxes = document.querySelectorAll('.col-filter');
        let selectedCols = Array.from(allHeaders);
        if(checkboxes.length > 0) selectedCols = Array.from(checkboxes).filter(c => c.checked).map(c => c.value);

        if ($.fn.DataTable.isDataTable('#data-table')) $('#data-table').DataTable().destroy();
        $('#table-head').empty(); $('#data-table tbody').empty();
        selectedCols.forEach(h => $('#table-head').append(`<th>${h}</th>`));

        const table = $('#data-table').DataTable({
            paging: false, info: false, 
            ordering: false, /* שינוי 1: ביטול מיון בטבלה עצמה */
            language: { 
                search: "חיפוש כללי בטבלה:", /* שינוי 3: החלפת מילת החיפוש */
                url: '//cdn.datatables.net/plug-ins/1.13.4/i18n/he.json' 
            }
        });

        rawDataStore.forEach(row => { table.row.add(selectedCols.map(h => row[h] || '')); });
        table.draw();

        // עדכון רשימת העמודות בתפריט הסיכון המהיר
        const pivotSelect = document.getElementById('pivot-select');
        pivotSelect.innerHTML = '<option value="">-- בחר עמודה לסיכום --</option>' + 
            selectedCols.map(h => `<option value="${h}">${h}</option>`).join('');
        
        document.getElementById('pivot-summary-container').innerHTML = '<p style="text-align:center; color:#94a3b8; margin-top:40px;">בחר עמודה מהתפריט למעלה</p>';

        closeModal('col-modal');
    }

    // פונקציית הסיכום החדשה - פשוטה ומהירה (שינוי 2: רשימה במקום טבלה)
    function updatePivotSummary(col) {
        if(!col) return;
        const counts = {};
        rawDataStore.forEach(row => {
            const val = row[col] || '(ריק)';
            counts[val] = (counts[val] || 0) + 1;
        });

        const sortedEntries = Object.entries(counts).sort((a, b) => b[1] - a[1]);

        let html = `<ul class="summary-list">`;
        
        sortedEntries.forEach(([val, count]) => {
            html += `<li><span>${val}</span><span class="summary-count">${count}</span></li>`;
        });
        
        html += `</ul>`;
        document.getElementById('pivot-summary-container').innerHTML = html;
    }

    renderTokens();
</script>
</body>
</html>