ロングプレス
https://gyazo.com/b855035a5d0416180f8e2c9eef7f2aa0
マウスボタン長押し（1秒）でモードを切替るUserScript。
サンプル
画面の 明るさ、コントラスト、グレースケール を切り替えている。ナイトモードで眩しさ対策。
何を切り替えたら便利になるだろう・・・？
マウスドラッグ操作などブラウザの他の機能とバッティングすることが多く実用的ではなさそうです。
使いどころが限られるでしょう。
ピっと鳴く 動作音
code:script.js
window.SineBeep = function() {
return new Promise((resolve, reject) => {
var context = new AudioContext();
var oscillator = context.createOscillator();
oscillator.type = "sine";
oscillator.frequency.value = 1040;
oscillator.connect(context.destination);
oscillator.start();
var beepDuration = 50; // Beep音の長さを変数に代入
setTimeout(function() {
oscillator.stop();
resolve(); // Promiseを解決して、ビープ音が終了したことを通知
}, beepDuration + 100);
});
};
ロングプレスでモード変更・復帰
code:script.js
let timerId;
let isGray = false;
let mouseDownPosition = null;
document.addEventListener('mousedown', function(event) {
if (event.button === 0) {
// マウスの位置がスクロールバー上でないことを確認
if (event.clientX < document.documentElement.clientWidth && event.clientY < document.documentElement.clientHeight) {
mouseDownPosition = { x: event.clientX, y: event.clientY }; // マウスダウン時の座標を保存
const bodyElements = document.querySelectorAll('body:not(.modal-open)'); // .modal-open を除いた body 要素を取得
if (bodyElements.length > 0) { // 取得した要素が存在する場合のみ処理を実行
timerId = setTimeout(function() {
// .body.modal-open が存在する場合は何もしない
if (document.querySelector('.body .modal-open')) {
return;
}
if (!isGray) {
document.body.style.filter = 'brightness(80%) grayscale(70%) contrast(130%)';
} else {
document.body.style.filter = 'brightness(100%) grayscale(0%) contrast(100%)';
}
isGray = !isGray;
SineBeep(); // 動作音
}, 1000); // 1秒後に実行
}
}
}
});
document.addEventListener('mousemove', function(event) {
// マウスダウン時の座標と比較し、移動量が10px以上ならタイマーをクリア
if (mouseDownPosition && (Math.abs(event.clientX - mouseDownPosition.x) > 10 || Math.abs(event.clientY - mouseDownPosition.y) > 10)) {
clearTimeout(timerId);
}
});
document.addEventListener('mouseup', function(event) {
if (event.button === 0) {
clearTimeout(timerId); // タイマーをクリア
mouseDownPosition = null; // マウスアップ時に座標をリセット
}
});
改修
スクロールバーのドラッグ操作中に発動してしまう不具合を修正しました。
Drawモードで描画中に反応する不具合を修正しました。
マウス座標をチェックして、1秒間ほとんど動かない（座標の変化がプラス・マイナス１０ｐｘ以下）の場合に限り動作するよう修正しました。