server & websocket adress & port added to setting
This commit is contained in:
parent
9a4fcee3dd
commit
adeb02f7ce
@ -1,6 +1,7 @@
|
||||
FROM node:16
|
||||
# Create app directory
|
||||
WORKDIR /usr/src/app
|
||||
ENV WEB_IP "$WEB_ADDRESS_INT"
|
||||
# Install app dependencies
|
||||
# A wildcard is used to ensure both package.json AND package-lock.json are copied
|
||||
# where available (npm@5+)
|
||||
|
18
README.md
18
README.md
@ -49,11 +49,11 @@ docker run -p 3100:3100 -p 8999:8999 --name ntopngglobe -d dergeorg/ntopngglobe
|
||||
```json
|
||||
{
|
||||
"location": {
|
||||
"home": {
|
||||
"lat": 48.1,
|
||||
"lng": 16.3
|
||||
"home": {
|
||||
"lat": 48.1, // must be set to lat of home wan ip --> https://www.maxmind.com/en/locate-my-ip-address
|
||||
"lng": 16.3 // must be set to lng of home wan ip --> https://www.maxmind.com/en/locate-my-ip-address
|
||||
},
|
||||
"precision": 0
|
||||
"precision": 0 // how to round the decimal. 0 is no decimal
|
||||
},
|
||||
"colors": {
|
||||
"loc": {
|
||||
@ -91,8 +91,14 @@ docker run -p 3100:3100 -p 8999:8999 --name ntopngglobe -d dergeorg/ntopngglobe
|
||||
}
|
||||
},
|
||||
"timer": {
|
||||
"del": 30,
|
||||
"refreshTimer": 1
|
||||
"del": 30, // deletes alerts older than 30 minutes
|
||||
"refreshTimer": 1 // 1 --> refresh globe every 1 minute; 0 --> refresh globe on every new Data set
|
||||
},
|
||||
"ips": {
|
||||
"home": "192.168.1.", //Private home adress
|
||||
"loopback": "127.0.0.1",
|
||||
"server": "localhost:3100", //Server adress
|
||||
"serverws": "localhost:8999" //websocket adress
|
||||
}
|
||||
}
|
||||
```
|
||||
|
4
app.js
4
app.js
@ -18,7 +18,9 @@ var usersRouter = require('./routes/users');
|
||||
// view engine setup
|
||||
app.set('views', path.join(__dirname, 'views'));
|
||||
app.set('view engine', 'jade');
|
||||
app.use(cors())
|
||||
app.use(cors({
|
||||
origin: 'globe.dergeorg.at'
|
||||
}))
|
||||
app.use(logger('dev'));
|
||||
app.use(express.json());
|
||||
app.use(express.urlencoded({ extended: false }));
|
||||
|
@ -16,7 +16,7 @@ async function addArc(src, dest, uid, src_name, dest_name){
|
||||
var endLat = undefined;
|
||||
var endLng = undefined;
|
||||
if(!data.arc.some(x => x.src === src && x.dest === dest)) {
|
||||
if (src.includes("192.168.1.") || src.includes("127.0.0.1")) {
|
||||
if (src.includes(settings.ips.home) || src.includes("127.0.0.1")) {
|
||||
startLat = round(settings.location.home.lat, settings.location.precision)
|
||||
startLng = round(settings.location.home.lng, settings.location.precision)
|
||||
} else {
|
||||
|
@ -44,5 +44,11 @@
|
||||
"timer": {
|
||||
"del": 30,
|
||||
"refreshTimer": 1
|
||||
},
|
||||
"ips": {
|
||||
"home": "192.168.1.",
|
||||
"loopback": "127.0.0.1",
|
||||
"server": "localhost:3100",
|
||||
"serverws": "localhost:8999"
|
||||
}
|
||||
}
|
@ -80,77 +80,72 @@
|
||||
item.cli_os + " \nis_srv_vic " + item.is_srv_vic
|
||||
}
|
||||
|
||||
function componentDidMount() {
|
||||
var data = {};
|
||||
if ("WebSocket" in window) {
|
||||
console.log("WebSocket is supported by your Browser!");
|
||||
const ws = new WebSocket('ws://localhost:8999');
|
||||
ws.onopen = function () {
|
||||
// Web Socket is connected, send data using send()
|
||||
console.log("Message is sent...");
|
||||
};
|
||||
ws.onmessage = function (evt) {
|
||||
var received_msg = evt.data;
|
||||
console.log("Message is received...");
|
||||
componentDidMount()
|
||||
};
|
||||
ws.onclose = function () {
|
||||
// websocket is closed.
|
||||
console.log("Connection is closed...");
|
||||
};
|
||||
}else {
|
||||
// The browser doesn't support WebSocket
|
||||
alert("WebSocket NOT supported by your Browser! A left click on the globe will refresh the data");
|
||||
}
|
||||
|
||||
axios.get("http://localhost:3100/display").then(res => {
|
||||
data = res.data;
|
||||
console.log(data)
|
||||
ReactDOM.render(
|
||||
<Globe
|
||||
onGlobeClick={() => {
|
||||
axios.get("http://localhost:3100/display").then(res => {
|
||||
data = res.data;
|
||||
componentDidMount()
|
||||
});
|
||||
}}
|
||||
globeImageUrl="/images/earth-night.jpg"
|
||||
backgroundImageUrl="/images/night-sky.png"
|
||||
backgroundColor={"#000011"}
|
||||
// edges
|
||||
arcsData={data.arc}
|
||||
arcColor={(d) => [d.color[0], d.color[1]]}
|
||||
arcDashLength={data.settings.sizes.globe.arcDashLength}
|
||||
arcAltitudeAutoScale={data.settings.sizes.globe.arcAltitudeAutoScale}
|
||||
arcDashGap={data.settings.sizes.globe.arcDashGap}
|
||||
arcDashInitialGap={data.settings.sizes.globe.arcDashInitialGap}
|
||||
arcDashAnimateTime={data.settings.sizes.globe.arcDashAnimateTime}
|
||||
arcStroke={data.settings.sizes.globe.arcStroke}
|
||||
arcLabel={(d) => generateHoverText(d.txrx)}
|
||||
onArcClick={function (d) {
|
||||
axios.get("http://localhost:3100/alert/" + d.uid).then(res => {
|
||||
const resdata = res.data;
|
||||
alert(generateClickText(resdata))
|
||||
})
|
||||
}}
|
||||
//arcCircularResolution={64}
|
||||
// arcLabel={() => "test"}
|
||||
// labels
|
||||
labelsData={data.loc}
|
||||
labelLat={(d) => d.lat}
|
||||
labelLng={(d) => d.lng}
|
||||
labelText={(d) => d.name}
|
||||
// labelSize={(d) => 0.5 + d.size}
|
||||
labelSize={0}
|
||||
labelDotRadius={0.4}
|
||||
// labelDotRadius={(d) => 0.5 + d.size}
|
||||
labelColor={(d) => d.color}
|
||||
labelResolution={2}
|
||||
enablePointerInteraction={true}
|
||||
/>,
|
||||
document.getElementById('globeViz')
|
||||
);
|
||||
}).catch(err => alert(err))
|
||||
function componentDidMount() {
|
||||
axios.get('/conf/settings.json').then(res => {
|
||||
const settings = res.data;
|
||||
var data = {};
|
||||
if ("WebSocket" in window) {
|
||||
console.log("WebSocket is supported by your Browser!");
|
||||
const ws = new WebSocket('ws://'+settings.ips.server);
|
||||
ws.onmessage = function (evt) {
|
||||
var received_msg = evt.data;
|
||||
componentDidMount()
|
||||
};
|
||||
}else {
|
||||
// The browser doesn't support WebSocket
|
||||
alert("WebSocket NOT supported by your Browser! A left click on the globe will refresh the data");
|
||||
}
|
||||
|
||||
axios.get("http://"+settings.ips.server+"/display").then(res => {
|
||||
data = res.data;
|
||||
console.log(data)
|
||||
ReactDOM.render(
|
||||
<Globe
|
||||
onGlobeClick={() => {
|
||||
axios.get("http://"+settings.ips.server+"/display").then(res => {
|
||||
data = res.data;
|
||||
componentDidMount()
|
||||
});
|
||||
}}
|
||||
globeImageUrl="/images/earth-night.jpg"
|
||||
backgroundImageUrl="/images/night-sky.png"
|
||||
backgroundColor={"#000011"}
|
||||
// edges
|
||||
arcsData={data.arc}
|
||||
arcColor={(d) => [d.color[0], d.color[1]]}
|
||||
arcDashLength={data.settings.sizes.globe.arcDashLength}
|
||||
arcAltitudeAutoScale={data.settings.sizes.globe.arcAltitudeAutoScale}
|
||||
arcDashGap={data.settings.sizes.globe.arcDashGap}
|
||||
arcDashInitialGap={data.settings.sizes.globe.arcDashInitialGap}
|
||||
arcDashAnimateTime={data.settings.sizes.globe.arcDashAnimateTime}
|
||||
arcStroke={data.settings.sizes.globe.arcStroke}
|
||||
arcLabel={(d) => generateHoverText(d.txrx)}
|
||||
onArcClick={function (d) {
|
||||
axios.get("http://"+settings.ips.server+"/alert/" + d.uid).then(res => {
|
||||
const resdata = res.data;
|
||||
alert(generateClickText(resdata))
|
||||
})
|
||||
}}
|
||||
//arcCircularResolution={64}
|
||||
// arcLabel={() => "test"}
|
||||
// labels
|
||||
labelsData={data.loc}
|
||||
labelLat={(d) => d.lat}
|
||||
labelLng={(d) => d.lng}
|
||||
labelText={(d) => d.name}
|
||||
// labelSize={(d) => 0.5 + d.size}
|
||||
labelSize={0}
|
||||
labelDotRadius={0.4}
|
||||
// labelDotRadius={(d) => 0.5 + d.size}
|
||||
labelColor={(d) => d.color}
|
||||
labelResolution={2}
|
||||
enablePointerInteraction={true}
|
||||
/>,
|
||||
document.getElementById('globeViz')
|
||||
);
|
||||
}).catch(err => alert(err))
|
||||
})
|
||||
}
|
||||
|
||||
componentDidMount()
|
||||
|
Loading…
x
Reference in New Issue
Block a user