c8261814fd
In many GNU/Linux setups, drawing attention when a notification arrives
causes the Signal window to steal focus immediately and interrupt the
user from what they were doing before the notification arrived. GNOME
Shell is the most prominent example of this behavior, but there are
likely other cases as well. Suddenly stealing focus on external events
like this can even pose a security problem in some cases, e.g. if the
user is in the middle of a typing a sudo password on one monitor while a
notification arrives and focuses Signal on another monitor. See #4452
for more information.
Disabling attention drawing entirely for Linux is also problematic
because some users rely on it as the sole indication of a new message,
as seen in #3582 and #3611.
Commit f790694559 improved the situation
by adding a hidden "--disable-flash-frame" command-line argument, but
this argument is undocumented and manually adding command-line arguments
to the application's .desktop file is not user-friendly.
This commit adds a settings option for whether to draw attention when a
new notification arrives to make it easy for all Linux users to obtain
the appropriate behavior without relying on an undocumented
command-line argument.
Fixes #4452.
166 lines
6.4 KiB
HTML
166 lines
6.4 KiB
HTML
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Security-Policy"
|
|
content="default-src 'none';
|
|
child-src 'self';
|
|
connect-src 'self' https: wss:;
|
|
font-src 'self';
|
|
form-action 'self';
|
|
frame-src 'none';
|
|
img-src 'self' blob: data:;
|
|
media-src 'self' blob:;
|
|
object-src 'none';
|
|
script-src 'self';
|
|
style-src 'self' 'unsafe-inline';"
|
|
>
|
|
<link href="node_modules/sanitize.css/sanitize.css" rel="stylesheet" type="text/css" />
|
|
<link href="stylesheets/manifest.css" rel="stylesheet" type="text/css" />
|
|
<style>
|
|
</style>
|
|
</head>
|
|
<body>
|
|
</body>
|
|
<script type='text/x-tmpl-mustache' id='syncSettings'>
|
|
<hr>
|
|
<h3>{{ sync }}</h3>
|
|
<div>
|
|
<button class='grey sync'>{{ syncNow }}</button>
|
|
<p>
|
|
{{ syncExplanation }}
|
|
<div class='synced_at'>
|
|
{{ lastSynced }} {{ syncDate }} {{ syncTime }}
|
|
</div>
|
|
<div class='sync_failed'>{{ syncFailed }}</div>
|
|
<div class='clearfix'></div>
|
|
</p>
|
|
</div>
|
|
</script>
|
|
<script type='text/x-tmpl-mustache' id='settings'>
|
|
<div class='content'>
|
|
<a class='x close' alt='close settings' href='#'></a>
|
|
<h2>{{ settings }}</h2>
|
|
<div class='device-name-settings'>
|
|
<b>{{ deviceNameLabel }}:</b> {{ deviceName }}
|
|
</div>
|
|
<hr>
|
|
<div class='theme-settings'>
|
|
<h3>{{ theme }}</h3>
|
|
{{#hasSystemTheme}}
|
|
<div>
|
|
<input type='radio' name='theme' id='theme-setting-system' value='system'>
|
|
<label for='theme-setting-system'>{{ themeSystem }}</label>
|
|
</div>
|
|
{{/hasSystemTheme}}
|
|
<div>
|
|
<input type='radio' name='theme' id='theme-setting-light' value='light'>
|
|
<label for='theme-setting-light'>{{ themeLight }}</label>
|
|
</div>
|
|
<div>
|
|
<input type='radio' name='theme' id='theme-setting-dark' value='dark'>
|
|
<label for='theme-setting-dark'>{{ themeDark }}</label>
|
|
</div>
|
|
</div>
|
|
<br />
|
|
{{ #isHideMenuBarSupported }}
|
|
<div class='menu-bar-setting'>
|
|
<input type='checkbox' name='hide-menu-bar' id='hide-menu-bar'/>
|
|
<label for='hide-menu-bar'>{{ hideMenuBar }}</label>
|
|
</div>
|
|
{{ /isHideMenuBarSupported }}
|
|
<hr>
|
|
<div class='notification-settings'>
|
|
<h3>{{ notifications }}</h3>
|
|
<p>{{ notificationSettingsDialog }}</p>
|
|
<div>
|
|
<input type='radio' name='notifications' id='notification-setting-message' value='message'>
|
|
<label for='notification-setting-message'>{{ nameAndMessage }} </label>
|
|
</div>
|
|
<div>
|
|
<input type='radio' name='notifications' id='notification-setting-name' value='name'/>
|
|
<label for='notification-setting-name'>{{ nameOnly }} </label>
|
|
</div>
|
|
<div>
|
|
<input type='radio' name='notifications' id='notification-setting-count' value='count'/>
|
|
<label for='notification-setting-count'>{{ noNameOrMessage }} </label>
|
|
</div>
|
|
<div>
|
|
<input type='radio' name='notifications' id='notification-setting-off' value='off'/>
|
|
<label for='notification-setting-off'>{{ disableNotifications }} </label>
|
|
</div>
|
|
</div>
|
|
{{ #isDrawAttentionSupported }}
|
|
<br />
|
|
<div class='draw-attention-setting'>
|
|
<input type='checkbox' name='notification-draw-attention' id='notification-draw-attention'/>
|
|
<label for='notification-draw-attention'>{{ notificationDrawAttention }}</label>
|
|
</div>
|
|
{{ /isDrawAttentionSupported }}
|
|
<br />
|
|
{{ #isAudioNotificationSupported }}
|
|
<div class='audio-notification-setting'>
|
|
<input type='checkbox' name='audio-notification' id='audio-notification'/>
|
|
<label for='audio-notification'>{{ audioNotificationDescription }}</label>
|
|
</div>
|
|
{{ /isAudioNotificationSupported }}
|
|
<hr>
|
|
<h3>{{ generalHeader }}</h3>
|
|
<div class='spell-check-setting'>
|
|
<input type='checkbox' name='spell-check-setting' id='spell-check-setting' />
|
|
<label for='spell-check-setting'>{{ spellCheckDescription }}</label>
|
|
<p class='spell-check-setting-message' style='display: {{ spellCheckDisplay }};' aria-hidden='{{ spellCheckHidden }}'>
|
|
{{ spellCheckDirtyText }}
|
|
</p>
|
|
</div>
|
|
<hr>
|
|
<div class='calling-setting'>
|
|
<h3>{{ calling }}</h3>
|
|
<div class='always-relay-calls-setting'>
|
|
<input type='checkbox' name='always-relay-calls' id='always-relay-calls' />
|
|
<label for='always-relay-calls'>{{ alwaysRelayCallsDescription }}</label>
|
|
<p>
|
|
<div class='detail'>
|
|
{{ alwaysRelayCallsDetail }}
|
|
</div>
|
|
</p>
|
|
</div>
|
|
<div class='call-ringtone-notification-setting'>
|
|
<input type='checkbox' name='call-ringtone-notification' id='call-ringtone-notification'/>
|
|
<label for='call-ringtone-notification'>{{ callRingtoneNotificationDescription }}</label>
|
|
</div>
|
|
<div class='call-system-notification-setting'>
|
|
<input type='checkbox' name='call-system-notification' id='call-system-notification'/>
|
|
<label for='call-system-notification'>{{ callSystemNotificationDescription }}</label>
|
|
</div>
|
|
<div class='incoming-call-notification-setting'>
|
|
<input type='checkbox' name='incoming-call-notification' id='incoming-call-notification'/>
|
|
<label for='incoming-call-notification'>{{ incomingCallNotificationDescription }}</label>
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class='permissions-setting'>
|
|
<h3>{{ permissions }}</h3>
|
|
<div class='media-permissions'>
|
|
<input type='checkbox' name='media-permissions' id='media-permissions' />
|
|
<label for='media-permissions'>{{ mediaPermissionsDescription }}</label>
|
|
</div>
|
|
<div class='media-camera-permissions'>
|
|
<input type='checkbox' name='media-camera-permissions' id='media-camera-permissions' />
|
|
<label for='media-camera-permissions'>{{ mediaCameraPermissionsDescription }}</label>
|
|
</div>
|
|
</div>
|
|
<div class='sync-setting'></div>
|
|
<hr>
|
|
<div class='clear-data-settings'>
|
|
<h3>{{ clearDataHeader }}</h3>
|
|
<div>
|
|
<button class='grey destructive clear-data'>{{ clearDataButton }}</button>
|
|
<p>{{ clearDataExplanation }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</script>
|
|
<script type='text/javascript' src='js/components.js'></script>
|
|
<script type='text/javascript' src='js/views/whisper_view.js'></script>
|
|
<script type='text/javascript' src='js/views/settings_view.js'></script>
|
|
<script type='text/javascript' src='js/settings_start.js'></script>
|
|
</html>
|