danoniplus 48.0.0 → 48.1.1

package/js/danoni_main.js

@@ -4,12 +4,12 @@
  * 
  * Source by tickle
  * Created : 2018/10/08
- * Revised : 2026/05/17
+ * Revised : 2026/05/23
  *
  * https://github.com/cwtickle/danoniplus
  */
-const g_version = `Ver 48.0.0`;
-const g_revisedDate = `2026/05/17`;
+const g_version = `Ver 48.1.1`;
+const g_revisedDate = `2026/05/23`;
 
 // カスタム用バージョン (danoni_custom.js 等で指定可)
 let g_localVersion = ``;
@@ -1809,6 +1809,7 @@ const g_handler = (() => {
 			if (key in events) {
 				const e = events[key];
 				e.target.removeEventListener(e.type, e.listener, e.capture);
+				delete events[key];
 			}
 		}
 	};
@@ -2008,6 +2009,7 @@ const makeBgCanvas = (_ctx, { w = g_sWidth, h = g_sHeight } = {}) => {
  * @param {string} [_customDisplayName=''] 画面名(メイン画面: 'Main', それ以外: 空)
  */
 const clearWindow = (_redrawFlg = false, _customDisplayName = ``) => {
+	closeDisplayPreview();
 	resetKeyControl();
 	resetTransform();
 	resetXY();
@@ -7086,8 +7088,8 @@ const setSpriteList = _settingList => {
 	const spriteList = [];
 	Object.keys(_settingList).forEach(setting =>
 		spriteList[setting] = createEmptySprite(optionsprite, `${setting}Sprite`, {
-			x: 25, y: _settingList[setting].heightPos * g_limitObj.setLblHeight + _settingList[setting].y + 20,
-			w: optionWidth + _settingList[setting].dw, h: g_limitObj.setLblHeight + _settingList[setting].dh,
+			x: 25, y: _settingList[setting].heightPos * g_limitObj.setLblHeight + (_settingList[setting].y || 0) + 20,
+			w: optionWidth + (_settingList[setting].dw || 0), h: g_limitObj.setLblHeight + (_settingList[setting].dh || 0),
 		}));
 	return spriteList;
 };
@@ -9075,7 +9077,13 @@ const settingsDisplayInit = () => {
 	createSettingsDisplayWindow(divRoot);
 
 	// ショートカットキーメッセージ
-	divRoot.appendChild(createDescDiv(`scMsg`, g_lblNameObj.sdShortcutDesc));
+	multiAppend(divRoot,
+		createDescDiv(`scMsg`, g_lblNameObj.sdShortcutDesc),
+		createCss2Button(`btnDisplayPreview`, `↓ Preview`, _evt => {
+			toggleDisplayPreview();
+		}, g_lblPosObj.btnDisplayPreview, g_cssObj.button_Setting),
+	);
+	createScText(btnDisplayPreview, `DisplayPreview`, { displayName: `settingsDisplay`, targetLabel: `btnDisplayPreview`, x: -25 });
 
 	// ユーザカスタムイベント(初期)
 	safeExecuteCustomHooks(`g_customJsObj.settingsDisplay`, g_customJsObj.settingsDisplay);
@@ -9090,6 +9098,426 @@ const settingsDisplayInit = () => {
 	safeExecuteCustomHooks(`g_skinJsObj.settingsDisplay`, g_skinJsObj.settingsDisplay);
 };
 
+/** プレビューウィンドウのルートdiv */
+let g_previewRoot = null;
+
+/** プレビューで登録した一時リスナー群 */
+let g_previewLsnrKeys = new Set();
+
+/** プレビュー内の各UIオブジェクトの現在座標 */
+const g_previewPos = {
+	jdgJ: { x: null, y: null },   // 通常判定キャラクタ・コンボ
+	jdgFJ: { x: null, y: null },   // フリーズ判定キャラクタ・コンボ
+};
+
+/**
+ * プレビュー用リスナー登録（キーをレジストリへ格納）
+ */
+const addPreviewListener = (target, type, listener, capture = false) => {
+	const key = g_handler.addListener(target, type, listener, capture);
+	g_previewLsnrKeys.add(key);
+	return key;
+};
+
+/**
+ * プレビューのトグル（表示 / 非表示）
+ */
+const toggleDisplayPreview = () => {
+	if (g_previewRoot && document.getElementById(`displayPreviewOverlay`)) {
+		closeDisplayPreview();
+		g_currentPage = `settingsDisplay`;
+	} else {
+		openDisplayPreview();
+		g_currentPage = `displayPreview`;
+	}
+	setShortcutEvent(g_currentPage, () => true, { displayFlg: false });
+};
+
+/**
+ * プレビューオーバーレイを開く
+ */
+const openDisplayPreview = () => {
+	const divRoot = document.getElementById(`divRoot`);
+	if (!divRoot) return;
+
+	// 既存があれば削除
+	closeDisplayPreview();
+
+	// ============================================================
+	// オーバーレイ本体
+	// ============================================================
+	const overlay = createEmptySprite(divRoot, `displayPreviewOverlay`, {
+		w: g_sWidth, h: g_sHeight, background: g_headerObj.baseBrightFlg ? `#eeeeeedd` : `#111111dd`, pointerEvents: C_DIS_AUTO,
+	});
+	g_previewRoot = overlay;
+	multiAppend(overlay,
+		createDivCss2Label(`lblDisplayPreview`, `Display Preview`,
+			g_lblPosObj.lblDisplayPreview, g_cssObj.settings_Display),
+		createCss2Button(`btnDisplayPreview2`, `↑ Preview`, _evt => {
+			toggleDisplayPreview();
+		}, g_lblPosObj.btnDisplayPreview, g_cssObj.button_Setting),
+		createDescDiv(`lblDisplayPreviewMsg`, g_lblNameObj.displayPreviewDesc),
+	);
+
+	// ============================================================
+	// プレイ画面フレーム（白枠）
+	// ============================================================
+	const rate = 0.8;
+	const playW = g_headerObj.playingWidth || g_sWidth;
+	const playH = g_headerObj.playingHeight || g_sHeight;
+	const frameX = Math.round((g_sWidth - playW) / 2);
+	const frameY = Math.round((g_sHeight - playH) / 2);
+
+	const frame = createEmptySprite(overlay, `previewFrame`, {
+		x: frameX, y: frameY, w: playW, h: playH,
+		background: `#111111`,
+		border: `1px solid #444444`,
+		overflow: `hidden`,
+		boxSizing: `border-box`,
+		transform: `scale(${rate})`,
+	});
+
+	// ============================================================
+	// Display設定に応じたUIを描画
+	// ============================================================
+	buildPreviewUI(frame, playW, playH);
+};
+
+/**
+ * プレビューオーバーレイを閉じる
+ */
+const closeDisplayPreview = () => {
+	const overlay = document.getElementById(`displayPreviewOverlay`);
+	if (overlay) {
+		deleteChildspriteAll(`displayPreviewOverlay`);
+		overlay.remove();
+	}
+	// プレビュー専用に登録した残りのハンドラを明示解除
+	if (g_previewLsnrKeys?.size) {
+		g_previewLsnrKeys.forEach(k => g_handler.removeListener(k));
+		g_previewLsnrKeys.clear();
+	}
+	g_previewRoot = null;
+};
+
+/**
+ * プレビュー内のUI要素を構築する
+ * @param {HTMLElement} _frame     プレイ画面フレーム要素
+ * @param {number}      _playW     プレイ幅(px)
+ * @param {number}      _playH     プレイ高さ(px)
+ */
+const buildPreviewUI = (_frame, _playW, _playH) => {
+
+	// --- Display設定の現在値を取得 ---
+	const d = {
+		stepzone: g_stateObj.d_stepzone,
+		judgment: g_stateObj.d_judgment,
+		lifegauge: g_stateObj.d_lifegauge,
+		score: g_stateObj.d_score,
+		musicinfo: g_stateObj.d_musicinfo,
+	};
+
+	const disableBox = (_name, { x, y, w, h } = {}) =>
+		createDivCss2Label(`previewDisableBox_${_name}`, `${g_emojiObj.crossMark} ${_name}`, {
+			x, y, w, h, background: `rgba(0,0,0,0.5)`, border: `1px dashed #555555`,
+			size: 32, color: `#cccccc`, align: C_ALIGN_LEFT,
+		});
+
+	// ============================================================
+	// ステップゾーン（中央横帯）
+	// ============================================================
+	const stepY = g_posObj.stepY ?? C_STEP_Y;
+	const revStepY = g_posObj.reverseStepY;
+
+	if (d.stepzone === C_FLG_OFF) {
+		multiAppend(_frame,
+			disableBox(`StepZone`, { x: Math.round(_playW / 2 - 200), y: stepY, w: 400, h: 50 }),
+			disableBox(`StepZone_Rev`, { x: Math.round(_playW / 2 - 200), y: C_STEP_Y + revStepY, w: 400, h: 50 }),
+		);
+	} else {
+		// 簡易ステップゾーン（7レーン分）
+		const laneCount = 7;
+		const laneW = 50;
+		const totalW = laneCount * laneW;
+		const startX = Math.round((_playW - totalW) / 2);
+
+		for (let j = 0; j < laneCount; j++) {
+			createEmptySprite(_frame, `previewStep${j}`, {
+				x: startX + j * laneW + 2, y: stepY + 2, w: laneW - 4, h: laneW - 4,
+				background: `rgba(100,100,200,0.25)`,
+				border: `1px solid rgba(150,150,255,0.5)`,
+			});
+			createEmptySprite(_frame, `previewStepR${j}`, {
+				x: startX + j * laneW + 2, y: C_STEP_Y + revStepY + 2, w: laneW - 4, h: laneW - 4,
+				background: `rgba(200,100,100,0.20)`,
+				border: `1px solid rgba(255,150,150,0.4)`,
+			});
+		}
+	}
+
+	// ============================================================
+	// 判定エリア（ドラッグ可能）
+	// ============================================================
+	if (d.judgment === C_FLG_OFF) {
+		_frame.appendChild(disableBox(`Judgment`, {
+			x: Math.round(_playW / 2 - 220), y: Math.round((_playH + (g_posObj?.stepYR ?? 0)) / 2 - 60), w: 440, h: 120,
+		}));
+	} else {
+		const jX0 = Math.round(_playW / 2 - 220) + (g_diffObj.arrowJdgX ?? 0);
+		const jY0 = Math.round((_playH + (g_posObj?.stepYR ?? 0)) / 2 - 60) + (g_diffObj.arrowJdgY ?? 0);
+		const fX0 = Math.round(_playW / 2 - 120) + (g_diffObj.frzJdgX ?? 0);
+		const fY0 = Math.round((_playH + (g_posObj?.stepYR ?? 0)) / 2 + 10) + (g_diffObj.frzJdgY ?? 0);
+
+		const jdgInitX = g_previewPos.jdgJ.x ?? jX0;
+		const jdgInitY = g_previewPos.jdgJ.y ?? jY0;
+		const jdgFInitX = g_previewPos.jdgFJ.x ?? fX0;
+		const jdgFInitY = g_previewPos.jdgFJ.y ?? fY0;
+
+		// 通常判定グループ
+		buildDraggableJudgGroup(_frame, `jdgJ`, jdgInitX, jdgInitY, _playW, _playH, {
+			charaText: d.judgment === C_FLG_ON ? g_lblNameObj.j_ii : ``,
+			comboText: d.judgment === C_FLG_ON ? `5 Combo!!` : ``,
+			diffText: `Fast 3 Frames`,
+			charaColor: `#66ffff`,
+		});
+
+		// フリーズ判定グループ
+		buildDraggableJudgGroup(_frame, `jdgFJ`, jdgFInitX, jdgFInitY, _playW, _playH, {
+			charaText: d.judgment === C_FLG_ON ? g_lblNameObj.j_kita : ``,
+			comboText: d.judgment === C_FLG_ON ? `5 Combo!!` : ``,
+			diffText: `Fast 2 Frames`,
+			charaColor: `#ffff99`,
+		});
+	}
+
+	// ============================================================
+	// ライフゲージ（左縦帯）
+	// ============================================================
+	if (d.lifegauge === C_FLG_OFF) {
+		_frame.appendChild(disableBox(`LifeGauge`, { x: 5, y: 50, w: 15, h: _playH - 100 }));
+	} else {
+		multiAppend(_frame,
+			createDivCss2Label(`previewLifeBack`, ``, {
+				x: 5, y: 50, w: 15, h: _playH - 100,
+				background: `#333333`, border: `1px solid #555555`,
+			}),
+			createDivCss2Label(`previewLifeBar`, ``, {
+				x: 5, y: 50 + (_playH - 100) * 0.3,
+				w: 15, h: (_playH - 100) * 0.7, background: `#006666`,
+			}),
+			createDivCss2Label(`previewLifeNum`, `700`, {
+				x: 0, y: 30, w: 70, h: 20,
+				size: 14, color: `#ffffff`, background: `#006666`, align: `center`,
+			}),
+		);
+	}
+
+	// ============================================================
+	// スコア・判定カウンタ（右端縦列）
+	// ============================================================
+	if (d.score === C_FLG_OFF) {
+		_frame.appendChild(disableBox(`Score`, { x: _playW - 80, y: 20, w: 70, h: 200 }));
+	} else {
+		const scoreItems = [
+			{ color: `#66ffff`, cnt: `5` },
+			{ color: `#99ff99`, cnt: `0` },
+			{ color: `#ffcc66`, cnt: `0` },
+			{ color: `#cc99ff`, cnt: `0` },
+			{ color: `#ff9999`, cnt: `0` },
+			{ color: `#ffffff`, cnt: `5` },
+			{},
+			{ color: `#ffff99`, cnt: `5` },
+			{ color: `#99ff66`, cnt: `0` },
+			{ color: `#ffffff`, cnt: `5` },
+		];
+		const sx = _playW - 110;
+		scoreItems.forEach((item, i) => {
+			_frame.appendChild(
+				createDivCss2Label(`previewScore${i}`, item.cnt || ``, {
+					x: sx + 50, y: 20 * (i + 1), w: 50, h: 20,
+					siz: 16, color: item.color, align: `right`,
+				}),
+			);
+		});
+	}
+
+	// ============================================================
+	// 曲名・制作者（左下）
+	// ============================================================
+	if (d.musicinfo === C_FLG_OFF) {
+		_frame.appendChild(disableBox(`MusicInfo`, { x: 5, y: _playH - 50, w: _playW - 125, h: 40 }));
+	} else {
+		multiAppend(
+			_frame,
+			createDivCss2Label(`previewCredit`, `Sample Music / Artist Name`, {
+				...g_lblPosObj.previewCredit, x: 100, y: _playH - 30, w: _playW - 125, h: 20,
+			}),
+			createDivCss2Label(`previewDifName`, `[7key / Normal]`, {
+				...g_lblPosObj.previewCredit, x: 100, y: _playH - 16, w: _playW - 125, h: 16, siz: 12,
+			}),
+			createDivCss2Label(`previewTime1`, `0:04 /`, {
+				...g_lblPosObj.previewCredit, x: 18, y: _playH - 30, w: 40, h: 20, align: C_ALIGN_RIGHT,
+			}),
+			createDivCss2Label(`previewTime2`, `2:54`, {
+				...g_lblPosObj.previewCredit, x: 60, y: _playH - 30, w: 60, h: 20,
+			}),
+		)
+	}
+};
+
+/**
+ * ドラッグ可能な判定グループを生成する
+ * @param {HTMLElement} _parent    親要素
+ * @param {string}      _groupId   `jdgJ` または `jdgFJ`
+ * @param {number}      _initX     初期X座標（frame相対）
+ * @param {number}      _initY     初期Y座標（frame相対）
+ * @param {number}      _playW     プレイ幅
+ * @param {number}      _playH     プレイ高さ
+ * @param {object}      _opts      表示テキスト・色オプション
+ */
+const buildDraggableJudgGroup = (_parent, _groupId, _initX, _initY, _playW, _playH, _opts) => {
+
+	const group = createEmptySprite(_parent, `previewGrp_${_groupId}`, {
+		x: _initX, y: _initY, w: 370, h: 51, cursor: `grab`, pointerEvents: C_DIS_AUTO,
+	});
+
+	multiAppend(
+		group,
+		// キャラクタ
+		createDivCss2Label(`previewChara_${_groupId}`, _opts.charaText, {
+			x: 0, y: 0, w: g_limitObj.jdgCharaWidth, h: g_limitObj.jdgCharaHeight,
+			siz: g_limitObj.jdgCharaSiz, color: _opts.charaColor,
+		}),
+		// コンボ
+		createDivCss2Label(`previewCombo_${_groupId}`, _opts.comboText, {
+			x: 170, y: 0, w: g_limitObj.jdgCharaWidth, h: g_limitObj.jdgCharaHeight,
+			siz: g_limitObj.jdgCharaSiz, color: `#ffffff`,
+		}),
+		// Fast/Slow
+		createDivCss2Label(`previewDiff_${_groupId}`, _opts.diffText, {
+			x: 170, y: 25, w: g_limitObj.jdgCharaWidth, h: g_limitObj.jdgCharaHeight,
+			siz: g_limitObj.mainSiz, color: `#ff9966`,
+		}),
+	);
+
+	// ドラッグハンドル（薄い枠）
+	createEmptySprite(group, `lblHandle_${_groupId}`, {
+		x: 0, y: 0, w: 370, h: 51, border: `1px dashed rgba(255,255,255,0.3)`,
+		boxSizing: `border-box`, borderRadius: `2px`,
+		background: `rgba(255,255,255,0.04)`,
+	});
+
+	// ---- ドラッグ処理 ----
+	let dragging = false;
+	let dragStartX = 0, dragStartY = 0;
+	let elemStartX = 0, elemStartY = 0;
+
+	const keyDown = addPreviewListener(group, `pointerdown`, _evt => {
+		dragging = true;
+		dragStartX = _evt.clientX;
+		dragStartY = _evt.clientY;
+		elemStartX = parseInt(group.style.left, 10);
+		elemStartY = parseInt(group.style.top, 10);
+		group.style.cursor = `grabbing`;
+		group.setPointerCapture(_evt.pointerId);
+		_evt.stopPropagation();
+	});
+	const keyMove = addPreviewListener(group, `pointermove`, _evt => {
+		if (!dragging) return;
+		const dx = _evt.clientX - dragStartX;
+		const dy = _evt.clientY - dragStartY;
+		const newX = Math.max(0, Math.min(_playW - 370, elemStartX + dx));
+		const newY = Math.max(0, Math.min(_playH - 50, elemStartY + dy));
+		group.style.left = wUnit(newX);
+		group.style.top = wUnit(newY);
+		_evt.stopPropagation();
+	});
+	const keyUp = addPreviewListener(group, `pointerup`, _evt => {
+		if (!dragging) return;
+		dragging = false;
+		group.style.cursor = `grab`;
+
+		const finalX = parseInt(group.style.left, 10);
+		const finalY = parseInt(group.style.top, 10);
+
+		// ---- 座標をグローバル状態とゲーム本体に反映 ----
+		g_previewPos[_groupId].x = finalX;
+		g_previewPos[_groupId].y = finalY;
+		applyJudgPositionToGame(_groupId, finalX, finalY);
+
+		_evt.stopPropagation();
+	});
+	// pointerup が届かないケースを拾う
+	addPreviewListener(group, `pointercancel`, _evt => {
+		dragging = false;
+		group.style.cursor = `grab`;
+	});
+	group.setAttribute(`lsnrkey`, keyMove);
+	group.setAttribute(`lsnrkeyTS`, keyDown);
+	group.setAttribute(`lsnrkeyTE`, keyUp);
+};
+
+/**
+ * ドラッグ結果の座標をゲーム本体の判定位置設定に反映する
+ * @param {string} _groupId  `jdgJ` または `jdgFJ`
+ * @param {number} _x        frame相対X
+ * @param {number} _y        frame相対Y
+ */
+const applyJudgPositionToGame = (_groupId, _x, _y) => {
+	const playH = g_headerObj.playingHeight || g_sHeight;
+	const stepYR = g_posObj?.stepYR ?? 0;
+
+	// mainInit内のjdgX[0/1], jdgY[0/1]はローカル変数なため、
+	// g_diffObj経由でオフセットとして保持し、次回プレイ開始時に反映する。
+	// ここでは g_diffObj.arrowJdgY / frzJdgY をオフセット格納先として利用する。
+	//
+	// 「標準Y」= (playH + stepYR) / 2 - 60  (jdgJ の場合)
+	//           = (playH + stepYR) / 2 + 10  (jdgFJ の場合)
+	// オフセット = 実際のY - 標準Y
+
+	if (_groupId === `jdgJ`) {
+		const stdX = g_headerObj.playingWidth / 2 - 220;
+		const stdY = Math.round((playH + stepYR) / 2 - 60);
+		g_diffObj.arrowJdgX = _x - stdX;
+		g_diffObj.arrowJdgY = _y - stdY;
+		showToast(`${g_lblNameObj.arrowJdgUpdate}: dX=${g_diffObj.arrowJdgX}, dY=${g_diffObj.arrowJdgY}`);
+	} else if (_groupId === `jdgFJ`) {
+		const stdX = g_headerObj.playingWidth / 2 - 120;
+		const stdY = Math.round((playH + stepYR) / 2 + 10);
+		g_diffObj.frzJdgX = _x - stdX;
+		g_diffObj.frzJdgY = _y - stdY;
+		showToast(`${g_lblNameObj.frzJdgUpdate}: dX=${g_diffObj.frzJdgX}, dY=${g_diffObj.frzJdgY}`);
+	}
+};
+
+/**
+ * 画面上部に一時的なトーストメッセージを表示する
+ * @param {string} _msg
+ */
+const showToast = _msg => {
+	const existing = document.getElementById(`previewToast`);
+	if (existing) existing.remove();
+
+	const toast = createDivCss2Label(`previewToast`, _msg, {
+		x: g_btnX() + g_btnWidth() / 2, y: 50, w: g_btnWidth() / 2, h: 10,
+		transform: `translateX(-50%)`,
+		background: `rgba(0,40,80,0.92)`,
+		color: `#aaddff`,
+		border: `1px solid #3366aa`,
+		borderRadius: `6px`,
+		padding: `6px 16px`,
+		fontSize: `12px`,
+		fontFamily: `monospace`,
+		whiteSpace: `nowrap`,
+		pointerEvents: `none`,
+		transition: `opacity 0.4s`,
+		opacity: `1`,
+	});
+	divRoot.appendChild(toast);
+	setTimeout(() => { toast.style.opacity = `0`; }, 2200);
+	setTimeout(() => { if (toast.parentNode) toast.remove(); }, 2700);
+};
+
 /**
  * 設定・オプション画面のラベル・ボタン処理の描画
  * @param {Object} _sprite 基準とするスプライト(ここで指定する座標は、そのスプライトからの相対位置)
@@ -9148,7 +9576,7 @@ const createSettingsDisplayWindow = _sprite => {
 			g_settings.displayNum[_name] = list.findIndex(flg => flg === g_stateObj[`d_${_name.toLowerCase()}`]);
 			displaySprite.appendChild(
 				makeSettingLblCssButton(linkId, dispView(), _heightPos, () => switchDisplay(), {
-					x: 30 + 180 * _widthPos, w: 170,
+					x: 30 + 180 * _widthPos, y: 20 * _heightPos, w: 170, h: 18,
 					title: g_msgObj[`d_${_name.toLowerCase()}`], borderStyle: `solid`,
 					cxtFunc: () => switchDisplay(-1),
 				}, `button_${cssBgList[g_settings.displayNum[_name]]}`, `button_${cssBarList[g_settings.displayNum[_name]]}`)
@@ -9159,14 +9587,14 @@ const createSettingsDisplayWindow = _sprite => {
 			if (g_settings[`d_${_name}s`] !== undefined) {
 				displaySprite.appendChild(
 					makeSettingLblCssButton(`${linkId}R`, `>`, _heightPos, () => switchDisplay(1, false), {
-						x: 175 + 180 * _widthPos, w: 25, cxtFunc: () => switchDisplay(-1, false),
+						x: 175 + 180 * _widthPos, w: 25, y: 2 + 20 * _heightPos, h: 18, cxtFunc: () => switchDisplay(-1, false),
 					}, g_cssObj.button_Mini)
 				);
 			}
 		} else {
 			displaySprite.appendChild(
 				createDivCss2Label(linkId, g_lblNameObj[`d_${toCapitalize(_name)}`] + `:${g_headerObj[`${_name}Set`]}`, {
-					x: 30 + 180 * _widthPos, y: 3 + g_limitObj.setLblHeight * _heightPos,
+					x: 30 + 180 * _widthPos, y: 3 + 20 * _heightPos,
 					w: 170, siz: g_limitObj.difSelectorSiz,
 				}, g_cssObj[`button_Disabled${flg}`])
 			);
@@ -9181,7 +9609,7 @@ const createSettingsDisplayWindow = _sprite => {
 	const spriteList = setSpriteList(g_settingPos.settingsDisplay);
 
 	_sprite.appendChild(createDivCss2Label(`sdDesc`, g_lblNameObj.sdDesc, g_lblPosObj.sdDesc));
-	g_displays.forEach((name, j) => makeDisplayButton(name, j % 7, Math.floor(j / 7)));
+	g_displays.forEach((name, j) => makeDisplayButton(name, j % 6, Math.floor(j / 6)));
 
 	// ---------------------------------------------------
 	// 矢印の見え方 (Appearance)
@@ -9226,9 +9654,7 @@ const createSettingsDisplayWindow = _sprite => {
 	// ---------------------------------------------------
 	// 判定表示系の不透明度 (Opacity)
 	// 縦位置: 9
-	g_headerObj.opacityUse = false;
-	[`judgment`, `fastSlow`, `filterLine`].forEach(display =>
-		g_headerObj.opacityUse ||= g_headerObj[`${display}Use`] || g_headerObj[`${display}Set`] === C_FLG_ON);
+	g_headerObj.opacityUse = g_headerObj.judgmentUse || g_headerObj.judgmentSet === C_FLG_ON;
 
 	createGeneralSetting(spriteList.opacity, `opacity`, { unitName: g_lblNameObj.percent });
 
@@ -10431,7 +10857,6 @@ const keyconfigKeyboardPreview = (() => {
 	// 定数
 	// -------------------------------------------------------------------------
 	const C_PREVIEW_ID = `kbPreviewArea`;
-	const C_BTN_ID = `btnKbPreview`;
 	const C_CANVAS_BASE_ID = `kbCanvasBase`;
 	const C_CANVAS_MAP_ID = `kbCanvasMap`;
 
@@ -10940,18 +11365,11 @@ const keyconfigKeyboardPreview = (() => {
 	const init = divRoot => {
 		calcScale();
 
-		// ボタン: キャンバス横幅中央に配置、小さいサイズ
-		const btnW = 80;
-		const btnX = g_btnX() + Math.floor((g_btnWidth() - btnW) / 2);
-
 		// "↓ Preview" → 展開、"↑ Preview" → 閉じる のトグルボタン
-		const btn = createCss2Button(C_BTN_ID, `↓ Preview`, () => {
+		const btn = createCss2Button(`btnKbPreview`, `↓ Preview`, () => {
 			togglePreview();
 			btn.textContent = _state.visible ? `↑ Preview` : `↓ Preview`;
-		}, {
-			x: btnX, y: BTN_Y, w: btnW, h: BTN_H, siz: BTN_FS,
-			title: g_msgObj.kcPreview,
-		}, g_cssObj.button_Setting);
+		}, g_lblPosObj.btnKbPreview, g_cssObj.button_Setting);
 		divRoot.appendChild(btn);
 
 		// プレビューエリア: 水平・垂直センタリング
@@ -12199,7 +12617,7 @@ const scoreConvert = (_dosObj, _scoreId, _preblankFrame, _dummyNo = ``,
 	// 歌詞データの分解 (3つで1セット, セット毎の改行区切り可)
 	obj.wordData = [];
 	obj.wordMaxDepth = -1;
-	if (g_stateObj.d_lyrics === C_FLG_OFF) {
+	if (g_stateObj.d_background === C_FLG_OFF) {
 	} else {
 		[obj.wordData, obj.wordMaxDepth] = makeWordData(scoreIdHeader);
 	}
@@ -13399,6 +13817,8 @@ const getArrowSettings = () => {
 		const lowerDisp = _disp.toLowerCase();
 		g_workObj[`${lowerDisp}Disp`] = (g_stateObj[`d_${lowerDisp}`] === C_FLG_OFF ? C_DIS_NONE : C_DIS_INHERIT);
 	});
+	g_workObj.judgmentDisp = g_stateObj.d_judgment !== C_FLG_ON ? C_DIS_NONE : C_DIS_INHERIT;
+	g_workObj.fastslowDisp = g_stateObj.d_judgment === C_FLG_OFF ? C_DIS_NONE : C_DIS_INHERIT;
 
 	g_workObj.lifeVal = Math.floor(g_workObj.lifeInit * 100) / 100;
 	g_workObj.arrowReturnVal = 0;
@@ -13696,11 +14116,11 @@ const mainInit = () => {
 	if (g_appearanceRanges.includes(g_stateObj.appearance)) {
 		mainSprite.appendChild(createDivCss2Label(`filterView`, ``, g_lblPosObj.filterView));
 		if (g_stateObj.d_filterline === C_FLG_ON) {
-			$id(`filterView`).opacity = objOpacity;
+			$id(`filterView`).opacity = 1;
 			for (let j = 0; j < g_stateObj.layerNum; j++) {
-				$id(`filterBar${j}`).opacity = objOpacity;
+				$id(`filterBar${j}`).opacity = 1;
 				if (doubleFilterFlg) {
-					$id(`filterBar${j}_HS`).opacity = objOpacity;
+					$id(`filterBar${j}_HS`).opacity = 1;
 				}
 			}
 		}
@@ -13905,8 +14325,12 @@ const mainInit = () => {
 	const jdgGroups = [`J`, `FJ`];
 	const jdgX = [g_headerObj.playingWidth / 2 - 220, g_headerObj.playingWidth / 2 - 120];
 	const jdgY = [(g_headerObj.playingHeight + g_posObj.stepYR) / 2 - 60, (g_headerObj.playingHeight + g_posObj.stepYR) / 2 + 10];
-	if (g_stateObj.d_background === C_FLG_OFF && g_headerObj.jdgPosReset) {
+	if (g_stateObj.d_background === C_FLG_OFF && g_headerObj.jdgPosReset && g_diffObj.arrowJdgX === 0) {
+		// jdgPosResetオプションにより判定位置変更が阻害されることを防ぐため、
+		// X座標が変わった場合は判定位置変更が行われたと判断
 	} else {
+		jdgX[0] += g_diffObj.arrowJdgX;
+		jdgX[1] += g_diffObj.frzJdgX;
 		jdgY[0] += g_diffObj.arrowJdgY;
 		jdgY[1] += g_diffObj.frzJdgY;
 	}
@@ -16792,7 +17216,6 @@ const getSelectedSettingList = (_orgShuffleFlg) => {
 	let displayData = [
 		withDisplays(g_stateObj.d_stepzone, C_FLG_ON, g_lblNameObj.rd_StepZone),
 		withDisplays(g_stateObj.d_judgment, C_FLG_ON, g_lblNameObj.rd_Judgment),
-		withDisplays(g_stateObj.d_fastslow, C_FLG_ON, g_lblNameObj.rd_FastSlow),
 		withDisplays(g_stateObj.d_lifegauge, C_FLG_ON, g_lblNameObj.rd_LifeGauge),
 		withDisplays(g_stateObj.d_score, C_FLG_ON, g_lblNameObj.rd_Score),
 		withDisplays(g_stateObj.d_musicinfo, C_FLG_ON, g_lblNameObj.rd_MusicInfo),
@@ -16812,7 +17235,6 @@ const getSelectedSettingList = (_orgShuffleFlg) => {
 	let display2Data = [
 		withDisplays(g_stateObj.d_velocity, C_FLG_ON, g_lblNameObj.rd_Velocity),
 		withDisplays(g_stateObj.d_color, C_FLG_ON, g_lblNameObj.rd_Color),
-		withDisplays(g_stateObj.d_lyrics, C_FLG_ON, g_lblNameObj.rd_Lyrics),
 		withDisplays(g_stateObj.d_background, C_FLG_ON, g_lblNameObj.rd_Background),
 		withDisplays(g_stateObj.d_arroweffect, C_FLG_ON, g_lblNameObj.rd_ArrowEffect),
 		withDisplays(g_stateObj.d_special, C_FLG_ON, g_lblNameObj.rd_Special),

package/js/lib/danoni_constants.js

@@ -5,7 +5,7 @@
  *
  * Source by tickle
  * Created : 2019/11/19
- * Revised : 2026/05/17 (v48.0.0)
+ * Revised : 2026/05/23 (v48.1.1)
  *
  * https://github.com/cwtickle/danoniplus
  */
@@ -102,33 +102,33 @@ const g_limitObj = {
 const g_settingPos = {
     dataMgt: {},
     option: {
-        difficulty: { heightPos: 0, y: -5, dw: 0, dh: 10 },
-        speed: { heightPos: 2, y: 0, dw: 0, dh: 0 },
-        motion: { heightPos: 3, y: 0, dw: 0, dh: 0 },
-        reverse: { heightPos: 4, y: 0, dw: 0, dh: 0 },
-        scroll: { heightPos: 4, y: 0, dw: 0, dh: 0 },
-        shuffle: { heightPos: 5.5, y: 0, dw: 0, dh: 0 },
-        autoPlay: { heightPos: 6.5, y: 0, dw: 0, dh: 0 },
-        gauge: { heightPos: 7.5, y: 0, dw: 0, dh: 0 },
-        adjustment: { heightPos: 10.5, y: 0, dw: 0, dh: 0 },
-        fadein: { heightPos: 11.5, y: 0, dw: 0, dh: 0 },
-        volume: { heightPos: 12.5, y: 0, dw: 0, dh: 0 },
+        difficulty: { heightPos: 0, y: -5, dh: 10 },
+        speed: { heightPos: 2 },
+        motion: { heightPos: 3 },
+        reverse: { heightPos: 4 },
+        scroll: { heightPos: 4 },
+        shuffle: { heightPos: 5.5 },
+        autoPlay: { heightPos: 6.5 },
+        gauge: { heightPos: 7.5 },
+        adjustment: { heightPos: 10.5 },
+        fadein: { heightPos: 11.5 },
+        volume: { heightPos: 12.5 },
     },
     settingsDisplay: {
-        appearance: { heightPos: 7.4, y: 10, dw: 0, dh: 0 },
-        opacity: { heightPos: 9, y: 10, dw: 0, dh: 0 },
-        hitPosition: { heightPos: 10, y: 10, dw: 0, dh: 0 },
+        appearance: { heightPos: 5.8, y: 10 },
+        opacity: { heightPos: 7.4, y: 10 },
+        hitPosition: { heightPos: 8.4, y: 10 },
     },
     exSetting: {
-        playWindow: { heightPos: 0, y: 0, dw: 0, dh: 0 },
-        stepArea: { heightPos: 1, y: 0, dw: 0, dh: 0 },
-        frzReturn: { heightPos: 2.5, y: 0, dw: 0, dh: 0 },
-        shaking: { heightPos: 3.5, y: 0, dw: 0, dh: 0 },
-        effect: { heightPos: 5, y: 0, dw: 0, dh: 0 },
-        camoufrage: { heightPos: 6, y: 0, dw: 0, dh: 0 },
-        swapping: { heightPos: 7, y: 0, dw: 0, dh: 0 },
-        judgRange: { heightPos: 8.5, y: 0, dw: 0, dh: 0 },
-        autoRetry: { heightPos: 12.5, y: 0, dw: 0, dh: 0 },
+        playWindow: { heightPos: 0 },
+        stepArea: { heightPos: 1 },
+        frzReturn: { heightPos: 2.5 },
+        shaking: { heightPos: 3.5 },
+        effect: { heightPos: 5 },
+        camoufrage: { heightPos: 6 },
+        swapping: { heightPos: 7 },
+        judgRange: { heightPos: 8.5 },
+        autoRetry: { heightPos: 12.5 },
     },
 };
 
@@ -211,7 +211,7 @@ const updateWindowSiz = () => {
         difList: { x: 165, y: 60, w: 280, h: 270 + g_sHeight - 500, overflow: C_DIS_AUTO, pointerEvents: C_DIS_AUTO },
         difCover: { x: 20, y: 60, w: 145, h: 270 + g_sHeight - 500, opacity: 0.95, pointerEvents: C_DIS_AUTO },
         difFilter: { x: 0, y: 66, w: 140, h: 204 + g_sHeight - 500, overflow: C_DIS_AUTO, pointerEvents: C_DIS_AUTO },
-        displaySprite: { x: 25, y: 30, w: (g_sWidth - 450) / 2, h: g_limitObj.setLblHeight * 5 },
+        displaySprite: { x: 25, y: 25, w: (g_sWidth - 450) / 2, h: g_limitObj.setLblHeight * 5 },
         scoreDetail: { x: 20, y: 85, w: (g_sWidth - 500) / 2 + 420, h: 245 + g_sHeight - 500, visibility: `hidden`, pointerEvents: C_DIS_AUTO },
         detailMiniMapHeader: { x: 110, y: 0, w: (g_sWidth - 500) / 2 + 310, h: 15 },
         detailMiniMapSub: { x: 110, y: 15, w: (g_sWidth - 500) / 2 + 310, h: 230 + g_sHeight - 500, overflow: C_DIS_AUTO, pointerEvents: C_DIS_AUTO },
@@ -536,6 +536,19 @@ const updateWindowSiz = () => {
             x: g_limitObj.setLblLeft + g_limitObj.setLblWidth - 40, y: 0, w: 40, h: g_limitObj.setLblHeight, siz: 12,
             borderStyle: `solid`,
         },
+        lblDisplayPreview: {
+            x: g_sWidth / 2 - 100, y: 0, w: 200, h: 20, siz: 24,
+        },
+        btnDisplayPreview: {
+            x: g_btnX() + Math.floor((g_btnWidth() - 80) / 2), y: 3, w: 80, h: 18, siz: 11,
+            title: g_msgObj.displayPreview,
+        },
+        lblDisplayPreviewMsg: {
+            x: g_btnX(), y: g_sHeight - 40, w: g_btnWidth(), h: 20, siz: 14,
+        },
+        previewCredit: {
+            siz: 13, color: `#cccccc`, align: C_ALIGN_LEFT,
+        },
 
         /** キーコンフィグ画面 */
         scKcMsg: {
@@ -571,6 +584,10 @@ const updateWindowSiz = () => {
         lnkKeySwitch: {
             x: g_sWidth - 60, w: 50, h: 20, siz: 14,
         },
+        btnKbPreview: {
+            x: g_btnX() + Math.floor((g_btnWidth() - 80) / 2), y: 3, w: 80, h: 18, siz: 11,
+            title: g_msgObj.displayPreview,
+        },
 
         btnKcBack: {
             x: g_btnX(1 / 3), y: g_sHeight - 75,
@@ -1182,7 +1199,6 @@ const g_stateObj = {
 
     d_stepzone: C_FLG_ON,
     d_judgment: C_FLG_ON,
-    d_fastslow: C_FLG_ON,
     d_lifegauge: C_FLG_ON,
     d_musicinfo: C_FLG_ON,
     d_score: C_FLG_ON,
@@ -1191,7 +1207,6 @@ const g_stateObj = {
     d_color: C_FLG_ON,
     d_velocity: C_FLG_ON,
     d_arroweffect: C_FLG_ON,
-    d_lyrics: C_FLG_ON,
     d_background: C_FLG_ON,
     d_special: C_FLG_ON,
     appearance: `Visible`,
@@ -1351,18 +1366,18 @@ const g_settings = {
 
     // Display設定の拡張リスト
     d_stepZones: [`FlatBar`],
+    d_judgments: [`FastSlow`],
     d_velocitys: [`Extreme`, `Soft`],
+    d_backgrounds: [`Lyrics`],
 
     displayNum: {
         stepZone: 0,
         judgment: 0,
-        fastSlow: 0,
         lifeGauge: 0,
         score: 0,
         musicInfo: 0,
         velocity: 0,
         color: 0,
-        lyrics: 0,
         background: 0,
         arrowEffect: 0,
         special: 0,
@@ -2201,8 +2216,8 @@ const g_keycons = {
     colorCursorNum: 0,
 };
 
-let g_displays = [`stepZone`, `judgment`, `fastSlow`, `lifeGauge`, `score`, `musicInfo`, `filterLine`,
-    `velocity`, `color`, `lyrics`, `background`, `arrowEffect`, `special`];
+let g_displays = [`stepZone`, `judgment`, `lifeGauge`, `score`, `musicInfo`, `filterLine`,
+    `velocity`, `color`, `background`, `arrowEffect`, `special`];
 
 // ローカルストレージ保存対象
 let g_storeSettings = [`adjustment`, `volume`, `appearance`, `opacity`, `hitPosition`];
@@ -2277,6 +2292,8 @@ const g_posObj = {
 };
 
 const g_diffObj = {
+    arrowJdgX: 0,
+    frzJdgX: 0,
     arrowJdgY: 0,
     frzJdgY: 0,
 };
@@ -2832,6 +2849,7 @@ const g_shortcutObj = {
         KeyU: { id: `btnSettingSummary` },
     },
     settingsDisplay: {
+        KeyP: { id: `btnDisplayPreview` },
         ShiftLeft_KeyA: { id: `lnkAppearanceL` },
         ShiftRight_KeyA: { id: `lnkAppearanceL` },
         KeyA: { id: `lnkAppearanceR` },
@@ -2851,83 +2869,71 @@ const g_shortcutObj = {
         ShiftRight_Digit1: { id: `lnkstepZoneR` },
         ShiftLeft_Digit2: { id: `lnkjudgmentR` },
         ShiftRight_Digit2: { id: `lnkjudgmentR` },
-        ShiftLeft_Digit3: { id: `lnkfastSlowR` },
-        ShiftRight_Digit3: { id: `lnkfastSlowR` },
-        ShiftLeft_Digit4: { id: `lnklifeGaugeR` },
-        ShiftRight_Digit4: { id: `lnklifeGaugeR` },
-        ShiftLeft_Digit5: { id: `lnkscoreR` },
-        ShiftRight_Digit5: { id: `lnkscoreR` },
-        ShiftLeft_Digit6: { id: `lnkmusicInfoR` },
-        ShiftRight_Digit6: { id: `lnkmusicInfoR` },
-        ShiftLeft_Digit7: { id: `lnkfilterLineR` },
-        ShiftRight_Digit7: { id: `lnkfilterLineR` },
-        ShiftLeft_Digit8: { id: `lnkvelocityR` },
-        ShiftRight_Digit8: { id: `lnkvelocityR` },
-        ShiftLeft_Digit9: { id: `lnkcolorR` },
-        ShiftRight_Digit9: { id: `lnkcolorR` },
-        ShiftLeft_Digit0: { id: `lnklyricsR` },
-        ShiftRight_Digit0: { id: `lnklyricsR` },
-        ShiftLeft_Semicolon: { id: `lnkbackgroundR` },
-        ShiftRight_Semicolon: { id: `lnkbackgroundR` },
-        ShiftLeft_Minus: { id: `lnkarrowEffectR` },
-        ShiftRight_Minus: { id: `lnkarrowEffectR` },
-        ShiftLeft_Slash: { id: `lnkspecialR` },
-        ShiftRight_Slash: { id: `lnkspecialR` },
+        ShiftLeft_Digit3: { id: `lnklifeGaugeR` },
+        ShiftRight_Digit3: { id: `lnklifeGaugeR` },
+        ShiftLeft_Digit4: { id: `lnkscoreR` },
+        ShiftRight_Digit4: { id: `lnkscoreR` },
+        ShiftLeft_Digit5: { id: `lnkmusicInfoR` },
+        ShiftRight_Digit5: { id: `lnkmusicInfoR` },
+        ShiftLeft_Digit6: { id: `lnkvelocityR` },
+        ShiftRight_Digit6: { id: `lnkvelocityR` },
+        ShiftLeft_Digit7: { id: `lnkcolorR` },
+        ShiftRight_Digit7: { id: `lnkcolorR` },
+        ShiftLeft_Digit8: { id: `lnkbackgroundR` },
+        ShiftRight_Digit8: { id: `lnkbackgroundR` },
+        ShiftLeft_Digit9: { id: `lnkarrowEffectR` },
+        ShiftRight_Digit9: { id: `lnkarrowEffectR` },
+        ShiftLeft_Digit0: { id: `lnkspecialR` },
+        ShiftRight_Digit0: { id: `lnkspecialR` },
+        ShiftLeft_Semicolon: { id: `lnkfilterLineR` },
+        ShiftRight_Semicolon: { id: `lnkfilterLineR` },
 
         Digit1: { id: `lnkstepZone` },
         Digit2: { id: `lnkjudgment` },
-        Digit3: { id: `lnkfastSlow` },
-        Digit4: { id: `lnklifeGauge` },
-        Digit5: { id: `lnkscore` },
-        Digit6: { id: `lnkmusicInfo` },
-        Digit7: { id: `lnkfilterLine` },
-        Digit8: { id: `lnkvelocity` },
-        Digit9: { id: `lnkcolor` },
-        Digit0: { id: `lnklyrics` },
-        Semicolon: { id: `lnkbackground` },
-        Minus: { id: `lnkarrowEffect` },
-        Slash: { id: `lnkspecial` },
+        Digit3: { id: `lnklifeGauge` },
+        Digit4: { id: `lnkscore` },
+        Digit5: { id: `lnkmusicInfo` },
+        Digit6: { id: `lnkvelocity` },
+        Digit7: { id: `lnkcolor` },
+        Digit8: { id: `lnkbackground` },
+        Digit9: { id: `lnkarrowEffect` },
+        Digit0: { id: `lnkspecial` },
+        Semicolon: { id: `lnkfilterLine` },
 
         ShiftLeft_Numpad1: { id: `lnkstepZoneR` },
         ShiftRight_Numpad1: { id: `lnkstepZoneR` },
         ShiftLeft_Numpad2: { id: `lnkjudgmentR` },
         ShiftRight_Numpad2: { id: `lnkjudgmentR` },
-        ShiftLeft_Numpad3: { id: `lnkfastSlowR` },
-        ShiftRight_Numpad3: { id: `lnkfastSlowR` },
-        ShiftLeft_Numpad4: { id: `lnklifeGaugeR` },
-        ShiftRight_Numpad4: { id: `lnklifeGaugeR` },
-        ShiftLeft_Numpad5: { id: `lnkscoreR` },
-        ShiftRight_Numpad5: { id: `lnkscoreR` },
-        ShiftLeft_Numpad6: { id: `lnkmusicInfoR` },
-        ShiftRight_Numpad6: { id: `lnkmusicInfoR` },
-        ShiftLeft_Numpad7: { id: `lnkfilterLineR` },
-        ShiftRight_Numpad7: { id: `lnkfilterLineR` },
-        ShiftLeft_Numpad8: { id: `lnkvelocityR` },
-        ShiftRight_Numpad8: { id: `lnkvelocityR` },
-        ShiftLeft_Numpad9: { id: `lnkcolorR` },
-        ShiftRight_Numpad9: { id: `lnkcolorR` },
-        ShiftLeft_Numpad0: { id: `lnklyricsR` },
-        ShiftRight_Numpad0: { id: `lnklyricsR` },
-        ShiftLeft_NumpadAdd: { id: `lnkbackgroundR` },
-        ShiftRight_NumpadAdd: { id: `lnkbackgroundR` },
-        ShiftLeft_NumpadSubtract: { id: `lnkarrowEffectR` },
-        ShiftRight_NumpadSubtract: { id: `lnkarrowEffectR` },
-        ShiftLeft_NumpadDivide: { id: `lnkspecialR` },
-        ShiftRight_NumpadDivide: { id: `lnkspecialR` },
+        ShiftLeft_Numpad3: { id: `lnklifeGaugeR` },
+        ShiftRight_Numpad3: { id: `lnklifeGaugeR` },
+        ShiftLeft_Numpad4: { id: `lnkscoreR` },
+        ShiftRight_Numpad4: { id: `lnkscoreR` },
+        ShiftLeft_Numpad5: { id: `lnkmusicInfoR` },
+        ShiftRight_Numpad5: { id: `lnkmusicInfoR` },
+        ShiftLeft_Numpad6: { id: `lnkvelocityR` },
+        ShiftRight_Numpad6: { id: `lnkvelocityR` },
+        ShiftLeft_Numpad7: { id: `lnkcolorR` },
+        ShiftRight_Numpad7: { id: `lnkcolorR` },
+        ShiftLeft_Numpad8: { id: `lnkbackgroundR` },
+        ShiftRight_Numpad8: { id: `lnkbackgroundR` },
+        ShiftLeft_Numpad9: { id: `lnkarrowEffectR` },
+        ShiftRight_Numpad9: { id: `lnkarrowEffectR` },
+        ShiftLeft_Numpad0: { id: `lnkspecialR` },
+        ShiftRight_Numpad0: { id: `lnkspecialR` },
+        ShiftLeft_NumpadAdd: { id: `lnkfilterLineR` },
+        ShiftRight_NumpadAdd: { id: `lnkfilterLineR` },
 
         Numpad1: { id: `lnkstepZone` },
         Numpad2: { id: `lnkjudgment` },
-        Numpad3: { id: `lnkfastSlow` },
-        Numpad4: { id: `lnklifeGauge` },
-        Numpad5: { id: `lnkscore` },
-        Numpad6: { id: `lnkmusicInfo` },
-        Numpad7: { id: `lnkfilterLine` },
-        Numpad8: { id: `lnkvelocity` },
-        Numpad9: { id: `lnkcolor` },
-        Numpad0: { id: `lnklyrics` },
-        NumpadAdd: { id: `lnkbackground` },
-        NumpadSubtract: { id: `lnkarrowEffect` },
-        NumpadDivide: { id: `lnkspecial` },
+        Numpad3: { id: `lnklifeGauge` },
+        Numpad4: { id: `lnkscore` },
+        Numpad5: { id: `lnkmusicInfo` },
+        Numpad6: { id: `lnkvelocity` },
+        Numpad7: { id: `lnkcolor` },
+        Numpad8: { id: `lnkbackground` },
+        Numpad9: { id: `lnkarrowEffect` },
+        Numpad0: { id: `lnkspecial` },
+        NumpadAdd: { id: `lnkfilterLine` },
 
         KeyZ: { id: `btnSave` },
         Escape: { id: `btnBack` },
@@ -2939,6 +2945,16 @@ const g_shortcutObj = {
         Tab: { id: `btnSettings` },
         KeyU: { id: `btnSettingSummary` },
     },
+    displayPreview: {
+        KeyP: { id: `btnDisplayPreview2` },
+        Escape: { id: `btnBack` },
+        Space: { id: `btnKeyConfig` },
+        Enter: { id: `btnPlay` },
+        NumpadEnter: { id: `btnPlay` },
+        ShiftLeft_Tab: { id: `btnBack` },
+        ShiftRight_Tab: { id: `btnBack` },
+        Tab: { id: `btnSettings` },
+    },
     exSetting: {
         ShiftLeft_KeyP: { id: `lnkPlayWindowL` },
         ShiftRight_KeyP: { id: `lnkPlayWindowL` },
@@ -3065,6 +3081,7 @@ const g_mainRepeatObj = {
 // CSS名称
 const g_cssObj = {
     title_base: `title_base`,
+    settings_Display: `settings_Display`,
 
     settings_DifSelector: `settings_DifSelector`,
     settings_Disabled: `settings_Disabled`,
@@ -4694,14 +4711,12 @@ const g_lblNameObj = {
 
     rd_StepZone: `Step`,
     rd_Judgment: `Judge`,
-    rd_FastSlow: `FS`,
     rd_LifeGauge: `Life`,
     rd_Score: `Score`,
     rd_MusicInfo: `MusicInfo`,
     rd_FilterLine: `Filter`,
     rd_Velocity: `Velocity`,
     rd_Color: `Color`,
-    rd_Lyrics: `Lyrics`,
     rd_Background: `Back`,
     rd_ArrowEffect: `Effect`,
     rd_Special: `SP`,
@@ -4733,6 +4748,9 @@ const g_lang_lblNameObj = {
         transKeyDesc: `別キーモードではキーコンフィグ、ColorType等は保存されません`,
         colorTypeDesc: `現在のColorTypeの設定では、色変化(Display:Color)は自動的にOFFになります`,
         sdShortcutDesc: `Hid+/Sud+時ショートカット：「pageUp」カバーを上へ / 「pageDown」下へ`,
+        displayPreviewDesc: `判定キャラクタ部分をドラッグで移動するとその位置に補正されます`,
+        arrowJdgUpdate: `矢印判定の座標を更新`,
+        frzJdgUpdate: `フリーズアロー判定の座標を更新`,
         resultImageDesc: `画像を右クリックしてコピーできます`,
 
         s_level: `Level`,
@@ -4790,6 +4808,9 @@ const g_lang_lblNameObj = {
         transKeyDesc: `Key config, Color type, etc. are not saved in another key mode`,
         colorTypeDesc: `With the current ColorType setting, color change (Display:Color) will be automatically turned OFF.`,
         sdShortcutDesc: `When "Hidden+" or "Sudden+" select, "pageUp" cover up / "pageDown" cover down`,
+        displayPreviewDesc: `If you drag the judgment character section, it will be adjusted to that position.`,
+        arrowJdgUpdate: `Update the coordinates (arrow)`,
+        frzJdgUpdate: `Update the coordinates (freeze)`,
         resultImageDesc: `You can copy the image by right-clicking on it.`,
 
         s_level: `Level`,
@@ -4887,7 +4908,7 @@ const g_lang_msgObj = {
         toSettings: `その他の拡張設定を設定します。`,
 
         d_stepzone: `ステップゾーンの表示\n[FlatBar] ステップゾーンをフラットな帯状にします`,
-        d_judgment: `判定キャラクタ・コンボの表示`,
+        d_judgment: `判定キャラクタ・コンボ、Fast/Slow表示\n[FastSlow] Fast/Slowのみ表示します`,
         d_fastslow: `Fast/Slow表示`,
         d_lifegauge: `ライフゲージの表示`,
         d_score: `現時点の判定数を表示`,
@@ -4897,7 +4918,7 @@ const g_lang_msgObj = {
             `[Soft] 全体変速、個別加速について速度変化の振れ幅が緩くなります（Extremeと逆の効果）`,
         d_color: `色変化の有効化設定`,
         d_lyrics: `歌詞表示の有効化設定`,
-        d_background: `背景・マスクモーションの有効化設定`,
+        d_background: `背景・マスクモーション、歌詞表示の有効化設定\n[Lyrics] 歌詞表示のみ有効化します`,
         d_arroweffect: `矢印・フリーズアローモーションの有効化設定`,
         d_special: `作品固有の特殊演出の有効化設定`,
 
@@ -4931,8 +4952,9 @@ const g_lang_msgObj = {
         lnkHighScore: `譜面のハイスコアをクリップボードへコピー`,
 
         appearance: `流れる矢印の見え方を制御します。`,
-        opacity: `判定キャラクタ、コンボ数、Fast/Slow、Hidden+/Sudden+の\n境界線表示の透明度を設定します。`,
+        opacity: `判定キャラクタ、コンボ数、Fast/Slowの透明度を設定します。`,
         hitPosition: `判定位置にズレを感じる場合、\n数値を変えることで判定の中央位置を1px単位(プラス:手前, マイナス:奥側)で調整することができます。\n早押し・遅押し傾向にある場合に使用します。`,
+        displayPreview: `プレイ画面上のオブジェクトの表示状態をプレビューします。\n判定キャラクタ部分をドラッグで移動するとその位置に補正されます。`,
 
         colorType: `矢印・フリーズアローの配色セットをあらかじめ定義されたリストから選択できます。\nType1～4選択時は色変化が自動でOFFになり、カラーピッカーから好きな色に変更できます。\n[Type0] グラデーション切替, [Type1～4] デフォルトパターン`,
         imgType: `矢印・フリーズアローなどのオブジェクトの見た目を変更します。`,
@@ -4990,8 +5012,7 @@ const g_lang_msgObj = {
         toSettings: `Set other extended settings.`,
 
         d_stepzone: `Display step zone\n[FlatBar] Make the step zone a flat bar shape.`,
-        d_judgment: `Display judgment and combo counts`,
-        d_fastslow: `Display fast and slow `,
+        d_judgment: `Display judgment, combo counts, fast/slow judgments\n[FastSlow] Display fast and slow judgments only.`,
         d_lifegauge: `Display lifegauge`,
         d_score: `Display the current number of judgments`,
         d_musicinfo: `Display the music credits and current time`,
@@ -4999,8 +5020,7 @@ const g_lang_msgObj = {
         d_velocity: `Enable velocity change settings\n[Extreme] For overall speed change and individual acceleration, \nif the speed change (absolute value) is greater than 1x, it will be 1.5x, \nand if it is less than 1x, it will be 0.75x.\n` +
             `[Soft] For overall speed change and individual acceleration, \nthe fluctuation of speed change is softened (opposite effect to Extreme).`,
         d_color: `Enable color change settings`,
-        d_lyrics: `Enable lyrics display`,
-        d_background: `Enable background images and animations`,
+        d_background: `Enable background images, animations and lyrics display\n[Lyrics] Only enable lyrics display`,
         d_arroweffect: `Enable sequences' animations`,
         d_special: `Enable setting of special effects to the work`,
 
@@ -5037,6 +5057,7 @@ const g_lang_msgObj = {
         appearance: `Controls how the flowing sequences look.`,
         opacity: `Set the transparency of some objects such as judgment, combo counts, fast and slow`,
         hitPosition: `If you feel a discrepancy in the judgment position, \nyou can adjust the center position of the judgment in 1px increments \n (plus: in front, minus: at the back) by changing the numerical value. \nUse this function when there is a tendency to push too fast or too slow.`,
+        displayPreview: `Preview the display status of objects on the play screen.\nDragging the judgment character section will adjust it to that position.`,
 
         colorType: `Change the color scheme set for arrows and freeze-arrows from the predefined set.\nWhen Type1 to 4 is selected, color change is automatically turned off and can be changed to any color from the color picker.\n[Type0] Switch the sequences color gradations, [Type1～4] default color scheme`,
         imgType: `Change the appearance of sequences.`,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "danoniplus",
-  "version": "48.0.0",
+  "version": "48.1.1",
   "description": "Dancing☆Onigiri (CW Edition) - Web-based Rhythm Game",
   "main": "./js/danoni_main.js",
   "jsdelivr": "./js/danoni_main.js",