55---
66{% include navbar.html %}
77
8- {% assign tt = site.data.time_table %}
9- {% assign slot = tt.slot_minutes | default: 15 %}
10- {% assign rooms = tt.rooms %}
11- {% assign room_count = rooms | size %}
8+ {% comment %}
9+ Jekyll プラグインで事前計算されたタイムテーブル表を使用
10+ ロジックはプラグインで計算済み。Liquid は描画のみを担当
11+ {% endcomment %}
1212
13- {% assign day_start_min = 600 %}
14- {% assign day_end_min = 960 %}
15- {% assign total_minutes = day_end_min | minus: day_start_min %}
16- {% assign slots_count = total_minutes | divided_by: slot %}
17- {% assign last_row = slots_count | minus: 1 %}
13+ {% assign ttg = site.data.time_table_grid %}
14+ {% assign time_slots = ttg.time_slots %}
15+ {% assign rooms = ttg.rooms %}
16+ {% assign room_styles = ttg.room_styles %}
17+ {% assign time_labels = ttg.time_labels %}
1818
1919< section class ="max-w-[1200px] mx-auto px-4 sm:px-8 mt-30 xl:mt-15 ">
2020 < h2 class ="text-4xl text-center mb-8 ">
@@ -23,94 +23,64 @@ <h2 class="text-4xl text-center mb-8">
2323 </ h2 >
2424
2525 < div class ="ttable-wrap " aria-label ="タイムテーブル(横スクロール可) ">
26- < table class ="ttable " style ="--room-count: {{ room_count }}; ">
26+ < table class ="ttable " style ="--room-count: {{ rooms | size }}; ">
2727 < caption >
28- {{ tt.date | default: site.date_event }} のタイムテーブル
28+ {{ site.date_event }} のタイムテーブル
2929 </ caption >
3030
3131 < thead >
3232 < tr >
3333 < th scope ="col " class ="ttable__th ttable__th--start "> 時間</ th >
34- {% for r in rooms %}
35- {% assign rstyle = tt. room_styles[r ] %}
34+ {% for room in rooms %}
35+ {% assign rstyle = room_styles[room ] %}
3636 < th scope ="col "
3737 class ="ttable__th ttable__th--room "
3838 style ="--room-color: {{ rstyle.color | default: '#c43b3b' }}; ">
39- < span class ="ttable__room-cap "> {{ r }}</ span >
39+ < span class ="ttable__room-cap "> {{ room }}</ span >
4040 </ th >
4141 {% endfor %}
4242 </ tr >
4343 </ thead >
4444
4545 < tbody >
46- {% for i in (0..last_row) %}
47- {% assign row_min = i | times: slot | plus: day_start_min %}
48- {% assign h = row_min | divided_by: 60 %}
49- {% assign mf = row_min | modulo: 60 | plus: 0 | prepend: '0' | slice: -2, 2 %}
46+ {% for time_slot in time_slots %}
47+ {% assign slot_index = forloop.index0 %}
48+ {% assign time_label = time_labels[slot_index] %}
5049
5150 < tr >
52- <!-- 左1列(sticky) -->
53- < th scope ="row " class ="ttable__cell ttable__cell--start "> {{ h }}:{{ mf }}</ th >
51+ < th scope ="row " class ="ttable__cell ttable__cell--start "> {{ time_label }}</ th >
5452
55- {% for r in rooms %}
56- {% assign rstyle = tt.room_styles[r] %}
57- {% assign events_in_room = tt.events | where: 'room', r | sort: 'start' %}
58-
59- {% assign active_event = nil %}
60- {% assign active_event_start_index = nil %}
61-
62- {% for ev in events_in_room %}
63- {% assign s_h = ev.start | split: ':' | first | plus: 0 %}
64- {% assign s_m = ev.start | split: ':' | last | plus: 0 %}
65- {% assign e_h = ev.end | split: ':' | first | plus: 0 %}
66- {% assign e_m = ev.end | split: ':' | last | plus: 0 %}
67- {% assign s_min = s_h | times: 60 | plus: s_m %}
68- {% assign e_min = e_h | times: 60 | plus: e_m %}
69-
70- {% assign s_clamped = s_min %}
71- {% if s_clamped < day _start_min %}{% assign s_clamped = day_start_min %}{% endif %}
72- {% assign e_clamped = e_min %}
73- {% if e_clamped > day_end_min %}{% assign e_clamped = day_end_min %}{% endif %}
74-
75- {% assign span_minutes = e_clamped | minus: s_clamped %}
76- {% if span_minutes > 0 %}
77- {% assign numerator = span_minutes | plus: slot | minus: 1 %}
78- {% assign span_slots = numerator | divided_by: slot %}
79- {% assign s_index = s_clamped | minus: day_start_min | divided_by: slot %}
80- {% assign e_index = s_index | plus: span_slots %}
81- {% if i > = s_index and i < e _index %}
82- {% assign active_event = ev %}
83- {% assign active_event_start_index = s_index %}
84- {% endif %}
85- {% endif %}
86- {% endfor %}
87-
88- {% if active_event and i == active_event_start_index %}
89- {%- assign s_h = active_event.start | split: ':' | first | plus: 0 -%}
90- {%- assign s_m = active_event.start | split: ':' | last | plus: 0 -%}
91- {%- assign e_h = active_event.end | split: ':' | first | plus: 0 -%}
92- {%- assign e_m = active_event.end | split: ':' | last | plus: 0 -%}
93- {%- assign s_min = s_h | times: 60 | plus: s_m -%}
94- {%- assign e_min = e_h | times: 60 | plus: e_m -%}
95- {%- if s_min < day _start_min -%}{%- assign s_min = day_start_min -%}{%- endif -%}
96- {%- if e_min > day_end_min -%}{%- assign e_min = day_end_min -%}{%- endif -%}
97- {%- assign span_minutes = e_min | minus: s_min -%}
98- {%- assign numerator = span_minutes | plus: slot | minus: 1 -%}
99- {%- assign span_slots = numerator | divided_by: slot -%}
100- {%- assign accent = active_event.accent | default: rstyle.color -%}
101- < td class ="ttable__cell ttable__cell--event " rowspan ="{{ span_slots }} " style ="--span: {{ span_slots }}; ">
102- < div class ="ttable__event " style ="--accent: {{ accent | default: '#c43b3b' }}; ">
103- < div class ="ttable__event-time "> {{ active_event.start }}–{{ active_event.end }}</ div >
104- < div class ="ttable__event-title "> {{ active_event.title }}</ div >
105- {% if active_event.subtitle %}
106- < div class ="ttable__event-subtitle "> {{ active_event.subtitle }}</ div >
53+ {% for room_event in time_slot %}
54+ {% assign room_index = forloop.index0 %}
55+ {% assign room = rooms[room_index] %}
56+ {% assign rstyle = room_styles[room] %}
57+
58+ {% if room_event.event %}
59+ {% comment %} イベントの開始セル {% endcomment %}
60+ {% assign event_data = room_event.event %}
61+ {% assign accent = event_data.accent | default: rstyle.color | default: '#c43b3b' %}
62+
63+ < td class ="ttable__cell ttable__cell--event "
64+ rowspan ="{{ room_event.span }} "
65+ style ="--span: {{ room_event.span }}; ">
66+ < div class ="ttable__event " style ="--accent: {{ accent }}; ">
67+ < div class ="ttable__event-time "> {{ event_data.start }}–{{ event_data.end }}</ div >
68+ < div class ="ttable__event-title "> {{ event_data.title }}</ div >
69+ {% if event_data.subtitle %}
70+ < div class ="ttable__event-subtitle "> {{ event_data.subtitle }}</ div >
71+ {% endif %}
72+ {% if event_data.badge %}
73+ < span class ="ttable__badge "> {{ event_data.badge }}</ span >
10774 {% endif %}
108- {% if active_event.badge %}
109- < span class ="ttable__badge "> {{ active_event.badge }}</ span >
75+ {% if event_data.note %}
76+ < div class ="ttable__event-note "> {{ event_data.note }}</ div >
11077 {% endif %}
11178 </ div >
11279 </ td >
113- {% elsif active_event == nil %}
80+ {% elsif room_event.continued %}
81+ {% comment %} 継続イベント(rowspanでカバーされているので出力は不要) {% endcomment %}
82+ {% else %}
83+ {% comment %} 空きイベント {% endcomment %}
11484 < td class ="ttable__cell ttable__cell--empty " aria-label ="空き時間 "> </ td >
11585 {% endif %}
11686 {% endfor %}
0 commit comments