| <link rel="import" href="chrome://resources/html/polymer.html"> |
| |
| <link rel="import" href="chrome://resources/cr_elements/cr_radio_button/cr_radio_button.html"> |
| <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> |
| <link rel="import" href="chrome://resources/html/load_time_data.html"> |
| <link rel="import" href="../deep_linking_behavior.html"> |
| <link rel="import" href="../os_route.html"> |
| <link rel="import" href="../localized_link/localized_link.html"> |
| <link rel="import" href="../../controls/settings_radio_group.html"> |
| <link rel="import" href="../../controls/settings_dropdown_menu.html"> |
| <link rel="import" href="../../controls/settings_slider.html"> |
| <link rel="import" href="../../controls/settings_toggle_button.html"> |
| <link rel="import" href="../../prefs/prefs_behavior.html"> |
| <link rel="import" href="../../settings_shared_css.html"> |
| <link rel="import" href="../../router.html"> |
| <link rel="import" href="device_page_browser_proxy.html"> |
| |
| <dom-module id="settings-pointers"> |
| <template> |
| <style include="settings-shared"> |
| h2 { |
| padding-inline-start: var(--cr-section-padding); |
| } |
| |
| .subsection { |
| padding-inline-end: var(--cr-section-padding); |
| padding-inline-start: var(--cr-section-indent-padding); |
| } |
| |
| .subsection > settings-toggle-button, |
| .subsection > .settings-box { |
| padding-inline-end: 0; |
| padding-inline-start: 0; |
| } |
| |
| #enableReverseScrollingToggle { |
| border-top: none; |
| padding-inline-end: 0; |
| } |
| </style> |
| <div id="mouse" hidden$="[[!hasMouse]]"> |
| <!-- Subsection title only appears if multiple sections are visible. --> |
| <h2 hidden$="[[!showHeadings_]]">$i18n{mouseTitle}</h2> |
| <div class$="[[subsectionClass_]]"> |
| <div class="settings-box"> |
| <div class="start settings-box-text" id="mouseSwapButtonLabel"> |
| $i18n{mouseSwapButtons} |
| </div> |
| <settings-dropdown-menu id="mouseSwapButtonDropdown" |
| aria-labeledby="mouseSwapButtonLabel" |
| pref="{{prefs.settings.mouse.primary_right}}" |
| menu-options="[[swapPrimaryOptions]]" |
| deep-link-focus-id$="[[Setting.kMouseSwapPrimaryButtons]]"> |
| </settings-dropdown-menu> |
| </div> |
| <template is="dom-if" if="[[allowDisableAcceleration_]]"> |
| <settings-toggle-button id="mouseAcceleration" |
| class="hr" |
| pref="{{prefs.settings.mouse.acceleration}}" |
| label="$i18n{mouseAccelerationLabel}" |
| deep-link-focus-id$="[[Setting.kMouseAcceleration]]"> |
| </settings-toggle-button> |
| </template> |
| <div class="settings-box"> |
| <div class="start" id="mouseSpeedLabel" aria-hidden="true"> |
| $i18n{mouseSpeed} |
| </div> |
| <settings-slider id="mouseSpeedSlider" |
| pref="{{prefs.settings.mouse.sensitivity2}}" |
| ticks="[[sensitivityValues_]]" |
| label-aria="$i18n{mouseSpeed}" |
| label-min="$i18n{pointerSlow}" |
| label-max="$i18n{pointerFast}" |
| deep-link-focus-id$="[[Setting.kMouseSpeed]]"> |
| </settings-slider> |
| </div> |
| <template is="dom-if" if="[[allowScrollSettings_]]"> |
| <settings-toggle-button id="mouseScrollAcceleration" |
| class="hr" |
| pref="{{prefs.settings.mouse.scroll_acceleration}}" |
| label="$i18n{mouseScrollAccelerationLabel}" |
| deep-link-focus-id$="[[Setting.kMouseScrollAcceleration]]"> |
| </settings-toggle-button> |
| <div class="settings-box"> |
| <div class="start" id="mouseScrollSpeedLabel" aria-hidden="true"> |
| $i18n{mouseScrollSpeed} |
| </div> |
| <settings-slider pref="{{prefs.settings.mouse.scroll_sensitivity}}" |
| ticks="[[sensitivityValues_]]" |
| label-aria="$i18n{mouseScrollSpeed}" |
| label-min="$i18n{pointerSlow}" |
| label-max="$i18n{pointerFast}"> |
| </settings-slider> |
| </div> |
| </template> |
| <div class="settings-box" id="mouseReverseScrollRow" |
| on-click="onMouseReverseScrollRowClicked_"> |
| <div class="start settings-box-text"> |
| <settings-localized-link |
| on-click="onLearnMoreLinkClicked_" |
| id="enableMouseReverseScrollingLabel" |
| localized-string="$i18n{mouseReverseScroll}" |
| link-url="$i18n{naturalScrollLearnMoreLink}"> |
| </settings-localized-link> |
| </div> |
| <cr-toggle id="mouseReverseScroll" |
| checked="{{prefs.settings.mouse.reverse_scroll.value}}" |
| aria-labelledby="enableMouseReverseScrollingLabel" |
| deep-link-focus-id$="[[Setting.kMouseReverseScrolling]]"> |
| </cr-toggle> |
| </div> |
| </div> |
| </div> |
| <div id="pointingStick" hidden$="[[!hasPointingStick]]"> |
| <!-- Subsection title only appears if multiple sections are visible. --> |
| <h2 hidden$="[[!showHeadings_]]">$i18n{pointingStickTitle}</h2> |
| <div class$="[[subsectionClass_]]"> |
| <div class="settings-box"> |
| <div class="start settings-box-text" |
| id="pointingStickSwapButtonLabel"> |
| $i18n{pointingStickPrimaryButton} |
| </div> |
| <settings-dropdown-menu id="pointingStickSwapButtonDropdown" |
| aria-labeledby="pointingStickSwapButtonLabel" |
| pref="{{prefs.settings.pointing_stick.primary_right}}" |
| menu-options="[[swapPrimaryOptions]]" |
| deep-link-focus-id$= |
| "[[Setting.kPointingStickSwapPrimaryButtons]]"> |
| </settings-dropdown-menu> |
| </div> |
| <template is="dom-if" if="[[allowDisableAcceleration_]]"> |
| <settings-toggle-button id="pointingStickAcceleration" |
| class="hr" |
| pref="{{prefs.settings.pointing_stick.acceleration}}" |
| label="$i18n{pointingStickAccelerationLabel}" |
| deep-link-focus-id$="[[Setting.kPointingStickAcceleration]]"> |
| </settings-toggle-button> |
| </template> |
| <div class="settings-box"> |
| <div class="start" id="pointingStickSpeedLabel" aria-hidden="true"> |
| $i18n{pointingStickSpeed} |
| </div> |
| <settings-slider id="pointingStickSpeedSlider" |
| pref="{{prefs.settings.pointing_stick.sensitivity}}" |
| ticks="[[sensitivityValues_]]" |
| label-aria="$i18n{pointingStickSpeed}" |
| label-min="$i18n{pointerSlow}" |
| label-max="$i18n{pointerFast}" |
| deep-link-focus-id$="[[Setting.kPointingStickSpeed]]"> |
| </settings-slider> |
| </div> |
| </div> |
| </div> |
| <div id="touchpad" hidden$="[[!hasTouchpad]]"> |
| <!-- Subsection title only appears if multiple sections are visible. --> |
| <h2 hidden$="[[!showHeadings_]]">$i18n{touchpadTitle}</h2> |
| <div class$="[[subsectionClass_]]"> |
| <settings-toggle-button id="enableTapToClick" |
| pref="{{prefs.settings.touchpad.enable_tap_to_click}}" |
| label="$i18n{touchpadTapToClickEnabledLabel}" |
| deep-link-focus-id$="[[Setting.kTouchpadTapToClick]]"> |
| </settings-toggle-button> |
| <settings-toggle-button id="enableTapDragging" |
| class="hr" |
| pref="{{prefs.settings.touchpad.enable_tap_dragging}}" |
| label="$i18n{tapDraggingLabel}" |
| deep-link-focus-id$="[[Setting.kTouchpadTapDragging]]"> |
| </settings-toggle-button> |
| <template is="dom-if" if="[[allowDisableAcceleration_]]"> |
| <settings-toggle-button id="touchpadAcceleration" |
| class="hr" |
| pref="{{prefs.settings.touchpad.acceleration}}" |
| label="$i18n{touchpadAccelerationLabel}" |
| deep-link-focus-id$="[[Setting.kTouchpadAcceleration]]"> |
| </settings-toggle-button> |
| </template> |
| <div class="settings-box"> |
| <div class="start" id="touchpadSpeedLabel" aria-hidden="true"> |
| $i18n{touchpadSpeed} |
| </div> |
| <settings-slider id="touchpadSensitivity" |
| pref="{{prefs.settings.touchpad.sensitivity2}}" |
| ticks="[[sensitivityValues_]]" |
| label-aria="$i18n{touchpadSpeed}" |
| label-min="$i18n{pointerSlow}" |
| label-max="$i18n{pointerFast}" |
| deep-link-focus-id$="[[Setting.kTouchpadSpeed]]"> |
| </settings-slider> |
| </div> |
| <template is="dom-if" if="[[allowScrollSettings_]]"> |
| <settings-toggle-button id="touchpadScrollAcceleration" |
| class="hr" |
| pref="{{prefs.settings.touchpad.scroll_acceleration}}" |
| label="$i18n{touchpadScrollAccelerationLabel}" |
| deep-link-focus-id$="[[Setting.kTouchpadScrollAcceleration]]"> |
| </settings-toggle-button> |
| <div class="settings-box"> |
| <div class="start" id="touchpadScrollSpeedLabel" aria-hidden="true"> |
| $i18n{touchpadScrollSpeed} |
| </div> |
| <settings-slider |
| pref="{{prefs.settings.touchpad.scroll_sensitivity}}" |
| ticks="[[sensitivityValues_]]" |
| label-aria="$i18n{touchpadScrollSpeed}" |
| label-min="$i18n{pointerSlow}" |
| label-max="$i18n{pointerFast}"> |
| </settings-slider> |
| </div> |
| </template> |
| <div class="settings-box" id="reverseScrollRow" |
| on-click="onTouchpadReverseScrollRowClicked_"> |
| <div class="start settings-box-text"> |
| <settings-localized-link |
| on-click="onLearnMoreLinkClicked_" |
| id="enableReverseScrollingLabel" |
| localized-string="$i18n{touchPadScrollLabel}" |
| link-url="$i18n{naturalScrollLearnMoreLink}"> |
| </settings-localized-link> |
| </div> |
| <cr-toggle id="enableReverseScrollingToggle" |
| checked="{{prefs.settings.touchpad.natural_scroll.value}}" |
| aria-labelledby="enableReverseScrollingLabel" |
| deep-link-focus-id$="[[Setting.kTouchpadReverseScrolling]]"> |
| </cr-toggle> |
| </div> |
| </div> |
| </div> |
| </template> |
| <script src="pointers.js"></script> |
| </dom-module> |
