- {this.collapsed() ? null : this.renderNodes()}
+ return
+ { this.renderTitleLine() }
+
+ { this.clear() }
+
+ { this.collapsed() ? null : this.renderNodes() }
@@ -178,10 +228,8 @@ export class TreeNode extends React.Component
{
return null
}
- const style = {
- color: '#333',
- }
- return ({this.props.treeNode.leafes().length} nodes)
+ const messages = this.props.treeNode.leafes().map(leaf => leaf.messages).reduce((a, b) => a + b)
+ return ({this.props.treeNode.leafes().length} nodes, {messages} messages)
}
private subnodesStyle(): React.CSSProperties {
@@ -190,3 +238,5 @@ export class TreeNode extends React.Component {
}
}
}
+
+export default withTheme()(TreeNode)
diff --git a/app/src/components/helper/isElementInViewport.ts b/app/src/components/helper/isElementInViewport.ts
new file mode 100644
index 0000000..5def19a
--- /dev/null
+++ b/app/src/components/helper/isElementInViewport.ts
@@ -0,0 +1,12 @@
+declare const window: any
+declare const document: any
+
+export function isElementInViewport(el: any) {
+ const rect = el.getBoundingClientRect()
+ return (
+ rect.top >= 0 &&
+ rect.left >= 0 &&
+ rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
+ rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */
+ )
+}
diff --git a/app/webpack.config.js b/app/webpack.config.js
index 8d577c1..450109e 100644
--- a/app/webpack.config.js
+++ b/app/webpack.config.js
@@ -1,3 +1,5 @@
+var LiveReloadPlugin = require('webpack-livereload-plugin');
+
module.exports = {
entry: "./src/index.tsx",
output: {
@@ -30,6 +32,10 @@ module.exports = {
]
},
+ plugins: [
+ new LiveReloadPlugin({})
+ ],
+
// When importing a module whose path matches one of the following, just
// assume a corresponding global variable exists and use that instead.
// This is important because it allows us to avoid bundling all of our
diff --git a/backend/src/index.ts b/backend/src/index.ts
index 95f1979..6561da6 100644
--- a/backend/src/index.ts
+++ b/backend/src/index.ts
@@ -1,10 +1,10 @@
+import * as socketIO from 'socket.io'
+const http = require('http')
+
import { TopicProperties, Tree, TreeNodeFactory } from './Model'
import { MqttSource, DataSource } from './DataSource'
-import * as socketIO from 'socket.io'
-
-const http = require('http')
-const options = { url: 'mqtt://nodered' }
+const options = { url: 'mqtt://test.mosquitto.org' }
const dataSource = new MqttSource()
const a: any[] = []
@@ -23,7 +23,9 @@ server.listen(3000)
const state = dataSource.connect(options)
dataSource.onMessage((topic: string, payload: Buffer) => {
let buffer = payload
- a.push({ topic, payload: buffer.toString('base64') })
+ if (a.length < 30) {
+ a.push({ topic, payload: buffer.toString('base64') })
+ }
if (buffer.length > 10000) {
buffer = buffer.slice(0, 10000)
}
diff --git a/electron.js b/electron.js
index 68cbedc..e1a4d18 100644
--- a/electron.js
+++ b/electron.js
@@ -7,7 +7,13 @@ let mainWindow
function createWindow () {
// Create the browser window.
- mainWindow = new BrowserWindow({width: 1024, height: 600})
+ mainWindow = new BrowserWindow({
+ width: 1024,
+ height: 600,
+ webPreferences: {
+ nodeIntegration: true
+ }
+ })
// and load the index.html of the app.
mainWindow.loadFile('app/index.html')
diff --git a/icon.xcf b/icon.xcf
new file mode 100644
index 0000000..be4682b
Binary files /dev/null and b/icon.xcf differ
diff --git a/tslint.json b/tslint.json
index 1f942fb..283120c 100644
--- a/tslint.json
+++ b/tslint.json
@@ -5,6 +5,7 @@
"max-line-length": [true, 200],
"member-access": true,
"no-else-after-return": false,
- "align": false
+ "align": false,
+ "variable-name": false
}
}