blob: 5361cc4ee255e79a11134046a9477141fd16c231 [file] [log] [blame]
<!-- Copyright 2014 The Chromium Authors. All rights reserved.
Use of this source code is governed by a BSD-style license that can be
found in the LICENSE file. -->
<html>
<head>
<title class="i18n" msgid="options_page_title">ChromeVox Options</title>
<link rel="stylesheet" type="text/css" href="options.css" />
<script type="text/javascript" src="../../closure/base.js"></script>
<script type="text/javascript" src="../../deps.js"></script>
<script type="text/javascript" src="options_loader.js"></script>
<script type="text/javascript" src="../../chromeVoxChromeOptionsScript.js">
</script>
<link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/cr_elements/cr_radio_button/cr_radio_button.html">
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
</head>
<body>
<!--
The "with dev msgs" in the title helps when debugging problems
with the message replacer.
-->
<h1 class="i18n" msgid="options_page_title">ChromeVox (with dev msgs)</h1>
<div class="container">
<p id="version"></p>
<div class="option">
<input id="useVerboseMode" type="checkbox" class="checkbox pref"
name="useVerboseMode">
<label for="useVerboseMode" class="i18n" msgid="options_verbosity_verbose">
Enable verbose descriptions.
</label>
</div>
<div class="option">
<input id="autoRead" type="checkbox" class="checkbox pref" name="autoRead">
<label for="autoRead" class="i18n" msgid="options_auto_read">
Automatically read a page after it finishes loading.
</label>
</div>
<div class="option">
<input id="speakTextUnderMouse" type="checkbox" class="checkbox pref"
name="speakTextUnderMouse">
<label for="speakTextUnderMouse" class="i18n" msgid="options_speak_mouse">
Speak text under the mouse.
</label>
</div>
<h2 class="i18n description" msgid="options_audio_description"
id="audio-description">
When playing audio
</h2>
<div class="option">
<select id="audio-strategy" class="pref"
aria-labelledby="audio-description">
<option id="audio-normal" class="i18n" msgid="options_audio_normal">
play at normal volume even if ChromeVox is speaking
</option>
<option id="audio-duck" class="i18n" msgid="options_audio_duck">
play at lower volume when ChromeVox is speaking
</option>
<option id="audio-suspend" class="i18n" msgid="options_audio_suspend">
pause playback when ChromeVox is speaking
</option>
</select>
</div>
<h2 class="i18n" msgid="options_voices">Voices</h2>
<div class="option">
<span class="i18n description" msgid="options_voices_description"
id="voices_description">
Select current voice:
</span>
<select id="voices" aria-labelledby="voices_description"></select>
</div>
<div class="option" id="languageSwitchingOption">
<input id="languageSwitching" type="checkbox"
class="checkbox pref" name="languageSwitching">
<label for="languageSwitching" class="i18n"
msgid="options_lang_switching_checkbox_label">
Automatically detect and switch ChromeVox language.
</label>
</div>
<h2 class="chromeos i18n" msgid="options_braille">Braille</h2>
<!-- Braille Settings -->
<div class="chromeos option">
<label>
<paper-icon-button icon="cr:expand-more"
class="developer-option-icon-button" id="braille-settings-more"
name="chromevox-braille-settings"></paper-icon-button>
<paper-icon-button icon="cr:expand-less"
class="developer-option-icon-button" id="braille-settings-less"
name="chromevox-developer-options" hidden></paper-icon-button>
<span class="i18n" msgid="options_braille_settings">
Braille Settings
</span>
</label>
<div class="settings-expand-row" id="6-dot-braille" hidden>
<label>
<cr-radio-button class="left" id="braille-description-6">
6-dot braille table
</cr-radio-button>
<select class="braille-description-selection right" id="braille-table-6"
aria-labelledby="braille-description-6"></select>
</label>
</div>
<div class="settings-expand-row" id="8-dot-braille" hidden>
<label>
<cr-radio-button class="left" id="braille-description-8">
8-dot braille table
</cr-radio-button>
<select class="braille-description-selection right"
id="braille-table-8" aria-labelledby="braille-description-8">
</select>
</label>
</div>
<div class="settings-expand-row" id="braille-word-wrap" hidden>
<label>
<input id="braille-word-wrap" type="checkbox" class="checkbox pref"
name="braille-word-wrap">
<span class="i18n" msgid="options_braille_word_wrap">
Enable word wrap
</span>
</label>
</div>
</div>
<!-- Bluetooth braille display -->
<div class="chromeos option">
<label>
<paper-icon-button icon="cr:expand-more"
class="developer-option-icon-button" id="bt-braille-settings-more"
name="chromevox-braille-settings"></paper-icon-button>
<paper-icon-button icon="cr:expand-less"
class="developer-option-icon-button" id="bt-braille-settings-less"
name="chromevox-developer-options" hidden></paper-icon-button>
<span class="i18n" msgid="options_bluetooth_braille_display_title">
Bluetooth braille display
</span>
</label>
<div id="bluetooth-braille" hidden>
</div>
</div>
<!-- Virtual braille display -->
<div class="chromeos option">
<label>
<paper-icon-button icon="cr:expand-more"
class="developer-option-icon-button" id="virtual-braille-settings-more"
name="chromevox-braille-settings"></paper-icon-button>
<paper-icon-button icon="cr:expand-less"
class="developer-option-icon-button" id="virtual-braille-settings-less"
name="chromevox-developer-options" hidden></paper-icon-button>
<span class="i18n settings-description"
msgid="options_virtual_braille_display">
Virtual braille display
</span>
<span class="i18n settings-sub-description"
msgid="options_virtual_braille_display_details">
Simulates the output of a refreshable braille display
in the ChromeVox panel at the top of the screen.
</span>
</label>
<div class="settings-expand-row"
id="virtual-braille-settings-num-lines" hidden>
<span class="i18n description left"
msgid="options_virtual_braille_display_rows"
id="virtual-braille-display-rows-description">
Lines:
</span>
<input type="number" min="1" class="right"
id="virtual-braille-display-rows-input">
</div>
<div class="settings-expand-row"
id="virtual-braille-settings-lines-cells" hidden>
<label>
<span class="i18n description left"
msgid="options_virtual_braille_display_columns"
id="virtual-braille-display-columns-description">
Cells in each line:
</span>
<input type="number" min="1" class="right"
id="virtual-braille-display-columns-input">
</label>
</div>
<div class="settings-expand-row"
id="virtual-braille-settings-display" hidden>
<label>
<span class="i18n description left" msgid="options_display_style">
Display Style</span>
<select id="change-display-style"
class="pref right change-display-style"
aria-labelledby="audio-description">
<option class="i18n" msgid="options_display_style_interleave">
Interleave
</option>
<option class="i18n" msgid="options_display_style_side_by_side">
Side-by-side
</option>
</select>
</label>
</div>
</div>
<div id="bluetoothBraille"></div>
<h2 class="i18n" msgid="options_developer_options" id="developerDescription">
Developer Options
</h2>
<div class="chromeos option">
<label>
<paper-icon-button icon="cr:expand-more"
aria-describedby="developer-options-label" aria-expanded="false"
class="developer-option-icon-button"
id="chromevox-developer-options-more"
name="chromevox-developer-options"></paper-icon-button>
<paper-icon-button icon="cr:expand-less"
aria-describedby="developer-options-label" aria-expanded="true"
class="developer-option-icon-button"
id="chromevox-developer-options-less"
name="chromevox-developer-options" hidden></paper-icon-button>
<span class="i18n" msgid="options_developer_options"
id="developer-options-label">
Enable developer options
</span>
</label>
<div class="settings-expand-row" id="developer-speech-logging">
<label>
<input id="enable-speech-logging" type="checkbox"
class="checkbox pref logging" name="enableSpeechLogging">
<span class="i18n" msgid="options_developer_speech_logging">
Enable speech logging
</span>
</label>
</div>
<div class="settings-expand-row" id="developer-earcon-logging">
<label>
<input id="enable-earcon-logging" type="checkbox"
class="checkbox pref logging" name="enableEarcon-logging">
<span class="i18n" msgid="options_developer_earcon_logging">
Enable earcon logging
</span>
</label>
</div>
<div class="settings-expand-row" id="developer-braille-logging">
<label>
<input id="enable-braille-logging" type="checkbox"
class="checkbox pref logging" name="enable-braillelogging">
<span class="i18n" msgid="options_developer_braille_logging">
Enable braille logging
</span>
</label>
</div>
<div class="settings-expand-row" id="developer-event-stream">
<label>
<span class="i18n" msgid="options_event_stream_logging">
Enable event stream logging
</span>
</label>
<button id="toggle-event-stream-filters"></button>
</div>
<div class="settings-expand-row" id="show-developer-log">
<label>
<paper-icon-button icon="cr:open-in-new"
aria-describedby="show-log-label"
class="developer-option-icon-button" id="open-developer-log">
</paper-icon-button>
<span class="i18n settings-description" msgid="options_show_log"
id="show-log-label">
Show Log</span>
<span class="i18n settings-sub-description"
msgid="options_show_log_key">Search + O + W</span>
</label>
</div>
</div>
<div id="event-stream-filters" hidden>
<label><div class="option-eventstream">
<input name="activedescendantchanged" type="checkbox"
class="checkbox pref eventstream">
<span>activedescendantchanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="alert" type="checkbox"
class="checkbox pref eventstream">
<span>alert</span>
</div></label>
<label><div class="option-eventstream">
<input name="ariaAttributeChanged" type="checkbox"
class="checkbox pref eventstream">
<span>ariaAttributeChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="autocorrectionOccured" type="checkbox"
class="checkbox pref eventstream">
<span>autocorrectionOccured</span>
</div></label>
<label><div class="option-eventstream">
<input name="blur" type="checkbox"
class="checkbox pref eventstream">
<span>blur</span>
</div></label>
<label><div class="option-eventstream">
<input name="checkedStateChanged" type="checkbox"
class="checkbox pref eventstream">
<span>checkedStateChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="childrenChanged" type="checkbox"
class="checkbox pref eventstream">
<span>childrenChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="clicked" type="checkbox"
class="checkbox pref eventstream">
<span>clicked</span>
</div></label>
<label><div class="option-eventstream">
<input name="documentSelectionChanged" type="checkbox"
class="checkbox pref eventstream">
<span>documentSelectionChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="documentTitleChanged" type="checkbox"
class="checkbox pref eventstream">
<span>documentTitleChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="expandedChanged" type="checkbox"
class="checkbox pref eventstream">
<span>expandedChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="focus" type="checkbox"
class="checkbox pref eventstream">
<span>focus</span>
</div></label>
<label><div class="option-eventstream">
<input name="focusContext" type="checkbox"
class="checkbox pref eventstream">
<span>focusContext</span>
</div></label>
<label><div class="option-eventstream">
<input name="imageFrameUpdated" type="checkbox"
class="checkbox pref eventstream">
<span>imageFrameUpdated</span>
</div></label>
<label><div class="option-eventstream">
<input name="hide" type="checkbox"
class="checkbox pref eventstream">
<span>hide</span>
</div></label>
<label><div class="option-eventstream">
<input name="hitTestResult" type="checkbox"
class="checkbox pref eventstream">
<span>hitTestResult</span>
</div></label>
<label><div class="option-eventstream">
<input name="hover" type="checkbox"
class="checkbox pref eventstream">
<span>hover</span>
</div></label>
<label><div class="option-eventstream">
<input name="invalidStatusChanged" type="checkbox"
class="checkbox pref eventstream">
<span>invalidStatusChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="layoutComplete" type="checkbox"
class="checkbox pref eventstream">
<span>layoutComplete</span>
</div></label>
<label><div class="option-eventstream">
<input name="liveRegionCreated" type="checkbox"
class="checkbox pref eventstream">
<span>liveRegionCreated</span>
</div></label>
<label><div class="option-eventstream">
<input name="liveRegionChanged" type="checkbox"
class="checkbox pref eventstream">
<span>liveRegionChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="loadComplete" type="checkbox"
class="checkbox pref eventstream">
<span>loadComplete</span>
</div></label>
<label><div class="option-eventstream">
<input name="locationChanged" type="checkbox"
class="checkbox pref eventstream">
<span>locationChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="mediaStartedPlaying" type="checkbox"
class="checkbox pref eventstream">
<span>mediaStartedPlaying</span>
</div></label>
<label><div class="option-eventstream">
<input name="mediaStoppedPlaying" type="checkbox"
class="checkbox pref eventstream">
<span>mediaStoppedPlaying</span>
</div></label>
<label><div class="option-eventstream">
<input name="menuEnd" type="checkbox"
class="checkbox pref eventstream">
<span>menuEnd</span>
</div></label>
<label><div class="option-eventstream">
<input name="menuListItemSelected" type="checkbox"
class="checkbox pref eventstream">
<span>menuListItemSelected</span>
</div></label>
<label><div class="option-eventstream">
<input name="menuListValueChanged" type="checkbox"
class="checkbox pref eventstream">
<span>menuListValueChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="menuPopupEnd" type="checkbox"
class="checkbox pref eventstream">
<span>menuPopupEnd</span>
</div></label>
<label><div class="option-eventstream">
<input name="menuPopupStart" type="checkbox"
class="checkbox pref eventstream">
<span>menuPopupStart</span>
</div></label>
<label><div class="option-eventstream">
<input name="menuStart" type="checkbox"
class="checkbox pref eventstream">
<span>menuStart</span>
</div></label>
<label><div class="option-eventstream">
<input name="mouseCanceled" type="checkbox"
class="checkbox pref eventstream">
<span>mouseCanceled</span>
</div></label>
<label><div class="option-eventstream">
<input name="mouseDragged" type="checkbox"
class="checkbox pref eventstream">
<span>mouseDragged</span>
</div></label>
<label><div class="option-eventstream">
<input name="mouseMoved" type="checkbox"
class="checkbox pref eventstream">
<span>mouseMoved</span>
</div></label>
<label><div class="option-eventstream">
<input name="mousePressed" type="checkbox"
class="checkbox pref eventstream">
<span>mousePressed</span>
</div></label>
<label><div class="option-eventstream">
<input name="mouseReleased" type="checkbox"
class="checkbox pref eventstream">
<span>mouseReleased</span>
</div></label>
<label><div class="option-eventstream">
<input name="rowCollapsed" type="checkbox"
class="checkbox pref eventstream">
<span>rowCollapsed</span>
</div></label>
<label><div class="option-eventstream">
<input name="rowCountChanged" type="checkbox"
class="checkbox pref eventstream">
<span>rowCountChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="rowExpanded" type="checkbox"
class="checkbox pref eventstream">
<span>rowExpanded</span>
</div></label>
<label><div class="option-eventstream">
<input name="scrollPositionChanged" type="checkbox"
class="checkbox pref eventstream">
<span>scrollPositionChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="scrolledToAnchor" type="checkbox"
class="checkbox pref eventstream">
<span>scrolledToAnchor</span>
</div></label>
<label><div class="option-eventstream">
<input name="selectedChildrenChanged" type="checkbox"
class="checkbox pref eventstream">
<span>selectedChildrenChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="selection" type="checkbox"
class="checkbox pref eventstream">
<span>selection</span>
</div></label>
<label><div class="option-eventstream">
<input name="selectionAdd" type="checkbox"
class="checkbox pref eventstream">
<span>selectionAdd</span>
</div></label>
<label><div class="option-eventstream">
<input name="selectionRemove" type="checkbox"
class="checkbox pref eventstream">
<span>selectionRemove</span>
</div></label>
<label><div class="option-eventstream">
<input name="show" type="checkbox"
class="checkbox pref eventstream">
<span>show</span>
</div></label>
<label><div class="option-eventstream">
<input name="stateChanged" type="checkbox"
class="checkbox pref eventstream">
<span>stateChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="textChanged" type="checkbox"
class="checkbox pref eventstream">
<span>textChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="textSelectionChanged" type="checkbox"
class="checkbox pref eventstream">
<span>textSelectionChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="treeChanged" type="checkbox"
class="checkbox pref eventstream">
<span>treeChanged</span>
</div></label>
<label><div class="option-eventstream">
<input name="valueChanged" type="checkbox"
class="checkbox pref eventstream">
<span>valueChanged</span>
</div></label>
</div>
</div>
<div id="status" role="live" aria-live="assertive">
</div>
</div>
</body>
</html>