From f81f16734616f45cec7bdb03e7636d3ba1578492 Mon Sep 17 00:00:00 2001
From: Greg Fodor <gfodor@gmail.com>
Date: Tue, 27 Mar 2018 09:35:11 -0700
Subject: [PATCH] Basic home root
---
package.json | 1 -
src/assets/images/package.json | 5 --
src/index.html | 17 +++--
src/index.js | 114 +-----------------------------
src/react-components/home-root.js | 29 ++++++++
src/telemetry.js | 4 +-
6 files changed, 40 insertions(+), 130 deletions(-)
delete mode 100644 src/assets/images/package.json
create mode 100644 src/react-components/home-root.js
diff --git a/package.json b/package.json
index b219ee378..1a2a4de3f 100644
--- a/package.json
+++ b/package.json
@@ -25,7 +25,6 @@
"detect-browser": "^2.1.0",
"event-target-shim": "^3.0.1",
"jsonschema": "^1.2.2",
- "material-design-lite": "^1.3.0",
"minijanus": "^0.5.0",
"mobile-detect": "^1.4.1",
"moving-average": "^1.0.0",
diff --git a/src/assets/images/package.json b/src/assets/images/package.json
deleted file mode 100644
index 0a5693e4e..000000000
--- a/src/assets/images/package.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "dependencies": {
- "moving-average": "^1.0.0"
- }
-}
diff --git a/src/index.html b/src/index.html
index 3fd52acf4..8ed070741 100644
--- a/src/index.html
+++ b/src/index.html
@@ -1,14 +1,13 @@
<!DOCTYPE html>
<html>
- <head>
- <title>Mozilla Mixed Reality Social Client Lobby</title>
+
+<head>
<meta charset="utf-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
+ <title>moz://a duck</title>
+</head>
+
+<body>
+ <div id="home-root" class="home-root"></div>
+</body>
- <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
- </head>
- <body>
- <div id="root"></div>
- </body>
</html>
diff --git a/src/index.js b/src/index.js
index 6cc93b05f..ec700f2f2 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,116 +1,6 @@
import React from "react";
import ReactDOM from "react-dom";
-import { JanusSession, JanusPluginHandle } from "minijanus";
-
-import "material-design-lite";
-import "material-design-lite/material.css";
-import "./assets/stylesheets/index.scss";
-import "webrtc-adapter";
-
+import HomeRoot from "./react-components/home-root";
import registerTelemetry from "./telemetry";
-const publicRooms = [1, 2, 3, 4, 5];
-
-registerTelemetry();
-
-class Lobby extends React.Component {
- constructor() {
- super();
- this.state = { rooms: [] };
-
- this.onWebsocketOpen = this.onWebsocketOpen.bind(this);
- this.onWebsocketMessage = this.onWebsocketMessage.bind(this);
- this.updateRooms = this.updateRooms.bind(this);
- }
-
- componentDidMount() {
- this.ws = new WebSocket(process.env.JANUS_SERVER, "janus-protocol");
- this.session = new JanusSession(this.ws.send.bind(this.ws));
- this.ws.addEventListener("open", this.onWebsocketOpen);
- this.ws.addEventListener("message", this.onWebsocketMessage);
- }
-
- componentWillUnmount() {
- clearInterval(this.pollRoomsIntervalHandle);
- this.ws.removeEventListener("open", this.onWebsocketOpen);
- this.ws.removeEventListener("message", this.onWebsocketMessage);
- }
-
- onWebsocketOpen() {
- this.session
- .create()
- .then(() => {
- this.handle = new JanusPluginHandle(this.session);
- return this.handle.attach("janus.plugin.sfu").then(this.updateRooms);
- })
- .then(() => {
- this.pollRoomsIntervalHandle = setInterval(this.updateRooms, 10000);
- });
- }
-
- updateRooms() {
- return this.fetchRooms().then(rooms => this.setState({ rooms }));
- }
-
- fetchRooms() {
- return this.handle.sendMessage({ kind: "listusers" }).then(signal => {
- const usersByRoom = signal.plugindata.data.response.users;
- return publicRooms.map(id => ({
- id,
- limit: 12,
- users: usersByRoom[id] || []
- }));
- });
- }
-
- onWebsocketMessage(event) {
- this.session.receive(JSON.parse(event.data));
- }
-
- render() {
- return (
- <div className="overlay">
- <RoomList rooms={this.state.rooms} />
- </div>
- );
- }
-}
-
-const RoomListItem = ({ room }) => {
- return (
- <li className="room-item mdl-list__item mdl-list__item--two-line">
- <a href={`room.html?room=${room.id}`}>
- <span className="mdl-list__item-primary-content">
- <i className="material-icons mdl-list__item-icon">room</i>
- <span>Meeting room {room.id}</span>
- <span className="mdl-list__item-sub-title">
- {room.users.length}/{room.limit}
- </span>
- </span>
- </a>
- </li>
- );
-};
-
-const RoomList = ({ rooms }) => {
- const roomId =
- publicRooms.length + 1 + Math.floor(Math.random() * (Number.MAX_SAFE_INTEGER - publicRooms.length + 1));
-
- return (
- <div className="mdl-card mdl-shadow--2dp panel">
- <ul className="mdl-list scroll">{rooms.map(room => <RoomListItem key={room.id} room={room} />)}</ul>
- <ul className="mdl-list">
- <li className="mdl-list__item room-item">
- <a href={`room.html?room=${roomId}`}>
- <span className="mdl-list__item-primary-content">
- <i className="material-icons mdl-list__item-icon">add</i>
- New Meeting Room
- </span>
- </a>
- </li>
- </ul>
- </div>
- );
-};
-
-ReactDOM.render(<Lobby />, document.getElementById("root"));
+ReactDOM.render(<HomeRoot />, document.getElementById("home-root"));
diff --git a/src/react-components/home-root.js b/src/react-components/home-root.js
new file mode 100644
index 000000000..90c314494
--- /dev/null
+++ b/src/react-components/home-root.js
@@ -0,0 +1,29 @@
+import React, { Component } from "react";
+import PropTypes from "prop-types";
+import classNames from "classnames";
+import queryString from "query-string";
+import { IntlProvider, FormattedMessage, addLocaleData } from "react-intl";
+import en from "react-intl/locale-data/en";
+
+const navigatorLang = (navigator.languages && navigator.languages[0]) || navigator.language || navigator.userLanguage;
+
+const lang = navigatorLang.toLowerCase().split(/[_-]+/)[0];
+
+import localeData from "../assets/translations.data.json";
+addLocaleData([...en]);
+
+const messages = localeData[lang] || localeData.en;
+
+class HomeRoot extends Component {
+ static propTypes = {};
+
+ state = {};
+
+ componentDidMount() {}
+
+ render() {
+ return <div>Hello</div>;
+ }
+}
+
+export default HomeRoot;
diff --git a/src/telemetry.js b/src/telemetry.js
index 9e42e76a0..2a738593e 100644
--- a/src/telemetry.js
+++ b/src/telemetry.js
@@ -1,7 +1,5 @@
import Raven from "raven-js";
export default function registerTelemetry() {
- Raven.config(
- "https://f571beaf5cee4e3085e0bf436f3eb158@sentry.io/256771"
- ).install();
+ Raven.config("https://f571beaf5cee4e3085e0bf436f3eb158@sentry.io/256771").install();
}
--
GitLab