Skip to content

Commit d657a08

Browse files
first
1 parent 357cf19 commit d657a08

10 files changed

Lines changed: 148 additions & 39 deletions

File tree

.npmignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,3 @@
1+
.idea
12
example-project
23
docs

cli/index.cli.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ if (!program.entry && !program.dir) {
2626
process.exit();
2727
}
2828

29+
// TODO: refactor as in index.dev
2930
apiServer.run({
3031
entryFile: program.entry,
3132
projectDir: program.dir,

index.dev.js

Lines changed: 3 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,9 @@
1-
const httpServer = require('http-server');
2-
const apiServer = require('./src/server');
1+
const server = require('./src/server');
32

43
const projectDir = `example-project/src`;
54
const entryFile = `example-project/src/index.js`;
65
const webpackConfigFile = `example-project/webpack.config.js`;
76
const clientPort = 2018;
87

9-
apiServer.run({ projectDir, entryFile, webpackConfigFile, clientPort });
10-
httpServer
11-
.createServer({ root: './src/public/dist/local', cache: -1 })
12-
.listen(clientPort, '127.0.0.1', () => {
13-
console.log(`"Codecrumbs" is served on http://localhost:${clientPort}`);
14-
});
8+
const isDev = true;
9+
server.setup({ projectDir, entryFile, webpackConfigFile, clientPort }, isDev);

package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,7 @@
3838
"lodash": "^4.17.10",
3939
"lodash.debounce": "^4.0.8",
4040
"madge": "^3.3.0",
41+
"portscanner": "^2.2.0",
4142
"react": "^16.7.0",
4243
"react-dom": "^16.7.0",
4344
"react-draggable": "^3.0.5",

src/public/dist/local/bundle/main.bundle.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46889,7 +46889,7 @@ module.exports = function(originalModule) {
4688946889
/*! exports provided: name, version, author, license, repository, scripts, bin, dependencies, devDependencies, nodemonConfig, default */
4689046890
/***/ (function(module) {
4689146891

46892-
module.exports = {"name":"codecrumbs","version":"1.0.12-alpha","author":"Bohdan Liashenko","license":"MIT","repository":{"type":"git","url":"https://github.com/Bogdan-Lyashenko/codecrumbs.git"},"scripts":{"start":"yarn client-dev & yarn server-dev","start:demo":"node ./index.dev.js","client-dev":"cd src/public && webpack --config webpack.dev.js --progress --colors --watch --env dev","server-dev":"nodemon ./index.dev.js","server-debug":"nodemon --inspect ./index.dev.js","build":"cd src/public && webpack --config webpack.prod.js --progress --colors","start:standalone":"cd src/public/dist/standalone && http-server","pretty":"prettier --write \"./src/public/js/**/*.js\""},"bin":{"codecrumbs":"./cli/index.cli.js"},"dependencies":{"@babel/parser":"^7.1.2","@babel/polyfill":"^7.0.0","@babel/traverse":"^7.1.0","antd":"^3.9.2","chokidar":"^2.0.3","classnames":"^2.2.6","colors":"^1.3.2","commander":"^2.19.0","copy-text-to-clipboard":"^1.0.4","d3-flextree":"^2.1.1","directory-tree":"^2.1.0","file-saver":"^2.0.0","http-server":"^0.11.1","js2flowchart":"^1.1.7","lodash":"^4.17.10","lodash.debounce":"^4.0.8","madge":"^3.3.0","react":"^16.7.0","react-dom":"^16.7.0","react-draggable":"^3.0.5","react-redux":"^5.0.7","react-syntax-highlighter":"8.0.1","redux":"^4.0.0","redux-persist":"^5.10.0","redux-saga":"^0.16.0","redux-thunk":"^2.2.0","reselect":"^4.0.0","websocket":"^1.0.26"},"devDependencies":{"@babel/core":"^7.1.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/preset-env":"^7.1.0","@babel/preset-react":"^7.0.0","babel-loader":"^8.0.4","babel-plugin-import":"^1.9.1","css-loader":"^0.28.11","node-sass":"^4.9.3","nodemon":"^1.18.7","prettier":"^1.14.0","sass-loader":"^7.1.0","style-loader":"^0.21.0","webpack":"^4.20.2","webpack-bundle-analyzer":"^3.0.3","webpack-cli":"^3.1.2","webpack-merge":"^4.1.5"},"nodemonConfig":{"ignore":["src/public/**/*.*"],"delay":"2500"}};
46892+
module.exports = {"name":"codecrumbs","version":"1.0.12-alpha","author":"Bohdan Liashenko","license":"BSD-3-Clause","repository":{"type":"git","url":"https://github.com/Bogdan-Lyashenko/codecrumbs.git"},"scripts":{"start":"yarn client-dev & yarn server-dev","start:demo":"node ./index.dev.js","client-dev":"cd src/public && webpack --config webpack.dev.js --progress --colors --watch --env dev","server-dev":"nodemon ./index.dev.js","server-debug":"nodemon --inspect ./index.dev.js","build":"cd src/public && webpack --config webpack.prod.js --progress --colors","start:standalone":"cd src/public/dist/standalone && http-server","pretty":"prettier --write \"./src/public/js/**/*.js\""},"bin":{"codecrumbs":"./cli/index.cli.js"},"dependencies":{"@babel/parser":"^7.1.2","@babel/polyfill":"^7.0.0","@babel/traverse":"^7.1.0","antd":"^3.9.2","chokidar":"^2.0.3","classnames":"^2.2.6","colors":"^1.3.2","commander":"^2.19.0","copy-text-to-clipboard":"^1.0.4","d3-flextree":"^2.1.1","directory-tree":"^2.1.0","file-saver":"^2.0.0","http-server":"^0.11.1","js2flowchart":"^1.1.7","lodash":"^4.17.10","lodash.debounce":"^4.0.8","madge":"^3.3.0","portscanner":"^2.2.0","react":"^16.7.0","react-dom":"^16.7.0","react-draggable":"^3.0.5","react-redux":"^5.0.7","react-syntax-highlighter":"8.0.1","redux":"^4.0.0","redux-persist":"^5.10.0","redux-saga":"^0.16.0","redux-thunk":"^2.2.0","reselect":"^4.0.0","websocket":"^1.0.26"},"devDependencies":{"@babel/core":"^7.1.2","@babel/plugin-syntax-dynamic-import":"^7.2.0","@babel/preset-env":"^7.1.0","@babel/preset-react":"^7.0.0","babel-loader":"^8.0.4","babel-plugin-import":"^1.9.1","css-loader":"^0.28.11","node-sass":"^4.9.3","nodemon":"^1.18.7","prettier":"^1.14.0","sass-loader":"^7.1.0","style-loader":"^0.21.0","webpack":"^4.20.2","webpack-bundle-analyzer":"^3.0.3","webpack-cli":"^3.1.2","webpack-merge":"^4.1.5"},"nodemonConfig":{"ignore":["src/public/**/*.*"],"delay":"2500"}};
4689346893

4689446894
/***/ }),
4689546895

src/public/js/core/dataBus/connection.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,15 @@ const { SERVER_PORT } = require('../../../../shared/constants');
22

33
export const createConnection = (onMessage, route = `ws://127.0.0.1:${SERVER_PORT}/`) => {
44
const ws = new WebSocket(route);
5+
6+
ws.onopen = () => {
7+
// connection is opened and ready to use
8+
};
9+
10+
ws.onerror = error => {
11+
// an error occurred when sending/receiving data
12+
};
13+
514
ws.onmessage = event => {
615
onMessage(JSON.parse(event.data));
716
};

src/public/js/public-path.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
11
const isLocalHost = location.hostname === 'localhost' || location.hostname === '127.0.0.1';
2+
3+
// for testing purposes
24
__webpack_public_path__ = isLocalHost
35
? '/bundle/'
4-
: '/codecrumbs/src/public/dist/standalone/bundle/';
6+
: '/bundle/';

src/server/index.js

Lines changed: 42 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,51 @@
1-
const WebSocketServer = require('websocket').server;
2-
const http = require('http');
3-
const api = require('./api/');
4-
const projectSourceWatcher = require('./project-source/');
5-
const { SERVER_PORT, SOCKET_EVENT_TYPE } = require('../shared/constants');
1+
const portscanner = require('portscanner');
2+
const httpServer = require('http-server');
63

7-
const run = ({ projectDir, entryFile, webpackConfigFile, clientPort }) => {
8-
const httpServer = http.createServer(api.handleRequests(projectDir, clientPort));
9-
httpServer.listen(SERVER_PORT, () => {
10-
console.log(`API server is listening: ${SERVER_PORT}.`);
11-
});
4+
const { SERVER_PORT } = require('../shared/constants');
5+
const mediator = require('./mediator');
6+
const sourceServer = require('./instance');
7+
8+
const PORT_IN_USE = 'open';
9+
const HOST = '127.0.0.1';
1210

13-
const webSocketServer = new WebSocketServer({ httpServer });
14-
webSocketServer.on('request', request => {
15-
const connection = request.accept(null, request.origin);
11+
const setup = ({ projectDir, entryFile, webpackConfigFile, clientPort }, isDev) => {
12+
Promise.all([
13+
portscanner.checkPortStatus(clientPort, HOST).then(status => {
14+
if (status !== PORT_IN_USE) {
15+
/**
16+
* socket+http server for data exchange between browser and source servers
17+
*/
18+
mediator.run({ port: SERVER_PORT });
19+
}
20+
}),
21+
portscanner.checkPortStatus(clientPort, HOST).then(status => {
22+
if (status !== PORT_IN_USE) {
23+
/**
24+
* http server to host "codecrumbs" client source for browser
25+
*/
26+
httpServer
27+
.createServer({ root: './src/public/dist/local', cache: isDev ? -1 : 3600 })
28+
.listen(clientPort, HOST, () => {
29+
console.log(`"Codecrumbs" client is served on http://localhost:${clientPort}`);
30+
});
31+
}
32+
})
33+
]).then(() => {
34+
//sourceServer instances are same socket "client" as browser client
35+
//to communicate they need to send message to all, and filter by type
1636

17-
projectSourceWatcher.subscribeOnChange(projectDir, entryFile, webpackConfigFile, {
18-
onInit: data =>
19-
connection.sendUTF(
20-
JSON.stringify({
21-
type: SOCKET_EVENT_TYPE.INIT_SOURCE_FILES_SYNC,
22-
data
23-
})
24-
),
25-
onChange: data =>
26-
connection.sendUTF(
27-
JSON.stringify({
28-
type: SOCKET_EVENT_TYPE.UPDATE_SOURCE_FILE_SYNC,
29-
data
30-
})
31-
)
37+
/**
38+
* source server instance (one per source code project)
39+
*/
40+
sourceServer.run(`${HOST}:${SERVER_PORT}`, {
41+
projectDir,
42+
entryFile,
43+
webpackConfigFile,
44+
clientPort
3245
});
3346
});
3447
};
3548

3649
module.exports = {
37-
run
50+
setup
3851
};

src/server/instance.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
// test windows https://github.com/theturtle32/WebSocket-Node#note-for-windows-users
2+
const WebSocketClient = require('websocket').client;
3+
const api = require('./api/');
4+
const projectSourceWatcher = require('./project-source/');
5+
const { SOCKET_EVENT_TYPE } = require('../shared/constants');
6+
7+
// instances should run on many ports but then send data to mediator and mediator to client
8+
const run = (mediatorEndPoint, { projectDir, entryFile, webpackConfigFile, clientPort }) => {
9+
const webSocketClient = new WebSocketClient();
10+
11+
webSocketClient.on('connectFailed', error => {
12+
console.log('Connect Error: ' + error);
13+
});
14+
15+
webSocketClient.on('connect', connection => {
16+
console.log(`Source server created for: ${projectDir}, entry point: ${entryFile}`);
17+
18+
connection.on('message', message => {
19+
if (message.type === 'utf8') {
20+
//console.log('mediator received msg', message.utf8Data)
21+
}
22+
});
23+
24+
projectSourceWatcher.subscribeOnChange(projectDir, entryFile, webpackConfigFile, {
25+
onInit: data =>
26+
connection.sendUTF(
27+
JSON.stringify({
28+
type: SOCKET_EVENT_TYPE.INIT_SOURCE_FILES_SYNC,
29+
data
30+
})
31+
),
32+
onChange: data =>
33+
connection.sendUTF(
34+
JSON.stringify({
35+
type: SOCKET_EVENT_TYPE.UPDATE_SOURCE_FILE_SYNC,
36+
data
37+
})
38+
)
39+
});
40+
});
41+
42+
webSocketClient.connect(`ws://${mediatorEndPoint}/`);
43+
};
44+
45+
module.exports = {
46+
run
47+
};

src/server/mediator.js

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,40 @@
1+
const WebSocketServer = require('websocket').server;
2+
const http = require('http');
3+
4+
// instances should run on many ports but then send data to mediator and mediator to client
5+
const run = ({ port }) => {
6+
const httpServer = http.createServer((request, response) => {
7+
console.log('http call to mediator', request.url);
8+
});
9+
10+
httpServer.listen(port, () => {
11+
console.log(`Mediator server is listening: ${port}.`);
12+
});
13+
14+
const webSocketServer = new WebSocketServer({ httpServer });
15+
webSocketServer.on('request', request => {
16+
const connection = request.accept(null, request.origin);
17+
18+
console.log('some client connects to mediator');
19+
20+
connection.on('message', message => {
21+
if (message.type === 'utf8') {
22+
//console.log('mediator received msg', message.utf8Data)
23+
}
24+
});
25+
26+
connection.on('close', connection => {
27+
// close user connection
28+
});
29+
30+
connection.sendUTF(
31+
JSON.stringify({
32+
type: 'connected!'
33+
})
34+
);
35+
});
36+
};
37+
38+
module.exports = {
39+
run
40+
};

0 commit comments

Comments
 (0)