Fossil SCM

Internal cleanups of how /chat config area is built up. No significant visible changes.

stephan 2021-09-21 20:07 trunk
Commit 60206ef512f1ef5a2f691298abb0fb1c00f242d6fc60d2deaeca70f5fe68cfc2
Parent 3524f72e6b3b448…
2 files changed +23 -19 +4 -1
~ src/chat.js ~ src/style.chat.css
M src/chat.js
+23 -19
--- src/chat.js
+++ src/chat.js
@@ -1083,40 +1083,40 @@
10831083
 }
10841084
 }];
10851085
10861086
 /** Set up selection list of notification sounds. */
10871087
 if(1){
1088
- settingsOps.selectSound = D.addClass(D.div(), 'menu-entry');
10891088
 const selectSound = D.select();
1090
- D.append(settingsOps.selectSound,
1091
- D.append(D.span(),"Audio alert"),
1092
- selectSound);
10931089
 D.option(selectSound, "", "(no audio)");
10941090
 const firstSoundIndex = selectSound.options.length;
1095
- F.config.chat.alerts.forEach(function(a){
1096
- D.option(selectSound, a);
1097
- });
1091
+ F.config.chat.alerts.forEach((a)=>D.option(selectSound, a));
10981092
 if(true===Chat.settings.getBool('audible-alert')){
1093
+ /* This setting used to be a plain bool. If we encounter
1094
+ such a setting, take the first sound in the list. */
10991095
 selectSound.selectedIndex = firstSoundIndex;
11001096
 }else{
11011097
 selectSound.value = Chat.settings.get('audible-alert','');
11021098
 if(selectSound.selectedIndex<0){
1103
- /*Missing file - removed after this setting was applied. Fall back
1104
- to the first sound in the list. */
1099
+ /* Missing file - removed after this setting was
1100
+ applied. Fall back to the first sound in the list. */
11051101
 selectSound.selectedIndex = firstSoundIndex;
11061102
 }
11071103
 }
1108
- selectSound.addEventListener('change',function(){
1109
- const v = this.value;
1110
- Chat.setNewMessageSound(v);
1111
- F.toast.message("Audio notifications "+(v ? "enabled" : "disabled")+".");
1112
- if(v) setTimeout(()=>Chat.playNewMessageSound(), 0);
1113
- }, false);
11141104
 Chat.setNewMessageSound(selectSound.value);
1105
+ settingsOps.push({
1106
+ label: "Audio alert",
1107
+ select: selectSound,
1108
+ callback: function(ev){
1109
+ const v = ev.target.value;
1110
+ Chat.setNewMessageSound(v);
1111
+ F.toast.message("Audio notifications "+(v ? "enabled" : "disabled")+".");
1112
+ if(v) setTimeout(()=>Chat.playNewMessageSound(), 0);
1113
+ }
1114
+ });
11151115
 }/*audio notification config*/
11161116
 /**
1117
- Build list of options...
1117
+ Build UI for config options...
11181118
 */
11191119
 settingsOps.forEach(function f(op){
11201120
 const line = D.addClass(D.div(), 'menu-entry');
11211121
 const btn = D.append(
11221122
 D.addClass(D.label(), 'cbutton'/*bootstrap skin hijacks 'button'*/),
@@ -1125,11 +1125,14 @@
11251125
 op.callback(ev);
11261126
 if(op.persistentSetting){
11271127
 Chat.settings.set(op.persistentSetting, op.boolValue());
11281128
 }
11291129
 };
1130
- if(op.hasOwnProperty('boolValue')){
1130
+ if(op.hasOwnProperty('select')){
1131
+ D.append(line, btn, op.select);
1132
+ op.select.addEventListener('change', callback, false);
1133
+ }else if(op.hasOwnProperty('boolValue')){
11311134
 if(undefined === f.$id) f.$id = 0;
11321135
 ++f.$id;
11331136
 const check = D.attr(D.checkbox(1, op.boolValue()),
11341137
 'aria-label', op.label);
11351138
 const id = 'cfgopt'+f.$id;
@@ -1136,17 +1139,18 @@
11361139
 if(op.boolValue()) check.checked = true;
11371140
 D.attr(check, 'id', id);
11381141
 D.attr(btn, 'for', id);
11391142
 D.append(line, check);
11401143
 check.addEventListener('change', callback);
1144
+ D.append(line, btn);
11411145
 }else{
11421146
 line.addEventListener('click', callback);
1147
+ D.append(line, btn);
11431148
 }
1144
- D.append(line, btn);
11451149
 D.append(optionsMenu, line);
11461150
 });
1147
- if(settingsOps.selectSound){
1151
+ if(0 && settingsOps.selectSound){
11481152
 D.append(optionsMenu, settingsOps.selectSound);
11491153
 }
11501154
 //settingsButton.click()/*for for development*/;
11511155
 })()/*#chat-settings-button setup*/;
11521156
11531157
--- src/chat.js
+++ src/chat.js
@@ -1083,40 +1083,40 @@
1083 }
1084 }];
1085
1086 /** Set up selection list of notification sounds. */
1087 if(1){
1088 settingsOps.selectSound = D.addClass(D.div(), 'menu-entry');
1089 const selectSound = D.select();
1090 D.append(settingsOps.selectSound,
1091 D.append(D.span(),"Audio alert"),
1092 selectSound);
1093 D.option(selectSound, "", "(no audio)");
1094 const firstSoundIndex = selectSound.options.length;
1095 F.config.chat.alerts.forEach(function(a){
1096 D.option(selectSound, a);
1097 });
1098 if(true===Chat.settings.getBool('audible-alert')){
 
 
1099 selectSound.selectedIndex = firstSoundIndex;
1100 }else{
1101 selectSound.value = Chat.settings.get('audible-alert','');
1102 if(selectSound.selectedIndex<0){
1103 /*Missing file - removed after this setting was applied. Fall back
1104 to the first sound in the list. */
1105 selectSound.selectedIndex = firstSoundIndex;
1106 }
1107 }
1108 selectSound.addEventListener('change',function(){
1109 const v = this.value;
1110 Chat.setNewMessageSound(v);
1111 F.toast.message("Audio notifications "+(v ? "enabled" : "disabled")+".");
1112 if(v) setTimeout(()=>Chat.playNewMessageSound(), 0);
1113 }, false);
1114 Chat.setNewMessageSound(selectSound.value);
 
 
 
 
 
 
 
 
 
 
1115 }/*audio notification config*/
1116 /**
1117 Build list of options...
1118 */
1119 settingsOps.forEach(function f(op){
1120 const line = D.addClass(D.div(), 'menu-entry');
1121 const btn = D.append(
1122 D.addClass(D.label(), 'cbutton'/*bootstrap skin hijacks 'button'*/),
@@ -1125,11 +1125,14 @@
1125 op.callback(ev);
1126 if(op.persistentSetting){
1127 Chat.settings.set(op.persistentSetting, op.boolValue());
1128 }
1129 };
1130 if(op.hasOwnProperty('boolValue')){
 
 
 
1131 if(undefined === f.$id) f.$id = 0;
1132 ++f.$id;
1133 const check = D.attr(D.checkbox(1, op.boolValue()),
1134 'aria-label', op.label);
1135 const id = 'cfgopt'+f.$id;
@@ -1136,17 +1139,18 @@
1136 if(op.boolValue()) check.checked = true;
1137 D.attr(check, 'id', id);
1138 D.attr(btn, 'for', id);
1139 D.append(line, check);
1140 check.addEventListener('change', callback);
 
1141 }else{
1142 line.addEventListener('click', callback);
 
1143 }
1144 D.append(line, btn);
1145 D.append(optionsMenu, line);
1146 });
1147 if(settingsOps.selectSound){
1148 D.append(optionsMenu, settingsOps.selectSound);
1149 }
1150 //settingsButton.click()/*for for development*/;
1151 })()/*#chat-settings-button setup*/;
1152
1153
--- src/chat.js
+++ src/chat.js
@@ -1083,40 +1083,40 @@
1083 }
1084 }];
1085
1086 /** Set up selection list of notification sounds. */
1087 if(1){
 
1088 const selectSound = D.select();
 
 
 
1089 D.option(selectSound, "", "(no audio)");
1090 const firstSoundIndex = selectSound.options.length;
1091 F.config.chat.alerts.forEach((a)=>D.option(selectSound, a));
 
 
1092 if(true===Chat.settings.getBool('audible-alert')){
1093 /* This setting used to be a plain bool. If we encounter
1094 such a setting, take the first sound in the list. */
1095 selectSound.selectedIndex = firstSoundIndex;
1096 }else{
1097 selectSound.value = Chat.settings.get('audible-alert','');
1098 if(selectSound.selectedIndex<0){
1099 /* Missing file - removed after this setting was
1100 applied. Fall back to the first sound in the list. */
1101 selectSound.selectedIndex = firstSoundIndex;
1102 }
1103 }
 
 
 
 
 
 
1104 Chat.setNewMessageSound(selectSound.value);
1105 settingsOps.push({
1106 label: "Audio alert",
1107 select: selectSound,
1108 callback: function(ev){
1109 const v = ev.target.value;
1110 Chat.setNewMessageSound(v);
1111 F.toast.message("Audio notifications "+(v ? "enabled" : "disabled")+".");
1112 if(v) setTimeout(()=>Chat.playNewMessageSound(), 0);
1113 }
1114 });
1115 }/*audio notification config*/
1116 /**
1117 Build UI for config options...
1118 */
1119 settingsOps.forEach(function f(op){
1120 const line = D.addClass(D.div(), 'menu-entry');
1121 const btn = D.append(
1122 D.addClass(D.label(), 'cbutton'/*bootstrap skin hijacks 'button'*/),
@@ -1125,11 +1125,14 @@
1125 op.callback(ev);
1126 if(op.persistentSetting){
1127 Chat.settings.set(op.persistentSetting, op.boolValue());
1128 }
1129 };
1130 if(op.hasOwnProperty('select')){
1131 D.append(line, btn, op.select);
1132 op.select.addEventListener('change', callback, false);
1133 }else if(op.hasOwnProperty('boolValue')){
1134 if(undefined === f.$id) f.$id = 0;
1135 ++f.$id;
1136 const check = D.attr(D.checkbox(1, op.boolValue()),
1137 'aria-label', op.label);
1138 const id = 'cfgopt'+f.$id;
@@ -1136,17 +1139,18 @@
1139 if(op.boolValue()) check.checked = true;
1140 D.attr(check, 'id', id);
1141 D.attr(btn, 'for', id);
1142 D.append(line, check);
1143 check.addEventListener('change', callback);
1144 D.append(line, btn);
1145 }else{
1146 line.addEventListener('click', callback);
1147 D.append(line, btn);
1148 }
 
1149 D.append(optionsMenu, line);
1150 });
1151 if(0 && settingsOps.selectSound){
1152 D.append(optionsMenu, settingsOps.selectSound);
1153 }
1154 //settingsButton.click()/*for for development*/;
1155 })()/*#chat-settings-button setup*/;
1156
1157
M src/style.chat.css
+4 -1
--- src/style.chat.css
+++ src/style.chat.css
@@ -330,12 +330,15 @@
330330
 align-items: center;
331331
 flex-direction: row;
332332
 flex-wrap: wrap;
333333
 padding: 1em;
334334
 }
335
-body.chat #chat-config #chat-config-options .menu-entry > *:first-child {
335
+body.chat #chat-config #chat-config-options .menu-entry > input:first-child {
336336
 margin-right: 1em;
337
+}
338
+body.chat #chat-config #chat-config-options .menu-entry > label:first-child {
339
+ margin-right: 0.5em;
337340
 }
338341
 body.chat #chat-preview #chat-preview-content {
339342
 overflow: auto;
340343
 flex: 1 1 auto;
341344
 padding: 0.5em;
342345
--- src/style.chat.css
+++ src/style.chat.css
@@ -330,12 +330,15 @@
330 align-items: center;
331 flex-direction: row;
332 flex-wrap: wrap;
333 padding: 1em;
334 }
335 body.chat #chat-config #chat-config-options .menu-entry > *:first-child {
336 margin-right: 1em;
 
 
 
337 }
338 body.chat #chat-preview #chat-preview-content {
339 overflow: auto;
340 flex: 1 1 auto;
341 padding: 0.5em;
342
--- src/style.chat.css
+++ src/style.chat.css
@@ -330,12 +330,15 @@
330 align-items: center;
331 flex-direction: row;
332 flex-wrap: wrap;
333 padding: 1em;
334 }
335 body.chat #chat-config #chat-config-options .menu-entry > input:first-child {
336 margin-right: 1em;
337 }
338 body.chat #chat-config #chat-config-options .menu-entry > label:first-child {
339 margin-right: 0.5em;
340 }
341 body.chat #chat-preview #chat-preview-content {
342 overflow: auto;
343 flex: 1 1 auto;
344 padding: 0.5em;
345

Keyboard Shortcuts

Open search /
Next entry (timeline) j
Previous entry (timeline) k
Open focused entry Enter
Show this help ?
Toggle theme Top nav button