Add pointer-events: none to visitor banner mask

Co-authored-by: syuilo <4439005+syuilo@users.noreply.github.com>

CHANGELOG.md

@@ -1,15 +1,3 @@
-## Unreleased
-
-### General
--
-
-### Client
-- Fix: アプリ内からキャッシュをクリアするとテーマ再適用するまでレンダリングが正しく行われない問題を修正
-
-### Server
--
-
-
 ## 2025.10.1
 
 ### General
@@ -25,7 +13,6 @@
 - Fix: 一部のブラウザでバナー画像が上下中央に表示されない問題を修正
 - Fix: ナビゲーションバーの設定で削除した項目をその場で再追加できない問題を修正
 - Fix: ロールポリシーによりダイレクトメッセージが無効化されている際のデッキのダイレクトメッセージカラムの挙動を改善
-- Fix: 画像のマスクでタッチ操作が不安定な問題を修正
 - Fix: ウォーターマークの各種挙動修正
   - ウォーターマークを回転させると歪む問題を修正
   - ウォーターマークを敷き詰めると上下左右反転した画像/文字が表示される問題を修正

locales/ko-KR.yml

@@ -3201,7 +3201,6 @@ _watermarkEditor:
   title: "워터마크 편집"
   cover: "전체에 붙이기"
   repeat: "전면에 깔기"
-  preserveBoundingRect: "회전 시 빠져나오지 않도록 조정"
   opacity: "불투명도"
   scale: "크기"
   text: "텍스트"

locales/zh-CN.yml

@@ -3201,7 +3201,6 @@ _watermarkEditor:
   title: "编辑水印"
   cover: "覆盖全体"
   repeat: "平铺"
-  preserveBoundingRect: "调整为旋转时不超出范围"
   opacity: "不透明度"
   scale: "大小"
   text: "文本"

locales/zh-TW.yml

@@ -3200,7 +3200,6 @@ _watermarkEditor:
   title: "編輯浮水印"
   cover: "覆蓋整體"
   repeat: "佈局"
-  preserveBoundingRect: "調整使其在旋轉時不會突出"
   opacity: "透明度"
   scale: "大小"
   text: "文字"

package.json

@@ -1,6 +1,6 @@
 {
 	"name": "misskey",
-	"version": "2025.10.1",
+	"version": "2025.10.1-beta.3",
 	"codename": "nasubi",
 	"repository": {
 		"type": "git",

packages/frontend/src/components/MkImageEffectorDialog.vue

@@ -19,7 +19,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 	<div :class="$style.root">
 		<div :class="$style.container">
 			<div :class="$style.preview">
-				<canvas ref="canvasEl" :class="$style.previewCanvas" @pointerdown.prevent.stop="onImagePointerdown"></canvas>
+				<canvas ref="canvasEl" :class="$style.previewCanvas" @pointerdown="onImagePointerdown"></canvas>
 				<div :class="$style.previewContainer">
 					<div class="_acrylic" :class="$style.previewTitle">{{ i18n.ts.preview }}</div>
 					<div class="_acrylic" :class="$style.editControls">
@@ -242,27 +242,31 @@ function onImagePointerdown(ev: PointerEvent) {
 
 	const AW = canvasEl.value.clientWidth;
 	const AH = canvasEl.value.clientHeight;
-	const BW = canvasEl.value.width; // Canvas intrinsic width (render width)
-	const BH = canvasEl.value.height; // Canvas intrinsic height (render height)
+	const BW = imageBitmap.width;
+	const BH = imageBitmap.height;
 
-	// Calculate the scale factor for object-fit: contain
-	const scale = Math.min(AW / BW, AH / BH);
-	
-	// Calculate the actual rendered size of the canvas content
-	const renderW = BW * scale;
-	const renderH = BH * scale;
-	
-	// Calculate the offset to center the image
-	const xOffset = (AW - renderW) / 2;
-	const yOffset = (AH - renderH) / 2;
+	let xOffset = 0;
+	let yOffset = 0;
 
-	const rect = canvasEl.value.getBoundingClientRect();
-	const pointerOffsetX = ev.clientX - rect.left;
-	const pointerOffsetY = ev.clientY - rect.top;
+	if (AW / AH < BW / BH) { // 横長
+		yOffset = AH - BH * (AW / BW);
+	} else { // 縦長
+		xOffset = AW - BW * (AH / BH);
+	}
 
-	// Convert from client coordinates to canvas coordinates
-	let startX = (pointerOffsetX - xOffset) / scale;
-	let startY = (pointerOffsetY - yOffset) / scale;
+	xOffset /= 2;
+	yOffset /= 2;
+
+	let startX = ev.offsetX - xOffset;
+	let startY = ev.offsetY - yOffset;
+
+	if (AW / AH < BW / BH) { // 横長
+		startX = startX / (Math.max(AW, AH) / Math.max(BH / BW, 1));
+		startY = startY / (Math.max(AW, AH) / Math.max(BW / BH, 1));
+	} else { // 縦長
+		startX = startX / (Math.min(AW, AH) / Math.max(BH / BW, 1));
+		startY = startY / (Math.min(AW, AH) / Math.max(BW / BH, 1));
+	}
 
 	const id = genId();
 	if (penMode.value === 'fill') {
@@ -307,15 +311,19 @@ function onImagePointerdown(ev: PointerEvent) {
 		});
 	}
 
-	_move(ev.clientX, ev.clientY);
+	_move(ev.offsetX, ev.offsetY);
 
-	function _move(pointerClientX: number, pointerClientY: number) {
-		const pointerX = pointerClientX - rect.left;
-		const pointerY = pointerClientY - rect.top;
-		
-		// Convert from client coordinates to canvas coordinates
-		let x = (pointerX - xOffset) / scale;
-		let y = (pointerY - yOffset) / scale;
+	function _move(pointerX: number, pointerY: number) {
+		let x = pointerX - xOffset;
+		let y = pointerY - yOffset;
+
+		if (AW / AH < BW / BH) { // 横長
+			x = x / (Math.max(AW, AH) / Math.max(BH / BW, 1));
+			y = y / (Math.max(AW, AH) / Math.max(BW / BH, 1));
+		} else { // 縦長
+			x = x / (Math.min(AW, AH) / Math.max(BH / BW, 1));
+			y = y / (Math.min(AW, AH) / Math.max(BW / BH, 1));
+		}
 
 		const scaleX = Math.abs(x - startX);
 		const scaleY = Math.abs(y - startY);
@@ -332,7 +340,7 @@ function onImagePointerdown(ev: PointerEvent) {
 	}
 
 	function move(ev: PointerEvent) {
-		_move(ev.clientX, ev.clientY);
+		_move(ev.offsetX, ev.offsetY);
 	}
 
 	function up() {
@@ -440,7 +448,6 @@ function onImagePointerdown(ev: PointerEvent) {
 	margin: 20px;
 	box-sizing: border-box;
 	object-fit: contain;
-	touch-action: none;
 }
 
 .controls {

packages/frontend/src/components/MkStreamingNotesTimeline.vue

@@ -500,6 +500,7 @@ defineExpose({
 		rgb(0 0 0 / 95.1%) 42.25%,
 		rgb(0 0 0 / 100%) 50%
 	);
+	pointer-events: none;
 }
 
 .newBg2 {
@@ -517,6 +518,7 @@ defineExpose({
 		rgb(0 0 0 / 95.1%) 91.9%,
 		rgb(0 0 0 / 100%) 100%
 	);
+	pointer-events: none;
 }
 
 .newButton {

packages/frontend/src/pages/about-misskey.vue

@@ -295,9 +295,6 @@ const patronsWithIcon = [{
 }, {
 	name: 'しゃどかの',
 	icon: 'https://assets.misskey-hub.net/patrons/5bec3c6b402942619e03f7a2ae76d69e.jpg',
-}, {
-	name: '大賀愛一郎',
-	icon: 'https://assets.misskey-hub.net/patrons/c701a797d1df4125970f25d3052250ac.jpg',
 }];
 
 const patrons = [

packages/frontend/src/theme.ts

@@ -242,9 +242,3 @@ export async function installTheme(code: string): Promise<void> {
 	if (!theme) return;
 	await addTheme(theme);
 }
-
-export function clearAppliedThemeCache() {
-	miLocalStorage.removeItem('theme');
-	miLocalStorage.removeItem('themeId');
-	miLocalStorage.removeItem('themeCachedVersion');
-}

packages/frontend/src/ui/_common_/navbar.vue

@@ -246,6 +246,7 @@ function menuEdit() {
 			rgb(0 0 0 / 95.1%) 42.25%,
 			rgb(0 0 0 / 100%) 50%
 		);
+		pointer-events: none;
 	}
 
 	&::after {
@@ -266,6 +267,7 @@ function menuEdit() {
 			rgb(0 0 0 / 95.1%) 91.9%,
 			rgb(0 0 0 / 100%) 100%
 		);
+		pointer-events: none;
 	}
 }
 
@@ -317,6 +319,7 @@ function menuEdit() {
 			rgb(0 0 0 / 95.1%) 91.9%,
 			rgb(0 0 0 / 100%) 100%
 		);
+		pointer-events: none;
 	}
 }
 

packages/frontend/src/ui/visitor.vue

@@ -122,6 +122,7 @@ onMounted(() => {
 	background-size: cover;
 	-webkit-mask-image: linear-gradient(rgba(0, 0, 0, 1.0), transparent);
 	mask-image: linear-gradient(rgba(0, 0, 0, 1.0), transparent);
+	pointer-events: none;
 }
 
 .dashboard {

packages/frontend/src/utility/clear-cache.ts

@@ -9,15 +9,14 @@ import * as os from '@/os.js';
 import { miLocalStorage } from '@/local-storage.js';
 import { fetchCustomEmojis } from '@/custom-emojis.js';
 import { fetchInstance } from '@/instance.js';
-import { clearAppliedThemeCache } from '@/theme.js';
 
 export async function clearCache() {
 	os.waiting();
 	miLocalStorage.removeItem('instance');
 	miLocalStorage.removeItem('instanceCachedAt');
+	miLocalStorage.removeItem('theme');
 	miLocalStorage.removeItem('emojis');
 	miLocalStorage.removeItem('lastEmojisFetchedAt');
-	clearAppliedThemeCache();
 	await misskeyApiGet('clear-browser-cache', {}).catch(() => {
 		// ignore
 	});

packages/misskey-js/package.json

@@ -1,7 +1,7 @@
 {
 	"type": "module",
 	"name": "misskey-js",
-	"version": "2025.10.1",
+	"version": "2025.10.1-beta.3",
 	"description": "Misskey SDK for JavaScript",
 	"license": "MIT",
 	"main": "./built/index.js",