-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
181 lines (181 loc) · 16.2 KB
/
Copy pathindex.html
File metadata and controls
181 lines (181 loc) · 16.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Dollar Gravity Observatory — Interactive 3D visualization of the USD-centric global finance-security system. Einstein spacetime fabric model.">
<meta name="theme-color" content="#000022">
<title>$ Dollar Gravity Observatory — NASA-Grade Einstein Fabric</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700;900&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet">
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{--cyan:#00eeff;--dim:rgba(0,238,255,0.5);--panel:rgba(0,20,40,0.95);}
body{margin:0;overflow:hidden;background:#000011;font-family:'JetBrains Mono',monospace;color:var(--cyan);}
#ui{position:absolute;top:15px;left:15px;background:var(--panel);padding:18px;border:1px solid var(--cyan);border-radius:6px;z-index:1000;max-width:360px;backdrop-filter:blur(10px);box-shadow:0 0 30px rgba(0,238,255,0.15)}
#ui h1{margin:0 0 8px 0;font-family:'Orbitron',sans-serif;font-size:1.3em;letter-spacing:2px;text-shadow:0 0 10px var(--cyan);font-weight:900}
#ui p{margin:5px 0;opacity:0.8;font-size:0.8rem}
.btn-group{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
button{background:rgba(0,238,255,0.08);border:1px solid var(--cyan);color:var(--cyan);padding:8px 16px;cursor:pointer;font-family:'JetBrains Mono',monospace;font-size:0.75rem;border-radius:4px;transition:all 0.3s}
button:hover{background:rgba(0,238,255,0.2);box-shadow:0 0 12px rgba(0,238,255,0.2);transform:translateY(-1px)}
#panel{position:absolute;top:15px;right:15px;width:400px;background:var(--panel);padding:24px;border:1px solid var(--cyan);border-radius:6px;display:none;z-index:1000;overflow-y:auto;max-height:88vh;backdrop-filter:blur(10px);box-shadow:0 0 30px rgba(0,238,255,0.15)}
#panel h2{font-family:'Orbitron',sans-serif;font-size:1.3em;margin-bottom:12px;text-shadow:0 0 10px var(--cyan)}
#panel p{line-height:1.7;font-size:0.82rem;margin-bottom:10px}
#panel .label{font-family:'Orbitron',sans-serif;font-size:0.65rem;letter-spacing:2px;color:var(--cyan);opacity:0.7;margin-top:14px;margin-bottom:4px;text-transform:uppercase}
#panel .tag{display:inline-block;padding:3px 10px;background:rgba(0,238,255,0.08);border:1px solid rgba(0,238,255,0.3);margin:3px 3px 3px 0;font-size:0.7rem;border-radius:3px}
#panel .falsifiability{margin:15px 0;padding:12px;background:rgba(0,238,255,0.05);border-left:3px solid var(--cyan);font-size:0.75rem;line-height:1.6}
#legend{display:none;margin-top:14px;padding-top:14px;border-top:1px solid rgba(0,238,255,0.2);font-size:0.78rem;line-height:1.8}
#legend p{margin-bottom:6px}
.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:8px;vertical-align:middle}
#tooltip{position:absolute;background:var(--panel);border:1px solid var(--cyan);padding:8px 14px;border-radius:4px;font-size:0.75rem;pointer-events:none;opacity:0;transition:opacity 0.2s;z-index:2000;white-space:nowrap}
.corner-bracket{position:fixed;width:30px;height:30px;pointer-events:none;z-index:500;opacity:0.3}
.cb-tl{top:10px;left:10px;border-top:2px solid var(--cyan);border-left:2px solid var(--cyan)}
.cb-tr{top:10px;right:10px;border-top:2px solid var(--cyan);border-right:2px solid var(--cyan)}
.cb-bl{bottom:10px;left:10px;border-bottom:2px solid var(--cyan);border-left:2px solid var(--cyan)}
.cb-br{bottom:10px;right:10px;border-bottom:2px solid var(--cyan);border-right:2px solid var(--cyan)}
#controls-hint{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);font-size:0.65rem;opacity:0.4;pointer-events:none;letter-spacing:1px}
@media(max-width:768px){#ui{max-width:280px;padding:12px}#ui h1{font-size:1em}#panel{width:90%;right:5%;left:5%}}
/* CROSS-PROJECT NAV */
.xpn{position:fixed;bottom:0;left:0;right:0;z-index:9999;background:rgba(0,0,17,0.95);backdrop-filter:blur(20px);border-top:1px solid rgba(255,234,0,0.2);padding:10px 20px;display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;font-family:'JetBrains Mono',monospace;font-size:12px;transition:transform 0.3s;box-shadow:0 -4px 30px rgba(0,0,0,0.5)}
.xpn a{color:rgba(0,238,255,0.4);text-decoration:none;padding:6px 14px;border-radius:4px;transition:all 0.3s;white-space:nowrap;border:1px solid rgba(255,234,0,0.1)}
.xpn a:hover{color:#ffea00;border-color:#ffea00;background:rgba(255,234,0,0.08);box-shadow:0 0 12px rgba(255,234,0,0.2)}
.xpn a.xa{color:#ffea00;border-color:#ffea00;background:rgba(255,234,0,0.12);font-weight:700;text-shadow:0 0 8px rgba(255,234,0,0.3)}
.xpn .xt{color:#00eeff;margin-right:10px;font-size:11px;letter-spacing:3px;text-transform:uppercase}
.xpnt{position:fixed;bottom:52px;right:20px;z-index:9999;background:rgba(0,0,17,0.8);border:1px solid rgba(255,234,0,0.2);color:#ffea00;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:'Orbitron',sans-serif;font-size:14px;font-weight:900;cursor:pointer;transition:all 0.3s;box-shadow:0 0 15px rgba(255,234,0,0.1)}
.xpnt:hover{background:rgba(255,234,0,0.15);box-shadow:0 0 20px rgba(255,234,0,0.3);transform:scale(1.1)}
@media(max-width:768px){.xpn{font-size:10px;gap:4px;padding:8px 10px}.xpn a{padding:4px 8px;font-size:10px}.xpn .xt{display:none}.xpnt{bottom:48px;width:32px;height:32px;font-size:12px}}
</style>
</head>
<body>
<div class="corner-bracket cb-tl"></div><div class="corner-bracket cb-tr"></div>
<div class="corner-bracket cb-bl"></div><div class="corner-bracket cb-br"></div>
<div id="ui">
<h1>$ DOLLAR GRAVITY</h1>
<p>Mid-2026 Static Snapshot | Einstein Spacetime Fabric Model</p>
<div class="btn-group">
<button onclick="toggleLegend()">Legend & Methodology</button>
<button onclick="resetCamera()">Reset View</button>
<button onclick="toggleFlows()">Toggle Flow Arcs</button>
<button onclick="toggleAutoRotate()">Auto-Rotate</button>
</div>
<div id="legend">
<p><span class="legend-dot" style="background:#ffdd44"></span><strong>USD Core</strong> — Central mass warping fabric</p>
<p><span class="legend-dot" style="background:#4488ff"></span><strong>Planets</strong> — Sovereign entities (size = power mass)</p>
<p><span class="legend-dot" style="background:#4488ff;box-shadow:0 0 6px #4488ff"></span><strong>Blue Rings</strong> — Money/FX flows & reserves</p>
<p><span class="legend-dot" style="background:#ff4444"></span><strong>Red Halos</strong> — Military & sanctions influence</p>
<p><span class="legend-dot" style="background:#44ff88"></span><strong>Green Arcs</strong> — Alliances & trade entanglements</p>
<p style="margin-top:10px;font-size:0.7rem;opacity:0.6">Data: Public aggregates (IMF, SIPRI, etc.) • Static • Gaps explicit</p>
<span class="tag">Falsifiable</span><span class="tag">Honest modeling</span>
</div>
</div>
<div id="panel"></div>
<div id="tooltip"></div>
<div id="controls-hint">CLICK PLANETS FOR DETAILS • DRAG TO ROTATE • SCROLL TO ZOOM</div>
<!-- CROSS-PROJECT NAVIGATION -->
<div class="xpn" id="xpn">
<span class="xt">// ECOSYSTEM</span>
<a href="https://powder-ranger.github.io" id="xpn-portfolio">Portfolio</a>
<a href="https://powder-ranger.github.io/nso-kryptonite-platform" id="xpn-nso">NSO Kryptonite</a>
<a href="https://powder-ranger.github.io/CIVWATCH" id="xpn-civwatch">CIVWATCH</a>
<a href="https://powder-ranger.github.io/OBLISK" id="xpn-oblisk">OBLISK</a>
<a href="https://powder-ranger.github.io/ai-nexus" id="xpn-ainexus">AI Nexus</a>
<a href="https://powder-ranger.github.io/dollar-gravity-framework" id="xpn-dollar">Dollar Gravity</a>
</div>
<button class="xpnt" id="xpnt" onclick="tgxpn()" title="Toggle nav (Shift+E)">▲</button>
<script>
let scene,camera,renderer,bodies=[],flowLines=[],showFlows=false,autoRotate=true;
function init(){
scene=new THREE.Scene();
camera=new THREE.PerspectiveCamera(60,window.innerWidth/window.innerHeight,0.1,2000);
renderer=new THREE.WebGLRenderer({antialias:true});
renderer.setSize(window.innerWidth,window.innerHeight);
renderer.setPixelRatio(window.devicePixelRatio);
document.body.appendChild(renderer.domElement);
const starsGeo=new THREE.BufferGeometry();
const starVertices=[];
for(let i=0;i<12000;i++){starVertices.push(THREE.MathUtils.randFloatSpread(3000),THREE.MathUtils.randFloatSpread(3000),THREE.MathUtils.randFloatSpread(3000));}
starsGeo.setAttribute('position',new THREE.Float32BufferAttribute(starVertices,3));
scene.add(new THREE.Points(starsGeo,new THREE.PointsMaterial({color:0xaaaaaa,size:0.07,transparent:true,opacity:0.8})));
scene.fog=new THREE.FogExp2(0x000022,0.0008);
const coreGeo=new THREE.SphereGeometry(3.2,64,64);
const coreMat=new THREE.MeshPhongMaterial({color:0xffdd44,emissive:0xffaa00,shininess:10,emissiveIntensity:0.6});
const core=new THREE.Mesh(coreGeo,coreMat);scene.add(core);
bodies.push({mesh:core,name:"USD Core",info:"Dominant central mass. Deepest spacetime well pulling global finance and security.",allies:"Global reserve system",enemies:"None (universal attractor)",trends:"Resilient post-2022",falsifiability:"Testable via reserve composition shifts (IMF COFER). Gaps: Opaque private elite channels."});
const planets=[
{x:8,y:3,z:0,color:0x4488ff,name:"USA",info:"Largest planetary mass. Strong blue/red fields sustaining orbits.",allies:"NATO allies, Five Eyes",enemies:"Rivals in multipolar push",trends:"Stable + growth",falsifiability:"High confidence metrics; elite influence modeled indirectly."},
{x:-9,y:6,z:2,color:0xff4444,name:"China",info:"Major rival moon. Entangled green arcs + thin bypass red halos.",allies:"BRICS partners",enemies:"USD system (partial)",trends:"Hedging acceleration 2021-2026",falsifiability:"De-dollarization claims falsifiable via trade data."},
{x:5,y:-8,z:-3,color:0x44ff88,name:"EU",info:"Allied cluster with coordinated blue flows.",allies:"Transatlantic",enemies:"Internal fractures",trends:"Cohesive but slowing",falsifiability:"Data gaps in unified fiscal policy."},
{x:-5,y:-5,z:4,color:0xff66aa,name:"Russia",info:"Sanctions-distorted field with red dominance.",allies:"Limited",enemies:"Western bloc",trends:"Resilience shown",falsifiability:"Sanctions effectiveness testable."},
{x:12,y:-2,z:1,color:0x88aaff,name:"India",info:"Rising mass with balanced green/blue.",allies:"Quad partners",enemies:"Border rivals",trends:"Strong growth trend",falsifiability:"Public data robust."},
{x:-4,y:9,z:-2,color:0xffaa44,name:"Saudi",info:"Petrodollar anchor with strong blue rings.",allies:"OPEC+",enemies:"Regional",trends:"Stable orbit",falsifiability:"Oil price sensitivity."},
{x:3,y:7,z:5,color:0xaa4444,name:"Iran",info:"Active scenario resistance moon. Distorted local well.",allies:"Axis of Resistance",enemies:"US/Israel",trends:"Sanctions test case",falsifiability:"Observable bypass networks but scale limited."},
];
planets.forEach(p=>createPlanet(p.x,p.y,p.z,p.color,p.name,p.info,p.allies,p.enemies,p.trends,p.falsifiability));
camera.position.set(0,15,45);camera.lookAt(0,0,0);
const ambient=new THREE.AmbientLight(0x404060,0.6);scene.add(ambient);
const pointLight=new THREE.PointLight(0xffffff,1.2,0);pointLight.position.set(10,20,30);scene.add(pointLight);
animate();
}
function createPlanet(x,y,z,color,name,info,allies,enemies,trends,fals){
const geo=new THREE.SphereGeometry(1.4+Math.random()*0.6,48,48);
const mat=new THREE.MeshPhongMaterial({color:color,emissive:color,emissiveIntensity:0.4,shininess:25,specular:0x222222});
const planet=new THREE.Mesh(geo,mat);planet.position.set(x,y,z);scene.add(planet);
const ringGeo=new THREE.TorusGeometry(2.8,0.15,16,64);
const ringBlue=new THREE.Mesh(ringGeo,new THREE.MeshBasicMaterial({color:0x4488ff,transparent:true,opacity:0.35,side:THREE.DoubleSide}));
ringBlue.rotation.x=Math.PI/2;planet.add(ringBlue);
const ringRed=new THREE.Mesh(ringGeo,new THREE.MeshBasicMaterial({color:0xff4444,transparent:true,opacity:0.25}));
ringRed.rotation.x=Math.PI/2.2;ringRed.scale.set(1.15,1.15,1.15);planet.add(ringRed);
bodies.push({mesh:planet,name:name,info:info,allies:allies,enemies:enemies,trends:trends,falsifiability:fals,color:color});
}
function animate(){
requestAnimationFrame(animate);
if(autoRotate){scene.rotation.y+=0.001;}
bodies.forEach((b,i)=>{if(i>0){b.mesh.rotation.y+=0.003;b.mesh.position.x+=Math.sin(Date.now()/2000+i)*0.002;}});
renderer.render(scene,camera);
}
const raycaster=new THREE.Raycaster();const mouse=new THREE.Vector2();
window.addEventListener('click',(event)=>{
mouse.x=(event.clientX/window.innerWidth)*2-1;mouse.y=-(event.clientY/window.innerHeight)*2+1;
raycaster.setFromCamera(mouse,camera);
const meshes=[];bodies.forEach(b=>{meshes.push(b.mesh);b.mesh.children.forEach(c=>meshes.push(c));});
const intersects=raycaster.intersectObjects(meshes,true);
if(intersects.length>0){
let obj=intersects[0].object;
while(obj&&!bodies.find(b=>b.mesh===obj))obj=obj.parent;
const selected=bodies.find(b=>b.mesh===obj);
if(selected)showPanel(selected);
}
});
window.addEventListener('mousemove',(event)=>{
mouse.x=(event.clientX/window.innerWidth)*2-1;mouse.y=-(event.clientY/window.innerHeight)*2+1;
raycaster.setFromCamera(mouse,camera);
const meshes=[];bodies.forEach(b=>{meshes.push(b.mesh);b.mesh.children.forEach(c=>meshes.push(c));});
const intersects=raycaster.intersectObjects(meshes,true);
const tooltip=document.getElementById('tooltip');
if(intersects.length>0){
let obj=intersects[0].object;
while(obj&&!bodies.find(b=>b.mesh===obj))obj=obj.parent;
const selected=bodies.find(b=>b.mesh===obj);
if(selected){tooltip.textContent=selected.name;tooltip.style.left=event.clientX+15+'px';tooltip.style.top=event.clientY+15+'px';tooltip.style.opacity=1;document.body.style.cursor='pointer';}
}else{tooltip.style.opacity=0;document.body.style.cursor='default';}
});
function showPanel(body){
const panel=document.getElementById('panel');
panel.innerHTML=`<h2>${body.name}</h2><p style="opacity:0.9">${body.info}</p><div class="label">Allies</div><p>${body.allies||'Various'}</p><div class="label">Enemies / Rivals</div><p>${body.enemies||'Contextual'}</p><div class="label">Trends 2021-2026</div><p>${body.trends}</p><div class="falsifiability"><strong>Falsifiability & Gaps:</strong><br>${body.falsifiability||'Explicit gaps noted in model.'}</div><button onclick="document.getElementById('panel').style.display='none'">Close Panel</button>`;
panel.style.display='block';
}
function toggleLegend(){const l=document.getElementById('legend');l.style.display=l.style.display==='none'?'block':'none';}
function resetCamera(){camera.position.set(0,15,45);camera.lookAt(0,0,0);}
function toggleFlows(){showFlows=!showFlows;const btn=event.target;btn.textContent=showFlows?'Hide Flow Arcs':'Show Flow Arcs';}
function toggleAutoRotate(){autoRotate=!autoRotate;const btn=event.target;btn.textContent=autoRotate?'Stop Rotation':'Auto-Rotate';}
window.addEventListener('resize',()=>{camera.aspect=window.innerWidth/window.innerHeight;camera.updateProjectionMatrix();renderer.setSize(window.innerWidth,window.innerHeight);});
init();
// Cross-nav
const pn=document.getElementById('xpn'),pt=document.getElementById('xpnt');
function tgxpn(){const h=pn.style.transform==='translateY(100%)';pn.style.transform=h?'translateY(0)':'translateY(100%)';pt.innerHTML=h?'▲':'▼';pt.style.bottom=h?'52px':'20px';}
document.getElementById('xpn-dollar').classList.add('xa');
document.addEventListener('keydown',e=>{if(e.shiftKey&&e.key==='E')tgxpn();if(e.shiftKey&&e.key==='T')window.scrollTo({top:0,behavior:'smooth'});});
</script>
</body>
</html>