-
Notifications
You must be signed in to change notification settings - Fork 144
/
defaults.js
1666 lines (1483 loc) · 57.6 KB
/
defaults.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
494
495
496
497
498
499
500
501
502
503
504
505
506
507
508
509
510
511
512
513
514
515
516
517
518
519
520
521
522
523
524
525
526
527
528
529
530
531
532
533
534
535
536
537
538
539
540
541
542
543
544
545
546
547
548
549
550
551
552
553
554
555
556
557
558
559
560
561
562
563
564
565
566
567
568
569
570
571
572
573
574
575
576
577
578
579
580
581
582
583
584
585
586
587
588
589
590
591
592
593
594
595
596
597
598
599
600
601
602
603
604
605
606
607
608
609
610
611
612
613
614
615
616
617
618
619
620
621
622
623
624
625
626
627
628
629
630
631
632
633
634
635
636
637
638
639
640
641
642
643
644
645
646
647
648
649
650
651
652
653
654
655
656
657
658
659
660
661
662
663
664
665
666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
684
685
686
687
688
689
690
691
692
693
694
695
696
697
698
699
700
701
702
703
704
705
706
707
708
709
710
711
712
713
714
715
716
717
718
719
720
721
722
723
724
725
726
727
728
729
730
731
732
733
734
735
736
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
753
754
755
756
757
758
759
760
761
762
763
764
765
766
767
768
769
770
771
772
773
774
775
776
777
778
779
780
781
782
783
784
785
786
787
788
789
790
791
792
793
794
795
796
797
798
799
800
801
802
803
804
805
806
807
808
809
810
811
812
813
814
815
816
817
818
819
820
821
822
823
824
825
826
827
828
829
830
831
832
833
834
835
836
837
838
839
840
841
842
843
844
845
846
847
848
849
850
851
852
853
854
855
856
857
858
859
860
861
862
863
864
865
866
867
868
869
870
871
872
873
874
875
876
877
878
879
880
881
882
883
884
885
886
887
888
889
890
891
892
893
894
895
896
897
898
899
900
901
902
903
904
905
906
907
908
909
910
911
912
913
914
915
916
917
918
919
920
921
922
923
924
925
926
927
928
929
930
931
932
933
934
935
936
937
938
939
940
941
942
943
944
945
946
947
948
949
950
951
952
953
954
955
956
957
958
959
960
961
962
963
964
965
966
967
968
969
970
971
972
973
974
975
976
977
978
979
980
981
982
983
984
985
986
987
988
989
990
991
992
993
994
995
996
997
998
999
1000
'use strict';
var version = require('../package.json').version;
var HypergridError = require('./lib/error');
var propClassEnum = {
COLUMNS: 1,
STRIPES: 2,
ROWS: 3,
CELLS: 4
};
var propClassLayersMap = {
DEFAULT: [propClassEnum.COLUMNS, propClassEnum.STRIPES, propClassEnum.ROWS, propClassEnum.CELLS],
NO_ROWS: [propClassEnum.COLUMNS, propClassEnum.CELLS]
};
/**
* This module lists the properties that can be set on a {@link Hypergrid} along with their default values.
* Edit this file to override the defaults.
* @module defaults
*/
var defaults = {
/**
* @summary The global theme name.
* @default
* @type {string}
* @memberOf module:defaults
*/
themeName: 'default',
/**
* The default message to display in front of the canvas when there are no grid rows.
* Format is HTML.
* @default
* @type {string}
* @memberOf module:defaults
*/
noDataMessage: '',
/**
* Multiplier for horizontal mouse wheel movement, applied to values of [`WheelEvent#deltaX`](https://developer.mozilla.org/docs/Web/API/WheelEvent/deltaX) (received by the horizontal scrollbar's listener).
*
* #### Caveat
* Wheel granularity depends on the OS, the input device, and possibly the browser. Any setting you choose will work differently in different environments. If you don't know the user's environment, it is probably best to give users control of this setting so they can fine tune it themselves.
*
* #### Default values
* This particular default value of `0.01` seems to work well on the MacBook Pro trackpad. It's slower than it was, which will greatly improve the scrolling experience since column scrolling often occurred inadvertently when the intent was to scroll in the veritcal direction only.
*
* Be aware however that the trackpad scrolling speed can be adjusted by the Mac user at the OS level (System Preferences -> Accessibility -> Mouse & Trackpad -> Trackpad Options… -> Scrolling speed).
*
* Hint: You can tell if the user is using a trackpad by listening for any deltaX (since a simple mouse wheel is deltaY only); and what OS by checking user agent.
* @default
* @type {number}
* @memberOf module:defaults
*/
wheelHFactor: 0.01,
/**
* Multiplier for vertical mouse wheel movement, applied to values of [`WheelEvent#deltaY`](https://developer.mozilla.org/docs/Web/API/WheelEvent/deltaY) (received by the vertical scrollbar's listener).
*
* #### Caveat
* Wheel granularity depends on the OS, the input device, and possibly the browser. Any setting you choose will work differently in different environments. If you don't know the user's environment, it is probably best to give users control of this setting so they can fine tune it themselves.
*
* #### Default values
* This particular default value of `0.05` is a compromise. It seems to work well on the MacBook Pro trackpad; and works acceptably (though differently) with a mouse wheel on both Mac OS and Windows.
*
* Be aware however that the trackpad scrolling speed can be adjusted by the Mac user at the OS level (System Preferences -> Accessibility -> Mouse & Trackpad -> Trackpad Options… -> Scrolling speed). Mouse wheel scrolling speed is also adjustable ( _yada yada_ -> Mouse Options… -> Scrolling speed; or on Windows search for "Change mouse wheel settings" in the Start menu).
*
* This default setting of `0.05` feels good on trackpad (2-finger drag). It's much slower than it was, but the way it was before was way to coarse and fast, scrolling hundreds of rows in a flash.
*
* With this setting, a mouse connected to a Mac, the wheel requires 5 click-stops to scroll 1 row; the same mouse connected to Windows scrolls 5 rows per click-stop. (However, I may have changed the default settings on my machines; not sure.)
*
* On Windows, the original multiplier setting (_i.e.,_ `1.0`) scrolled 100 grid rows on a single mouse wheel click-stop; the new default (`0.05`) scrolls 5 rows per click-stop. It stands to reason therefore that a setting of `0.01` will scroll 1:1 (1 row per 1 click-stop).
*
#### Hint
You can tell if the user is using a trackpad by listening for any deltaX (since a simple mouse wheel is deltaY only); and what OS by checking user agent.
* @default
* @type {number}
* @memberOf module:defaults
*/
wheelVFactor: 0.05,
/**
* @summary List of subgrids by
* @desc Restrict usage here to strings (naming data models) or arrays consisting of such a string + constructor arguments. That is, avoid {@link subgridSpec}'s function and object overloads and {@link subgridConstructorRef} function overload.
* @default "[ 'HeaderSubgrid', 'data' ]"
* @type {subgridSpec[]}
* @memberOf module:defaults
*/
subgrids: [
'HeaderSubgrid',
'data'
],
/**
* The font for data cells.
* @default
* @type {cssFont}
* @memberOf module:defaults
*/
font: '13px Tahoma, Geneva, sans-serif',
/**
* Font color for data cells.
* @default
* @type {string}
* @memberOf module:defaults
*/
color: 'rgb(25, 25, 25)',
/**
* Background color for data cells.
* @default
* @type {string}
* @memberOf module:defaults
*/
backgroundColor: 'rgb(241, 241, 241)',
/**
* Font style for selected cell(s).
* @default
* @type {string}
* @memberOf module:defaults
*/
foregroundSelectionFont: 'bold 13px Tahoma, Geneva, sans-serif',
/**
* Font color for selected cell(s).
* @default
* @type {string}
* @memberOf module:defaults
*/
foregroundSelectionColor: 'rgb(0, 0, 128)',
/**
* Background color for selected cell(s).
* @default
* @type {string}
* @memberOf module:defaults
*/
backgroundSelectionColor: 'rgba(147, 185, 255, 0.625)',
/********** SECTION: COLUMN HEADER COLORS **********/
// IMPORTANT CAVEAT: The code is inconsistent regarding the terminology. Is the "column header" section _the row_ of cells at the top (that act as headers for each column) or is it _the column_ of cells (that act as headers for each row)? Oh my.
/**
* @default
* @type {cssFont}
* @memberOf module:defaults
*/
columnHeaderFont: '12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
columnHeaderColor: 'rgb(25, 25, 25)',
/**
* Font style for selected columns' headers.
* @default
* @type {string}
* @memberOf module:defaults
*/
columnHeaderForegroundSelectionFont: 'bold 12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
columnHeaderBackgroundColor: 'rgb(223, 227, 232)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
columnHeaderForegroundSelectionColor: 'rgb(80, 80, 80)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
columnHeaderBackgroundSelectionColor: 'rgba(255, 220, 97, 0.45)',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
columnHeaderHalign: 'center',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
columnHeaderRenderer: 'SimpleCell',
/**
* There is no standard format called "header"; unless defined, defaults to "string" (pass-thru formatter).
* @default
* @type {string}
* @memberOf module:defaults
*/
columnHeaderFormat: 'header',
/********** SECTION: ROW HEADER COLORS **********/
/**
* @default
* @type {cssFont}
* @memberOf module:defaults
*/
rowHeaderFont: '12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
rowHeaderColor: 'rgb(25, 25, 25)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
rowHeaderBackgroundColor: 'rgb(223, 227, 232)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
rowHeaderForegroundSelectionColor: 'rgb(80, 80, 80)',
/**
* Font style for selected rows' headers.
* @default
* @type {string}
* @memberOf module:defaults
*/
rowHeaderForegroundSelectionFont: 'bold 12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
rowHeaderBackgroundSelectionColor: 'rgba(255, 220, 97, 0.45)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
backgroundColor2: 'rgb(201, 201, 201)',
/********** SECTION: TREE HEADER COLORS **********/
/**
* @default
* @type {cssFont}
* @memberOf module:defaults
*/
treeHeaderFont: '12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
treeHeaderColor: 'rgb(25, 25, 25)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
treeHeaderBackgroundColor: 'rgb(223, 227, 232)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
treeHeaderForegroundSelectionColor: 'rgb(80, 80, 80)',
/**
* Font style for selected rows' headers.
* @default
* @type {string}
* @memberOf module:defaults
*/
treeHeaderForegroundSelectionFont: 'bold 12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
treeHeaderBackgroundSelectionColor: 'rgba(255, 220, 97, 0.45)',
/********** SECTION: FILTER ROW COLORS **********/
/**
* @default
* @type {cssFont}
* @memberOf module:defaults
*/
filterFont: '12px Tahoma, Geneva, sans-serif',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
filterColor: 'rgb(25, 25, 25)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
filterBackgroundColor: 'white',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
filterForegroundSelectionColor: 'rgb(25, 25, 25)',
/**
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
filterBackgroundSelectionColor: 'rgb(255, 220, 97)',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
filterHalign: 'center',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
filterRenderer: 'SimpleCell',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
filterEditor: 'TextField',
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
filterable: true,
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
showFilterRow: false,
/**
* @default
* @type {number}
* @memberOf module:defaults
*/
voffset: 0,
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
scrollbarHoverOver: 'visible',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
scrollbarHoverOff: 'hidden',
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
scrollingEnabled: true,
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
vScrollbarClassPrefix: '',
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
hScrollbarClassPrefix: '',
/**
* Horizontal alignment of each cell as interpreted by it's cell renderer.
* @default
* @type {string}
* @memberOf module:defaults
*/
halign: 'center',
/**
* Padding to left and right of cell value.
*
* NOTE: Right padding may not be visible if column is not sized wide enough.
*
* See also {@link module:defaults.iconPadding|iconPadding}.
* @default
* @type {number}
* @memberOf module:defaults
*/
cellPadding: 5,
/**
* Padding to left and right of cell icons.
*
* Overrides {@link module:defaults.cellPadding|cellPadding}:
* * Left icon + `iconPadding` overrides left {@link module:defaults.cellPddingg|cellPddingg}.
* * Right icon + `iconPadding` overrides right {@link module:defaults.cellPddingg|cellPddingg}.
* @see {@link module:defaults.leftIcon|leftIcon}
* @see {@link module:defaults.centerIcon|centerIcon}
* @see {@link module:defaults.rightIcon|rightIcon}
* @default
* @type {number}
* @memberOf module:defaults
*/
iconPadding: 3,
/**
* @summary Name of image to appear at right of cell.
* @desc Must be a key from {@link module:images|images}.
*
* Used by {@link SimpleCell} cell renderer.
* @see {@link module:defaults.centerIcon|centerIcon}
* @see {@link module:defaults.rightIcon|rightIcon}
* @see {@link module:defaults.iconPadding|iconPadding}
* @default
* @type {string}
* @memberOf module:defaults
*/
leftIcon: undefined,
/**
* @summary Name of image to appear at right of cell.
* @desc Must be a key from {@link module:images|images}.
*
* Used by {@link SimpleCell} cell renderer.
* @see {@link module:defaults.leftIcon|leftIcon}
* @see {@link module:defaults.rightIcon|rightIcon}
* @see {@link module:defaults.iconPadding|iconPadding}
* @default
* @type {string}
* @memberOf module:defaults
*/
centerIcon: undefined,
/**
* @summary Name of image to appear at right of cell.
* @desc Must be a key from {@link module:images|images}.
*
* Used by {@link SimpleCell} cell renderer.
* @see {@link module:defaults.leftIcon|leftIcon}
* @see {@link module:defaults.centerIcon|centerIcon}
* @see {@link module:defaults.iconPadding|iconPadding}
* @default
* @type {string}
* @memberOf module:defaults
*/
rightIcon: undefined,
/**
* Set to `true` to render `0` and `false`. Otherwise these value appear as blank cells.
* @default
* @type {boolean}
* @memberOf module:defaults
*/
renderFalsy: false,
/**
* The name of a transformer function defined in require('synonomous/transformers').
*
* If the named headerify function is defined, whenever the schema array changes, it is applied each element
* (column schema) for each column that does not already have an explicitly defined `header` property.
*
* When this property does not name a defined headerify function, undefined column headers default to their column names.
*
* @see lib/headerifiers.js
* @default
* @type {string}
* @memberOf module:defaults
*/
headerify: 'toTitle',
/**
* Enable rendering of horizontal grid lines.
* @default
* @type {boolean}
* @memberOf module:defaults
*/
gridLinesH: true,
/**
* Thickness of horizontal grid lines (pixels).
* @type {number}
* @default
* @memberOf module:defaults
* @see {@link module:dynamicProperties.lineWidth lineWidth}
*/
gridLinesHWidth: 1,
/**
* Color of horizontal grid lines.
* @type {string}
* @default
* @memberOf module:defaults
* @see {@link module:dynamicProperties.lineColor lineColor}
*/
gridLinesHColor: 'rgb(199, 199, 199)',
/**
* Enable rendering of vertical grid lines.
* @default
* @type {boolean}
* @memberOf module:defaults
*/
gridLinesV: true,
/**
* Thickness of vertical grid lines (pixels).
* @type {number}
* @default
* @memberOf module:defaults
* @see {@link module:dynamicProperties.lineWidth lineWidth}
*/
gridLinesVWidth: 1,
/**
* Color of vertical grid lines.
* @type {string}
* @default
* @memberOf module:defaults
* @see {@link module:dynamicProperties.lineColor lineColor}
*/
gridLinesVColor: 'rgb(199, 199, 199)',
/**
* When {@link module:defaults.gridLinesV} is truthy, determines if lines render in the column headers area.
* @type {boolean}
* @default
* @memberOf module:defaults
*/
gridLinesColumnHeader: true,
/**
* When {@link module:defaults.gridLinesH} is truthy, determines if lines render in the row headers area.
* @type {boolean}
* @default
* @memberOf module:defaults
*/
gridLinesRowHeader: true,
/**
* When {@link module:defaults.gridLinesV} or {@link module:defaults.gridLinesH} are truthy, determines if lines render in the user data area.
* @type {boolean}
* @default
* @memberOf module:defaults
*/
gridLinesUserDataArea: true,
/**
* Set canvas's CSS border to this string as well as:
* * {@link module:dynamicProperties.gridBorderLeft gridBorderLeft}
* * {@link module:dynamicProperties.gridBorderRight gridBorderRight}
* * {@link module:dynamicProperties.gridBorderTop gridBorderTop}
* * {@link module:dynamicProperties.gridBorderBottom gridBorderBottom}.
*
* If set to:
* `true`: uses current {@link module:dynamicProperties.lineWidth lineWidth} and {@link module:dynamicProperties.lineColor lineColor}
* `false`: uses null
*
* Caveat: The use of `grid.canvas.canvas.style.boxSizing = 'border-box'` is _not_ recommended due to
* the fact that the canvas is squashed slightly to accommodate the border resulting in blurred text.
*
* @default
* @type {boolean|string}
* @memberOf module:defaults
*/
gridBorder: false,
/**
* Set canvas's left CSS border to this string.
*
* If set to:
* * `true`: uses current {@link module:dynamicProperties.lineWidth lineWidth} and {@link module:dynamicProperties.lineColor lineColor}
* * `false`: uses null
* @default
* @type {boolean|string}
* @memberOf module:defaults
*/
gridBorderLeft: false,
/**
* Set canvas's right CSS border to this string.
*
* If set to:
* * `true`: uses current {@link module:dynamicProperties.lineWidth lineWidth} and {@link module:dynamicProperties.lineColor lineColor}
* * `false`: uses null
* @default
* @type {boolean}
* @memberOf module:defaults
*/
gridBorderRight: false,
/**
* Set canvas's top CSS border to this string.
*
* If set to:
* * `true`: uses current {@link module:dynamicProperties.lineWidth lineWidth} and {@link module:dynamicProperties.lineColor lineColor}
* * `false`: uses null
* @default
* @type {boolean}
* @memberOf module:defaults
*/
gridBorderTop: false,
/**
* Set canvas's bottom CSS border to this string.
*
* If set to:
* * `true`: uses current {@link module:dynamicProperties.lineWidth lineWidth} and {@link module:dynamicProperties.lineColor lineColor}
* * `false`: uses null
* @default
* @type {boolean}
* @memberOf module:defaults
*/
gridBorderBottom: false,
/**
* Define this property to style rule lines between non-scrollable rows and scrollable rows differently from {@link module:defaults.gridLinesHWidth gridLinesHWidth}.
* Undefine it to show normal grid line in that position.
* @default
* @type {number}
* @memberOf module:defaults
*/
fixedLinesHWidth: 2,
/**
* Define this property to render just the edges of the lines between non-scrollable rows & scrollable rows, creating a double-line effect.
* The value is the thickness of the edges.
* Typical definition would be `1` in tandem with setting {@link module:defaults.fixedLinesHWidth fixedLinesHWidth} to `3`.
* @default
* @type {number}
* @memberOf module:defaults
*/
fixedLinesHEdge: undefined, // undefined means no edge effect
/**
* Define this property to style rule lines between fixed & scolling rows differently from {@link module:defaults.gridLinesHColor}.
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
fixedLinesHColor: 'rgb(164,164,164)', // ~21% darker than {@link module:defaults.gridLinesHColor} default
/**
* Define this property to style rule lines between non-scrollable columns and scrollable columns differently from {@link module:defaults.gridLinesVWidth gridLinesVWidth}.
* Undefine it to show normal grid line in that position.
* @default
* @type {number}
* @memberOf module:defaults
*/
fixedLinesVWidth: 2,
/**
* Define this property to render just the edges of the lines between fixed & scrolling columns, creating a double-line effect.
* The value is the thickness of the edges.
* Typical definition would be `1` in tandem with setting {@link module:defaults.fixedLinesVWidth fixedLinesVWidth} to `3`.
* @see {@link module:defaults.fixedLinesVWidth}
* @default
* @type {number}
* @memberOf module:defaults
*/
fixedLinesVEdge: undefined, // undefined means no edge effect
/**
* Define this property to style rule lines between fixed & scolling columns differently from {@link module:defaults.gridLinesVColor}.
* @default
* @type {cssColor}
* @memberOf module:defaults
*/
fixedLinesVColor: 'rgb(164,164,164)', // ~21% darker than {@link module:defaults.gridLinesVColor} default
/**
* Analogous to CSS {@link https://developer.mozilla.org/docs/Web/CSS/box-sizing `box-sizing`} property:
* * `'content-box'` _(default starting in version 3)_<br>
* Grid and fixed rule lines are rendered _between_ cells;
* cell rects are spread out to accommodate.
* * `'border-box'` _(default in version 2)_<br>
* Grid and fixed rule lines are rendered on inside right and bottom edges of each cell
* (except right-most and bottom-most visible cells);
* cell rects are contiguous.
* @default
* @type {string}
* @memberOf module:defaults
*/
boxSizing: version > 2 ? 'content-box' : 'border-box',
/**
* @default
* @type {number}
* @see {@link module:defaults.boxSizing boxSizing}
* @memberOf module:defaults
*/
defaultRowHeight: version > 2 ? 14 : 15,
/**
* This default column width is used when `width` property is undefined.
* (`width` is defined on column creation unless {@link module:defaults.columnAutosizing columnAutosizing} has been set to `false`.)
* @default
* @type {number}
* @memberOf module:defaults
*/
defaultColumnWidth: 100,
/**
* Minimum column width.
* Adjust this value for different fonts/sizes or exotic cell renderers.
* _Must be defined._
* The default (`5`) is enough room for an ellipsis with default font size.
* @default
* @type {number}
* @memberOf module:defaults
*/
minimumColumnWidth: 5,
/**
* Maximum column width.
* _When defined,_ column width is clamped to this value by {@link Column#setWidth setWidth}).
* Ignored when falsy.
* Respects {@link module:defaults.resizeColumnInPlace resizeColumnInPlace} but may cause user confusion when
* user can't make column narrower due to next column having reached its maximum.
* @default
* @type {number}
* @memberOf module:defaults
*/
maximumColumnWidth: undefined,
/**
* Resizing a column through the UI (by clicking and dragging on the column's
* right border in the column header row) normally affects the width of the whole grid.
*
* Set this new property to truthy to inversely resize the next column.
* In other words, if user expands (say) the third column, then the fourth column will contract —
* and _vice versa_ — without therefore affecting the width of the grid.
*
* This is a _column property_ and may be set for selected columns (`myColumn.properties.resizeColumnInPlace`)
* or for all columns by setting it at the grid level (`myGrid.properties.resizeColumnInPlace`).
*
* Note that the implementation of this property does not allow expanding a
* column beyond the width it can borrow from the next column.
* The last column, however, is unconstrained, and resizing of course affects the total grid width.
* @default
* @type {boolean}
* @memberOf module:defaults
*/
resizeColumnInPlace: false,
//for immediate painting, set these values to 0, true respectively
/**
* @default
* @type {number}
* @memberOf module:defaults
*/
repaintIntervalRate: 60,
/**
* Normally multiple calls to {@link Hypergrid#repaint grid.repaint()}, {@link Hypergrid#reindex grid.reindex()}, {@link Hypergrid#behaviorShapeChanged grid.behaviorShapeChanged()}, and/or {@link Hypergrid#behaviorStateChanged grid.behaviorStateChanged()} defer their actions until just before the next scheduled render. For debugging purposes, set `repaintImmediately` to truthy to carry out these actions immediately while leaving the paint loop running for when you resume execution. Alternatively, call {@link Canvas#stopPaintLoop grid.canvas.stopPaintLoop()}. Caveat: Both these modes are for debugging purposes only and may not render the grid perfectly for all interactions.
* @default
* @type {boolean}
* @memberOf module:defaults
*/
repaintImmediately: false,
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
useHiDPI: true,
/**
* @summary Mappings for cell navigation keys.
* @desc Cell navigation is handled in the {@link CellSelection} "feature".
* This property gives you control over which key presses the built-in mechanism will respond to.
*
* (If this built-in cell selection logic is insufficient for your needs, you can also listen for
* the various "fin-key" events and carry out more complex operations in your listeners.)
*
* The key press names used here are defined in Canvas.js.
* Note that all key presses actually have two names, a normal name and a shifted name.
* The latter name is used when **shift** is depressed.
*
* The built-in nav key presses are as follows:
* * **`UP`** _(up-arrow key)_ - Replace all selections with a single cell, one row up from the last selection.
* * **`DOWN`** _(down-arrow key)_ - Replace all selections with a single cell, one row down from the last selection.
* * **`LEFT`** _(left-arrow key)_ - Replace all selections with a single cell, one column to the left of the last selection.
* * **`RIGHT`** _(right-arrow key)_ - Replace all selections with a single cell, one column to the right of the last selection.
* * **`UPSHIFT`** _(shift + up-arrow)_ - Extend the last selection up one row.
* * **`DOWNSHIFT`** _(shift + down-arrow)_ - Extend the last selection down one row.
* * **`LEFTSHIFT`** _(shift + left-arrow)_ - Extend the last selection left one column.
* * **`RIGHTSHIFT`** _(shift + right-arrow)_ - Extend the last selection right one column.
*
* To alter these or add other mappings see the examples below.
*
* A note regarding the other meta keys (**ctrl**, **option**, and **command**):
* Although these meta keys can be detected, they do not modify the key names as **shift** does.
* This is because they are more for system use and generally (with the possibly exception fo **ctrl**) should not
* be depended upon, as system functions will take priority and your app will never see these key presses.
*
* A special accommodation has been made to the {@link module:defaults.editOnKeydown|editOnKeydown} property:
* * If `editOnKeydown` truthy AND mapped character is an actual (non-white-space) character, as opposed to (say)
* **tab** or **return**, then navigation requires the **ctrl** key to distinguish between nav and data.
* * If `editOnKeydown` falsy, the **ctrl** key is ignored.
*
* So if (say) `a` is mapped to `LEFT` as in the last example below, if `editOnKeydown` is ON, then `a` (without
* **ctrl**) would start editing the cell but **ctrl** + `a` would move the selection one column to the left.
*
* @example
* // To void the above build-ins:
* navKeyMap: {
* UP: undefined,
* UPSHIFT: undefined,
* DOWN: undefined,
* ...
* }
*
* @example
* // To map alternative nav key presses to RETURN and TAB (default mapping):
* navKeyMap: {
* RETURN: 'DOWN',
* RETURNSHIFT: 'UP',
* TAB: 'RIGHT',
* TABSHIFT: 'LEFT'
* }
*
* @example
* // To map alternative nav key presses to a/w/d/s and extend select to A/W/D/S:
* navKeyMap: {
* a: 'LEFT', A: 'LEFTSHIFT',
* w: 'UP', W: 'UPSHIFT',
* s: 'DOWN', S: 'DOWNSHIFT',
* d: 'RIGHT', D: 'RIGHTSHIFT'
* }
*
* @default
* @type {object|undefined}
* @memberOf module:defaults
*/
navKeyMap: {
RETURN: 'DOWN',
RETURNSHIFT: 'UP',
TAB: 'RIGHT',
TABSHIFT: 'LEFT'
},
/** @summary Validation failure feedback.
* @desc Validation occurs on {@link CellEditor#stopEditing|stopEditing}, normally called on commit (`TAB`, `ENTER`, or any other keys listed in `navKeyMap`).
*
* On successful validation, the value is saved back to the data source and the editor is closed.
*
* On validation failure, feedback is shown to the user in the form of an "error effect" possibly followed by an "end effect" containing a detailed explanation.
*
* The error effect to use is named in {@link module:defaults.feedbackEffect|feedbackEffect}.
*
* The value of this property is the number of times to show the "error effect" on validation failure before showing the detailed explanation.
*
* `feedback` may be set to one of:
* * **`undefined`** - Do not show the error effect or the alert. Just discard the value and close the editor (as if `ESC` had been typed).
* * **`0`** - Just shows the error feedback effect (see the {@link CellEditor#errorEffect|errorEffect} property).
* * **`1`** - Shows the error feedback effect followed by the detailed explanation.
* * `2` or more:
* 1. Shows the error feedback effect
* 2. On every `feedback` tries, shows the detailed explanation.
* @default
* @type {number|undefined}
* @memberOf module:defaults
*/
feedbackCount: 3,
/**
* @default
* @type {{name:string,options:object}|string}
* @memberOf module:defaults
* @see {@link module:defaults.feedbackCount|feedbackCount}
*/
feedbackEffect: 'shaker',
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
readOnly: false,
/**
* @default
* @type {number}
* @memberOf module:defaults
*/
fixedColumnCount: 0,
/**
* @default
* @type {number}
* @memberOf module:defaults
*/
fixedRowCount: 0,
/**
* @default
* @type {boolean}
* @memberOf module:defaults
* @see {@link module:dynamicProperties.showRowNumbers}
*/
rowHeaderNumbers: true,
/**
* @default
* @type {boolean}
* @memberOf module:defaults
* @see {@link module:dynamicProperties.showRowNumbers}
*/
rowHeaderCheckboxes: true,
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
showTreeColumn: true,
/**
* @default
* @type {string}
* @memberOf module:defaults
*/
treeRenderer: 'SimpleCell',
/**
* @default
* @type {boolean}
* @memberOf module:defaults
*/
showHeaderRow: true,
/** Clicking in a cell "selects" it; it is added to the select region and repainted with "cell selection" colors.
* @default
* @type {boolean}
* @memberOf module:defaults
*/
cellSelection: true,
/** Clicking in a column header (top row) "selects" the column; the entire column is added to the select region and repainted with "column selection" colors.
* @default
* @type {boolean}