Skip to content

Commit 8ca01c6

Browse files
committed
feat: add proper links to objects
1 parent 2bf26a5 commit 8ca01c6

File tree

3 files changed

+84
-53
lines changed

3 files changed

+84
-53
lines changed

src/render.js

Lines changed: 25 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ if(__worker) {
2525
console.log('received from worker', d.type)
2626

2727
if(d.type === 'click') {
28-
sideMenu.setCurrentObject({ first: d.first, nearby: d.nearby })
28+
sideMenu.setCurrentObject({ first: d.first, nearby: d.nearby, nearbyReferenceInfos: d.nearbyReferenceInfos })
2929
updUrl(d.first)
3030
}
3131
else if(d.type === 'getInfo') {
@@ -34,6 +34,7 @@ if(__worker) {
3434
}
3535
else if(d.type === 'getSceneInfo') {
3636
sideMenu.setCurrentObject({ scene: d.scene })
37+
updUrlScene(d.scene)
3738
}
3839
else if(d.type === 'colliders-done') {
3940
const it = {
@@ -427,11 +428,15 @@ try {
427428
const url = new URL(window.location.href)
428429
const posx = parseFloat(url.searchParams.get('posx'))
429430
const posy = parseFloat(url.searchParams.get('posy'))
431+
const obji = parseFloat(url.searchParams.get('obji'))
430432
if(isFinite(posx) && isFinite(posy)) {
431433
context.camera.posX = posx
432434
context.camera.posY = posy
433435
context.requestRender(1)
434436
}
437+
if(isFinite(obji)) {
438+
worker?.postMessage({ type: 'getInfo', index: obji })
439+
}
435440
}
436441
catch(e) {
437442
console.error(e)
@@ -440,13 +445,27 @@ catch(e) {
440445
function updUrl(obj) {
441446
const posx = obj.pos[0]
442447
const posy = obj.pos[1]
448+
const obji = obj.index
449+
450+
const url = new URL(window.location.href)
451+
url.searchParams.set('posx', posx)
452+
url.searchParams.set('posy', posy)
453+
url.searchParams.set('obji', obji)
454+
455+
const prevUrl = new URL(window.location.href)
456+
if(url.toString() != prevUrl.toString()) {
457+
window.history.pushState({}, '', url)
458+
}
459+
}
443460

461+
function updUrlScene(it) {
444462
const url = new URL(window.location.href)
445-
const prevPosx = parseFloat(url.searchParams.get('posx'))
446-
const prevPosy = parseFloat(url.searchParams.get('posy'))
447-
if(isFinite(posx) && isFinite(posy) && (posx != prevPosx || posy != prevPosy)) {
448-
url.searchParams.set('posx', posx)
449-
url.searchParams.set('posy', posy)
463+
url.searchParams.set('obji', it.index)
464+
url.searchParams.delete('posx')
465+
url.searchParams.delete('posy')
466+
467+
const prevUrl = new URL(window.location.href)
468+
if(url.toString() != prevUrl.toString()) {
450469
window.history.pushState({}, '', url)
451470
}
452471
}

src/sideMenu.jsx

Lines changed: 41 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -175,7 +175,7 @@ function ObjectMenu() {
175175
return <div key={obj.tick} className='object-menu'>
176176
<Object first={obj.data?.first}/>
177177
<div className="space"></div>
178-
<Other nearby={obj.data?.nearby}/>
178+
<Other nearby={obj.data?.nearby} nearbyReferenceInfos={obj.data?.nearbyReferenceInfos}/>
179179
</div>
180180
}
181181
}
@@ -188,7 +188,7 @@ function Scene({ scene }) {
188188
const children = Array(scene.children.length)
189189
for(let i = 0; i < scene.children.length; i++) {
190190
const ci = scene.children[i]
191-
children[i] = <Link key={i} index={ci} name={scene.referenceNames[ci]}/>
191+
children[i] = <Link key={i} index={ci} obj={scene}/>
192192
}
193193

194194
return <>
@@ -240,12 +240,11 @@ function Object({ first }) {
240240
const ti = parsedSchema.typeSchemaI
241241

242242
function parentLink(obj, parentI, i) {
243-
const rn = obj.referenceNames[parentI]
244243
if(parentI < 0) {
245-
return <span key={i}>[<Link index={parentI} name={rn}/>]</span>
244+
return <span key={i}>[<Link index={parentI} obj={obj}/>]</span>
246245
}
247246
else {
248-
return <span key={i}><Link index={parentI} name={rn}/></span>
247+
return <span key={i}><Link index={parentI} obj={obj}/></span>
249248
}
250249
}
251250

@@ -269,7 +268,7 @@ function Children({ obj }) {
269268
const children = Array(obj.children.length)
270269
for(let i = 0; i < obj.children.length; i++) {
271270
const ci = obj.children[i]
272-
children[i] = <Link key={i} index={ci} name={obj.referenceNames[ci]}/>
271+
children[i] = <Link key={i} index={ci} obj={obj}/>
273272
}
274273

275274
return <details className="component">
@@ -282,7 +281,7 @@ function ReferencedBy({ obj }) {
282281
const arr = []
283282
for(let i = 0; i < obj.referencedBy.length; i++) {
284283
const ri = obj.referencedBy[i]
285-
arr.push(<Link key={i} index={ri} name={obj.referenceNames[ri]}/>)
284+
arr.push(<Link key={i} index={ri} obj={obj}/>)
286285
}
287286
const empty = arr.length == 0
288287

@@ -396,16 +395,27 @@ ac(ti.CircleCollider2D, (c, o) => {
396395
</Props>
397396
})
398397

399-
function Link({ index, name }) {
400-
const displayName = name != null ? name || '<No name>' : '<Unknown>'
398+
function Link({ index, obj }) {
399+
const referenceInfo = obj.referenceInfos[index] ?? []
400+
const displayName = referenceInfo[0] != null ? referenceInfo[0] || '<No name>' : '<Unknown>'
401401

402402
if(index != null) {
403-
function onClick() { gotoOther(index) }
404-
function reactIsDumb(element) {
405-
// imagine saying that this is a security vulnerability
406-
if(element) element.href = "javascript:void(0)"
403+
const url = new URL(window.location.href)
404+
if(referenceInfo[1] != null && referenceInfo[2] != null) {
405+
url.searchParams.set('posx', referenceInfo[1])
406+
url.searchParams.set('posy', referenceInfo[2])
407407
}
408-
return <a ref={reactIsDumb} onClick={onClick}>{displayName}</a>
408+
else {
409+
url.searchParams.delete('posx')
410+
url.searchParams.delete('posy')
411+
}
412+
url.searchParams.set('obji', index)
413+
414+
function onClick(ev) {
415+
gotoOther(index)
416+
ev.preventDefault()
417+
}
418+
return <a href={url} onClick={onClick}>{displayName}</a>
409419
}
410420
else {
411421
return <span>{displayName}</span>
@@ -416,15 +426,15 @@ ac(ti.ScarabPickup, (c, o) => {
416426
return <Props>
417427
<Prop>
418428
Container:
419-
<Link index={c.container} name={o.referenceNames[c.container]}/>
429+
<Link index={c.container} obj={o}/>
420430
</Prop>
421431
<Component comp={c._base} obj={o}/>
422432
</Props>
423433
})
424434

425435
ac(ti.Transition, (c, o) => {
426436
return <Props>
427-
<Prop>Destination:{<Link index={c.destI} name={o.referenceNames[c.destI]}/>}</Prop>
437+
<Prop>Destination:{<Link index={c.destI} obj={o}/>}</Prop>
428438
<Component comp={c._base} obj={o}/>
429439
</Props>
430440
})
@@ -435,13 +445,13 @@ ac(ti.Unlocker, (c, o) => {
435445
const gc = Array(c.group.length)
436446
for(let i = 0; i < gc.length; i++) {
437447
const l = c.group[i]
438-
gc[i] = <Link key={i} index={l} name={o.referenceNames[l]}/>
448+
gc[i] = <Link key={i} index={l} obj={o}/>
439449
}
440450

441451
return <Props>
442452
<Prop>KeyUse:{keyUses[c.keyUse] ?? '<Unknown>'}</Prop>
443-
<Prop>Target:<Link index={c.target} name={o.referenceNames[c.target]}/></Prop>
444-
<Prop>Target bis (?):<Link index={c.targetBis} name={o.referenceNames[c.targetBis]}/></Prop>
453+
<Prop>Target:<Link index={c.target} obj={o}/></Prop>
454+
<Prop>Target bis (?):<Link index={c.targetBis} obj={o}/></Prop>
445455
<Prop>Group:<Props>{gc}</Props></Prop>
446456
<Component comp={c._base} obj={o}/>
447457
</Props>
@@ -451,13 +461,13 @@ ac(ti.UnlockerTorch, (c, o) => {
451461
const gc = Array(c.group.length)
452462
for(let i = 0; i < gc.length; i++) {
453463
const l = c.group[i]
454-
gc[i] = <Link key={i} index={l} name={o.referenceNames[l]}/>
464+
gc[i] = <Link key={i} index={l} obj={o}/>
455465
}
456466

457467
return <Props>
458-
<Prop>Target:<Link index={c.target} name={o.referenceNames[c.target]}/></Prop>
459-
<Prop>Target bis (?):<Link index={c.targetBis} name={o.referenceNames[c.targetBis]}/></Prop>
460-
<Prop>Linked torch:<Link index={c.linkedTorch} name={o.referenceNames[c.linkedTorch]}/></Prop>
468+
<Prop>Target:<Link index={c.target} obj={o}/></Prop>
469+
<Prop>Target bis (?):<Link index={c.targetBis} obj={o}/></Prop>
470+
<Prop>Linked torch:<Link index={c.linkedTorch} obj={o}/></Prop>
461471
<Prop>Group:<Props>{gc}</Props></Prop>
462472
<Component comp={c._base} obj={o}/>
463473
</Props>
@@ -477,8 +487,8 @@ const objectiveNames = [
477487

478488
ac(ti.UnlockerTrigger, (c, o) => {
479489
return <Props>
480-
<Prop>Target:<Link index={c.target} name={o.referenceNames[c.target]}/></Prop>
481-
<Prop>Target bis (?):<Link index={c.targetBis} name={o.referenceNames[c.targetBis]}/></Prop>
490+
<Prop>Target:<Link index={c.target} obj={o}/></Prop>
491+
<Prop>Target bis (?):<Link index={c.targetBis} obj={o}/></Prop>
482492
<Prop>Prereqisute:{objectiveNames[c.objectiveCleared]}</Prop>
483493
<Component comp={c._base} obj={o}/>
484494
</Props>
@@ -553,7 +563,7 @@ ac(ti.Buyable, (c, o) => {
553563
<Prop>For sale:{bs(c.isForSale)}</Prop>
554564
<Prop>Title:{c.title}</Prop>
555565
<Prop>Description:{c.description}</Prop>
556-
<Prop>Owner:<Link index={c.owner} name={o.referenceNames[c.owner]}/></Prop>
566+
<Prop>Owner:<Link index={c.owner} obj={o}/></Prop>
557567
<Component comp={c._base} obj={o}/>
558568
</Props>
559569
});
@@ -597,7 +607,7 @@ ac(ti.Npc, (c, o) => {
597607

598608
ac(ti.Tunnel, (c, o) => {
599609
return <Props>
600-
<Prop>Destination:<Link index={c.destination} name={o.referenceNames[c.destination]}/></Prop>
610+
<Prop>Destination:<Link index={c.destination} obj={o}/></Prop>
601611
<Component comp={c._base} obj={o}/>
602612
</Props>
603613
})
@@ -692,15 +702,16 @@ function Prop({ children }) {
692702
}
693703

694704

695-
function Other({ nearby }) {
696-
if(nearby == null) return
705+
function Other({ nearby, nearbyReferenceInfos }) {
706+
if(nearby == null || nearbyReferenceInfos == null) return
707+
const nearbyObj = { referenceInfos: nearbyReferenceInfos }
697708

698709
const nearbyC = []
699710
for(let i = 0; i < nearby.length; i++) {
700711
const it = nearby[i]
701712
nearbyC.push(
702713
<div key={i} className="hanging">
703-
<Link index={it.index} name={it.name}/>
714+
<Link index={it.index} obj={nearbyObj}/>
704715
<span> [away{nbsp}{it.distance.toFixed(2)}]</span>
705716
</div>
706717
)

src/worker.js

Lines changed: 18 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -627,26 +627,26 @@ objectsProcessedP.then(d => {
627627
})
628628

629629
function serializeObject(obj) {
630-
const referenceNames = {}
630+
const referenceInfos = {}
631631

632632
const children = Array(obj.children.length)
633633
for(let i = 0; i < obj.children.length; i++) {
634634
const child = obj.children[i]
635635
if(child) {
636636
children[i] = child._index
637637
const name = child.name
638-
if(name) {
639-
referenceNames[child._index] = name
640-
}
638+
referenceInfos[child._index] = [name, child.pos[0], child.pos[1]]
641639
}
642640
else {
643641
children[i] = null
644642
}
645643
}
646644

647645
function a(ii) {
648-
const name = objects[ii]?.name
649-
if(name) referenceNames[ii] = name
646+
const obj = objects[ii]
647+
if(!obj) return
648+
const name = obj.name
649+
referenceInfos[ii] = [name, obj.pos[0], obj.pos[1]]
650650
}
651651

652652
for(let i = 0; i < obj.components.length; i++) {
@@ -704,26 +704,27 @@ function serializeObject(obj) {
704704

705705
if(parentI < 0) {
706706
const name = scenes[-parentI - 1]?.name
707-
if(name) referenceNames[parentI] = name
707+
referenceInfos[parentI] = [name]
708708
break
709709
}
710710
else {
711711
const parent = objects[parentI]
712712
if(parent == null) break
713713

714714
const name = parent.name
715-
if(name) referenceNames[parentI] = name
715+
referenceInfos[parentI] = [name, parent.pos[0], parent.pos[1]]
716716
parentI = parent._parentI
717717
}
718718
}
719719

720720
return {
721+
index: obj._index,
721722
name: obj.name,
722723
pos: obj.pos,
723724
components: obj.components,
724725
markerI: obj._markerI,
725726
markerType: obj._markerType,
726-
referenceNames,
727+
referenceInfos,
727728
children,
728729
parentChain: parentChain,
729730
referencedBy,
@@ -789,17 +790,19 @@ function onClick(x, y) {
789790
const first = serializeObject(obj)
790791

791792
const nearby = Array(closest.length - 1)
793+
const nearbyReferenceInfos = {}
792794
nearby.length = 0
793795
for(let i = 1; i < closest.length; i++) {
794796
const c = closest[i]
797+
const co = c[1]
795798
nearby.push({
796-
name: c[1].name,
797799
distance: Math.sqrt(c[0]),
798-
index: c[1]._index,
800+
index: co._index,
799801
})
802+
nearbyReferenceInfos[co._index] = [co.name, co.pos[0], co.pos[1]]
800803
}
801804

802-
message({ type: 'click', first, nearby })
805+
message({ type: 'click', first, nearby, nearbyReferenceInfos })
803806
}
804807
else {
805808
message({ type: 'click' })
@@ -810,24 +813,22 @@ function getInfo(index) {
810813
if(index < 0) {
811814
const s = scenes[-index - 1]
812815
if(s) {
813-
const referenceNames = {}
816+
const referenceInfos = {}
814817

815818
const children = Array(s.roots.length)
816819
for(let i = 0; i < s.roots.length; i++) {
817820
const child = s.roots[i]
818821
if(child) {
819822
children[i] = child._index
820823
const name = child.name
821-
if(name) {
822-
referenceNames[child._index] = name
823-
}
824+
referenceInfos[child._index] = [name, child.pos[0], child.pos[1]]
824825
}
825826
else {
826827
children[i] = null
827828
}
828829
}
829830

830-
message({ type: 'getSceneInfo', scene: { referenceNames, children, name: s.name } })
831+
message({ type: 'getSceneInfo', scene: { referenceInfos, children, name: s.name, index } })
831832
}
832833
}
833834
else {

0 commit comments

Comments
 (0)