// MedlinePlus Physiotherapy Library Script
// Author: Ubaid CLS Integration

(function(){
const ALLORIGINS='https://api.allorigins.win/raw?url=';

document.getElementById('medlib').innerHTML=`
<style>
#mp-container{max-width:900px;margin:auto;font-family:Arial;color:black}
#mp-container input,#mp-container select{padding:12px;border-radius:8px;border:1px solid #ccc;font-size:16px;color:black}
#mp-container button{padding:10px 14px;border-radius:8px;border:0;background:#0066cc;color:white;cursor:pointer;margin-right:5px}
#mp-quick button{padding:6px 12px;border-radius:999px;border:1px solid #ccc;background:white;cursor:pointer;margin:4px}
#mp-quick button:hover{background:#eef6ff;border-color:#0066cc}
.mp-card{border:1px solid #ddd;border-radius:10px;padding:14px;background:#fafafa;margin-bottom:14px}
.mp-title{font-size:18px;font-weight:bold;margin:0 0 6px 0}
.mp-meta{font-size:13px;color:#555;margin-bottom:8px}
.mp-actions{margin-top:10px}
.mp-actions button{margin-right:6px}
.mp-abstract{display:none;background:white;padding:10px;border-left:4px solid #0066cc;margin-top:6px}
#mp-pager{display:flex;justify-content:center;align-items:center;gap:8px;margin:18px 0}
#mp-pager button{padding:6px 10px;border-radius:6px;border:1px solid #ddd;background:white;cursor:pointer}
</style>

<div id="mp-container">
<h2>MedlinePlus Physiotherapy Library</h2>
<div>
<input type="text" id="mp-query" placeholder="Search physiotherapy or rehab topics..." />
<button id="mp-search-btn">Search</button>
<select id="mp-sort"><option value="relevance">Sort: Relevance</option><option value="alpha">Sort: Title A→Z</option></select>
</div>
<div id="mp-quick" style="margin-top:10px">
<button data-q="stroke rehabilitation physiotherapy">Stroke</button>
<button data-q="cerebral palsy physiotherapy">CP</button>
<button data-q="low back pain physiotherapy">LBP</button>
<button data-q="ACL physiotherapy rehab">ACL</button>
<button data-q="post operative physiotherapy">Post-op</button>
</div>
<div id="mp-results"></div>
<div id="mp-pager" style="display:none">
<button id="mp-prev">⬅ Previous</button>
<span id="mp-pageinfo"></span>
<button id="mp-next">Next ➡</button>
</div>
<h3>Favorites</h3>
<div id="mp-favs"></div>
</div>
`;

let allItems=[],currentPage=1,lastQuery='',pageSize=5;

const resultsEl=document.getElementById('mp-results');
const pageInfo=document.getElementById('mp-pageinfo');
const pager=document.getElementById('mp-pager');
const favEl=document.getElementById('mp-favs');

function loadFavs(){
  const favs=JSON.parse(localStorage.getItem('mp_favs_v1')||'[]');
  if(favs.length===0){favEl.innerHTML='<p style="color:#555">No saved articles.</p>'; return;}
  favEl.innerHTML='';
  favs.forEach(f=>{
    const p=document.createElement('p');
    p.innerHTML=`<a href="${f.url}" target="_blank">${f.title}</a> <button data-rm="${f.url}">Remove</button>`;
    favEl.appendChild(p);
  });
  favEl.querySelectorAll('button[data-rm]').forEach(btn=>{
    btn.addEventListener('click', ()=>{
      const u=btn.getAttribute('data-rm');
      const newFavs=JSON.parse(localStorage.getItem('mp_favs_v1')||'[]').filter(x=>x.url!==u);
      localStorage.setItem('mp_favs_v1',JSON.stringify(newFavs));
      loadFavs();
    });
  });
}
loadFavs();

function saveFav(item){
  if(!item||!item.url){alert('Cannot save');return;}
  const favs=JSON.parse(localStorage.getItem('mp_favs_v1')||'[]');
  if(favs.some(f=>f.url===item.url)){alert('Already saved');return;}
  favs.push({title:item.title,url:item.url});
  localStorage.setItem('mp_favs_v1',JSON.stringify(favs));
  loadFavs();
  alert('Saved to Favorites');
}

function escapeHtml(s){return String(s||'').replaceAll('&','&amp;').replaceAll('<','&lt;').replaceAll('>','&gt;');}

function truncate(s,n){return s.length>n?s.slice(0,n-1)+'…':s;}

async function searchMP(q){
  lastQuery=q;
  currentPage=1;
  resultsEl.innerHTML='<p>Loading...</p>';
  pager.style.display='none';
  allItems=[];
  try{
    const url=ALLORIGINS+'https://wsearch.nlm.nih.gov/ws/query?db=healthTopics&term='+encodeURIComponent(q)+'&retmax=200';
    const res=await fetch(url);
    if(!res.ok) throw new Error('Fetch failed '+res.status);
    const text=await res.text();
    const xml=new DOMParser().parseFromString(text,'application/xml');
    const docs=Array.from(xml.getElementsByTagName('document'));
    allItems=docs.map(d=>{
      return {
        title:d.getElementsByTagName('title')[0]?.textContent||'No Title',
        url:d.getElementsByTagName('url')[0]?.textContent||'#',
        content:d.getElementsByTagName('content')[0]?.textContent||'',
        subject:d.getElementsByTagName('subject')[0]?.textContent||''
      }
    });
    applySort();
    renderPage();
  }catch(err){
    console.error(err);
    resultsEl.innerHTML='<p>Error loading results.</p>';
  }
}

function applySort(){
  const s=document.getElementById('mp-sort').value;
  if(s==='alpha') allItems.sort((a,b)=>a.title.localeCompare(b.title));
}

function renderPage(){
  resultsEl.innerHTML='';
  if(allItems.length===0){resultsEl.innerHTML='<p style="color:#555">No results.</p>';pager.style.display='none';return;}
  const totalPages=Math.ceil(allItems.length/pageSize);
  if(currentPage<1) currentPage=1;
  if(currentPage>totalPages) currentPage=totalPages;
  const start=(currentPage-1)*pageSize;
  const pageItems=allItems.slice(start,start+pageSize);

  pageItems.forEach((it,i)=>{
    const card=document.createElement('div');
    card.className='mp-card';
    const id='abs'+(start+i);
    card.innerHTML=`<div class="mp-title">${escapeHtml(it.title)}</div>
    <div class="mp-meta">${escapeHtml(it.subject)}</div>
    <div>${truncate(it.content,200)}</div>
    <div class="mp-actions">
    <button onclick="document.getElementById('${id}').style.display=document.getElementById('${id}').style.display==='block'?'none':'block'">Abstract</button>
    <button onclick="window.open('${it.url}','_blank')">Open Full</button>
    <button onclick="(${saveFav.toString()})(${JSON.stringify(it)})">Save</button>
    </div>
    <div id="${id}" class="mp-abstract">${escapeHtml(it.content)}</div>`;
    resultsEl.appendChild(card);
  });

  pageInfo.textContent=`Page ${currentPage} of ${totalPages}`;
  pager.style.display='flex';
  document.getElementById('mp-prev').disabled=currentPage<=1;
  document.getElementById('mp-next').disabled=currentPage>=totalPages;
}

document.getElementById('mp-prev').addEventListener('click',()=>{currentPage--;renderPage();});
document.getElementById('mp-next').addEventListener('click',()=>{currentPage++;renderPage();});
document.getElementById('mp-search-btn').addEventListener('click',()=>{searchMP(document.getElementById('mp-query').value);});
document.getElementById('mp-sort').addEventListener('change',()=>{applySort();renderPage();});
document.querySelectorAll('#mp-quick button').forEach(b=>b.addEventListener('click',()=>{searchMP(b.dataset.q);}));

})();