From c8d3d07c33290e503c2792e6ea22817b1775dd35 Mon Sep 17 00:00:00 2001
From: Sami Spets <savasp@utu.fi>
Date: Mon, 30 Sep 2019 14:49:16 +0300
Subject: [PATCH] client gets the list of available streams
---
web-service/client/package.json | 3 ++-
web-service/client/src/App.js | 13 ++++++------
web-service/client/src/Streams.js | 34 +++++++++++++++++++++++--------
web-service/server/src/index.js | 7 +++++--
4 files changed, 39 insertions(+), 18 deletions(-)
diff --git a/web-service/client/package.json b/web-service/client/package.json
index e8f24e819..13437031d 100644
--- a/web-service/client/package.json
+++ b/web-service/client/package.json
@@ -12,7 +12,8 @@
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
- "eject": "react-scripts eject"
+ "eject": "react-scripts eject",
+ "buildFull": "react-scripts build && cp -r build ~/work/ftl/web-service/server"
},
"browserslist": {
"production": [
diff --git a/web-service/client/src/App.js b/web-service/client/src/App.js
index ab02b2fec..39eaaf6c9 100644
--- a/web-service/client/src/App.js
+++ b/web-service/client/src/App.js
@@ -36,13 +36,14 @@ const App = () => {
window.location.reload();
}
- if(window.localStorage.getItem('token')){
- return (
- <Streams clearCookies={clearCookies}/>
- )
- }
+ // if(window.localStorage.getItem('token')){
+ // return (
+ //
+ // )
+ // }
return (
- <Login handleLogin={handleLogin} />
+ <Streams clearCookies={clearCookies}/>
+ // <Login handleLogin={handleLogin} />
)
}
diff --git a/web-service/client/src/Streams.js b/web-service/client/src/Streams.js
index 7c0f7ec87..e93fedd08 100644
--- a/web-service/client/src/Streams.js
+++ b/web-service/client/src/Streams.js
@@ -11,24 +11,40 @@ The user will be redirected to Stream.js file
const Streams = ({clearCookies}) => {
const [thumbnails, setThumbnails] = useState([]);
-
- useEffect(() => {
- setThumbnails(testData.thumbnail);
- console.log('streams')
- }, [])
- const renderThumbnails = () => {
- const photos = thumbnails.map(i => <div style={{'paddingTop': '25px'}}><img alt='robots' src={i.video} width='150px'/><p style={{'margin': 'none'}}>viewers: {i.viewers}</p></div>)
- return photos;
+ useEffect( async () => {
+ const jsonThumbnails = await fetch('/streams/');
+ const realThumbnails = await jsonThumbnails.json();
+ setThumbnails(realThumbnails);
+ console.log('THUMBNAILS', thumbnails)
+ }, [])
+ /**
+ * Fetch the thumbnails
+ * setInterval() fetch every 1 second
+ */
+
+ const fetchThumbnails = async () => {
+ const jsonThumbnails = await fetch('/streams/');
+ const realThumbnails = await jsonThumbnails.json();
+ return realThumbnails;
}
+ const renderThumbnails = async () => {
+ const thumbs = await fetchThumbnails()
+ console.log('before', thumbnails)
+ setThumbnails((thumbs));
+ console.log('after', thumbnails)
+ return thumbnails
+ }
+
+
return(
<div style={{'margin': 'auto', 'textAlign': 'center'}}>
<h1>Streams component works!!</h1>
<h2>Namibia here we come!</h2>
<button onClick={clearCookies}>Logout</button>
<br />
- {renderThumbnails()}
+ <button onClick={() => renderThumbnails()}></button>
</div>
)
}
diff --git a/web-service/server/src/index.js b/web-service/server/src/index.js
index 6dd821d19..47e78cfa8 100644
--- a/web-service/server/src/index.js
+++ b/web-service/server/src/index.js
@@ -114,8 +114,10 @@ RGBDStream.prototype.subscribe = function() {
}
RGBDStream.prototype.pushFrames = function(latency, spacket, packet) {
- if (spacket[1] & 0x1) this.depth = packet[4];
- else this.rgb = packet[4];
+ if (packet[0] === 0){
+ if (spacket[1] & 0x1) this.depth = packet[4];
+ else this.rgb = packet[4];
+ }
console.log("Frame = ", packet[0], packet[1]);
@@ -149,6 +151,7 @@ app.get('/streams', (req, res) => {
app.get('/stream/rgb', (req, res) => {
let uri = req.query.uri;
if (uri_data.hasOwnProperty(uri)) {
+ uri_data[uri].peer.send("get_stream", uri, 10, 9, [Peer.uuid], uri);
res.writeHead(200, {'Content-Type': 'image/jpeg'});
res.end(uri_data[uri].rgb);
}
--
GitLab