<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=0.8">
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"
        integrity="sha256-/JqT3SQfawRcv/BIHPThkBvs0OEvtFFmqPF/lYI/Cxo=" crossorigin="anonymous"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
    <script defer data-domain="tools.badheshchauhan.com"  src="https://getanalyzr.vercel.app/tracking-script.js"></script>


    <title>Data Display</title>
    <style>
        thead th {
            position: sticky;
            top: 0;
            z-index: 2;
        }

        #searchInput {
            width: 90%;
            padding: 10px;
            border: none;
            border-radius: 25px;
            color: #fff;
            font-size: 20px;
            box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.2);
            outline: none;
            transition: background-image 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
        }


        /* Hover styles for the search input and search button */
        #searchInput:hover,
        #searchBtn:hover {
            background-image: linear-gradient(to right, #a89ba2, #dbdee3);
            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.3);

        }

        /* Focus styles for the search input */
        #searchInput:focus {
            background-image: linear-gradient(to right, #a5979f, #a7b0b9);
            box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4);
        }

        body {
            margin: 5px;
        }

        table {
            margin-bottom: 20px;
        }

        th {
            position: sticky;
            top: 0;
            z-index: 1;
        }

        td {
            overflow-wrap: break-word;
        }

        .btn,
        #delay,
        .alert {
            margin: 5px;
        }


        body {
            padding-top: 5px;
        }


        .delete-icon {
            cursor: pointer;
            color: red;
            margin-left: 5px;
            display: none;
        }

        th:hover .delete-icon,
        td:hover .delete-icon {
            display: inline;
        }

        .delete-icon:hover {
            color: rgb(228, 17, 17);
        }

        /* .btn-block {
            display: none;
        } */




        @media (max-width: 768px) {
            .container {
                padding: 15px;
            }

            th,
            td {
                padding: 6px;
                font-size: 0.8rem;
            }
        }
    </style>
</head>

<body>
    <div class="col-xs-3">
        <center>
            <button type="button" class="btn btn-success download-button  btn-block" id='csv'
                onclick="tableToCSV('csv')"><span class="glyphicon glyphicon-download-alt"></span> CSV</button>
            <button type="button" class="btn btn-success download-button  btn-block" id='xlsx'
                onclick="tableToCSV('xlsx')"><span class="glyphicon glyphicon-download-alt"></span> XLSX</button>
            <button type="button" class="btn btn-success download-button  btn-block" id='copy'
                onclick="tableToCSV('copy')"><span class="glyphicon glyphicon-copy"></span> COPY ALL</button>
            <button type="button" class="btn btn-warning btn-block" id='resetColumns' onclick="resetTable()">Reset
                columns</button>
        </center>
    </div>

    <br>
    <div>
        <center> <input type="text" id="searchInput" placeholder="Search Data in Table Example" style="display: none;">
        </center> <br>

        <table id="data-table" class="table table-bordered table-sm table-hover border-primary table-responsive">
            <thead class="table-success">
                <tr id="table-header"></tr>
            </thead>
            <tbody id="table-body"></tbody>
        </table>

        <script>
const _0x511a90=_0x5058;function _0x5058(_0x30c853,_0x1c3832){const _0x472a16=_0x472a();return _0x5058=function(_0x5058b5,_0x2eb95f){_0x5058b5=_0x5058b5-0x1bd;let _0x4b1ff3=_0x472a16[_0x5058b5];return _0x4b1ff3;},_0x5058(_0x30c853,_0x1c3832);}(function(_0x39e0e6,_0x1c4769){const _0x4c8e41=_0x5058,_0x26cdda=_0x39e0e6();while(!![]){try{const _0xa887e0=-parseInt(_0x4c8e41(0x204))/0x1+-parseInt(_0x4c8e41(0x222))/0x2+parseInt(_0x4c8e41(0x1cc))/0x3+-parseInt(_0x4c8e41(0x21a))/0x4+parseInt(_0x4c8e41(0x1df))/0x5+parseInt(_0x4c8e41(0x206))/0x6*(-parseInt(_0x4c8e41(0x1cf))/0x7)+parseInt(_0x4c8e41(0x1d9))/0x8*(parseInt(_0x4c8e41(0x20c))/0x9);if(_0xa887e0===_0x1c4769)break;else _0x26cdda['push'](_0x26cdda['shift']());}catch(_0x20f55){_0x26cdda['push'](_0x26cdda['shift']());}}}(_0x472a,0x486f0));const originalData=[];function resetTable(){const _0x18051a=_0x5058;populateTable(originalData[_0x18051a(0x1ee)]());}window[_0x511a90(0x1d5)](_0x511a90(0x1da),_0x488340=>{const _0xb11946=_0x511a90,_0x3a8fa8=new Audio(_0xb11946(0x224));_0x3a8fa8[_0xb11946(0x1f7)](),console[_0xb11946(0x1c5)](_0xb11946(0x1f6),_0x488340[_0xb11946(0x205)]);var _0x322d02=_0x488340[_0xb11946(0x205)];populateTable(_0x322d02[_0xb11946(0x1bf)]),console[_0xb11946(0x1c5)](_0xb11946(0x1f6),_0x322d02);});function _0x472a(){const _0x4d07a8=['Row\x20','payload','write','table-body','then','asc','column','log','split','table_csv.csv','cells','td,th','removeChild','clipboard','294666kuaLuh','keys','innerText','518sVbiKG','display','Missing\x20dataset\x20column\x20on\x20target:','indexOf','map','aoa_to_sheet','addEventListener','isArray','length','error','1042120KYSNoC','message','none','getAttribute','querySelectorAll','data-table','1857620RLeLUS','keyup','searchInput','text/csv','utils','writeText','block','style','innerHTML','getElementById','join','warn','Column\x20','setAttribute','csv','flat','toUpperCase','copy','click','application/octet-stream','Invalid\x20column\x20index:\x20','rows','createElement','Received\x20message:','play','target','table-header','\x20does\x20not\x20have\x20a\x20cell\x20at\x20index\x20','trim','\x22>&#10006;</span>','book_new','array','body','catch','textContent','getElementsByTagName','matches','276974ivNDRI','data','21876zHAkUz','data-sort-order','\x20<span\x20class=\x22delete-icon\x22\x20data-column=\x22','replace','Error\x20copying\x20to\x20clipboard:\x20','value','72fMbWKG','Table\x20headers:','push','localeCompare','appendChild','download','\x20deleted\x20successfully.','book_append_sheet','deleteCell','forEach','from','.delete-icon','Data\x20is\x20empty\x20or\x20not\x20an\x20array.','desc','1121540jcDNeB','table_xlsx.xlsx','sort','dataset','href','Table\x20data\x20copied\x20to\x20clipboard!','xlsx','URL','776030OeBjgk','createObjectURL','https://cdn.pixabay.com/download/audio/2024/11/10/audio_923e1bad2b.mp3?filename=notification-sound-3-262896.mp3','closest'];_0x472a=function(){return _0x4d07a8;};return _0x472a();}function populateTable(_0x3b7337){const _0x799fe7=_0x511a90;originalData[_0x799fe7(0x20e)](_0x3b7337);const _0x20bbd7=document[_0x799fe7(0x1e8)](_0x799fe7(0x1f9)),_0x50b5ba=document[_0x799fe7(0x1e8)](_0x799fe7(0x1c1));_0x20bbd7[_0x799fe7(0x1e7)]='',_0x50b5ba[_0x799fe7(0x1e7)]='';if(!Array[_0x799fe7(0x1d6)](_0x3b7337)||_0x3b7337[_0x799fe7(0x1d7)]===0x0){console[_0x799fe7(0x1ea)](_0x799fe7(0x218));return;}const _0x3b6464=Object[_0x799fe7(0x1cd)](_0x3b7337[0x0]);console[_0x799fe7(0x1c5)](_0x799fe7(0x20d),_0x3b6464),_0x3b6464[_0x799fe7(0x215)]((_0x4953c0,_0x11c6f2)=>{const _0x4954c6=_0x799fe7,_0x3f73fd=document[_0x4954c6(0x1f5)]('th');_0x3f73fd[_0x4954c6(0x1e7)]=_0x4953c0+_0x4954c6(0x208)+_0x11c6f2+_0x4954c6(0x1fc),_0x3f73fd[_0x4954c6(0x1d5)](_0x4954c6(0x1f1),function(){sortTable(_0x11c6f2);}),_0x20bbd7[_0x4954c6(0x210)](_0x3f73fd);}),_0x3b7337[_0x799fe7(0x215)]((_0x47de9b,_0x39f712)=>{const _0xa39ae8=_0x799fe7,_0x308c05=document[_0xa39ae8(0x1f5)]('tr');_0x3b6464[_0xa39ae8(0x215)](_0x1ed7cc=>{const _0x5e0114=_0xa39ae8,_0x331ef2=document[_0x5e0114(0x1f5)]('td');_0x331ef2[_0x5e0114(0x201)]=_0x47de9b[_0x1ed7cc]||'',_0x308c05[_0x5e0114(0x210)](_0x331ef2);}),_0x50b5ba[_0xa39ae8(0x210)](_0x308c05);}),document[_0x799fe7(0x1e8)](_0x799fe7(0x1de))[_0x799fe7(0x1d5)](_0x799fe7(0x1f1),_0x565131=>{const _0x4e37ca=_0x799fe7,_0x512627=_0x565131[_0x4e37ca(0x1f8)];if(!_0x512627[_0x4e37ca(0x203)](_0x4e37ca(0x217)))return;const _0x291231=_0x512627[_0x4e37ca(0x1bd)]('th');if(!_0x291231)return;const _0xc1c322=_0x512627[_0x4e37ca(0x21d)][_0x4e37ca(0x1c4)];if(_0xc1c322===undefined){console[_0x4e37ca(0x1ea)](_0x4e37ca(0x1d1),_0x512627);return;}const _0x564c4b=parseInt(_0xc1c322,0xa);!isNaN(_0x564c4b)&&_0x564c4b>=0x0?deleteColumn(_0x564c4b):console[_0x4e37ca(0x1ea)](_0x4e37ca(0x1f3)+_0xc1c322,_0x512627);}),document[_0x799fe7(0x1e8)](_0x799fe7(0x1e1))[_0x799fe7(0x1e6)][_0x799fe7(0x1d0)]=_0x799fe7(0x1e5),document[_0x799fe7(0x1e8)](_0x799fe7(0x1e1))[_0x799fe7(0x1d5)](_0x799fe7(0x1e0),searchTable);}function deleteColumn(_0x751b14){const _0x4fb25b=_0x511a90,_0xd791a=document[_0x4fb25b(0x1e8)](_0x4fb25b(0x1de)),_0x3f4eed=Array[_0x4fb25b(0x216)](_0xd791a[_0x4fb25b(0x1f4)]);if(_0x3f4eed[_0x4fb25b(0x1d7)]===0x0||_0x751b14<0x0||_0x3f4eed[0x0][_0x4fb25b(0x1c8)]&&_0x751b14>=_0x3f4eed[0x0][_0x4fb25b(0x1c8)][_0x4fb25b(0x1d7)]){console[_0x4fb25b(0x1d8)](_0x4fb25b(0x1f3)+_0x751b14);return;}_0x3f4eed[_0x4fb25b(0x215)]((_0x5b09a1,_0x33b1ad)=>{const _0x1033b0=_0x4fb25b;_0x751b14<_0x5b09a1[_0x1033b0(0x1c8)][_0x1033b0(0x1d7)]?_0x5b09a1[_0x1033b0(0x214)](_0x751b14):console[_0x1033b0(0x1ea)](_0x1033b0(0x1be)+_0x33b1ad+_0x1033b0(0x1fa)+_0x751b14);}),console[_0x4fb25b(0x1c5)](_0x4fb25b(0x1eb)+_0x751b14+_0x4fb25b(0x212));}function sortTable(_0xf58d2d){const _0x5caa82=_0x511a90,_0x5de8f3=document[_0x5caa82(0x1e8)](_0x5caa82(0x1c1));let _0x478790=Array[_0x5caa82(0x216)](_0x5de8f3[_0x5caa82(0x1f4)]),_0x300e4c=_0x5de8f3[_0x5caa82(0x1dc)](_0x5caa82(0x207))!==_0x5caa82(0x219);_0x5de8f3[_0x5caa82(0x1ec)](_0x5caa82(0x207),_0x300e4c?_0x5caa82(0x219):_0x5caa82(0x1c3)),_0x478790[_0x5caa82(0x21c)]((_0x48adc4,_0x29414e)=>{const _0x2f81a8=_0x5caa82;let _0xcf06e8=_0x48adc4[_0x2f81a8(0x1c8)][_0xf58d2d]?.[_0x2f81a8(0x201)][_0x2f81a8(0x1fb)](),_0x43c53d=_0x29414e[_0x2f81a8(0x1c8)][_0xf58d2d]?.[_0x2f81a8(0x201)][_0x2f81a8(0x1fb)]();if(!_0xcf06e8||!_0x43c53d)return 0x0;if(!isNaN(_0xcf06e8)&&!isNaN(_0x43c53d))return _0x300e4c?_0xcf06e8-_0x43c53d:_0x43c53d-_0xcf06e8;return _0x300e4c?_0xcf06e8[_0x2f81a8(0x20f)](_0x43c53d):_0x43c53d[_0x2f81a8(0x20f)](_0xcf06e8);}),_0x478790[_0x5caa82(0x215)](_0x447fa=>_0x5de8f3[_0x5caa82(0x210)](_0x447fa));}function tableToCSV(_0x564c27){const _0x306105=_0x511a90;let _0x285116=[],_0x28379e=document[_0x306105(0x202)]('tr');for(let _0x5ab503=0x0;_0x5ab503<_0x28379e[_0x306105(0x1d7)];_0x5ab503++){let _0x2d8eeb=_0x28379e[_0x5ab503][_0x306105(0x1dd)](_0x306105(0x1c9)),_0x5f529c=[];for(let _0x5ed49b=0x0;_0x5ed49b<_0x2d8eeb[_0x306105(0x1d7)];_0x5ed49b++){_0x5f529c[_0x306105(0x20e)](_0x2d8eeb[_0x5ed49b][_0x306105(0x1ce)]);}_0x285116[_0x306105(0x20e)](_0x5f529c[_0x306105(0x1e9)](','));}if(_0x564c27===_0x306105(0x1ed)){_0x285116=_0x285116[_0x306105(0x1e9)]('\x0a');var _0x412d4f=new Blob([_0x285116],{'type':_0x306105(0x1e2)}),_0x483e9b=_0x306105(0x1c7);}if(_0x564c27===_0x306105(0x220)){let _0x32ffd8=_0x285116[_0x306105(0x1d3)](_0x2a4667=>_0x2a4667[_0x306105(0x1c6)](','));var _0x4e507e=XLSX[_0x306105(0x1e3)][_0x306105(0x1d4)](_0x32ffd8);const _0x40cf2e=XLSX[_0x306105(0x1e3)][_0x306105(0x1fd)]();XLSX[_0x306105(0x1e3)][_0x306105(0x213)](_0x40cf2e,_0x4e507e,_0x306105(0x205));const _0x5c8b10=XLSX[_0x306105(0x1c0)](_0x40cf2e,{'bookType':_0x306105(0x220),'type':_0x306105(0x1fe)});var _0x53195e=new Blob([_0x5c8b10],{'type':_0x306105(0x1f2)}),_0x483e9b=_0x306105(0x21b);}if(_0x564c27===_0x306105(0x1f0)){let _0x5214c6=_0x285116[_0x306105(0x1d3)](_0x4f9e10=>_0x4f9e10[_0x306105(0x209)](/,/g,'\x09'))[_0x306105(0x1e9)]('\x0a');navigator[_0x306105(0x1cb)][_0x306105(0x1e4)](_0x5214c6)[_0x306105(0x1c2)](()=>{const _0x9b02d4=_0x306105;alert(_0x9b02d4(0x21f));})[_0x306105(0x200)](_0x43f96b=>{const _0x3e779d=_0x306105;console[_0x3e779d(0x1d8)](_0x3e779d(0x20a),_0x43f96b);});return;}let _0x293c93=document[_0x306105(0x1f5)]('a');_0x293c93[_0x306105(0x211)]=_0x483e9b;if(_0x564c27===_0x306105(0x1ed)){let _0x3c4421=window[_0x306105(0x221)][_0x306105(0x223)](_0x412d4f);_0x293c93[_0x306105(0x21e)]=_0x3c4421;}if(_0x564c27===_0x306105(0x220)){let _0x260c3e=window[_0x306105(0x221)][_0x306105(0x223)](_0x53195e);_0x293c93[_0x306105(0x21e)]=_0x260c3e;}_0x293c93[_0x306105(0x1e6)][_0x306105(0x1d0)]=_0x306105(0x1db),document[_0x306105(0x1ff)][_0x306105(0x210)](_0x293c93),_0x293c93[_0x306105(0x1f1)](),document[_0x306105(0x1ff)][_0x306105(0x1ca)](_0x293c93);}function searchTable(){const _0x3af476=_0x511a90;var _0x542302,_0x463faa,_0x3b90f5,_0x2256eb,_0x5ed89c,_0x1b0a16,_0x334275;_0x542302=document[_0x3af476(0x1e8)](_0x3af476(0x1e1)),_0x463faa=_0x542302[_0x3af476(0x20b)][_0x3af476(0x1ef)](),_0x3b90f5=document[_0x3af476(0x1e8)](_0x3af476(0x1de)),_0x2256eb=_0x3b90f5[_0x3af476(0x202)]('tr');for(_0x1b0a16=0x0;_0x1b0a16<_0x2256eb[_0x3af476(0x1d7)];_0x1b0a16++){_0x5ed89c=_0x2256eb[_0x1b0a16][_0x3af476(0x202)]('td');for(var _0x4d5758=0x0;_0x4d5758<_0x5ed89c[_0x3af476(0x1d7)];_0x4d5758++){let _0x153524=_0x5ed89c[_0x4d5758];if(_0x153524){_0x334275=_0x153524[_0x3af476(0x201)]||_0x153524[_0x3af476(0x1ce)];if(_0x334275['toUpperCase']()[_0x3af476(0x1d2)](_0x463faa)>-0x1){_0x2256eb[_0x1b0a16][_0x3af476(0x1e6)][_0x3af476(0x1d0)]='';break;}else _0x2256eb[_0x1b0a16][_0x3af476(0x1e6)][_0x3af476(0x1d0)]=_0x3af476(0x1db);}}}}

        </script>

        <script src="https://cdn.sheetjs.com/xlsx-0.20.3/package/dist/xlsx.full.min.js"></script>


</body>

</html>