@lvce-editor/title-bar-worker 2.16.0 → 2.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/titleBarWorkerMain.js +735 -747
- package/package.json +1 -1
|
@@ -1149,10 +1149,11 @@ const {
|
|
|
1149
1149
|
set: set$3,
|
|
1150
1150
|
getCommandIds,
|
|
1151
1151
|
registerCommands,
|
|
1152
|
-
wrapCommand
|
|
1152
|
+
wrapCommand,
|
|
1153
|
+
wrapGetter
|
|
1153
1154
|
} = create$2();
|
|
1154
1155
|
|
|
1155
|
-
const create3 = (id, uri, x, y, width, height, platform, controlsOverlayEnabled, titleBarStyleCustom) => {
|
|
1156
|
+
const create3 = (id, uri, x, y, width, height, platform, controlsOverlayEnabled, titleBarStyleCustom, assetDir) => {
|
|
1156
1157
|
const titleBarButtons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
1157
1158
|
const state = {
|
|
1158
1159
|
...createDefaultState(),
|
|
@@ -1175,10 +1176,10 @@ const create3 = (id, uri, x, y, width, height, platform, controlsOverlayEnabled,
|
|
|
1175
1176
|
platform,
|
|
1176
1177
|
controlsOverlayEnabled,
|
|
1177
1178
|
titleBarStyleCustom,
|
|
1178
|
-
titleBarButtons
|
|
1179
|
+
titleBarButtons,
|
|
1180
|
+
assetDir
|
|
1179
1181
|
};
|
|
1180
1182
|
set$3(id, state, state);
|
|
1181
|
-
return state;
|
|
1182
1183
|
};
|
|
1183
1184
|
|
|
1184
1185
|
const RenderEntries = 1;
|
|
@@ -1189,12 +1190,10 @@ const isEqual$3 = (oldState, newState) => {
|
|
|
1189
1190
|
return oldState.titleBarEntries === newState.titleBarEntries && oldState.width === newState.width && oldState.focusedIndex === newState.focusedIndex && oldState.isMenuOpen === newState.isMenuOpen;
|
|
1190
1191
|
};
|
|
1191
1192
|
|
|
1192
|
-
const diffType$2 = RenderFocusedIndex;
|
|
1193
1193
|
const isEqual$2 = (oldState, newState) => {
|
|
1194
1194
|
return oldState.focusedIndex === newState.focusedIndex && oldState.isMenuOpen === newState.isMenuOpen;
|
|
1195
1195
|
};
|
|
1196
1196
|
|
|
1197
|
-
const diffType$1 = RenderMenus;
|
|
1198
1197
|
const isEqual$1 = (oldState, newState) => {
|
|
1199
1198
|
return oldState.menus === newState.menus;
|
|
1200
1199
|
};
|
|
@@ -1221,13 +1220,12 @@ const diff2 = uid => {
|
|
|
1221
1220
|
return diff(oldState, newState);
|
|
1222
1221
|
};
|
|
1223
1222
|
|
|
1224
|
-
const diffType = RenderEntries;
|
|
1225
1223
|
const isEqual = (oldState, newState) => {
|
|
1226
1224
|
return oldState.titleBarEntries === newState.titleBarEntries && oldState.width === newState.width && oldState.focusedIndex === newState.focusedIndex && oldState.isMenuOpen === newState.isMenuOpen && oldState.assetDir === newState.assetDir && oldState.titleBarIconEnabled === newState.titleBarIconEnabled && oldState.title === newState.title && oldState.titleBarTitleEnabled === newState.titleBarTitleEnabled && oldState.platform === newState.platform && oldState.controlsOverlayEnabled === newState.controlsOverlayEnabled && oldState.titleBarStyleCustom === newState.titleBarStyleCustom && oldState.titleBarButtonsEnabled === newState.titleBarButtonsEnabled && oldState.titleBarButtons === newState.titleBarButtons;
|
|
1227
1225
|
};
|
|
1228
1226
|
|
|
1229
1227
|
const modules = [isEqual, isEqual$2, isEqual$1];
|
|
1230
|
-
const numbers = [
|
|
1228
|
+
const numbers = [RenderEntries, RenderFocusedIndex, RenderMenus];
|
|
1231
1229
|
|
|
1232
1230
|
const diff3 = uid => {
|
|
1233
1231
|
const {
|
|
@@ -1262,229 +1260,498 @@ const Button = 'event.button';
|
|
|
1262
1260
|
const ClientX = 'event.clientX';
|
|
1263
1261
|
const ClientY = 'event.clientY';
|
|
1264
1262
|
|
|
1265
|
-
const
|
|
1266
|
-
const
|
|
1267
|
-
const
|
|
1268
|
-
const
|
|
1269
|
-
const
|
|
1270
|
-
const
|
|
1271
|
-
const
|
|
1272
|
-
const
|
|
1273
|
-
|
|
1274
|
-
const
|
|
1275
|
-
const
|
|
1276
|
-
|
|
1277
|
-
const
|
|
1278
|
-
|
|
1279
|
-
const
|
|
1280
|
-
const
|
|
1281
|
-
|
|
1282
|
-
const
|
|
1283
|
-
|
|
1284
|
-
|
|
1285
|
-
|
|
1286
|
-
const
|
|
1287
|
-
|
|
1288
|
-
|
|
1289
|
-
|
|
1290
|
-
const
|
|
1291
|
-
|
|
1292
|
-
|
|
1293
|
-
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
const
|
|
1299
|
-
|
|
1300
|
-
const
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1314
|
-
|
|
1315
|
-
|
|
1316
|
-
|
|
1317
|
-
|
|
1318
|
-
|
|
1319
|
-
|
|
1320
|
-
|
|
1321
|
-
|
|
1322
|
-
|
|
1323
|
-
|
|
1324
|
-
|
|
1325
|
-
|
|
1326
|
-
|
|
1327
|
-
|
|
1328
|
-
|
|
1329
|
-
}, {
|
|
1330
|
-
key: Escape$2,
|
|
1331
|
-
command: 'TitleBar.handleKeyEscape',
|
|
1332
|
-
when: FocusTitleBarMenuBar
|
|
1333
|
-
}];
|
|
1334
|
-
};
|
|
1335
|
-
|
|
1336
|
-
/**
|
|
1337
|
-
* @enum {string}
|
|
1338
|
-
*/
|
|
1339
|
-
const UiStrings$1 = {
|
|
1340
|
-
Copy: 'Copy',
|
|
1341
|
-
CopyLineDown: 'Copy Line Down',
|
|
1342
|
-
CopyLineUp: 'Copy Line Up',
|
|
1343
|
-
Cut: 'Cut',
|
|
1344
|
-
MoveLineDown: 'Move Line Down',
|
|
1345
|
-
MoveLineUp: 'Move Line Up',
|
|
1346
|
-
Paste: 'Paste',
|
|
1347
|
-
Redo: 'Redo',
|
|
1348
|
-
SelectAll: 'Select All',
|
|
1349
|
-
ToggleBlockComment: 'Toggle Block Comment',
|
|
1350
|
-
ToggleLineComment: 'Toggle Line Comment',
|
|
1351
|
-
Undo: 'Undo'};
|
|
1352
|
-
const cut = () => {
|
|
1353
|
-
return i18nString(UiStrings$1.Cut);
|
|
1354
|
-
};
|
|
1355
|
-
const copy = () => {
|
|
1356
|
-
return i18nString(UiStrings$1.Copy);
|
|
1357
|
-
};
|
|
1358
|
-
const paste = () => {
|
|
1359
|
-
return i18nString(UiStrings$1.Paste);
|
|
1360
|
-
};
|
|
1361
|
-
const undo = () => {
|
|
1362
|
-
return i18nString(UiStrings$1.Undo);
|
|
1363
|
-
};
|
|
1364
|
-
const redo = () => {
|
|
1365
|
-
return i18nString(UiStrings$1.Redo);
|
|
1366
|
-
};
|
|
1367
|
-
const toggleLineComment = () => {
|
|
1368
|
-
return i18nString(UiStrings$1.ToggleLineComment);
|
|
1369
|
-
};
|
|
1370
|
-
const toggleBlockComment = () => {
|
|
1371
|
-
return i18nString(UiStrings$1.ToggleBlockComment);
|
|
1372
|
-
};
|
|
1373
|
-
const selectAll = () => {
|
|
1374
|
-
return i18nString(UiStrings$1.SelectAll);
|
|
1375
|
-
};
|
|
1376
|
-
const copyLineUp = () => {
|
|
1377
|
-
return i18nString(UiStrings$1.CopyLineUp);
|
|
1378
|
-
};
|
|
1379
|
-
const copyLineDown = () => {
|
|
1380
|
-
return i18nString(UiStrings$1.CopyLineDown);
|
|
1381
|
-
};
|
|
1382
|
-
const moveLineUp = () => {
|
|
1383
|
-
return i18nString(UiStrings$1.MoveLineUp);
|
|
1384
|
-
};
|
|
1385
|
-
const moveLineDown = () => {
|
|
1386
|
-
return i18nString(UiStrings$1.MoveLineDown);
|
|
1387
|
-
};
|
|
1263
|
+
const Backspace$1 = 1;
|
|
1264
|
+
const Tab$1 = 2;
|
|
1265
|
+
const Enter$1 = 3;
|
|
1266
|
+
const Escape$1 = 8;
|
|
1267
|
+
const Space$1 = 9;
|
|
1268
|
+
const PageUp$1 = 10;
|
|
1269
|
+
const PageDown$1 = 11;
|
|
1270
|
+
const End$1 = 255;
|
|
1271
|
+
const Home$1 = 12;
|
|
1272
|
+
const LeftArrow$1 = 13;
|
|
1273
|
+
const UpArrow$1 = 14;
|
|
1274
|
+
const RightArrow$1 = 15;
|
|
1275
|
+
const DownArrow$1 = 16;
|
|
1276
|
+
const Insert$1 = 17;
|
|
1277
|
+
const Delete$1 = 18;
|
|
1278
|
+
const Digit0$1 = 19;
|
|
1279
|
+
const Digit1$1 = 20;
|
|
1280
|
+
const Digit2$1 = 21;
|
|
1281
|
+
const Digit3$1 = 22;
|
|
1282
|
+
const Digit4$1 = 23;
|
|
1283
|
+
const Digit5$1 = 24;
|
|
1284
|
+
const Digit6$1 = 25;
|
|
1285
|
+
const Digit7$1 = 26;
|
|
1286
|
+
const Digit8$1 = 27;
|
|
1287
|
+
const Digit9$1 = 28;
|
|
1288
|
+
const KeyA$1 = 29;
|
|
1289
|
+
const KeyB$1 = 30;
|
|
1290
|
+
const KeyC$1 = 31;
|
|
1291
|
+
const KeyD$1 = 32;
|
|
1292
|
+
const KeyE$1 = 33;
|
|
1293
|
+
const KeyF$1 = 34;
|
|
1294
|
+
const KeyG$1 = 35;
|
|
1295
|
+
const KeyH$1 = 36;
|
|
1296
|
+
const KeyI$1 = 37;
|
|
1297
|
+
const KeyJ$1 = 38;
|
|
1298
|
+
const KeyK$1 = 39;
|
|
1299
|
+
const KeyL$1 = 40;
|
|
1300
|
+
const KeyM$1 = 41;
|
|
1301
|
+
const KeyN$1 = 42;
|
|
1302
|
+
const KeyO$1 = 43;
|
|
1303
|
+
const KeyP$1 = 44;
|
|
1304
|
+
const KeyQ$1 = 45;
|
|
1305
|
+
const KeyR$1 = 46;
|
|
1306
|
+
const KeyS$1 = 47;
|
|
1307
|
+
const KeyT$1 = 48;
|
|
1308
|
+
const KeyU$1 = 49;
|
|
1309
|
+
const KeyV$1 = 50;
|
|
1310
|
+
const KeyW$1 = 51;
|
|
1311
|
+
const KeyX$1 = 52;
|
|
1312
|
+
const KeyY$1 = 53;
|
|
1313
|
+
const KeyZ$1 = 54;
|
|
1314
|
+
const F1$1 = 57;
|
|
1315
|
+
const F2$1 = 58;
|
|
1316
|
+
const F3$1 = 59;
|
|
1317
|
+
const F4$1 = 60;
|
|
1318
|
+
const F5$1 = 61;
|
|
1319
|
+
const F6$1 = 62;
|
|
1320
|
+
const Equal$1 = 84;
|
|
1321
|
+
const Comma$1 = 85;
|
|
1322
|
+
const Minus$1 = 86;
|
|
1323
|
+
const Backquote$1 = 89;
|
|
1324
|
+
const Backslash$1 = 91;
|
|
1325
|
+
const Star$1 = 131;
|
|
1326
|
+
const Plus$1 = 132;
|
|
1388
1327
|
|
|
1389
|
-
const
|
|
1390
|
-
const
|
|
1391
|
-
const
|
|
1392
|
-
const
|
|
1393
|
-
const
|
|
1394
|
-
const
|
|
1395
|
-
const
|
|
1396
|
-
const
|
|
1397
|
-
const
|
|
1398
|
-
const
|
|
1328
|
+
const Unknown = 'Unknown';
|
|
1329
|
+
const Backspace = 'Backspace';
|
|
1330
|
+
const Tab = 'Tab';
|
|
1331
|
+
const Enter = 'Enter';
|
|
1332
|
+
const Escape = 'Escape';
|
|
1333
|
+
const Space = 'Space';
|
|
1334
|
+
const PageUp = 'PageUp';
|
|
1335
|
+
const PageDown = 'PageDown';
|
|
1336
|
+
const End = 'End';
|
|
1337
|
+
const Home = 'Home';
|
|
1338
|
+
const LeftArrow = 'LeftArrow';
|
|
1339
|
+
const UpArrow = 'UpArrow';
|
|
1340
|
+
const RightArrow = 'RightArrow';
|
|
1341
|
+
const DownArrow = 'DownArrow';
|
|
1342
|
+
const Insert = 'Insert';
|
|
1343
|
+
const Delete = 'Delete';
|
|
1344
|
+
const Digit0 = '0';
|
|
1345
|
+
const Digit1 = '1';
|
|
1346
|
+
const Digit2 = '2';
|
|
1347
|
+
const Digit3 = '3';
|
|
1348
|
+
const Digit4 = '4';
|
|
1349
|
+
const Digit5 = '5';
|
|
1350
|
+
const Digit6 = '6';
|
|
1351
|
+
const Digit7 = '7';
|
|
1352
|
+
const Digit8 = '8';
|
|
1353
|
+
const Digit9 = '9';
|
|
1354
|
+
const KeyA = 'a';
|
|
1355
|
+
const KeyB = 'b';
|
|
1356
|
+
const KeyC = 'c';
|
|
1357
|
+
const KeyD = 'd';
|
|
1358
|
+
const KeyE = 'e';
|
|
1359
|
+
const KeyF = 'f';
|
|
1360
|
+
const KeyG = 'g';
|
|
1361
|
+
const KeyH = 'h';
|
|
1362
|
+
const KeyI = 'i';
|
|
1363
|
+
const KeyJ = 'j';
|
|
1364
|
+
const KeyK = 'k';
|
|
1365
|
+
const KeyL = 'l';
|
|
1366
|
+
const KeyM = 'm';
|
|
1367
|
+
const KeyN = 'n';
|
|
1368
|
+
const KeyO = 'o';
|
|
1369
|
+
const KeyP = 'p';
|
|
1370
|
+
const KeyQ = 'q';
|
|
1371
|
+
const KeyR = 'r';
|
|
1372
|
+
const KeyS = 's';
|
|
1373
|
+
const KeyT = 't';
|
|
1374
|
+
const KeyU = 'u';
|
|
1375
|
+
const KeyV = 'v';
|
|
1376
|
+
const KeyW = 'w';
|
|
1377
|
+
const KeyX = 'x';
|
|
1378
|
+
const KeyY = 'y';
|
|
1379
|
+
const KeyZ = 'z';
|
|
1380
|
+
const F1 = 'F1';
|
|
1381
|
+
const F2 = 'F2';
|
|
1382
|
+
const F3 = 'F3';
|
|
1383
|
+
const F4 = 'F4';
|
|
1384
|
+
const F5 = 'F5';
|
|
1385
|
+
const F6 = 'F6';
|
|
1386
|
+
const Equal = '=';
|
|
1387
|
+
const Comma = ',';
|
|
1388
|
+
const Minus = 'Minus';
|
|
1389
|
+
const Backquote = 'Backquote';
|
|
1390
|
+
const Backslash = 'Backslash';
|
|
1391
|
+
const Star = '*';
|
|
1392
|
+
const Plus = '+';
|
|
1399
1393
|
|
|
1400
|
-
const
|
|
1401
|
-
|
|
1402
|
-
|
|
1403
|
-
|
|
1404
|
-
|
|
1405
|
-
|
|
1406
|
-
|
|
1407
|
-
|
|
1394
|
+
const getKeyCodeString = keyCode => {
|
|
1395
|
+
switch (keyCode) {
|
|
1396
|
+
case Backspace$1:
|
|
1397
|
+
return Backspace;
|
|
1398
|
+
case Tab$1:
|
|
1399
|
+
return Tab;
|
|
1400
|
+
case Escape$1:
|
|
1401
|
+
return Escape;
|
|
1402
|
+
case Enter$1:
|
|
1403
|
+
return Enter;
|
|
1404
|
+
case Space$1:
|
|
1405
|
+
return Space;
|
|
1406
|
+
case PageUp$1:
|
|
1407
|
+
return PageUp;
|
|
1408
|
+
case PageDown$1:
|
|
1409
|
+
return PageDown;
|
|
1410
|
+
case End$1:
|
|
1411
|
+
return End;
|
|
1412
|
+
case Home$1:
|
|
1413
|
+
return Home;
|
|
1414
|
+
case LeftArrow$1:
|
|
1415
|
+
return LeftArrow;
|
|
1416
|
+
case UpArrow$1:
|
|
1417
|
+
return UpArrow;
|
|
1418
|
+
case RightArrow$1:
|
|
1419
|
+
return RightArrow;
|
|
1420
|
+
case DownArrow$1:
|
|
1421
|
+
return DownArrow;
|
|
1422
|
+
case Insert$1:
|
|
1423
|
+
return Insert;
|
|
1424
|
+
case Delete$1:
|
|
1425
|
+
return Delete;
|
|
1426
|
+
case Digit0$1:
|
|
1427
|
+
return Digit0;
|
|
1428
|
+
case Digit1$1:
|
|
1429
|
+
return Digit1;
|
|
1430
|
+
case Digit2$1:
|
|
1431
|
+
return Digit2;
|
|
1432
|
+
case Digit3$1:
|
|
1433
|
+
return Digit3;
|
|
1434
|
+
case Digit4$1:
|
|
1435
|
+
return Digit4;
|
|
1436
|
+
case Digit5$1:
|
|
1437
|
+
return Digit5;
|
|
1438
|
+
case Digit6$1:
|
|
1439
|
+
return Digit6;
|
|
1440
|
+
case Digit7$1:
|
|
1441
|
+
return Digit7;
|
|
1442
|
+
case Digit8$1:
|
|
1443
|
+
return Digit8;
|
|
1444
|
+
case Digit9$1:
|
|
1445
|
+
return Digit9;
|
|
1446
|
+
case KeyA$1:
|
|
1447
|
+
return KeyA;
|
|
1448
|
+
case KeyB$1:
|
|
1449
|
+
return KeyB;
|
|
1450
|
+
case KeyC$1:
|
|
1451
|
+
return KeyC;
|
|
1452
|
+
case KeyD$1:
|
|
1453
|
+
return KeyD;
|
|
1454
|
+
case KeyE$1:
|
|
1455
|
+
return KeyE;
|
|
1456
|
+
case KeyF$1:
|
|
1457
|
+
return KeyF;
|
|
1458
|
+
case KeyG$1:
|
|
1459
|
+
return KeyG;
|
|
1460
|
+
case KeyH$1:
|
|
1461
|
+
return KeyH;
|
|
1462
|
+
case KeyI$1:
|
|
1463
|
+
return KeyI;
|
|
1464
|
+
case KeyJ$1:
|
|
1465
|
+
return KeyJ;
|
|
1466
|
+
case KeyK$1:
|
|
1467
|
+
return KeyK;
|
|
1468
|
+
case KeyL$1:
|
|
1469
|
+
return KeyL;
|
|
1470
|
+
case KeyM$1:
|
|
1471
|
+
return KeyM;
|
|
1472
|
+
case KeyN$1:
|
|
1473
|
+
return KeyN;
|
|
1474
|
+
case KeyO$1:
|
|
1475
|
+
return KeyO;
|
|
1476
|
+
case KeyP$1:
|
|
1477
|
+
return KeyP;
|
|
1478
|
+
case KeyQ$1:
|
|
1479
|
+
return KeyQ;
|
|
1480
|
+
case KeyR$1:
|
|
1481
|
+
return KeyR;
|
|
1482
|
+
case KeyS$1:
|
|
1483
|
+
return KeyS;
|
|
1484
|
+
case KeyT$1:
|
|
1485
|
+
return KeyT;
|
|
1486
|
+
case KeyU$1:
|
|
1487
|
+
return KeyU;
|
|
1488
|
+
case KeyV$1:
|
|
1489
|
+
return KeyV;
|
|
1490
|
+
case KeyW$1:
|
|
1491
|
+
return KeyW;
|
|
1492
|
+
case KeyX$1:
|
|
1493
|
+
return KeyX;
|
|
1494
|
+
case KeyY$1:
|
|
1495
|
+
return KeyY;
|
|
1496
|
+
case KeyZ$1:
|
|
1497
|
+
return KeyZ;
|
|
1498
|
+
case F1$1:
|
|
1499
|
+
return F1;
|
|
1500
|
+
case F2$1:
|
|
1501
|
+
return F2;
|
|
1502
|
+
case F3$1:
|
|
1503
|
+
return F3;
|
|
1504
|
+
case F4$1:
|
|
1505
|
+
return F4;
|
|
1506
|
+
case F5$1:
|
|
1507
|
+
return F5;
|
|
1508
|
+
case F6$1:
|
|
1509
|
+
return F6;
|
|
1510
|
+
case Backslash$1:
|
|
1511
|
+
return Backslash;
|
|
1512
|
+
case Equal$1:
|
|
1513
|
+
return Equal;
|
|
1514
|
+
case Comma$1:
|
|
1515
|
+
return Comma;
|
|
1516
|
+
case Backquote$1:
|
|
1517
|
+
return Backquote;
|
|
1518
|
+
case Plus$1:
|
|
1519
|
+
return Plus;
|
|
1520
|
+
case Star$1:
|
|
1521
|
+
return Star;
|
|
1522
|
+
case Minus$1:
|
|
1523
|
+
return Minus;
|
|
1524
|
+
default:
|
|
1525
|
+
return Unknown;
|
|
1526
|
+
}
|
|
1527
|
+
};
|
|
1408
1528
|
|
|
1409
|
-
const
|
|
1410
|
-
|
|
1411
|
-
|
|
1412
|
-
|
|
1413
|
-
|
|
1529
|
+
const CtrlCmd = 1 << 11 >>> 0;
|
|
1530
|
+
const Shift = 1 << 10 >>> 0;
|
|
1531
|
+
|
|
1532
|
+
const TitleBar$1 = 15;
|
|
1533
|
+
|
|
1534
|
+
const parseKey = rawKey => {
|
|
1535
|
+
const isCtrl = Boolean(rawKey & CtrlCmd);
|
|
1536
|
+
const isShift = Boolean(rawKey & Shift);
|
|
1537
|
+
const keyCode = rawKey & 0x00_00_00_ff;
|
|
1538
|
+
const key = getKeyCodeString(keyCode);
|
|
1539
|
+
return {
|
|
1540
|
+
key,
|
|
1541
|
+
isCtrl,
|
|
1542
|
+
isShift
|
|
1543
|
+
};
|
|
1414
1544
|
};
|
|
1415
1545
|
|
|
1416
|
-
const
|
|
1417
|
-
const
|
|
1546
|
+
const DebugWorker = 55;
|
|
1547
|
+
const RendererWorker$1 = 1;
|
|
1548
|
+
|
|
1549
|
+
const FocusTitleBarMenuBar = 26;
|
|
1550
|
+
|
|
1551
|
+
const mergeClassNames = (...classNames) => {
|
|
1552
|
+
return classNames.filter(Boolean).join(' ');
|
|
1553
|
+
};
|
|
1554
|
+
|
|
1555
|
+
const px = value => {
|
|
1556
|
+
return `${value}px`;
|
|
1557
|
+
};
|
|
1558
|
+
|
|
1559
|
+
const text = data => {
|
|
1560
|
+
return {
|
|
1561
|
+
type: Text,
|
|
1562
|
+
text: data,
|
|
1563
|
+
childCount: 0
|
|
1564
|
+
};
|
|
1565
|
+
};
|
|
1566
|
+
|
|
1567
|
+
const getKeyBindings$1 = () => {
|
|
1418
1568
|
return [{
|
|
1419
|
-
|
|
1420
|
-
|
|
1421
|
-
|
|
1422
|
-
command: /* TODO */'-1'
|
|
1569
|
+
key: DownArrow$1,
|
|
1570
|
+
command: 'TitleBar.handleKeyArrowDown',
|
|
1571
|
+
when: FocusTitleBarMenuBar
|
|
1423
1572
|
}, {
|
|
1424
|
-
|
|
1425
|
-
|
|
1426
|
-
|
|
1427
|
-
command: /* TODO */'-1'
|
|
1428
|
-
}, menuEntrySeparator, {
|
|
1429
|
-
id: 'cut',
|
|
1430
|
-
label: cut(),
|
|
1431
|
-
flags: None,
|
|
1432
|
-
command: /* Editor.cut */'Editor.cut'
|
|
1573
|
+
key: UpArrow$1,
|
|
1574
|
+
command: 'TitleBar.handleKeyArrowUp',
|
|
1575
|
+
when: FocusTitleBarMenuBar
|
|
1433
1576
|
}, {
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
command: /* Editor.copy */'Editor.copy'
|
|
1577
|
+
key: RightArrow$1,
|
|
1578
|
+
command: 'TitleBar.handleKeyArrowRight',
|
|
1579
|
+
when: FocusTitleBarMenuBar
|
|
1438
1580
|
}, {
|
|
1439
|
-
|
|
1440
|
-
|
|
1441
|
-
|
|
1442
|
-
command: /* Editor.paste */'Editor.paste'
|
|
1443
|
-
}, menuEntrySeparator, {
|
|
1444
|
-
id: 'toggle-line-comment',
|
|
1445
|
-
label: toggleLineComment(),
|
|
1446
|
-
flags: None,
|
|
1447
|
-
command: /* Editor.toggleLineComment */'Editor.toggleLineComment'
|
|
1581
|
+
key: LeftArrow$1,
|
|
1582
|
+
command: 'TitleBar.handleKeyArrowLeft',
|
|
1583
|
+
when: FocusTitleBarMenuBar
|
|
1448
1584
|
}, {
|
|
1449
|
-
|
|
1450
|
-
|
|
1451
|
-
|
|
1452
|
-
|
|
1585
|
+
key: Space$1,
|
|
1586
|
+
command: 'TitleBar.handleKeySpace',
|
|
1587
|
+
when: FocusTitleBarMenuBar
|
|
1588
|
+
}, {
|
|
1589
|
+
key: Home$1,
|
|
1590
|
+
command: 'TitleBar.handleKeyHome',
|
|
1591
|
+
when: FocusTitleBarMenuBar
|
|
1592
|
+
}, {
|
|
1593
|
+
key: End$1,
|
|
1594
|
+
command: 'TitleBar.handleKeyEnd',
|
|
1595
|
+
when: FocusTitleBarMenuBar
|
|
1596
|
+
}, {
|
|
1597
|
+
key: Escape$1,
|
|
1598
|
+
command: 'TitleBar.handleKeyEscape',
|
|
1599
|
+
when: FocusTitleBarMenuBar
|
|
1453
1600
|
}];
|
|
1454
1601
|
};
|
|
1455
1602
|
|
|
1456
|
-
const MenuEntriesEdit = {
|
|
1457
|
-
__proto__: null,
|
|
1458
|
-
getMenuEntries: getMenuEntries$d,
|
|
1459
|
-
id: id$9
|
|
1460
|
-
};
|
|
1461
|
-
|
|
1462
1603
|
/**
|
|
1463
1604
|
* @enum {string}
|
|
1464
1605
|
*/
|
|
1465
|
-
const UiStrings = {
|
|
1466
|
-
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1470
|
-
|
|
1471
|
-
|
|
1472
|
-
|
|
1473
|
-
|
|
1474
|
-
|
|
1475
|
-
|
|
1476
|
-
|
|
1477
|
-
};
|
|
1478
|
-
const
|
|
1479
|
-
return i18nString(UiStrings.
|
|
1480
|
-
};
|
|
1481
|
-
const
|
|
1482
|
-
return i18nString(UiStrings.
|
|
1483
|
-
};
|
|
1484
|
-
const
|
|
1485
|
-
return i18nString(UiStrings.
|
|
1486
|
-
};
|
|
1487
|
-
const
|
|
1606
|
+
const UiStrings$1 = {
|
|
1607
|
+
Copy: 'Copy',
|
|
1608
|
+
CopyLineDown: 'Copy Line Down',
|
|
1609
|
+
CopyLineUp: 'Copy Line Up',
|
|
1610
|
+
Cut: 'Cut',
|
|
1611
|
+
MoveLineDown: 'Move Line Down',
|
|
1612
|
+
MoveLineUp: 'Move Line Up',
|
|
1613
|
+
Paste: 'Paste',
|
|
1614
|
+
Redo: 'Redo',
|
|
1615
|
+
SelectAll: 'Select All',
|
|
1616
|
+
ToggleBlockComment: 'Toggle Block Comment',
|
|
1617
|
+
ToggleLineComment: 'Toggle Line Comment',
|
|
1618
|
+
Undo: 'Undo'};
|
|
1619
|
+
const cut = () => {
|
|
1620
|
+
return i18nString(UiStrings$1.Cut);
|
|
1621
|
+
};
|
|
1622
|
+
const copy = () => {
|
|
1623
|
+
return i18nString(UiStrings$1.Copy);
|
|
1624
|
+
};
|
|
1625
|
+
const paste = () => {
|
|
1626
|
+
return i18nString(UiStrings$1.Paste);
|
|
1627
|
+
};
|
|
1628
|
+
const undo = () => {
|
|
1629
|
+
return i18nString(UiStrings$1.Undo);
|
|
1630
|
+
};
|
|
1631
|
+
const redo = () => {
|
|
1632
|
+
return i18nString(UiStrings$1.Redo);
|
|
1633
|
+
};
|
|
1634
|
+
const toggleLineComment = () => {
|
|
1635
|
+
return i18nString(UiStrings$1.ToggleLineComment);
|
|
1636
|
+
};
|
|
1637
|
+
const toggleBlockComment = () => {
|
|
1638
|
+
return i18nString(UiStrings$1.ToggleBlockComment);
|
|
1639
|
+
};
|
|
1640
|
+
const selectAll = () => {
|
|
1641
|
+
return i18nString(UiStrings$1.SelectAll);
|
|
1642
|
+
};
|
|
1643
|
+
const copyLineUp = () => {
|
|
1644
|
+
return i18nString(UiStrings$1.CopyLineUp);
|
|
1645
|
+
};
|
|
1646
|
+
const copyLineDown = () => {
|
|
1647
|
+
return i18nString(UiStrings$1.CopyLineDown);
|
|
1648
|
+
};
|
|
1649
|
+
const moveLineUp = () => {
|
|
1650
|
+
return i18nString(UiStrings$1.MoveLineUp);
|
|
1651
|
+
};
|
|
1652
|
+
const moveLineDown = () => {
|
|
1653
|
+
return i18nString(UiStrings$1.MoveLineDown);
|
|
1654
|
+
};
|
|
1655
|
+
|
|
1656
|
+
const Edit = 2;
|
|
1657
|
+
const File$1 = 5;
|
|
1658
|
+
const Go = 6;
|
|
1659
|
+
const Help = 7;
|
|
1660
|
+
const OpenRecent = 9;
|
|
1661
|
+
const Run = 10;
|
|
1662
|
+
const Selection = 11;
|
|
1663
|
+
const Terminal = 14;
|
|
1664
|
+
const TitleBar = 15;
|
|
1665
|
+
const View = 16;
|
|
1666
|
+
|
|
1667
|
+
const Separator = 1;
|
|
1668
|
+
const None = 0;
|
|
1669
|
+
const SubMenu = 4;
|
|
1670
|
+
const Checked = 2;
|
|
1671
|
+
const Unchecked = 3;
|
|
1672
|
+
const Disabled = 5;
|
|
1673
|
+
const RestoreFocus = 6;
|
|
1674
|
+
const Ignore = 7;
|
|
1675
|
+
|
|
1676
|
+
const menuEntrySeparator = {
|
|
1677
|
+
id: 'separator',
|
|
1678
|
+
label: '',
|
|
1679
|
+
flags: Separator,
|
|
1680
|
+
command: ''
|
|
1681
|
+
};
|
|
1682
|
+
|
|
1683
|
+
const id$9 = Edit;
|
|
1684
|
+
const getMenuEntries$d = () => {
|
|
1685
|
+
return [{
|
|
1686
|
+
id: 'undo',
|
|
1687
|
+
label: undo(),
|
|
1688
|
+
flags: Disabled,
|
|
1689
|
+
command: /* TODO */'-1'
|
|
1690
|
+
}, {
|
|
1691
|
+
id: 'redo',
|
|
1692
|
+
label: redo(),
|
|
1693
|
+
flags: Disabled,
|
|
1694
|
+
command: /* TODO */'-1'
|
|
1695
|
+
}, menuEntrySeparator, {
|
|
1696
|
+
id: 'cut',
|
|
1697
|
+
label: cut(),
|
|
1698
|
+
flags: None,
|
|
1699
|
+
command: /* Editor.cut */'Editor.cut'
|
|
1700
|
+
}, {
|
|
1701
|
+
id: 'copy',
|
|
1702
|
+
label: copy(),
|
|
1703
|
+
flags: None,
|
|
1704
|
+
command: /* Editor.copy */'Editor.copy'
|
|
1705
|
+
}, {
|
|
1706
|
+
id: 'paste',
|
|
1707
|
+
label: paste(),
|
|
1708
|
+
flags: None,
|
|
1709
|
+
command: /* Editor.paste */'Editor.paste'
|
|
1710
|
+
}, menuEntrySeparator, {
|
|
1711
|
+
id: 'toggle-line-comment',
|
|
1712
|
+
label: toggleLineComment(),
|
|
1713
|
+
flags: None,
|
|
1714
|
+
command: /* Editor.toggleLineComment */'Editor.toggleLineComment'
|
|
1715
|
+
}, {
|
|
1716
|
+
id: 'toggle-block-comment',
|
|
1717
|
+
label: toggleBlockComment(),
|
|
1718
|
+
flags: None,
|
|
1719
|
+
command: /* Editor.toggleBlockComment */'Editor.toggleBlockComment'
|
|
1720
|
+
}];
|
|
1721
|
+
};
|
|
1722
|
+
|
|
1723
|
+
const MenuEntriesEdit = {
|
|
1724
|
+
__proto__: null,
|
|
1725
|
+
getMenuEntries: getMenuEntries$d,
|
|
1726
|
+
id: id$9
|
|
1727
|
+
};
|
|
1728
|
+
|
|
1729
|
+
/**
|
|
1730
|
+
* @enum {string}
|
|
1731
|
+
*/
|
|
1732
|
+
const UiStrings = {
|
|
1733
|
+
NewFile: 'New File',
|
|
1734
|
+
NewWindow: 'New Window',
|
|
1735
|
+
OpenFile: 'Open File',
|
|
1736
|
+
OpenFolder: 'Open Folder',
|
|
1737
|
+
OpenRecent: 'Open Recent',
|
|
1738
|
+
Exit: 'Exit',
|
|
1739
|
+
Save: 'Save',
|
|
1740
|
+
SaveAll: 'Save All'
|
|
1741
|
+
};
|
|
1742
|
+
const newFile = () => {
|
|
1743
|
+
return i18nString(UiStrings.NewFile);
|
|
1744
|
+
};
|
|
1745
|
+
const newWindow = () => {
|
|
1746
|
+
return i18nString(UiStrings.NewWindow);
|
|
1747
|
+
};
|
|
1748
|
+
const openFile = () => {
|
|
1749
|
+
return i18nString(UiStrings.OpenFile);
|
|
1750
|
+
};
|
|
1751
|
+
const openFolder = () => {
|
|
1752
|
+
return i18nString(UiStrings.OpenFolder);
|
|
1753
|
+
};
|
|
1754
|
+
const openRecent = () => {
|
|
1488
1755
|
return i18nString(UiStrings.OpenRecent);
|
|
1489
1756
|
};
|
|
1490
1757
|
const save = () => {
|
|
@@ -2251,7 +2518,7 @@ const menus$1 = [MenuEntriesEdit, MenuEntriesFile, MenuEntriesGo, MenuEntriesHel
|
|
|
2251
2518
|
const getMenuIds = () => {
|
|
2252
2519
|
return menus$1.map(menu => menu.id);
|
|
2253
2520
|
};
|
|
2254
|
-
const getMenuEntries$1 = (id, platform) => {
|
|
2521
|
+
const getMenuEntries$1 = async (id, platform) => {
|
|
2255
2522
|
const menu = menus$1.find(item => item.id === id);
|
|
2256
2523
|
if (!menu) {
|
|
2257
2524
|
return [];
|
|
@@ -2274,7 +2541,7 @@ const TitleBarButtons = 'TitleBarButtons';
|
|
|
2274
2541
|
const TitleBarEntryActive = 'TitleBarEntryActive';
|
|
2275
2542
|
const TitleBarIcon = 'TitleBarIcon';
|
|
2276
2543
|
const TitleBarIconIcon = 'TitleBarIconIcon';
|
|
2277
|
-
const TitleBarMenuBar
|
|
2544
|
+
const TitleBarMenuBar = 'TitleBarMenuBar';
|
|
2278
2545
|
const TitleBarTopLevelEntry = 'TitleBarTopLevelEntry';
|
|
2279
2546
|
const TitleBarTopLevelEntryLabel = 'TitleBarTopLevelEntryLabel';
|
|
2280
2547
|
const Viewlet = 'Viewlet';
|
|
@@ -2384,7 +2651,7 @@ const activeId = 'TitleBarEntryActive';
|
|
|
2384
2651
|
const getTitleBarMenuBarVirtualDom = (visibleItems, focusedIndex) => {
|
|
2385
2652
|
return [{
|
|
2386
2653
|
type: Div,
|
|
2387
|
-
className: mergeClassNames(Viewlet, TitleBarMenuBar
|
|
2654
|
+
className: mergeClassNames(Viewlet, TitleBarMenuBar),
|
|
2388
2655
|
role: MenuBar,
|
|
2389
2656
|
tabIndex: 0,
|
|
2390
2657
|
childCount: visibleItems.length,
|
|
@@ -2642,535 +2909,256 @@ const focusIndex = async (state, index) => {
|
|
|
2642
2909
|
return {
|
|
2643
2910
|
...state,
|
|
2644
2911
|
focusedIndex: index
|
|
2645
|
-
};
|
|
2646
|
-
};
|
|
2647
|
-
|
|
2648
|
-
const handleMouseOutMenuClosed = state => {
|
|
2649
|
-
return focusIndex(state, -1);
|
|
2650
|
-
};
|
|
2651
|
-
|
|
2652
|
-
const handleMouseOutMenuOpen = state => {
|
|
2653
|
-
return state;
|
|
2654
|
-
};
|
|
2655
|
-
|
|
2656
|
-
const ifElse = (menuOpenFunction, menuClosedFunction) => {
|
|
2657
|
-
const ifElseFunction = (state, ...args) => {
|
|
2658
|
-
const {
|
|
2659
|
-
isMenuOpen
|
|
2660
|
-
} = state;
|
|
2661
|
-
if (isMenuOpen) {
|
|
2662
|
-
return menuOpenFunction(state, ...args);
|
|
2663
|
-
}
|
|
2664
|
-
return menuClosedFunction(state, ...args);
|
|
2665
|
-
};
|
|
2666
|
-
return ifElseFunction;
|
|
2667
|
-
};
|
|
2668
|
-
|
|
2669
|
-
const handleMouseOut = ifElse(handleMouseOutMenuOpen, handleMouseOutMenuClosed);
|
|
2670
|
-
|
|
2671
|
-
const handlePointerOut = (state, clientX, clientY) => {
|
|
2672
|
-
const {
|
|
2673
|
-
x,
|
|
2674
|
-
iconWidth,
|
|
2675
|
-
titleBarEntries
|
|
2676
|
-
} = state;
|
|
2677
|
-
const menuX = getMenuOffset(x, clientX, iconWidth);
|
|
2678
|
-
const index = getTitleBarIndexFromPosition(titleBarEntries, menuX);
|
|
2679
|
-
if (index === -1) {
|
|
2680
|
-
return state;
|
|
2681
|
-
}
|
|
2682
|
-
return handleMouseOut(state);
|
|
2683
|
-
};
|
|
2684
|
-
|
|
2685
|
-
const handleMouseOverMenuClosed = (state, index) => {
|
|
2686
|
-
return focusIndex(state, index);
|
|
2687
|
-
};
|
|
2688
|
-
|
|
2689
|
-
const handleMouseOverMenuOpen = async (state, index) => {
|
|
2690
|
-
if (index === -1) {
|
|
2691
|
-
return state;
|
|
2692
|
-
}
|
|
2693
|
-
return focusIndex(state, index);
|
|
2694
|
-
};
|
|
2695
|
-
|
|
2696
|
-
const handleMouseOver = ifElse(handleMouseOverMenuOpen, handleMouseOverMenuClosed);
|
|
2697
|
-
|
|
2698
|
-
const handlePointerOver = (state, clientX, clientY) => {
|
|
2699
|
-
const {
|
|
2700
|
-
titleBarEntries,
|
|
2701
|
-
x,
|
|
2702
|
-
iconWidth
|
|
2703
|
-
} = state;
|
|
2704
|
-
const menuOffset = getMenuOffset(x, clientX, iconWidth);
|
|
2705
|
-
const index = getTitleBarIndexFromPosition(titleBarEntries, menuOffset);
|
|
2706
|
-
if (index === -1) {
|
|
2707
|
-
return state;
|
|
2708
|
-
}
|
|
2709
|
-
return handleMouseOver(state, index);
|
|
2710
|
-
};
|
|
2711
|
-
|
|
2712
|
-
const createTextMeasureContext = (letterSpacing, font) => {
|
|
2713
|
-
const canvas = new OffscreenCanvas(0, 0);
|
|
2714
|
-
const ctx = canvas.getContext('2d');
|
|
2715
|
-
if (!ctx) {
|
|
2716
|
-
throw new Error('Failed to get canvas context 2d');
|
|
2717
|
-
}
|
|
2718
|
-
ctx.letterSpacing = letterSpacing;
|
|
2719
|
-
ctx.font = font;
|
|
2720
|
-
return ctx;
|
|
2721
|
-
};
|
|
2722
|
-
|
|
2723
|
-
const getFontString = (fontWeight, fontSize, fontFamily) => {
|
|
2724
|
-
return `${fontWeight} ${fontSize}px ${fontFamily}`;
|
|
2725
|
-
};
|
|
2726
|
-
|
|
2727
|
-
const measureTextWidths = (texts, fontWeight, fontSize, fontFamily, letterSpacing) => {
|
|
2728
|
-
if (typeof letterSpacing !== 'number') {
|
|
2729
|
-
throw new TypeError('letterSpacing must be of type number');
|
|
2730
|
-
}
|
|
2731
|
-
const letterSpacingString = px(letterSpacing);
|
|
2732
|
-
const fontString = getFontString(fontWeight, fontSize, fontFamily);
|
|
2733
|
-
const ctx = createTextMeasureContext(letterSpacingString, fontString);
|
|
2734
|
-
const widths = [];
|
|
2735
|
-
for (const text of texts) {
|
|
2736
|
-
const metrics = ctx.measureText(text);
|
|
2737
|
-
const {
|
|
2738
|
-
width
|
|
2739
|
-
} = metrics;
|
|
2740
|
-
widths.push(width);
|
|
2741
|
-
}
|
|
2742
|
-
return widths;
|
|
2743
|
-
};
|
|
2744
|
-
|
|
2745
|
-
const getLabel = entry => {
|
|
2746
|
-
return entry.label;
|
|
2747
|
-
};
|
|
2748
|
-
const addWidths = (entries, labelPadding, fontWeight, fontSize, fontFamily, letterSpacing) => {
|
|
2749
|
-
const labels = entries.map(getLabel);
|
|
2750
|
-
const widths = measureTextWidths(labels, fontWeight, fontSize, fontFamily, letterSpacing);
|
|
2751
|
-
const withWidths = [];
|
|
2752
|
-
for (let i = 0; i < entries.length; i++) {
|
|
2753
|
-
const entry = entries[i];
|
|
2754
|
-
const textWidth = widths[i];
|
|
2755
|
-
const width = textWidth + labelPadding * 2;
|
|
2756
|
-
withWidths.push({
|
|
2757
|
-
...entry,
|
|
2758
|
-
width
|
|
2759
|
-
});
|
|
2760
|
-
}
|
|
2761
|
-
return withWidths;
|
|
2762
|
-
};
|
|
2763
|
-
|
|
2764
|
-
const loadContent2 = async state => {
|
|
2765
|
-
const {
|
|
2766
|
-
platform,
|
|
2767
|
-
controlsOverlayEnabled,
|
|
2768
|
-
titleBarStyleCustom,
|
|
2769
|
-
labelFontFamily,
|
|
2770
|
-
labelFontSize,
|
|
2771
|
-
labelFontWeight,
|
|
2772
|
-
labelLetterSpacing,
|
|
2773
|
-
labelPadding
|
|
2774
|
-
} = state;
|
|
2775
|
-
const titleBarEntries = await getMenuEntries(TitleBar$1);
|
|
2776
|
-
const withWidths = addWidths(titleBarEntries, labelPadding, labelFontWeight, labelFontSize, labelFontFamily, labelLetterSpacing);
|
|
2777
|
-
const buttons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
2778
|
-
const title = 'test';
|
|
2779
|
-
const iconWidth = 30;
|
|
2780
|
-
return {
|
|
2781
|
-
...state,
|
|
2782
|
-
titleBarEntries: withWidths,
|
|
2783
|
-
buttons,
|
|
2784
|
-
title,
|
|
2785
|
-
iconWidth
|
|
2786
|
-
};
|
|
2787
|
-
};
|
|
2788
|
-
|
|
2789
|
-
const loadContent = async (state, titleBarEntries) => {
|
|
2790
|
-
const {
|
|
2791
|
-
platform,
|
|
2792
|
-
controlsOverlayEnabled,
|
|
2793
|
-
titleBarStyleCustom,
|
|
2794
|
-
labelFontFamily,
|
|
2795
|
-
labelFontSize,
|
|
2796
|
-
labelFontWeight,
|
|
2797
|
-
labelLetterSpacing,
|
|
2798
|
-
labelPadding
|
|
2799
|
-
} = state;
|
|
2800
|
-
const withWidths = addWidths(titleBarEntries, labelPadding, labelFontWeight, labelFontSize, labelFontFamily, labelLetterSpacing);
|
|
2801
|
-
const buttons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
2802
|
-
const title = 'test';
|
|
2803
|
-
return {
|
|
2804
|
-
...state,
|
|
2805
|
-
titleBarEntries: withWidths,
|
|
2806
|
-
buttons,
|
|
2807
|
-
title
|
|
2808
|
-
};
|
|
2809
|
-
};
|
|
2810
|
-
|
|
2811
|
-
const Ellipsis = 'Ellipsis';
|
|
2812
|
-
|
|
2813
|
-
const getVisibleTitleBarEntries = (entries, width, focusedIndex, isMenuOpen) => {
|
|
2814
|
-
array(entries);
|
|
2815
|
-
number(width);
|
|
2816
|
-
let total = 0;
|
|
2817
|
-
const visible = [];
|
|
2818
|
-
for (let i = 0; i < entries.length; i++) {
|
|
2819
|
-
const entry = entries[i];
|
|
2820
|
-
total += entry.width;
|
|
2821
|
-
if (total >= width) {
|
|
2822
|
-
break;
|
|
2823
|
-
}
|
|
2824
|
-
const isOpen = i === focusedIndex && isMenuOpen;
|
|
2825
|
-
const isFocused = i === focusedIndex;
|
|
2826
|
-
visible.push({
|
|
2827
|
-
...entry,
|
|
2828
|
-
isOpen,
|
|
2829
|
-
isFocused
|
|
2830
|
-
});
|
|
2831
|
-
}
|
|
2832
|
-
const hasOverflow = visible.length < entries.length;
|
|
2833
|
-
if (hasOverflow) {
|
|
2834
|
-
const padding = 8;
|
|
2835
|
-
const moreIconWidth = 22;
|
|
2836
|
-
const totalPadding = padding * 2;
|
|
2837
|
-
const hasStillOverflow = total + moreIconWidth + totalPadding > width;
|
|
2838
|
-
if (hasStillOverflow) {
|
|
2839
|
-
visible.pop();
|
|
2840
|
-
}
|
|
2841
|
-
visible.push({
|
|
2842
|
-
ariaLabel: moreDot(),
|
|
2843
|
-
icon: Ellipsis,
|
|
2844
|
-
label: '',
|
|
2845
|
-
width: moreIconWidth + totalPadding
|
|
2846
|
-
});
|
|
2847
|
-
}
|
|
2848
|
-
return visible;
|
|
2849
|
-
};
|
|
2850
|
-
|
|
2851
|
-
const renderEntries = (oldState, newState) => {
|
|
2852
|
-
const visibleEntries = getVisibleTitleBarEntries(newState.titleBarEntries, newState.width, newState.focusedIndex, newState.isMenuOpen);
|
|
2853
|
-
const dom = getTitleBarMenuBarVirtualDom(visibleEntries, newState.focusedIndex);
|
|
2854
|
-
return ['Viewlet.setDom2', newState.uid, dom];
|
|
2855
|
-
};
|
|
2856
|
-
|
|
2857
|
-
const renderFocusedIndex = (oldState, newState) => {
|
|
2858
|
-
if (newState.focusedIndex === -1) {
|
|
2859
|
-
return [];
|
|
2860
|
-
}
|
|
2861
|
-
return ['Viewlet.focusSelector', '.ViewletTitleBarMenuBar'];
|
|
2862
|
-
};
|
|
2863
|
-
|
|
2864
|
-
const checkboxChecked = {
|
|
2865
|
-
type: Div,
|
|
2866
|
-
className: mergeClassNames(MenuItem, MenuItemCheckMark),
|
|
2867
|
-
role: MenuItemCheckBox,
|
|
2868
|
-
ariaChecked: true,
|
|
2869
|
-
tabIndex: -1,
|
|
2870
|
-
childCount: 2
|
|
2871
|
-
};
|
|
2872
|
-
const checkMark = {
|
|
2873
|
-
type: Div,
|
|
2874
|
-
className: mergeClassNames(MenuItemCheckmarkIcon, MaskIconCheck)
|
|
2875
|
-
};
|
|
2876
|
-
const getMenuItemCheckedDom = menuItem => {
|
|
2877
|
-
const {
|
|
2878
|
-
label
|
|
2879
|
-
} = menuItem;
|
|
2880
|
-
return [checkboxChecked, checkMark, text(label)];
|
|
2881
|
-
};
|
|
2882
|
-
|
|
2883
|
-
const getKeyBindingString = (key, altKey, ctrlKey, shiftKey, metaKey) => {
|
|
2884
|
-
let string = '';
|
|
2885
|
-
if (ctrlKey) {
|
|
2886
|
-
string += 'Ctrl+';
|
|
2887
|
-
}
|
|
2888
|
-
if (shiftKey) {
|
|
2889
|
-
string += 'Shift+';
|
|
2890
|
-
}
|
|
2891
|
-
string += key.toUpperCase();
|
|
2892
|
-
return string;
|
|
2893
|
-
};
|
|
2894
|
-
|
|
2895
|
-
const Backspace$1 = 1;
|
|
2896
|
-
const Tab$1 = 2;
|
|
2897
|
-
const Enter$1 = 3;
|
|
2898
|
-
const Escape$1 = 8;
|
|
2899
|
-
const Space$1 = 9;
|
|
2900
|
-
const PageUp$1 = 10;
|
|
2901
|
-
const PageDown$1 = 11;
|
|
2902
|
-
const End$1 = 255;
|
|
2903
|
-
const Home$1 = 12;
|
|
2904
|
-
const LeftArrow$1 = 13;
|
|
2905
|
-
const UpArrow$1 = 14;
|
|
2906
|
-
const RightArrow$1 = 15;
|
|
2907
|
-
const DownArrow$1 = 16;
|
|
2908
|
-
const Insert$1 = 17;
|
|
2909
|
-
const Delete$1 = 18;
|
|
2910
|
-
const Digit0$1 = 19;
|
|
2911
|
-
const Digit1$1 = 20;
|
|
2912
|
-
const Digit2$1 = 21;
|
|
2913
|
-
const Digit3$1 = 22;
|
|
2914
|
-
const Digit4$1 = 23;
|
|
2915
|
-
const Digit5$1 = 24;
|
|
2916
|
-
const Digit6$1 = 25;
|
|
2917
|
-
const Digit7$1 = 26;
|
|
2918
|
-
const Digit8$1 = 27;
|
|
2919
|
-
const Digit9$1 = 28;
|
|
2920
|
-
const KeyA$1 = 29;
|
|
2921
|
-
const KeyB$1 = 30;
|
|
2922
|
-
const KeyC$1 = 31;
|
|
2923
|
-
const KeyD$1 = 32;
|
|
2924
|
-
const KeyE$1 = 33;
|
|
2925
|
-
const KeyF$1 = 34;
|
|
2926
|
-
const KeyG$1 = 35;
|
|
2927
|
-
const KeyH$1 = 36;
|
|
2928
|
-
const KeyI$1 = 37;
|
|
2929
|
-
const KeyJ$1 = 38;
|
|
2930
|
-
const KeyK$1 = 39;
|
|
2931
|
-
const KeyL$1 = 40;
|
|
2932
|
-
const KeyM$1 = 41;
|
|
2933
|
-
const KeyN$1 = 42;
|
|
2934
|
-
const KeyO$1 = 43;
|
|
2935
|
-
const KeyP$1 = 44;
|
|
2936
|
-
const KeyQ$1 = 45;
|
|
2937
|
-
const KeyR$1 = 46;
|
|
2938
|
-
const KeyS$1 = 47;
|
|
2939
|
-
const KeyT$1 = 48;
|
|
2940
|
-
const KeyU$1 = 49;
|
|
2941
|
-
const KeyV$1 = 50;
|
|
2942
|
-
const KeyW$1 = 51;
|
|
2943
|
-
const KeyX$1 = 52;
|
|
2944
|
-
const KeyY$1 = 53;
|
|
2945
|
-
const KeyZ$1 = 54;
|
|
2946
|
-
const F1$1 = 57;
|
|
2947
|
-
const F2$1 = 58;
|
|
2948
|
-
const F3$1 = 59;
|
|
2949
|
-
const F4$1 = 60;
|
|
2950
|
-
const F5$1 = 61;
|
|
2951
|
-
const F6$1 = 62;
|
|
2952
|
-
const Equal$1 = 84;
|
|
2953
|
-
const Comma$1 = 85;
|
|
2954
|
-
const Minus$1 = 86;
|
|
2955
|
-
const Backquote$1 = 89;
|
|
2956
|
-
const Backslash$1 = 91;
|
|
2957
|
-
const Star$1 = 131;
|
|
2958
|
-
const Plus$1 = 132;
|
|
2959
|
-
|
|
2960
|
-
const Unknown = 'Unknown';
|
|
2961
|
-
const Backspace = 'Backspace';
|
|
2962
|
-
const Tab = 'Tab';
|
|
2963
|
-
const Enter = 'Enter';
|
|
2964
|
-
const Escape = 'Escape';
|
|
2965
|
-
const Space = 'Space';
|
|
2966
|
-
const PageUp = 'PageUp';
|
|
2967
|
-
const PageDown = 'PageDown';
|
|
2968
|
-
const End = 'End';
|
|
2969
|
-
const Home = 'Home';
|
|
2970
|
-
const LeftArrow = 'LeftArrow';
|
|
2971
|
-
const UpArrow = 'UpArrow';
|
|
2972
|
-
const RightArrow = 'RightArrow';
|
|
2973
|
-
const DownArrow = 'DownArrow';
|
|
2974
|
-
const Insert = 'Insert';
|
|
2975
|
-
const Delete = 'Delete';
|
|
2976
|
-
const Digit0 = '0';
|
|
2977
|
-
const Digit1 = '1';
|
|
2978
|
-
const Digit2 = '2';
|
|
2979
|
-
const Digit3 = '3';
|
|
2980
|
-
const Digit4 = '4';
|
|
2981
|
-
const Digit5 = '5';
|
|
2982
|
-
const Digit6 = '6';
|
|
2983
|
-
const Digit7 = '7';
|
|
2984
|
-
const Digit8 = '8';
|
|
2985
|
-
const Digit9 = '9';
|
|
2986
|
-
const KeyA = 'a';
|
|
2987
|
-
const KeyB = 'b';
|
|
2988
|
-
const KeyC = 'c';
|
|
2989
|
-
const KeyD = 'd';
|
|
2990
|
-
const KeyE = 'e';
|
|
2991
|
-
const KeyF = 'f';
|
|
2992
|
-
const KeyG = 'g';
|
|
2993
|
-
const KeyH = 'h';
|
|
2994
|
-
const KeyI = 'i';
|
|
2995
|
-
const KeyJ = 'j';
|
|
2996
|
-
const KeyK = 'k';
|
|
2997
|
-
const KeyL = 'l';
|
|
2998
|
-
const KeyM = 'm';
|
|
2999
|
-
const KeyN = 'n';
|
|
3000
|
-
const KeyO = 'o';
|
|
3001
|
-
const KeyP = 'p';
|
|
3002
|
-
const KeyQ = 'q';
|
|
3003
|
-
const KeyR = 'r';
|
|
3004
|
-
const KeyS = 's';
|
|
3005
|
-
const KeyT = 't';
|
|
3006
|
-
const KeyU = 'u';
|
|
3007
|
-
const KeyV = 'v';
|
|
3008
|
-
const KeyW = 'w';
|
|
3009
|
-
const KeyX = 'x';
|
|
3010
|
-
const KeyY = 'y';
|
|
3011
|
-
const KeyZ = 'z';
|
|
3012
|
-
const F1 = 'F1';
|
|
3013
|
-
const F2 = 'F2';
|
|
3014
|
-
const F3 = 'F3';
|
|
3015
|
-
const F4 = 'F4';
|
|
3016
|
-
const F5 = 'F5';
|
|
3017
|
-
const F6 = 'F6';
|
|
3018
|
-
const Equal = '=';
|
|
3019
|
-
const Comma = ',';
|
|
3020
|
-
const Minus = 'Minus';
|
|
3021
|
-
const Backquote = 'Backquote';
|
|
3022
|
-
const Backslash = 'Backslash';
|
|
3023
|
-
const Star = '*';
|
|
3024
|
-
const Plus = '+';
|
|
3025
|
-
|
|
3026
|
-
const getKeyCodeString = keyCode => {
|
|
3027
|
-
switch (keyCode) {
|
|
3028
|
-
case Backspace$1:
|
|
3029
|
-
return Backspace;
|
|
3030
|
-
case Tab$1:
|
|
3031
|
-
return Tab;
|
|
3032
|
-
case Escape$1:
|
|
3033
|
-
return Escape;
|
|
3034
|
-
case Enter$1:
|
|
3035
|
-
return Enter;
|
|
3036
|
-
case Space$1:
|
|
3037
|
-
return Space;
|
|
3038
|
-
case PageUp$1:
|
|
3039
|
-
return PageUp;
|
|
3040
|
-
case PageDown$1:
|
|
3041
|
-
return PageDown;
|
|
3042
|
-
case End$1:
|
|
3043
|
-
return End;
|
|
3044
|
-
case Home$1:
|
|
3045
|
-
return Home;
|
|
3046
|
-
case LeftArrow$1:
|
|
3047
|
-
return LeftArrow;
|
|
3048
|
-
case UpArrow$1:
|
|
3049
|
-
return UpArrow;
|
|
3050
|
-
case RightArrow$1:
|
|
3051
|
-
return RightArrow;
|
|
3052
|
-
case DownArrow$1:
|
|
3053
|
-
return DownArrow;
|
|
3054
|
-
case Insert$1:
|
|
3055
|
-
return Insert;
|
|
3056
|
-
case Delete$1:
|
|
3057
|
-
return Delete;
|
|
3058
|
-
case Digit0$1:
|
|
3059
|
-
return Digit0;
|
|
3060
|
-
case Digit1$1:
|
|
3061
|
-
return Digit1;
|
|
3062
|
-
case Digit2$1:
|
|
3063
|
-
return Digit2;
|
|
3064
|
-
case Digit3$1:
|
|
3065
|
-
return Digit3;
|
|
3066
|
-
case Digit4$1:
|
|
3067
|
-
return Digit4;
|
|
3068
|
-
case Digit5$1:
|
|
3069
|
-
return Digit5;
|
|
3070
|
-
case Digit6$1:
|
|
3071
|
-
return Digit6;
|
|
3072
|
-
case Digit7$1:
|
|
3073
|
-
return Digit7;
|
|
3074
|
-
case Digit8$1:
|
|
3075
|
-
return Digit8;
|
|
3076
|
-
case Digit9$1:
|
|
3077
|
-
return Digit9;
|
|
3078
|
-
case KeyA$1:
|
|
3079
|
-
return KeyA;
|
|
3080
|
-
case KeyB$1:
|
|
3081
|
-
return KeyB;
|
|
3082
|
-
case KeyC$1:
|
|
3083
|
-
return KeyC;
|
|
3084
|
-
case KeyD$1:
|
|
3085
|
-
return KeyD;
|
|
3086
|
-
case KeyE$1:
|
|
3087
|
-
return KeyE;
|
|
3088
|
-
case KeyF$1:
|
|
3089
|
-
return KeyF;
|
|
3090
|
-
case KeyG$1:
|
|
3091
|
-
return KeyG;
|
|
3092
|
-
case KeyH$1:
|
|
3093
|
-
return KeyH;
|
|
3094
|
-
case KeyI$1:
|
|
3095
|
-
return KeyI;
|
|
3096
|
-
case KeyJ$1:
|
|
3097
|
-
return KeyJ;
|
|
3098
|
-
case KeyK$1:
|
|
3099
|
-
return KeyK;
|
|
3100
|
-
case KeyL$1:
|
|
3101
|
-
return KeyL;
|
|
3102
|
-
case KeyM$1:
|
|
3103
|
-
return KeyM;
|
|
3104
|
-
case KeyN$1:
|
|
3105
|
-
return KeyN;
|
|
3106
|
-
case KeyO$1:
|
|
3107
|
-
return KeyO;
|
|
3108
|
-
case KeyP$1:
|
|
3109
|
-
return KeyP;
|
|
3110
|
-
case KeyQ$1:
|
|
3111
|
-
return KeyQ;
|
|
3112
|
-
case KeyR$1:
|
|
3113
|
-
return KeyR;
|
|
3114
|
-
case KeyS$1:
|
|
3115
|
-
return KeyS;
|
|
3116
|
-
case KeyT$1:
|
|
3117
|
-
return KeyT;
|
|
3118
|
-
case KeyU$1:
|
|
3119
|
-
return KeyU;
|
|
3120
|
-
case KeyV$1:
|
|
3121
|
-
return KeyV;
|
|
3122
|
-
case KeyW$1:
|
|
3123
|
-
return KeyW;
|
|
3124
|
-
case KeyX$1:
|
|
3125
|
-
return KeyX;
|
|
3126
|
-
case KeyY$1:
|
|
3127
|
-
return KeyY;
|
|
3128
|
-
case KeyZ$1:
|
|
3129
|
-
return KeyZ;
|
|
3130
|
-
case F1$1:
|
|
3131
|
-
return F1;
|
|
3132
|
-
case F2$1:
|
|
3133
|
-
return F2;
|
|
3134
|
-
case F3$1:
|
|
3135
|
-
return F3;
|
|
3136
|
-
case F4$1:
|
|
3137
|
-
return F4;
|
|
3138
|
-
case F5$1:
|
|
3139
|
-
return F5;
|
|
3140
|
-
case F6$1:
|
|
3141
|
-
return F6;
|
|
3142
|
-
case Backslash$1:
|
|
3143
|
-
return Backslash;
|
|
3144
|
-
case Equal$1:
|
|
3145
|
-
return Equal;
|
|
3146
|
-
case Comma$1:
|
|
3147
|
-
return Comma;
|
|
3148
|
-
case Backquote$1:
|
|
3149
|
-
return Backquote;
|
|
3150
|
-
case Plus$1:
|
|
3151
|
-
return Plus;
|
|
3152
|
-
case Star$1:
|
|
3153
|
-
return Star;
|
|
3154
|
-
case Minus$1:
|
|
3155
|
-
return Minus;
|
|
3156
|
-
default:
|
|
3157
|
-
return Unknown;
|
|
2912
|
+
};
|
|
2913
|
+
};
|
|
2914
|
+
|
|
2915
|
+
const handleMouseOutMenuClosed = state => {
|
|
2916
|
+
return focusIndex(state, -1);
|
|
2917
|
+
};
|
|
2918
|
+
|
|
2919
|
+
const handleMouseOutMenuOpen = state => {
|
|
2920
|
+
return state;
|
|
2921
|
+
};
|
|
2922
|
+
|
|
2923
|
+
const ifElse = (menuOpenFunction, menuClosedFunction) => {
|
|
2924
|
+
const ifElseFunction = (state, ...args) => {
|
|
2925
|
+
const {
|
|
2926
|
+
isMenuOpen
|
|
2927
|
+
} = state;
|
|
2928
|
+
if (isMenuOpen) {
|
|
2929
|
+
return menuOpenFunction(state, ...args);
|
|
2930
|
+
}
|
|
2931
|
+
return menuClosedFunction(state, ...args);
|
|
2932
|
+
};
|
|
2933
|
+
return ifElseFunction;
|
|
2934
|
+
};
|
|
2935
|
+
|
|
2936
|
+
const handleMouseOut = ifElse(handleMouseOutMenuOpen, handleMouseOutMenuClosed);
|
|
2937
|
+
|
|
2938
|
+
const handlePointerOut = (state, clientX, clientY) => {
|
|
2939
|
+
const {
|
|
2940
|
+
x,
|
|
2941
|
+
iconWidth,
|
|
2942
|
+
titleBarEntries
|
|
2943
|
+
} = state;
|
|
2944
|
+
const menuX = getMenuOffset(x, clientX, iconWidth);
|
|
2945
|
+
const index = getTitleBarIndexFromPosition(titleBarEntries, menuX);
|
|
2946
|
+
if (index === -1) {
|
|
2947
|
+
return state;
|
|
3158
2948
|
}
|
|
2949
|
+
return handleMouseOut(state);
|
|
3159
2950
|
};
|
|
3160
2951
|
|
|
3161
|
-
const
|
|
3162
|
-
|
|
3163
|
-
|
|
3164
|
-
|
|
3165
|
-
|
|
3166
|
-
|
|
2952
|
+
const handleMouseOverMenuClosed = (state, index) => {
|
|
2953
|
+
return focusIndex(state, index);
|
|
2954
|
+
};
|
|
2955
|
+
|
|
2956
|
+
const handleMouseOverMenuOpen = async (state, index) => {
|
|
2957
|
+
if (index === -1) {
|
|
2958
|
+
return state;
|
|
2959
|
+
}
|
|
2960
|
+
return focusIndex(state, index);
|
|
2961
|
+
};
|
|
2962
|
+
|
|
2963
|
+
const handleMouseOver = ifElse(handleMouseOverMenuOpen, handleMouseOverMenuClosed);
|
|
2964
|
+
|
|
2965
|
+
const handlePointerOver = (state, clientX, clientY) => {
|
|
2966
|
+
const {
|
|
2967
|
+
titleBarEntries,
|
|
2968
|
+
x,
|
|
2969
|
+
iconWidth
|
|
2970
|
+
} = state;
|
|
2971
|
+
const menuOffset = getMenuOffset(x, clientX, iconWidth);
|
|
2972
|
+
const index = getTitleBarIndexFromPosition(titleBarEntries, menuOffset);
|
|
2973
|
+
if (index === -1) {
|
|
2974
|
+
return state;
|
|
2975
|
+
}
|
|
2976
|
+
return handleMouseOver(state, index);
|
|
2977
|
+
};
|
|
2978
|
+
|
|
2979
|
+
const createTextMeasureContext = (letterSpacing, font) => {
|
|
2980
|
+
const canvas = new OffscreenCanvas(0, 0);
|
|
2981
|
+
const ctx = canvas.getContext('2d');
|
|
2982
|
+
if (!ctx) {
|
|
2983
|
+
throw new Error('Failed to get canvas context 2d');
|
|
2984
|
+
}
|
|
2985
|
+
ctx.letterSpacing = letterSpacing;
|
|
2986
|
+
ctx.font = font;
|
|
2987
|
+
return ctx;
|
|
2988
|
+
};
|
|
2989
|
+
|
|
2990
|
+
const getFontString = (fontWeight, fontSize, fontFamily) => {
|
|
2991
|
+
return `${fontWeight} ${fontSize}px ${fontFamily}`;
|
|
2992
|
+
};
|
|
2993
|
+
|
|
2994
|
+
const measureTextWidths = (texts, fontWeight, fontSize, fontFamily, letterSpacing) => {
|
|
2995
|
+
if (typeof letterSpacing !== 'number') {
|
|
2996
|
+
throw new TypeError('letterSpacing must be of type number');
|
|
2997
|
+
}
|
|
2998
|
+
const letterSpacingString = px(letterSpacing);
|
|
2999
|
+
const fontString = getFontString(fontWeight, fontSize, fontFamily);
|
|
3000
|
+
const ctx = createTextMeasureContext(letterSpacingString, fontString);
|
|
3001
|
+
const widths = [];
|
|
3002
|
+
for (const text of texts) {
|
|
3003
|
+
const metrics = ctx.measureText(text);
|
|
3004
|
+
const {
|
|
3005
|
+
width
|
|
3006
|
+
} = metrics;
|
|
3007
|
+
widths.push(width);
|
|
3008
|
+
}
|
|
3009
|
+
return widths;
|
|
3010
|
+
};
|
|
3011
|
+
|
|
3012
|
+
const getLabel = entry => {
|
|
3013
|
+
return entry.label;
|
|
3014
|
+
};
|
|
3015
|
+
const addWidths = (entries, labelPadding, fontWeight, fontSize, fontFamily, letterSpacing) => {
|
|
3016
|
+
const labels = entries.map(getLabel);
|
|
3017
|
+
const widths = measureTextWidths(labels, fontWeight, fontSize, fontFamily, letterSpacing);
|
|
3018
|
+
const withWidths = [];
|
|
3019
|
+
for (let i = 0; i < entries.length; i++) {
|
|
3020
|
+
const entry = entries[i];
|
|
3021
|
+
const textWidth = widths[i];
|
|
3022
|
+
const width = textWidth + labelPadding * 2;
|
|
3023
|
+
withWidths.push({
|
|
3024
|
+
...entry,
|
|
3025
|
+
width
|
|
3026
|
+
});
|
|
3027
|
+
}
|
|
3028
|
+
return withWidths;
|
|
3029
|
+
};
|
|
3030
|
+
|
|
3031
|
+
const loadContent2 = async state => {
|
|
3032
|
+
const {
|
|
3033
|
+
platform,
|
|
3034
|
+
controlsOverlayEnabled,
|
|
3035
|
+
titleBarStyleCustom,
|
|
3036
|
+
labelFontFamily,
|
|
3037
|
+
labelFontSize,
|
|
3038
|
+
labelFontWeight,
|
|
3039
|
+
labelLetterSpacing,
|
|
3040
|
+
labelPadding
|
|
3041
|
+
} = state;
|
|
3042
|
+
const titleBarEntries = await getMenuEntries(TitleBar$1);
|
|
3043
|
+
const withWidths = addWidths(titleBarEntries, labelPadding, labelFontWeight, labelFontSize, labelFontFamily, labelLetterSpacing);
|
|
3044
|
+
const buttons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
3045
|
+
const title = 'test';
|
|
3046
|
+
const iconWidth = 30;
|
|
3167
3047
|
return {
|
|
3168
|
-
|
|
3169
|
-
|
|
3170
|
-
|
|
3048
|
+
...state,
|
|
3049
|
+
titleBarEntries: withWidths,
|
|
3050
|
+
buttons,
|
|
3051
|
+
title,
|
|
3052
|
+
iconWidth
|
|
3053
|
+
};
|
|
3054
|
+
};
|
|
3055
|
+
|
|
3056
|
+
const loadContent = async (state, titleBarEntries) => {
|
|
3057
|
+
const {
|
|
3058
|
+
platform,
|
|
3059
|
+
controlsOverlayEnabled,
|
|
3060
|
+
titleBarStyleCustom,
|
|
3061
|
+
labelFontFamily,
|
|
3062
|
+
labelFontSize,
|
|
3063
|
+
labelFontWeight,
|
|
3064
|
+
labelLetterSpacing,
|
|
3065
|
+
labelPadding
|
|
3066
|
+
} = state;
|
|
3067
|
+
const withWidths = addWidths(titleBarEntries, labelPadding, labelFontWeight, labelFontSize, labelFontFamily, labelLetterSpacing);
|
|
3068
|
+
const buttons = getTitleBarButtons(platform, controlsOverlayEnabled, titleBarStyleCustom);
|
|
3069
|
+
const title = 'test';
|
|
3070
|
+
return {
|
|
3071
|
+
...state,
|
|
3072
|
+
titleBarEntries: withWidths,
|
|
3073
|
+
buttons,
|
|
3074
|
+
title
|
|
3171
3075
|
};
|
|
3172
3076
|
};
|
|
3173
3077
|
|
|
3078
|
+
const Ellipsis = 'Ellipsis';
|
|
3079
|
+
|
|
3080
|
+
const getVisibleTitleBarEntries = (entries, width, focusedIndex, isMenuOpen) => {
|
|
3081
|
+
array(entries);
|
|
3082
|
+
number(width);
|
|
3083
|
+
let total = 0;
|
|
3084
|
+
const visible = [];
|
|
3085
|
+
for (let i = 0; i < entries.length; i++) {
|
|
3086
|
+
const entry = entries[i];
|
|
3087
|
+
total += entry.width;
|
|
3088
|
+
if (total >= width) {
|
|
3089
|
+
break;
|
|
3090
|
+
}
|
|
3091
|
+
const isOpen = i === focusedIndex && isMenuOpen;
|
|
3092
|
+
const isFocused = i === focusedIndex;
|
|
3093
|
+
visible.push({
|
|
3094
|
+
...entry,
|
|
3095
|
+
isOpen,
|
|
3096
|
+
isFocused
|
|
3097
|
+
});
|
|
3098
|
+
}
|
|
3099
|
+
const hasOverflow = visible.length < entries.length;
|
|
3100
|
+
if (hasOverflow) {
|
|
3101
|
+
const padding = 8;
|
|
3102
|
+
const moreIconWidth = 22;
|
|
3103
|
+
const totalPadding = padding * 2;
|
|
3104
|
+
const hasStillOverflow = total + moreIconWidth + totalPadding > width;
|
|
3105
|
+
if (hasStillOverflow) {
|
|
3106
|
+
visible.pop();
|
|
3107
|
+
}
|
|
3108
|
+
visible.push({
|
|
3109
|
+
ariaLabel: moreDot(),
|
|
3110
|
+
icon: Ellipsis,
|
|
3111
|
+
label: '',
|
|
3112
|
+
width: moreIconWidth + totalPadding
|
|
3113
|
+
});
|
|
3114
|
+
}
|
|
3115
|
+
return visible;
|
|
3116
|
+
};
|
|
3117
|
+
|
|
3118
|
+
const renderEntries = (oldState, newState) => {
|
|
3119
|
+
const visibleEntries = getVisibleTitleBarEntries(newState.titleBarEntries, newState.width, newState.focusedIndex, newState.isMenuOpen);
|
|
3120
|
+
const dom = getTitleBarMenuBarVirtualDom(visibleEntries, newState.focusedIndex);
|
|
3121
|
+
return ['Viewlet.setDom2', newState.uid, dom];
|
|
3122
|
+
};
|
|
3123
|
+
|
|
3124
|
+
const renderFocusedIndex = (oldState, newState) => {
|
|
3125
|
+
if (newState.focusedIndex === -1) {
|
|
3126
|
+
return [];
|
|
3127
|
+
}
|
|
3128
|
+
return ['Viewlet.focusSelector', '.ViewletTitleBarMenuBar'];
|
|
3129
|
+
};
|
|
3130
|
+
|
|
3131
|
+
const checkboxChecked = {
|
|
3132
|
+
type: Div,
|
|
3133
|
+
className: mergeClassNames(MenuItem, MenuItemCheckMark),
|
|
3134
|
+
role: MenuItemCheckBox,
|
|
3135
|
+
ariaChecked: true,
|
|
3136
|
+
tabIndex: -1,
|
|
3137
|
+
childCount: 2
|
|
3138
|
+
};
|
|
3139
|
+
const checkMark = {
|
|
3140
|
+
type: Div,
|
|
3141
|
+
className: mergeClassNames(MenuItemCheckmarkIcon, MaskIconCheck)
|
|
3142
|
+
};
|
|
3143
|
+
const getMenuItemCheckedDom = menuItem => {
|
|
3144
|
+
const {
|
|
3145
|
+
label
|
|
3146
|
+
} = menuItem;
|
|
3147
|
+
return [checkboxChecked, checkMark, text(label)];
|
|
3148
|
+
};
|
|
3149
|
+
|
|
3150
|
+
const getKeyBindingString = (key, altKey, ctrlKey, shiftKey, metaKey) => {
|
|
3151
|
+
let string = '';
|
|
3152
|
+
if (ctrlKey) {
|
|
3153
|
+
string += 'Ctrl+';
|
|
3154
|
+
}
|
|
3155
|
+
if (shiftKey) {
|
|
3156
|
+
string += 'Shift+';
|
|
3157
|
+
}
|
|
3158
|
+
string += key.toUpperCase();
|
|
3159
|
+
return string;
|
|
3160
|
+
};
|
|
3161
|
+
|
|
3174
3162
|
const getKeyDom = key => {
|
|
3175
3163
|
const parsedKey = parseKey(key);
|
|
3176
3164
|
const keyBindingsString = getKeyBindingString(parsedKey.key, false, parsedKey.isCtrl, parsedKey.isShift);
|
|
@@ -3550,9 +3538,12 @@ const resize = async (state, dimensions) => {
|
|
|
3550
3538
|
};
|
|
3551
3539
|
};
|
|
3552
3540
|
|
|
3553
|
-
const saveState =
|
|
3541
|
+
const saveState = state => {
|
|
3542
|
+
const {
|
|
3543
|
+
focusedIndex
|
|
3544
|
+
} = state;
|
|
3554
3545
|
return {
|
|
3555
|
-
|
|
3546
|
+
focusedIndex
|
|
3556
3547
|
};
|
|
3557
3548
|
};
|
|
3558
3549
|
|
|
@@ -3685,11 +3676,8 @@ const setFocus = async focusKey => {
|
|
|
3685
3676
|
await invoke('Focus.setFocus', focusKey);
|
|
3686
3677
|
};
|
|
3687
3678
|
|
|
3688
|
-
// TODO remove this file and merge with whenExpressions
|
|
3689
|
-
const TitleBarMenuBar = FocusTitleBarMenuBar;
|
|
3690
|
-
|
|
3691
3679
|
const handleFocus = async state => {
|
|
3692
|
-
await setFocus(
|
|
3680
|
+
await setFocus(FocusTitleBarMenuBar);
|
|
3693
3681
|
return state;
|
|
3694
3682
|
};
|
|
3695
3683
|
|
|
@@ -4119,7 +4107,7 @@ const commandMap = {
|
|
|
4119
4107
|
'TitleBar.render3': render3,
|
|
4120
4108
|
'TitleBar.renderEventListeners': renderEventListeners,
|
|
4121
4109
|
'TitleBar.resize': wrapCommand(resize),
|
|
4122
|
-
'TitleBar.saveState': saveState,
|
|
4110
|
+
'TitleBar.saveState': wrapGetter(saveState),
|
|
4123
4111
|
'TitleBar.terminate': terminate,
|
|
4124
4112
|
'TitleBar.toggleIndex': wrapCommand(toggleIndex),
|
|
4125
4113
|
'TitleBar.toggleMenu': wrapCommand(toggleMenu)
|