Skip to content

Commit cec89ca

Browse files
Add sort of folders
1 parent c08ca9f commit cec89ca

12 files changed

Lines changed: 76 additions & 30 deletions

File tree

example-project/data/model.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
/**
2+
* Created by bliashenko on 2018-06-02.
3+
*/

src/public/dist/bundle.js

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -80672,12 +80672,17 @@ module.exports = function(originalModule) {
8067280672
"use strict";
8067380673

8067480674

80675+
var FILE_NODE_TYPE = 'file';
80676+
var DIR_NODE_TYPE = 'directory';
80677+
8067580678
var SOCKET_EVENT_TYPE = {
8067680679
SYNC_SOURCE_FILES: 'sync-source-files'
8067780680
};
8067880681

8067980682
module.exports = {
80680-
SOCKET_EVENT_TYPE: SOCKET_EVENT_TYPE
80683+
SOCKET_EVENT_TYPE: SOCKET_EVENT_TYPE,
80684+
FILE_NODE_TYPE: FILE_NODE_TYPE,
80685+
DIR_NODE_TYPE: DIR_NODE_TYPE
8068180686
};
8068280687

8068380688
/***/ }),
@@ -81374,15 +81379,26 @@ function recalculateFilesLayout() {
8137481379
while (1) {
8137581380
switch (_context.prev = _context.next) {
8137681381
case 0:
81377-
_context.next = 2;
81382+
_context.prev = 0;
81383+
_context.next = 3;
8137881384
return (0, _effects.put)((0, _actions.calcFilesTreeLayoutNodes)());
8137981385

81380-
case 2:
81386+
case 3:
81387+
_context.next = 9;
81388+
break;
81389+
81390+
case 5:
81391+
_context.prev = 5;
81392+
_context.t0 = _context['catch'](0);
81393+
_context.next = 9;
81394+
return (0, _effects.put)({ type: 'ERROR' });
81395+
81396+
case 9:
8138181397
case 'end':
8138281398
return _context.stop();
8138381399
}
8138481400
}
81385-
}, _marked, this);
81401+
}, _marked, this, [[0, 5]]);
8138681402
}
8138781403

8138881404
//TODO: think to move out from data-bus folder
@@ -81722,8 +81738,6 @@ var _drawHelpers = __webpack_require__(/*! ./drawHelpers */ "./js/components/tre
8172281738

8172381739
var _drawHelpers2 = __webpack_require__(/*! ../SourceTree/drawHelpers */ "./js/components/tree-diagram/component/SourceTree/drawHelpers.js");
8172481740

81725-
var _constants = __webpack_require__(/*! ../../store/constants */ "./js/components/tree-diagram/store/constants.js");
81726-
8172781741
var _treeLayout = __webpack_require__(/*! ../../../../utils/treeLayout */ "./js/utils/treeLayout.js");
8172881742

8172981743
var _SvgSet = __webpack_require__(/*! ../utils/SvgSet */ "./js/components/tree-diagram/component/utils/SvgSet.js");
@@ -82299,7 +82313,7 @@ var _SvgDraw = __webpack_require__(/*! ../utils/SvgDraw */ "./js/components/tree
8229982313

8230082314
var _drawHelpers = __webpack_require__(/*! ./drawHelpers */ "./js/components/tree-diagram/component/SourceTree/drawHelpers.js");
8230182315

82302-
var _constants = __webpack_require__(/*! ../../store/constants */ "./js/components/tree-diagram/store/constants.js");
82316+
var _constants = __webpack_require__(/*! ../../../../../../shared/constants */ "../shared/constants.js");
8230382317

8230482318
var _SvgSet = __webpack_require__(/*! ../utils/SvgSet */ "./js/components/tree-diagram/component/utils/SvgSet.js");
8230582319

@@ -82601,7 +82615,7 @@ var drawFolderIcon = exports.drawFolderIcon = function drawFolderIcon(draw, shif
8260182615

8260282616
var polyline = null;
8260382617
if (closed) {
82604-
polyline = draw.polyline([folderIconPoint.x - 1, folderIconPoint.y + 16, folderIconPoint.x + 15, folderIconPoint.y + 16]);
82618+
polyline = draw.polyline([folderIconPoint.x - 1, folderIconPoint.y + 16, folderIconPoint.x + 16, folderIconPoint.y + 16, folderIconPoint.x + 16, folderIconPoint.y + 14]);
8260582619

8260682620
var color = !disabled ? '#BFBFBF' : '#ccc';
8260782621
polyline.fill('none').stroke({
@@ -83012,9 +83026,6 @@ Object.defineProperty(exports, "__esModule", {
8301283026
var PURPLE_COLOR = exports.PURPLE_COLOR = '#ff18a6';
8301383027
var BLUE_COLOR = exports.BLUE_COLOR = '#1890ff';
8301483028

83015-
var FILE_NODE_TYPE = exports.FILE_NODE_TYPE = 'file';
83016-
var DIR_NODE_TYPE = exports.DIR_NODE_TYPE = 'directory';
83017-
8301883029
var SYMBOL_WIDTH = exports.SYMBOL_WIDTH = 8.4;
8301983030

8302083031
var LAYOUT_CONFIG = exports.LAYOUT_CONFIG = {
@@ -83254,14 +83265,16 @@ var _d3Flextree = __webpack_require__(/*! d3-flextree */ "../../node_modules/d3-
8325483265

8325583266
var d3FlexTree = _interopRequireWildcard(_d3Flextree);
8325683267

83257-
var _constants = __webpack_require__(/*! ../components/tree-diagram/store/constants */ "./js/components/tree-diagram/store/constants.js");
83268+
var _constants = __webpack_require__(/*! ../../../shared/constants */ "../shared/constants.js");
83269+
83270+
var _constants2 = __webpack_require__(/*! ../components/tree-diagram/store/constants */ "./js/components/tree-diagram/store/constants.js");
8325883271

8325983272
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) newObj[key] = obj[key]; } } newObj.default = obj; return newObj; } }
8326083273

8326183274
var getTreeLayout = exports.getTreeLayout = function getTreeLayout(treeData, _ref) {
8326283275
var includeFileChildren = _ref.includeFileChildren,
8326383276
_ref$config = _ref.config,
83264-
config = _ref$config === undefined ? _constants.LAYOUT_CONFIG : _ref$config,
83277+
config = _ref$config === undefined ? _constants2.LAYOUT_CONFIG : _ref$config,
8326583278
closedFolders = _ref.closedFolders;
8326683279

8326783280
var layoutStructure = d3FlexTree.flextree({

src/public/dist/bundle.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

src/public/js/components/data-bus/store/sagas.js

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,11 @@ import { ACTIONS as SWITCHES_ACTIONS } from '../../controls/ViewSwitches/store/c
44
import { calcFilesTreeLayoutNodes } from './actions';
55

66
function* recalculateFilesLayout() {
7-
yield put(calcFilesTreeLayoutNodes());
7+
try {
8+
yield put(calcFilesTreeLayoutNodes());
9+
} catch (e) {
10+
yield put({type: 'ERROR'});
11+
}
812
}
913

1014
//TODO: think to move out from data-bus folder

src/public/js/components/tree-diagram/component/CodeCrumbsTree/CodeCrumbsTree.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import {
88
} from './drawHelpers';
99
import { drawFileText, drawFileIcon } from '../SourceTree/drawHelpers';
1010

11-
import { FILE_NODE_TYPE, DIR_NODE_TYPE } from '../../store/constants';
1211
import { getFilesList } from '../../../../utils/treeLayout';
1312
import { createSet } from '../utils/SvgSet';
1413

src/public/js/components/tree-diagram/component/SourceTree/SourceTree.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,10 @@ import {
99
drawFolderIcon
1010
} from './drawHelpers';
1111

12-
import { FILE_NODE_TYPE, DIR_NODE_TYPE } from '../../store/constants';
12+
import {
13+
FILE_NODE_TYPE,
14+
DIR_NODE_TYPE
15+
} from '../../../../../../shared/constants';
1316
import { createSet } from '../utils/SvgSet';
1417

1518
class SourceTree extends React.Component {

src/public/js/components/tree-diagram/component/SourceTree/drawHelpers.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -148,8 +148,10 @@ export const drawFolderIcon = (
148148
polyline = draw.polyline([
149149
folderIconPoint.x - 1,
150150
folderIconPoint.y + 16,
151-
folderIconPoint.x + 15,
152-
folderIconPoint.y + 16
151+
folderIconPoint.x + 16,
152+
folderIconPoint.y + 16,
153+
folderIconPoint.x + 16,
154+
folderIconPoint.y + 14,
153155
]);
154156

155157
const color = !disabled ? '#BFBFBF' : '#ccc';

src/public/js/components/tree-diagram/store/constants.js

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
export const PURPLE_COLOR = '#ff18a6';
22
export const BLUE_COLOR = '#1890ff';
33

4-
export const FILE_NODE_TYPE = 'file';
5-
export const DIR_NODE_TYPE = 'directory';
6-
74
export const SYMBOL_WIDTH = 8.4;
85

96
export const LAYOUT_CONFIG = {

src/public/js/utils/treeLayout.js

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,6 @@
11
import * as d3FlexTree from 'd3-flextree';
2-
import {
3-
FILE_NODE_TYPE,
4-
DIR_NODE_TYPE,
5-
LAYOUT_CONFIG
6-
} from '../components/tree-diagram/store/constants';
2+
import { FILE_NODE_TYPE, DIR_NODE_TYPE } from '../../../shared/constants';
3+
import { LAYOUT_CONFIG } from '../components/tree-diagram/store/constants';
74

85
export const getTreeLayout = (
96
treeData,

src/server/project-source-watcher.js

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
const directoryTree = require('directory-tree');
22
const codecrumbs = require('./codecrumbs/codecrumbs');
33
const file = require('./utils/file');
4+
const treeTraversal = require('../shared/utils/tree').traversal;
5+
const DIR_NODE_TYPE = require('../shared/constants').DIR_NODE_TYPE;
46
const madge = require('madge');
57
const chokidar = require('chokidar');
68
const debounce = require('lodash.debounce');
@@ -16,6 +18,22 @@ const getDirFiles = projectDir => {
1618
}
1719
);
1820

21+
treeTraversal(filesTree, node => {
22+
if (node.type === DIR_NODE_TYPE && node.children) {
23+
node.children = node.children.sort((a, b) => {
24+
if (a.type !== DIR_NODE_TYPE && b.type === DIR_NODE_TYPE) {
25+
return 1;
26+
}
27+
28+
if (a.type === DIR_NODE_TYPE && b.type !== DIR_NODE_TYPE) {
29+
return -1;
30+
}
31+
32+
return 0;
33+
});
34+
}
35+
});
36+
1937
return { list: filesList, tree: filesTree };
2038
};
2139

0 commit comments

Comments
 (0)