https://maichike.com/assets/controllers/place_preview_seat_map_controller-e038f9e9.js

1import CanvasSeatMapController from "controllers/canvas_seat_map_controller"
2
3// 会場の「座席表プレビュー」タブ。購入画面（o/cart_performances）とまったく同じ
4// canvas_seat_map_controller で描き、実際にお客様が見る座席表を会場単位で確認する。
5// 公演を持たないので販売状況は無く、全席を「購入可」の状態で描く。
6// 確認用なので座席の選択・編集はできない。
7export default class extends CanvasSeatMapController {
8  // STATUS.VACANT（購入可）。会場には販売状況が無いので全席この状態で描く
9  applyStates() {
10    this.seats.forEach(seat => { seat.status = 1 })
11  }
12
13  // 購入画面のカート連携は無いので、選択まわりは何もしない
14  updateSelection() {}
15
16  selectAt() {}
17
18  hoverCursor() {
19    return ""
20  }
21
22  draw() {
23    super.draw()
24    this.updateScaleLabel()
25  }
26
27  updateScaleLabel() {
28    const label = this.element.querySelector("[data-manage-scale]")
29    if (!label || !this.scale) return
30    const text = `${Math.round(this.scale * 100)}%`
31    if (label.textContent !== text) label.textContent = text
32  }
33
34
35  // 販売価格は会場だけでは決まらないので、席の呼び名だけ出す
36  showTooltip(seat, clientX, clientY) {
37    const tooltip = this.tooltipTarget
38    const title = document.createElement("div")
39    title.className = "fw-bold"
40    title.textContent = this.seatName(seat)
41    tooltip.replaceChildren(title)
42    tooltip.classList.remove("d-none")
43    const viewport = this.viewportTarget.getBoundingClientRect()
44    tooltip.style.left = `${Math.max(8, Math.min(clientX - viewport.left + 12, viewport.width - tooltip.offsetWidth - 8))}px`
45    tooltip.style.top = `${Math.max(8, Math.min(clientY - viewport.top + 12, viewport.height - tooltip.offsetHeight - 8))}px`
46  }
47}