зеркало из https://github.com/mozilla/hubs.git
Moved to JanusAdapter, removed easyrtc and server, updated build system.
This commit is contained in:
Robert Long
Родитель
d16f238375
Коммит
187ab29c8f
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"presets": ["env"]
|
||||
}
|
||||
|
|
@ -58,4 +58,4 @@ typings/
|
|||
.env
|
||||
|
||||
# webpack bundle
|
||||
public/app.bundle.js
|
||||
public/app.bundle.js*
|
||||
24
package.json
24
package.json
|
|
@ -4,28 +4,26 @@
|
|||
"main": "src/index.js",
|
||||
"license": "MPL-2.0",
|
||||
"scripts": {
|
||||
"start": "cross-env NODE_ENV=production node ./server/index.js",
|
||||
"dev": "cross-env NGROK=true node ./server/index.js",
|
||||
"build": "webpack"
|
||||
"dev": "webpack-dev-server --open --config webpack.dev.js",
|
||||
"build": "webpack --config webpack.prod.js"
|
||||
},
|
||||
"dependencies": {
|
||||
"aframe-input-mapping-component": "https://github.com/fernandojsg/aframe-input-mapping-component",
|
||||
"aframe-teleport-controls": "https://github.com/netpro2k/aframe-teleport-controls#feature/teleport-origin",
|
||||
"easyrtc": "^1.1.0",
|
||||
"express": "^4.15.5",
|
||||
"networked-aframe": "https://github.com/netpro2k/networked-aframe#feature/positional-audio",
|
||||
"pleasejs": "^0.4.2",
|
||||
"socket.io": "^2.0.3"
|
||||
"naf-janus-adapter": "^0.1.1",
|
||||
"networked-aframe": "https://github.com/netpro2k/networked-aframe#feature/register-adapter",
|
||||
"pleasejs": "^0.4.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"cross-env": "^5.0.5",
|
||||
"babel-core": "^6.26.0",
|
||||
"babel-loader": "^7.1.2",
|
||||
"babel-minify-webpack-plugin": "^0.2.0",
|
||||
"babel-preset-env": "^1.6.1",
|
||||
"eslint-config-prettier": "^2.6.0",
|
||||
"eslint-plugin-prettier": "^2.3.1",
|
||||
"ngrok": "^2.2.22",
|
||||
"prettier": "^1.7.0",
|
||||
"qrcode-terminal": "^0.11.0",
|
||||
"webpack": "^3.6.0",
|
||||
"webpack-dev-middleware": "^1.12.0",
|
||||
"webpack-hot-middleware": "^2.19.1"
|
||||
"webpack-dev-server": "^2.9.3",
|
||||
"webpack-merge": "^4.1.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,33 +1,30 @@
|
|||
<html>
|
||||
|
||||
<head>
|
||||
<title>A-Frame Social VR Demo</title>
|
||||
<script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.5/socket.io.min.js"></script>
|
||||
|
||||
<script src="easyrtc/easyrtc.js"></script>
|
||||
<script src="./app.bundle.js"></script>
|
||||
<title>A-Frame Social VR Demo</title>
|
||||
<script src="https://aframe.io/releases/0.7.0/aframe.min.js"></script>
|
||||
<script src="./app.bundle.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a-scene
|
||||
networked-scene="adapter: easyrtc;
|
||||
<a-scene networked-scene="adapter: janus;
|
||||
room: 2;
|
||||
serverURL: wss://quander.me:8989;
|
||||
audio: true;
|
||||
debug: true;
|
||||
connectOnLoad: false"
|
||||
mute-mic="eventSrc: a-scene; toggleEvents: action_mute">
|
||||
<a-assets>
|
||||
<img id="grid" src="assets/grid.png" crossorigin="anonymous">
|
||||
<img id="sky" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg" crossorigin="anonymous" />
|
||||
connectOnLoad: false" mute-mic="eventSrc: a-scene; toggleEvents: action_mute">
|
||||
<a-assets>
|
||||
<img id="grid" src="assets/grid.png" crossorigin="anonymous">
|
||||
<img id="sky" src="https://cdn.aframe.io/360-image-gallery-boilerplate/img/sechelt.jpg" crossorigin="anonymous" />
|
||||
|
||||
<a-asset-item id="dodec-avatar-head" src="assets/avatars/dodec/DodecAvatarGLTF/DodecAvatar_Head.gltf"></a-asset-item>
|
||||
<a-asset-item id="dodec-avatar-head" src="assets/avatars/dodec/DodecAvatarGLTF/DodecAvatar_Head.gltf"></a-asset-item>
|
||||
|
||||
<a-asset-item id="watch-model" src="assets/hud/watch.gltf"></a-asset-item>
|
||||
<a-asset-item id="watch-model" src="assets/hud/watch.gltf"></a-asset-item>
|
||||
|
||||
<a-asset-item id="rock-island" src="assets/environments/RockIslandTest/RockIsland.gltf"></a-asset-item>
|
||||
<a-asset-item id="rock-island" src="assets/environments/RockIslandTest/RockIsland.gltf"></a-asset-item>
|
||||
|
||||
<!-- Templates -->
|
||||
<script id="head-template" type="text/html">
|
||||
<!-- Templates -->
|
||||
<script id="head-template" type="text/html">
|
||||
<a-entity
|
||||
class="head"
|
||||
gltf-model="#dodec-avatar-head"
|
||||
|
|
@ -39,11 +36,11 @@
|
|||
></a-entity>
|
||||
</script>
|
||||
|
||||
<script id="hand-template" type="text/html">
|
||||
<script id="hand-template" type="text/html">
|
||||
<a-box class="hand" scale="0.2 0.1 0.3"></a-box>
|
||||
</script>
|
||||
|
||||
<script id="nametag-template" type="text/html">
|
||||
<script id="nametag-template" type="text/html">
|
||||
<a-entity
|
||||
class="nametag"
|
||||
nametag-transform="follow: .head"
|
||||
|
|
@ -51,60 +48,33 @@
|
|||
position="0 2.5 0"
|
||||
scale="6 6 6"></a-entity>
|
||||
</script>
|
||||
</a-assets>
|
||||
</a-assets>
|
||||
|
||||
<a-entity
|
||||
id="player-rig"
|
||||
networked
|
||||
wasd-controls
|
||||
snap-rotation="pivotSrc: #head">
|
||||
<a-sphere scale="0.1 0.1 0.1"></a-sphere>
|
||||
<a-entity
|
||||
id="head"
|
||||
camera="userHeight: 1.6"
|
||||
look-controls
|
||||
networked="template:#head-template;showLocalTemplate:false;"></a-entity>
|
||||
<a-entity id="player-rig" networked wasd-controls snap-rotation="pivotSrc: #head">
|
||||
<a-sphere scale="0.1 0.1 0.1"></a-sphere>
|
||||
<a-entity id="head" camera="userHeight: 1.6" look-controls networked="template:#head-template;showLocalTemplate:false;"></a-entity>
|
||||
|
||||
<a-entity
|
||||
id="nametag"
|
||||
networked="template:#nametag-template;showLocalTemplate:false;"></a-entity>
|
||||
<a-entity id="nametag" networked="template:#nametag-template;showLocalTemplate:false;"></a-entity>
|
||||
|
||||
<a-entity
|
||||
id="left-hand"
|
||||
hand-controls="left"
|
||||
|
||||
axis-dpad="centerZone: 1"
|
||||
teleport-controls="cameraRig: #player-rig; teleportOrigin: #head; button: action_teleport_"
|
||||
networked="template:#hand-template;showLocalTemplate:false;"
|
||||
>
|
||||
<a-entity id="watch" gltf-model="assets/hud/watch.gltf" position="0 0.0015 0.147" rotation="3.5 0 0">
|
||||
<a-circle
|
||||
mute-state-indicator
|
||||
scale-audio-feedback="analyserSrc: #head; minScale: 0.035; maxScale: 0.08;"
|
||||
position="0 0.023 0"
|
||||
rotation="-90 0 0"
|
||||
scale="0.04 0.04 0.04"
|
||||
material="color:#d8eece;shader:flat">
|
||||
</a-circle>
|
||||
<a-entity id="left-hand" hand-controls="left" axis-dpad="centerZone: 1" teleport-controls="cameraRig: #player-rig; teleportOrigin: #head; button: action_teleport_"
|
||||
networked="template:#hand-template;showLocalTemplate:false;">
|
||||
<a-entity id="watch" gltf-model="assets/hud/watch.gltf" position="0 0.0015 0.147" rotation="3.5 0 0">
|
||||
<a-circle mute-state-indicator scale-audio-feedback="analyserSrc: #head; minScale: 0.035; maxScale: 0.08;" position="0 0.023 0"
|
||||
rotation="-90 0 0" scale="0.04 0.04 0.04" material="color:#d8eece;shader:flat">
|
||||
</a-circle>
|
||||
</a-entity>
|
||||
</a-entity>
|
||||
|
||||
<a-entity id="right-hand" hand-controls="right" axis-dpad teleport-controls="cameraRig: #player-rig; teleportOrigin: #head; hitEntity: #telepor-indicator; button: action_teleport_;"
|
||||
networked="template:#hand-template;showLocalTemplate:false;"></a-entity>
|
||||
</a-entity>
|
||||
|
||||
<a-entity
|
||||
id="right-hand"
|
||||
|
||||
hand-controls="right"
|
||||
|
||||
axis-dpad
|
||||
teleport-controls="cameraRig: #player-rig; teleportOrigin: #head; hitEntity: #telepor-indicator; button: action_teleport_;"
|
||||
networked="template:#hand-template;showLocalTemplate:false;"></a-entity>
|
||||
</a-entity>
|
||||
|
||||
<a-entity class="head" gltf-model="#rock-island" position="0 0 0">
|
||||
<a-sky color="#DDFFD9"></a-sky>
|
||||
</a-scene>
|
||||
<script>
|
||||
document.querySelector('a-scene').addEventListener('loaded', onSceneLoad)
|
||||
</script>
|
||||
<a-entity class="head" gltf-model="#rock-island" position="0 0 0">
|
||||
<a-sky color="#DDFFD9"></a-sky>
|
||||
</a-scene>
|
||||
<script>
|
||||
document.querySelector('a-scene').addEventListener('loaded', onSceneLoad)
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
149
server/index.js
149
server/index.js
|
|
@ -1,149 +0,0 @@
|
|||
var http = require("http");
|
||||
var express = require("express");
|
||||
var socketIo = require("socket.io");
|
||||
var easyrtc = require("easyrtc");
|
||||
var path = require("path");
|
||||
|
||||
var port = process.env.PORT || 8080;
|
||||
process.title = "social-vr-demo-server";
|
||||
|
||||
var app = express();
|
||||
app.use(express.static(path.resolve(__dirname, "..", "public")));
|
||||
|
||||
// Run webpack-dev middleware when developing.
|
||||
if (process.env.NODE_ENV !== "production") {
|
||||
var webpack = require("webpack");
|
||||
var webpackDevMiddleware = require("webpack-dev-middleware");
|
||||
|
||||
var config = require("../webpack.config.dev.js");
|
||||
var compiler = webpack(config);
|
||||
|
||||
app.use(
|
||||
webpackDevMiddleware(compiler, {
|
||||
publicPath: config.output.publicPath,
|
||||
watchOptions: {
|
||||
aggregateTimeout: 300,
|
||||
poll: true
|
||||
}
|
||||
})
|
||||
);
|
||||
|
||||
app.use(require("webpack-hot-middleware")(compiler));
|
||||
}
|
||||
|
||||
// Start Express http server
|
||||
var webServer = http.createServer(app).listen(port);
|
||||
|
||||
// Start Socket.io so it attaches itself to Express server
|
||||
var socketServer = socketIo.listen(webServer, { "log level": 1 });
|
||||
|
||||
var myIceServers = [
|
||||
{ url: "stun:stun.l.google.com:19302" },
|
||||
{ url: "stun:stun1.l.google.com:19302" },
|
||||
{ url: "stun:stun2.l.google.com:19302" },
|
||||
{ url: "stun:stun3.l.google.com:19302" }
|
||||
// {
|
||||
// "url":"turn:[ADDRESS]:[PORT]",
|
||||
// "username":"[USERNAME]",
|
||||
// "credential":"[CREDENTIAL]"
|
||||
// },
|
||||
// {
|
||||
// "url":"turn:[ADDRESS]:[PORT][?transport=tcp]",
|
||||
// "username":"[USERNAME]",
|
||||
// "credential":"[CREDENTIAL]"
|
||||
// }
|
||||
];
|
||||
easyrtc.setOption("appIceServers", myIceServers);
|
||||
easyrtc.setOption("logLevel", "debug");
|
||||
easyrtc.setOption("demosEnable", false);
|
||||
|
||||
// Overriding the default easyrtcAuth listener, only so we can directly access its callback
|
||||
easyrtc.events.on("easyrtcAuth", function(
|
||||
socket,
|
||||
easyrtcid,
|
||||
msg,
|
||||
socketCallback,
|
||||
callback
|
||||
) {
|
||||
easyrtc.events.defaultListeners.easyrtcAuth(
|
||||
socket,
|
||||
easyrtcid,
|
||||
msg,
|
||||
socketCallback,
|
||||
function(err, connectionObj) {
|
||||
if (err || !msg.msgData || !msg.msgData.credential || !connectionObj) {
|
||||
callback(err, connectionObj);
|
||||
return;
|
||||
}
|
||||
|
||||
connectionObj.setField("credential", msg.msgData.credential, {
|
||||
isShared: false
|
||||
});
|
||||
|
||||
console.log(
|
||||
"[" + easyrtcid + "] Credential saved!",
|
||||
connectionObj.getFieldValueSync("credential")
|
||||
);
|
||||
|
||||
callback(err, connectionObj);
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
// To test, lets print the credential to the console for every room join!
|
||||
easyrtc.events.on("roomJoin", function(
|
||||
connectionObj,
|
||||
roomName,
|
||||
roomParameter,
|
||||
callback
|
||||
) {
|
||||
console.log(
|
||||
"[" + connectionObj.getEasyrtcid() + "] Credential retrieved!",
|
||||
connectionObj.getFieldValueSync("credential")
|
||||
);
|
||||
easyrtc.events.defaultListeners.roomJoin(
|
||||
connectionObj,
|
||||
roomName,
|
||||
roomParameter,
|
||||
callback
|
||||
);
|
||||
});
|
||||
|
||||
// Start EasyRTC server
|
||||
var rtc = easyrtc.listen(app, socketServer, null, function(err, rtcRef) {
|
||||
console.log("Initiated");
|
||||
|
||||
rtcRef.events.on("roomCreate", function(
|
||||
appObj,
|
||||
creatorConnectionObj,
|
||||
roomName,
|
||||
roomOptions,
|
||||
callback
|
||||
) {
|
||||
console.log("roomCreate fired! Trying to create: " + roomName);
|
||||
|
||||
appObj.events.defaultListeners.roomCreate(
|
||||
appObj,
|
||||
creatorConnectionObj,
|
||||
roomName,
|
||||
roomOptions,
|
||||
callback
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
webServer.listen(port, function() {
|
||||
console.log("listening on http://localhost:" + port);
|
||||
});
|
||||
|
||||
// Expose server to the internet with HTTPS. Useful for testing WebRTC on mobile.
|
||||
if (process.env.NGROK) {
|
||||
var ngrok = require("ngrok");
|
||||
var qrcode = require("qrcode-terminal");
|
||||
|
||||
ngrok.connect(port, function(err, url) {
|
||||
console.log();
|
||||
qrcode.generate(url);
|
||||
console.log("\nHTTPS url availible at: " + url);
|
||||
});
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
import "networked-aframe";
|
||||
import "naf-janus-adapter";
|
||||
import "aframe-teleport-controls";
|
||||
import "aframe-input-mapping-component";
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
const path = require("path");
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
app: path.join(__dirname, "src", "index")
|
||||
},
|
||||
output: {
|
||||
filename: "[name].bundle.js",
|
||||
path: path.resolve(__dirname, "public")
|
||||
},
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /.js$/,
|
||||
include: [path.resolve(__dirname, "src")],
|
||||
exclude: [path.resolve(__dirname, "node_modules")],
|
||||
loader: "babel-loader"
|
||||
}
|
||||
]
|
||||
},
|
||||
resolve: {
|
||||
extensions: [".js"]
|
||||
}
|
||||
};
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
var path = require("path");
|
||||
var webpack = require("webpack");
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
app: ["webpack-hot-middleware/client?reload=true", "./src/index.js"]
|
||||
},
|
||||
devtool: "inline-source-map",
|
||||
plugins: [new webpack.HotModuleReplacementPlugin()],
|
||||
output: {
|
||||
filename: "[name].bundle.js",
|
||||
path: path.resolve(__dirname, "public"),
|
||||
publicPath: "/"
|
||||
}
|
||||
};
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
var path = require("path");
|
||||
var webpack = require("webpack");
|
||||
|
||||
module.exports = {
|
||||
entry: {
|
||||
app: "./src/index.js"
|
||||
},
|
||||
output: {
|
||||
filename: "[name].bundle.js",
|
||||
path: path.resolve(__dirname, "public"),
|
||||
publicPath: "/"
|
||||
}
|
||||
};
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
const path = require("path");
|
||||
const merge = require("webpack-merge");
|
||||
const common = require("./webpack.common");
|
||||
|
||||
module.exports = merge(common, {
|
||||
devtool: "inline-source-map",
|
||||
devServer: {
|
||||
contentBase: path.resolve(__dirname, "public")
|
||||
}
|
||||
});
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
const merge = require("webpack-merge");
|
||||
const MinifyPlugin = require("babel-minify-webpack-plugin");
|
||||
const common = require("./webpack.common");
|
||||
|
||||
module.exports = merge(common, {
|
||||
devtool: "source-map",
|
||||
plugins: [new MinifyPlugin()]
|
||||
});
|
||||
1939
yarn.lock
1939
yarn.lock
Разница между файлами не показана из-за своего большого размера
Загрузить разницу
Загрузка…
Ссылка в новой задаче