diff --git a/public/my.html b/public/my.html index 98cf2fd..9b820d1 100644 --- a/public/my.html +++ b/public/my.html @@ -17,7 +17,7 @@
-

Your team

Your position's matrix — the rollup line on each card counts everyone underneath, all the way down. Click a position to drill into that leg. Open slots are where the next placements land.

✓ qualified (2/2 directs) · P Premium · S Standard · ⬇ everyone below that position (all generations) and the POL they've earned · ↧ spillover = placed there by upline activity; only members who join with a position's own ID count toward its 2/2

+

Your team

Your position's matrix — the rollup line on each card counts everyone underneath, all the way down. Click a position to drill into that leg. Open slots are where the next placements land.

✓ qualified (2/2 directs) · P Premium · S Standard · ⬇ everyone below that position (all generations) and the POL they've earned · ↧ spillover = placed there by upline activity; only members who join with a position's own ID count toward its 2/2

Your pipeline

Money forming below you. Each generation in your leg pays your position at exactly one level — when a member's level catches up to their depth, their next upgrade comes to you.

Messages

Wallet-verified messaging along your matrix lines — your upline and your team can reach you here, and you can reach them. No email needed; your wallet is your identity. Messages are member-to-member; the team admin can review them for abuse.

Loading…
diff --git a/public/my.js b/public/my.js index 793f09d..fd9ccb6 100644 --- a/public/my.js +++ b/public/my.js @@ -13,6 +13,7 @@ const tp=document.getElementById('tabPitch'),td=document.getElementById('tabDash'); if(tp)tp.classList.toggle('on',name==='pitch'); if(td)td.classList.toggle('on',name==='dash'); + if(name==='dash'&&treeUI.mode==='pyramid')setTimeout(applyMatrixZoom,30); // fit once the matrix is visible } document.querySelectorAll('.mp-tab').forEach(t=>t.addEventListener('click',()=>{setTab(t.dataset.tab);window.scrollTo({top:0,behavior:'smooth'});})); function renderPitch(d){ @@ -34,7 +35,33 @@ function pathId(){const m=location.pathname.match(/^\/my\/(\d+)$/);if(m)return m[1];const q=new URLSearchParams(location.search).get('id');if(q&&/^\d+$/.test(q))return q;try{return localStorage.getItem('ctb.myId')||''}catch(e){return ''}} - const treeUI={byId:{},parent:{},homeId:0,rootId:0,mode:'pyramid'}; + const treeUI={byId:{},parent:{},homeId:0,rootId:0,mode:'pyramid',zoom:null,_applied:1}; + // Zoom the matrix so it fits small screens. treeUI.zoom: null = auto-fit (shrink + // to fit width, never enlarge), or a manual factor. Uses CSS `zoom` so the layout + // reflows cleanly (no leftover box, centering + scroll keep working). + function applyMatrixZoom(){ + const bar=document.getElementById('dZoom'); + const mtp=document.querySelector('#dTree .mtp'); + if(!mtp){if(bar)bar.classList.add('hidden');return} + mtp.style.zoom='1'; + const availW=mtp.clientWidth; + if(!availW){if(bar)bar.classList.add('hidden');return} // in a hidden tab — apply when it opens + if(bar)bar.classList.remove('hidden'); + const natW=mtp.scrollWidth||1; + let z=treeUI.zoom; + if(z==null)z=Math.min(1,availW/natW); // Fit / default: shrink only + z=Math.max(.4,Math.min(1.6,z)); + mtp.style.zoom=String(z); + treeUI._applied=z; + const lbl=document.getElementById('zLbl');if(lbl)lbl.textContent=Math.round(z*100)+'%'; + } + (function wireZoom(){ + const out=document.getElementById('zOut'),inn=document.getElementById('zIn'),fit=document.getElementById('zFit'); + if(out)out.addEventListener('click',()=>{treeUI.zoom=Math.max(.4,(treeUI._applied||1)-0.15);applyMatrixZoom()}); + if(inn)inn.addEventListener('click',()=>{treeUI.zoom=Math.min(1.6,(treeUI._applied||1)+0.15);applyMatrixZoom()}); + if(fit)fit.addEventListener('click',()=>{treeUI.zoom=null;applyMatrixZoom()}); + let t;window.addEventListener('resize',()=>{clearTimeout(t);t=setTimeout(()=>{if(treeUI.mode==='pyramid')applyMatrixZoom()},160)}); + })(); function indexTree(n,par){if(!n)return;treeUI.byId[n.id]=n;if(par)treeUI.parent[n.id]=par.id;indexTree(n.left,n);indexTree(n.right,n)} function isSpill(n){return !!(n&&treeUI.parent[n.id]&&n.referrerId&&n.referrerId!==treeUI.parent[n.id])} function card(n,focus){ @@ -58,10 +85,12 @@ nav.innerHTML=path.length>1?`Viewing: `+path.map((id,i)=>i===path.length-1?`#${id}`:``).join(' › ')+` `:''; const wire=el=>el.querySelectorAll('[data-tid]').forEach(b=>b.addEventListener('click',()=>{const t=Number(b.dataset.tid);if(t&&treeUI.byId[t]){treeUI.rootId=t;renderTree()}})); wire(out);wire(nav); + applyMatrixZoom(); } function renderList(){ const out=document.getElementById('dTree'); document.getElementById('dTreeNav').innerHTML=''; + const zb=document.getElementById('dZoom');if(zb)zb.classList.add('hidden'); const home=treeUI.byId[treeUI.homeId]; if(!home){out.innerHTML='
Team view is still indexing — check back in a few minutes.
';return} const node=(n,depth)=>{ diff --git a/public/styles.css b/public/styles.css index 2838b22..703a196 100644 --- a/public/styles.css +++ b/public/styles.css @@ -135,6 +135,8 @@ a{color:inherit}.wrap{width:min(1160px,calc(100% - 32px));margin:auto}.nav{heigh /* Admin matrix pyramid view */ .mtp{display:flex;flex-direction:column;gap:14px;overflow-x:auto;padding:6px 2px 10px} +.mt-zoom{display:inline-flex;gap:4px;align-items:center;background:rgba(13,34,54,.6);border:1px solid #2a4a66;border-radius:9px;padding:3px 4px} +.mt-zbtn{min-width:30px;padding-left:0;padding-right:0;font-weight:800;font-size:16px;line-height:1} .mtp-row{display:flex;justify-content:center;gap:8px;min-width:max-content;margin:0 auto} .mtp-card{appearance:none;font:inherit;cursor:pointer;text-align:center;background:#0d2236;border:1px solid #2a4a66;border-radius:12px;padding:9px 10px;min-width:104px;color:var(--text);display:flex;flex-direction:column;gap:2px;align-items:center;transition:.15s ease} .mtp-card:hover{border-color:var(--teal);transform:translateY(-1px)}