fix: re-enable preview for interactive objkts (#354)

* fix: re-enable preview for interactive objkts, regression from #346 * avoid mixed content by providing the fullpath with trailing / * fix width/height --------- Co-authored-by: Mel Massadian <[email protected]>
teia-community · Nov 28, 2023 · b4e8dc5 · b4e8dc5
1 parent 1a4c9cb
commit b4e8dc5
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 12 deletions.
diff --git a/src/components/media-types/html/index.jsx b/src/components/media-types/html/index.jsx
@@ -55,7 +55,7 @@ export const HTMLComponent = (props) => {
   const unpackZipFiles = async () => {
     unpacking.current = true
 
-    const buffer = dataRUIToBuffer(previewUri)
+    const buffer = await dataRUIToBuffer(previewUri)
 
     try {
       const filesArr = await prepareFilesFromZIP(buffer)
@@ -122,7 +122,7 @@ export const HTMLComponent = (props) => {
           <iframe
             ref={iframeRef}
             title={`interactive object ${nft.token_id}`}
-            src={`https://iframe.teia.art/html?uid=${uid}&creator=${_creator_}&viewer=${_viewer_}&objkt=${_objectId_}`}
+            src={`https://iframe.teia.art/html/?uid=${uid}&creator=${_creator_}&viewer=${_viewer_}&objkt=${_objectId_}`}
             sandbox={sandbox_features}
             allow={allowed_features}
           />

diff --git a/src/components/media-types/html/index.module.scss b/src/components/media-types/html/index.module.scss
@@ -23,6 +23,8 @@
 
   &.interactive {
     pointer-events: all;
+    width: 100%;
+    height: 100%;
   }
 
   .preview {

diff --git a/src/components/media-types/vector/index.jsx b/src/components/media-types/vector/index.jsx
@@ -63,6 +63,6 @@ export const VectorComponent = ({
   )
 }
 // svg version:     src={`${src}?author=${_creator_}&viewer=${_viewer_}`}
-// iframe version:  src={`https://iframe.teia.art/svg?src=${src}&creator=${_creator_}&viewer=${_viewer_}`}
+// iframe version:  src={`https://iframe.teia.art/svg/?src=${src}&creator=${_creator_}&viewer=${_viewer_}`}
 
 export default VectorComponent
diff --git a/src/utils/html.js b/src/utils/html.js
@@ -288,14 +288,9 @@ export async function validateFiles(files) {
   }
 }
 
-export function dataRUIToBuffer(dataURI) {
-  const parts = dataURI.split(',')
-  const base64 = parts[1]
-  const binaryStr = atob(base64)
-  const len = binaryStr.length
-  const bytes = new Uint8Array(len)
-  for (let i = 0; i < len; i++) {
-    bytes[i] = binaryStr.charCodeAt(i)
-  }
+export async function dataRUIToBuffer(dataURI) {
+  const blob = await fetch(dataURI).then((r) => r.blob())
+  const binaryStr = await new Response(blob).arrayBuffer()
+  const bytes = new Uint8Array(binaryStr)
   return bytes
 }