1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 |
|
10 | import { each } from '@lumino/algorithm';
|
11 | import { h, VirtualDOM } from '@lumino/virtualdom';
|
12 |
|
13 |
|
14 |
|
15 |
|
16 |
|
17 |
|
18 | const DRAG_THRESHOLD = 5;
|
19 |
|
20 |
|
21 |
|
22 | const DRAG_IMAGE_CLASS = 'jp-dragImage';
|
23 |
|
24 |
|
25 |
|
26 | const SINGLE_DRAG_IMAGE_CLASS = 'jp-dragImage-singlePrompt';
|
27 |
|
28 |
|
29 |
|
30 | const CELL_DRAG_CONTENT_CLASS = 'jp-dragImage-content';
|
31 |
|
32 |
|
33 |
|
34 | const CELL_DRAG_PROMPT_CLASS = 'jp-dragImage-prompt';
|
35 |
|
36 |
|
37 |
|
38 | const CELL_DRAG_MULTIPLE_BACK = 'jp-dragImage-multipleBack';
|
39 | export var CellDragUtils;
|
40 | (function (CellDragUtils) {
|
41 | |
42 |
|
43 |
|
44 |
|
45 |
|
46 |
|
47 |
|
48 |
|
49 |
|
50 |
|
51 |
|
52 |
|
53 |
|
54 | function findCell(node, cells, isCellNode) {
|
55 | let cellIndex = -1;
|
56 | while (node && node.parentElement) {
|
57 | if (isCellNode(node)) {
|
58 | each(cells, (cell, index) => {
|
59 | if (cell.node === node) {
|
60 | cellIndex = index;
|
61 | return false;
|
62 | }
|
63 | });
|
64 | break;
|
65 | }
|
66 | node = node.parentElement;
|
67 | }
|
68 | return cellIndex;
|
69 | }
|
70 | CellDragUtils.findCell = findCell;
|
71 | |
72 |
|
73 |
|
74 |
|
75 |
|
76 |
|
77 | function detectTargetArea(cell, target) {
|
78 | let targetArea;
|
79 | if (cell) {
|
80 | if (cell.editorWidget.node.contains(target)) {
|
81 | targetArea = 'input';
|
82 | }
|
83 | else if (cell.promptNode.contains(target)) {
|
84 | targetArea = 'prompt';
|
85 | }
|
86 | else {
|
87 | targetArea = 'cell';
|
88 | }
|
89 | }
|
90 | else {
|
91 | targetArea = 'unknown';
|
92 | }
|
93 | return targetArea;
|
94 | }
|
95 | CellDragUtils.detectTargetArea = detectTargetArea;
|
96 | |
97 |
|
98 |
|
99 |
|
100 |
|
101 |
|
102 |
|
103 |
|
104 |
|
105 | function shouldStartDrag(prevX, prevY, nextX, nextY) {
|
106 | const dx = Math.abs(nextX - prevX);
|
107 | const dy = Math.abs(nextY - prevY);
|
108 | return dx >= DRAG_THRESHOLD || dy >= DRAG_THRESHOLD;
|
109 | }
|
110 | CellDragUtils.shouldStartDrag = shouldStartDrag;
|
111 | |
112 |
|
113 |
|
114 |
|
115 |
|
116 |
|
117 | function createCellDragImage(activeCell, selectedCells) {
|
118 | const count = selectedCells.length;
|
119 | let promptNumber;
|
120 | if (activeCell.model.type === 'code') {
|
121 | const executionCount = activeCell.model
|
122 | .executionCount;
|
123 | promptNumber = ' ';
|
124 | if (executionCount) {
|
125 | promptNumber = executionCount.toString();
|
126 | }
|
127 | }
|
128 | else {
|
129 | promptNumber = '';
|
130 | }
|
131 | const cellContent = activeCell.model.value.text.split('\n')[0].slice(0, 26);
|
132 | if (count > 1) {
|
133 | if (promptNumber !== '') {
|
134 | return VirtualDOM.realize(h.div(h.div({ className: DRAG_IMAGE_CLASS }, h.span({ className: CELL_DRAG_PROMPT_CLASS }, '[' + promptNumber + ']:'), h.span({ className: CELL_DRAG_CONTENT_CLASS }, cellContent)), h.div({ className: CELL_DRAG_MULTIPLE_BACK }, '')));
|
135 | }
|
136 | else {
|
137 | return VirtualDOM.realize(h.div(h.div({ className: DRAG_IMAGE_CLASS }, h.span({ className: CELL_DRAG_PROMPT_CLASS }), h.span({ className: CELL_DRAG_CONTENT_CLASS }, cellContent)), h.div({ className: CELL_DRAG_MULTIPLE_BACK }, '')));
|
138 | }
|
139 | }
|
140 | else {
|
141 | if (promptNumber !== '') {
|
142 | return VirtualDOM.realize(h.div(h.div({ className: `${DRAG_IMAGE_CLASS} ${SINGLE_DRAG_IMAGE_CLASS}` }, h.span({ className: CELL_DRAG_PROMPT_CLASS }, '[' + promptNumber + ']:'), h.span({ className: CELL_DRAG_CONTENT_CLASS }, cellContent))));
|
143 | }
|
144 | else {
|
145 | return VirtualDOM.realize(h.div(h.div({ className: `${DRAG_IMAGE_CLASS} ${SINGLE_DRAG_IMAGE_CLASS}` }, h.span({ className: CELL_DRAG_PROMPT_CLASS }), h.span({ className: CELL_DRAG_CONTENT_CLASS }, cellContent))));
|
146 | }
|
147 | }
|
148 | }
|
149 | CellDragUtils.createCellDragImage = createCellDragImage;
|
150 | })(CellDragUtils || (CellDragUtils = {}));
|
151 |
|
\ | No newline at end of file |