Skip to content
Snippets Groups Projects
Commit 2e0ff1e9 authored by Sami Spets's avatar Sami Spets
Browse files

minor changes

parent 59ffdc05
Branches
Tags
No related merge requests found
Pipeline #15870 passed
Stage: all
Show whitespace changes
Inline Side-by-side
web-service/server/public/css/index.css
+ 10
− 5
View file @ 2e0ff1e9
...@@ -36,17 +36,22 @@ body { ...@@ -36,17 +36,22 @@ body {
} }
.ftlab-card-component { .ftlab-card-component {
width: 150px; width: 250px;
height: auto; height: auto;
margin: auto; margin: auto;
text-align: center; text-align: center;
border: 1px solid black; border: 1px solid black;
} }
.thumbnail-img {
width: 150px;
}
#container { #container {
height: 100%;
padding: 0;
margin: 0;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex; display: flex;
align-items: center;
justify-content: center;
} }
\ No newline at end of file
web-service/server/public/js/index.js
+ 51
− 42
View file @ 2e0ff1e9
const checkIfLoggedIn = async () => { const checkIfLoggedIn = async () => {
// const token = window.localStorage.getItem('token') const token = window.localStorage.getItem('token')
// console.log(token) console.log(token)
// if(!token){ if(!token){
// console.log("You need to login") console.log("You need to login")
// renderLogin() renderLogin()
// }else{ }else{
// //Check if the token is valid //Check if the token is valid
// const response = await fetch('http://localhost:8080/auth/validation', { const response = await fetch('http://localhost:8080/auth/validation', {
// method: 'POST', method: 'POST',
// headers: {'Authorization': token} headers: {'Authorization': token}
// }) })
// console.log('RESPONSE', response) console.log('RESPONSE', response)
// //Token is valid, show available streams //Token is valid, show available streams
// if(response.status === 200){ if(response.status === 200){
// console.log("SUCCESS") console.log("SUCCESS")
renderThumbnails() renderThumbnails()
// } }
// } }
} }
//Redirects the user to google authentication //Redirects the user to google authentication
...@@ -48,28 +48,29 @@ const videoPlayer = () => { ...@@ -48,28 +48,29 @@ const videoPlayer = () => {
* Creates thumbnail (image) for all available streams and adds them to div class='container' * Creates thumbnail (image) for all available streams and adds them to div class='container'
*/ */
const renderThumbnails = async () => { const renderThumbnails = async () => {
const thumbnails = await getAvailableStreams(); // const thumbnails = await getAvailableStreams();
console.log('THUMBNAILS', thumbnails) //console.log('THUMBNAILS', thumbnails)
const containerDiv = document.getElementById('container') const containerDiv = document.getElementById('container')
containerDiv.innerHTML = ''; containerDiv.innerHTML = '';
console.log(containerDiv) console.log(containerDiv)
for(var i=0; i<thumbnails.length; i++){ for(var i=0; i<2; i++){
const encodedURI = encodeURIComponent(thumbnails[i]) // const encodedURI = encodeURIComponent(thumbnails[i])
console.log("THUMBNAIL[i]", thumbnails[i]) // console.log("THUMBNAIL[i]", thumbnails[i])
try{ // try{
const someData = await fetch(`http://localhost:8080/stream/rgb?uri=${encodedURI}`) // const someData = await fetch(`http://localhost:8080/stream/rgb?uri=${encodedURI}`)
console.log('SOME DATA', someData) // console.log('SOME DATA', someData)
if(!someData.ok){ // if(!someData.ok){
throw new Error('Image not found') // throw new Error('Image not found')
} // }
const myBlob = await someData.blob(); // const myBlob = await someData.blob();
console.log('BLOB', myBlob) // console.log('BLOB', myBlob)
const objectURL = URL.createObjectURL(myBlob); // const objectURL = URL.createObjectURL(myBlob);
containerDiv.innerHTML += createCard(objectURL, i+4, encodedURI) containerDiv.innerHTML += createCard()
}catch(err){ // containerDiv.innerHTML += createCard(objectURL, i+4, encodedURI)
console.log("Couldn't create thumbnail"); // }catch(err){
console.log(err) // console.log("Couldn't create thumbnail");
} // console.log(err)
// }
} }
} }
...@@ -100,11 +101,19 @@ const renderLogin = () => { ...@@ -100,11 +101,19 @@ const renderLogin = () => {
</div>` </div>`
} }
const createCard = (url, viewers, uri) => { // const createCard = (url, viewers, uri) => {
// return `<div class='ftlab-card-component' >
// <img src='${url}' class="thumbnail-img" alt="Hups"></img>
// <p>Viewers: ${viewers}</p>
// <button onclick="window.location.href='/stream/${uri}'">button</button>
// </div>`
// }
const createCard = () => {
return `<div class='ftlab-card-component'> return `<div class='ftlab-card-component'>
<img src='${url}' class="thumbnail-img" alt="Hups" width='500px'></img> <img src='https://via.placeholder.com/250x150' class="thumbnail-img" width="250px" alt="Hups"></img>
<p>Viewers: ${viewers}</p> <p>Viewers: yes</p>
<button onclick="window.location.href='/stream/${uri}'">button</button> <button onclick="window.location.href='/stream/URI'">button</button>
</div>` </div>`
} }
......
web-service/server/src/index.js
+ 14
− 8
View file @ 2e0ff1e9
...@@ -12,7 +12,7 @@ const User = require('./models/users') ...@@ -12,7 +12,7 @@ const User = require('./models/users')
const Configs = require('./models/generic') const Configs = require('./models/generic')
const Disparity = require('./models/disparity') const Disparity = require('./models/disparity')
const bodyParser = require('body-parser') const bodyParser = require('body-parser')
const cors = require('cors') //const cors = require('cors')
// ---- INDEXES ---------------------------------------------------------------- // ---- INDEXES ----------------------------------------------------------------
app.use(passport.initialize()); app.use(passport.initialize());
...@@ -29,13 +29,13 @@ passport.deserializeUser((userDataFromCookie, done) => { ...@@ -29,13 +29,13 @@ passport.deserializeUser((userDataFromCookie, done) => {
done(null, userDataFromCookie); done(null, userDataFromCookie);
}) })
// mongoose.connect(config.MONGODB_URI, { useNewUrlParser: true, useUnifiedTopology: true }) mongoose.connect(config.MONGODB_URI, { useNewUrlParser: true, useUnifiedTopology: true })
// .then(() => { .then(() => {
// console.log('Connected to MongoDB'); console.log('Connected to MongoDB');
// }) })
// .catch((err) => { .catch((err) => {
// console.log(err); console.log(err);
// }) })
let peer_by_id = {}; let peer_by_id = {};
//let uri_to_peer = {}; //let uri_to_peer = {};
...@@ -314,6 +314,12 @@ app.get('/stream/config', async(req, res) => { ...@@ -314,6 +314,12 @@ app.get('/stream/config', async(req, res) => {
app.get('/stream', (req, res) => { app.get('/stream', (req, res) => {
let uri = req.query.uri; let uri = req.query.uri;
/**
* It should render a new html page that has it's own dedicated js-file
* The js-file should do everything related to the decoding of bitstream.
*/
console.log(uri) console.log(uri)
}) })
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment