Skip to content

Commit 188a31a

Browse files
UziTechUziTech
committed
fix: remove temporary fix for selection opacity
temporarily fixed in #10
1 parent 9f304c6 commit 188a31a

File tree

2 files changed

+25
-45
lines changed

2 files changed

+25
-45
lines changed

‎spec/element-spec.js

+25-25
Original file line numberDiff line numberDiff line change
@@ -356,7 +356,7 @@ describe('XTerminalElement', () => {
356356
expect(theme).toEqual({
357357
background: '#000000',
358358
foreground: '#ffffff',
359-
selection: 'rgba(77, 77, 77, 0.5)',
359+
selection: '#4d4d4d',
360360
cursor: '#ffffff',
361361
cursorAccent: '#000000',
362362
black: '#2e3436',
@@ -391,7 +391,7 @@ describe('XTerminalElement', () => {
391391
expect(theme).toEqual({
392392
background: '#1d1f21',
393393
foreground: '#c5c8c6',
394-
selection: 'rgba(153, 153, 153, 0.5)',
394+
selection: '#999999',
395395
cursor: '#ffffff',
396396
cursorAccent: '#000000',
397397
black: '#2e3436',
@@ -426,7 +426,7 @@ describe('XTerminalElement', () => {
426426
expect(theme).toEqual({
427427
background: '#ffffff',
428428
foreground: '#555555',
429-
selection: 'rgba(175, 196, 218, 0.5)',
429+
selection: '#afc4da',
430430
cursor: '#000000',
431431
cursorAccent: '#000000',
432432
black: '#2e3436',
@@ -461,7 +461,7 @@ describe('XTerminalElement', () => {
461461
expect(theme).toEqual({
462462
background: '#1d1f21',
463463
foreground: '#c5c8c6',
464-
selection: 'rgba(180, 183, 180, 0.5)',
464+
selection: '#b4b7b4',
465465
// selectionForeground: '#e0e0e0',
466466
cursor: '#ffffff',
467467
cursorAccent: '#000000',
@@ -497,7 +497,7 @@ describe('XTerminalElement', () => {
497497
expect(theme).toEqual({
498498
background: '#ffffff',
499499
foreground: '#1d1f21',
500-
selection: 'rgba(40, 42, 46, 0.5)',
500+
selection: '#282a2e',
501501
// selectionForeground: '#e0e0e0',
502502
cursor: '#1d1f21',
503503
cursorAccent: '#000000',
@@ -533,7 +533,7 @@ describe('XTerminalElement', () => {
533533
expect(theme).toEqual({
534534
background: '#0c0047',
535535
foreground: '#f81705',
536-
selection: 'rgba(41, 143, 22, 0.5)',
536+
selection: '#298f16',
537537
cursor: '#009f59',
538538
cursorAccent: '#000000',
539539
black: '#2e3436',
@@ -568,7 +568,7 @@ describe('XTerminalElement', () => {
568568
expect(theme).toEqual({
569569
background: '#181d23',
570570
foreground: '#666d81',
571-
selection: 'rgba(42, 47, 56, 0.5)',
571+
selection: '#2a2f38',
572572
// selectionForeground: '#b7c5d3',
573573
cursor: '#528bff',
574574
cursorAccent: '#000000',
@@ -604,7 +604,7 @@ describe('XTerminalElement', () => {
604604
expect(theme).toEqual({
605605
background: '#1e1f29',
606606
foreground: 'white',
607-
selection: 'rgba(68, 71, 90, 0.5)',
607+
selection: '#44475a',
608608
cursor: '#999999',
609609
cursorAccent: '#000000',
610610
black: '#2e3436',
@@ -639,7 +639,7 @@ describe('XTerminalElement', () => {
639639
expect(theme).toEqual({
640640
background: 'rgb(19, 119, 61)',
641641
foreground: 'rgb(255, 240, 165)',
642-
selection: 'rgba(181, 73, 37, 0.5)',
642+
selection: 'rgba(182, 73, 38, .99)',
643643
cursor: 'rgb(142, 40, 0)',
644644
cursorAccent: '#000000',
645645
black: '#2e3436',
@@ -674,7 +674,7 @@ describe('XTerminalElement', () => {
674674
expect(theme).toEqual({
675675
background: '#000000',
676676
foreground: 'rgb(41, 254, 20)',
677-
selection: 'rgba(6, 29, 155, 0.5)',
677+
selection: 'rgba(7, 30, 155, .99)',
678678
cursor: 'rgb(55, 254, 38)',
679679
cursorAccent: '#000000',
680680
black: '#2e3436',
@@ -709,7 +709,7 @@ describe('XTerminalElement', () => {
709709
expect(theme).toEqual({
710710
background: '#ffffff',
711711
foreground: '#000000',
712-
selection: 'rgba(177, 215, 255, 0.5)',
712+
selection: 'rgba(178, 215, 255, .99)',
713713
cursor: 'rgb(146, 146, 146)',
714714
cursorAccent: '#000000',
715715
black: '#2e3436',
@@ -744,7 +744,7 @@ describe('XTerminalElement', () => {
744744
expect(theme).toEqual({
745745
background: '#000000',
746746
foreground: 'rgb(230, 230, 230)',
747-
selection: 'rgba(155, 29, 6, 0.5)',
747+
selection: 'rgba(155, 30, 7, .99)',
748748
cursor: 'rgb(200, 20, 25)',
749749
cursorAccent: '#000000',
750750
black: '#2e3436',
@@ -779,7 +779,7 @@ describe('XTerminalElement', () => {
779779
expect(theme).toEqual({
780780
background: 'rgb(254, 244, 156)',
781781
foreground: 'black',
782-
selection: 'rgba(177, 215, 255, 0.5)',
782+
selection: 'rgba(178, 215, 255, .99)',
783783
cursor: 'rgb(146, 146, 146)',
784784
cursorAccent: '#000000',
785785
black: '#2e3436',
@@ -814,7 +814,7 @@ describe('XTerminalElement', () => {
814814
expect(theme).toEqual({
815815
background: 'rgb(223, 219, 196)',
816816
foreground: 'rgb(77, 47, 46)',
817-
selection: 'rgba(155, 153, 121, 0.5)',
817+
selection: 'rgba(155, 153, 122, .99)',
818818
cursor: 'rgb(115, 99, 89)',
819819
cursorAccent: '#000000',
820820
black: '#2e3436',
@@ -849,7 +849,7 @@ describe('XTerminalElement', () => {
849849
expect(theme).toEqual({
850850
background: 'rgb(44, 102, 201)',
851851
foreground: 'white',
852-
selection: 'rgba(40, 134, 255, 0.5)',
852+
selection: 'rgba(41, 134, 255, .99)',
853853
cursor: 'rgb(146, 146, 146)',
854854
cursorAccent: '#000000',
855855
black: '#2e3436',
@@ -884,7 +884,7 @@ describe('XTerminalElement', () => {
884884
expect(theme).toEqual({
885885
background: '#282c34',
886886
foreground: '#abb2bf',
887-
selection: 'rgba(145, 150, 161, 0.5)',
887+
selection: '#9196a1',
888888
cursor: '#528bff',
889889
cursorAccent: '#000000',
890890
black: '#2e3436',
@@ -919,7 +919,7 @@ describe('XTerminalElement', () => {
919919
expect(theme).toEqual({
920920
background: 'hsl(230, 1%, 98%)',
921921
foreground: 'hsl(230, 8%, 24%)',
922-
selection: 'rgba(229, 229, 230, 0.5)',
922+
selection: 'hsl(230, 1%, 90%)',
923923
cursor: 'hsl(230, 100%, 66%)',
924924
cursorAccent: '#000000',
925925
black: '#2e3436',
@@ -989,7 +989,7 @@ describe('XTerminalElement', () => {
989989
expect(theme).toEqual({
990990
background: '#000000',
991991
foreground: 'rgb(244, 244, 244)',
992-
selection: 'rgba(82, 82, 82, 0.5)',
992+
selection: 'rgba(82, 82, 82, .99)',
993993
cursor: 'rgb(96, 96, 96)',
994994
cursorAccent: '#000000',
995995
black: '#2e3436',
@@ -1024,7 +1024,7 @@ describe('XTerminalElement', () => {
10241024
expect(theme).toEqual({
10251025
background: 'rgb(143, 53, 39)',
10261026
foreground: 'rgb(215, 201, 167)',
1027-
selection: 'rgba(60, 24, 21, 0.5)',
1027+
selection: 'rgba(60, 25, 22, .99)',
10281028
cursor: 'white',
10291029
cursorAccent: '#000000',
10301030
black: '#2e3436',
@@ -1059,7 +1059,7 @@ describe('XTerminalElement', () => {
10591059
expect(theme).toEqual({
10601060
background: '#000000',
10611061
foreground: 'rgb(255, 38, 14)',
1062-
selection: 'rgba(6, 29, 155, 0.5)',
1062+
selection: 'rgba(7, 30, 155, .99)',
10631063
cursor: 'rgb(255, 38, 14)',
10641064
cursorAccent: '#000000',
10651065
black: '#2e3436',
@@ -1094,7 +1094,7 @@ describe('XTerminalElement', () => {
10941094
expect(theme).toEqual({
10951095
background: 'rgb(146, 146, 146)',
10961096
foreground: '#000000',
1097-
selection: 'rgba(119, 122, 156, 0.5)',
1097+
selection: 'rgba(120, 123, 156, .99)',
10981098
cursor: 'rgb(224, 224, 224)',
10991099
cursorAccent: '#000000',
11001100
black: '#2e3436',
@@ -1129,7 +1129,7 @@ describe('XTerminalElement', () => {
11291129
expect(theme).toEqual({
11301130
background: '#042029',
11311131
foreground: '#708284',
1132-
selection: 'rgba(131, 148, 150, 0.5)',
1132+
selection: '#839496',
11331133
cursor: '#819090',
11341134
cursorAccent: '#000000',
11351135
black: '#2e3436',
@@ -1164,7 +1164,7 @@ describe('XTerminalElement', () => {
11641164
expect(theme).toEqual({
11651165
background: '#fdf6e3',
11661166
foreground: '#657a81',
1167-
selection: 'rgba(236, 231, 213, 0.5)',
1167+
selection: '#ece7d5',
11681168
cursor: '#586e75',
11691169
cursorAccent: '#000000',
11701170
black: '#2e3436',
@@ -1199,7 +1199,7 @@ describe('XTerminalElement', () => {
11991199
expect(theme).toEqual({
12001200
background: 'rgb(120, 132, 151)',
12011201
foreground: '#000000',
1202-
selection: 'rgba(177, 215, 255, 0.5)',
1202+
selection: 'rgba(178, 215, 255, .99)',
12031203
cursor: '#ffffff',
12041204
cursorAccent: '#000000',
12051205
black: '#2e3436',
@@ -1235,7 +1235,7 @@ describe('XTerminalElement', () => {
12351235
expect(theme).toEqual({
12361236
background: root.getPropertyValue('--standard-app-background-color'),
12371237
foreground: root.getPropertyValue('--standard-text-color'),
1238-
selection: 'rgba(0, 0, 0, 0.5)',
1238+
selection: root.getPropertyValue('--standard-background-color-selected'),
12391239
cursor: root.getPropertyValue('--standard-text-color-highlight'),
12401240
cursorAccent: '#000000',
12411241
black: '#2e3436',

‎src/element.js

-20
Original file line numberDiff line numberDiff line change
@@ -400,29 +400,9 @@ class XTerminalElementImpl extends HTMLElement {
400400
}
401401
}
402402

403-
const webgl = ('webgl' in profile ? profile.webgl : this.model.profile.webgl)
404-
if (!webgl) {
405-
colors.selection = this.setMaximumOpacity(colors.selection, 0.5)
406-
}
407-
408403
return colors
409404
}
410405

411-
setMaximumOpacity (color, opacity) {
412-
// modified from https://stackoverflow.com/a/24390910/806777
413-
const cvs = document.createElement('canvas')
414-
cvs.height = 1
415-
cvs.width = 1
416-
const ctx = cvs.getContext('2d')
417-
ctx.fillStyle = color
418-
ctx.fillRect(0, 0, 1, 1)
419-
const [r, g, b, a] = ctx.getImageData(0, 0, 1, 1).data
420-
if (a / 255 <= opacity) {
421-
return color
422-
}
423-
return `rgba(${r}, ${g}, ${b}, ${opacity})`
424-
}
425-
426406
getXtermOptions () {
427407
let xtermOptions = {
428408
cursorBlink: true,

0 commit comments

Comments
 (0)