diff options
Diffstat (limited to 'src/client/views/newlightbox/ExploreView/ExploreView.tsx')
| -rw-r--r-- | src/client/views/newlightbox/ExploreView/ExploreView.tsx | 30 |
1 files changed, 30 insertions, 0 deletions
diff --git a/src/client/views/newlightbox/ExploreView/ExploreView.tsx b/src/client/views/newlightbox/ExploreView/ExploreView.tsx new file mode 100644 index 000000000..855bfd9e2 --- /dev/null +++ b/src/client/views/newlightbox/ExploreView/ExploreView.tsx @@ -0,0 +1,30 @@ +import './ExploreView.scss'; +import { IBounds, IExploreView, emptyBounds } from "./utils"; +import { IRecommendation } from "../components"; +import * as React from 'react'; +import { NewLightboxView } from '../NewLightboxView'; +import { StrCast } from '../../../../fields/Types'; + + + +export const ExploreView = (props: IExploreView) => { + const { recs, bounds=emptyBounds } = props + + return <div className={`exploreView-container`}> + {recs && recs.map((rec) => { + console.log(rec.embedding, bounds) + const x_bound: number = Math.max(Math.abs(bounds.max_x), Math.abs(bounds.min_x)) + const y_bound: number = Math.max(Math.abs(bounds.max_y), Math.abs(bounds.min_y)) + console.log(x_bound, y_bound) + if (rec.embedding) { + const x = (rec.embedding.x / x_bound) * 50; + const y = (rec.embedding.y / y_bound) * 50; + console.log(x, y) + return <div className={`exploreView-doc`} onClick={() => {}} style={{top: `calc(50% + ${y}%)`, left: `calc(50% + ${x}%)`}}> + {rec.title} + </div> + } else return (null) + })} + <div className={`exploreView-doc`} style={{top: `calc(50% + ${0}%)`, left: `calc(50% + ${0}%)`, background: '#073763', color: 'white'}}>{StrCast(NewLightboxView.NewLightboxDoc?.title)}</div> + </div> +}
\ No newline at end of file |