Misc website bug fixes (visgl#5969)

harisbal · Jul 19, 2021 · ffca15b · ffca15b
1 parent 9ecb7b4
commit ffca15b
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 19 deletions.
diff --git a/examples/playground/json-examples/tagmap.json b/examples/playground/json-examples/tagmap.json
@@ -12,32 +12,23 @@
     {
       "@@type": "MapView",
       "controller": true,
-      "mapStyle": "https://rivulet-zhang.github.io/dataRepo/mapbox/style/map-style-dark-v9-no-labels.json"
+      "mapStyle": "https://basemaps.cartocdn.com/gl/dark-matter-nolabels-gl-style/style.json"
     }
   ],
   "layers": [
-    {
-      "@@type": "TagmapLayer",
-      "id": "twitter-topics-tagmap",
-      "data": "https://rivulet-zhang.github.io/dataRepo/tagmap/hashtags10k.json",
-      "getLabel": "@@=label",
-      "getPosition": "@@=coordinates",
-      "minFontSize": 14,
-      "maxFontSize": 50
-    },
     {
       "@@type": "TextLayer",
       "id": "twitter-topics-raw",
       "data": "https://rivulet-zhang.github.io/dataRepo/tagmap/hashtags10k.json",
+      "characterSet": "auto",
       "getText": "@@=label",
       "getPosition": "@@=coordinates",
       "getColor": [
         29,
         145,
         192
       ],
-      "getSize": 20,
-      "sizeScale": 1.6
+      "getSize": 12
     }
   ]
 }
diff --git a/examples/playground/src/app.js b/examples/playground/src/app.js
@@ -18,7 +18,7 @@ import JSON_TEMPLATES from '../json-examples';
 const INITIAL_TEMPLATE = Object.keys(JSON_TEMPLATES)[0];
 
 // Set your mapbox token here
-const GOOGLE_MAPS_TOKEN = process.env.GoogleMapsToken; // eslint-disable-line
+const GOOGLE_MAPS_TOKEN = process.env.GoogleMapsAPIKey; // eslint-disable-line
 
 function isFunctionObject(value) {
   return typeof value === 'object' && '@@function' in value;

diff --git a/examples/playground/webpack.config.js b/examples/playground/webpack.config.js
@@ -31,7 +31,7 @@ const CONFIG = {
     ]
   },
 
-  plugins: [new webpack.EnvironmentPlugin(['GoogleMapsToken'])],
+  plugins: [new webpack.EnvironmentPlugin(['GoogleMapsAPIKey'])],
 
   node: {fs: 'empty'}
 };

diff --git a/examples/website/360-video/app.js b/examples/website/360-video/app.js
@@ -1,4 +1,4 @@
-import React, {useMemo, useState} from 'react';
+import React, {useEffect, useState} from 'react';
 import {render} from 'react-dom';
 
 import DeckGL from '@deck.gl/react';
@@ -35,11 +35,13 @@ const INITIAL_VIEW_STATE = {
 
 export default function App() {
   const [isPlaying, setPlaying] = useState(false);
+  const [video, setVideo] = useState(null);
 
-  const video = useMemo(() => {
+  useEffect(() => {
+    let videoEl;
     /* global document */
     if (typeof document !== 'undefined') {
-      const videoEl = document.createElement('video');
+      videoEl = document.createElement('video');
       videoEl.crossOrigin = 'anonymous';
       videoEl.preload = 'auto';
       videoEl.loop = true;
@@ -48,9 +50,9 @@ export default function App() {
       source.src = VIDEO_URL;
       videoEl.append(source);
 
-      return videoEl;
+      setVideo(videoEl);
     }
-    return null;
+    return () => videoEl && videoEl.pause();
   }, []);
 
   const layer = new SimpleMeshLayer({