Skip to content

Commit 5f6830e

Browse files
authored
Merge pull request #18 from pycon-mini-tokai/timetable-2
タイムテーブルの実装の改善1
2 parents 6e44c7a + 874325b commit 5f6830e

File tree

3 files changed

+31
-112
lines changed

3 files changed

+31
-112
lines changed

2024/index.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -473,7 +473,7 @@ footer {
473473
cursor: pointer;
474474
opacity: 0.8;
475475
}
476-
#detail_keynote, #detail_talk1, #detail_talk2, #detail_talk3, #detail_talk4, #detail_talk5, #detail_talk6, #detail_talk7, #detail_workshop1, #detail_workshop2, #detail_workshop3 {
476+
.event-detail-talk {
477477
display: none;
478478
}
479479
#event_detail .name {

2024/index.html

+14-13
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,7 @@ <h1><img src="assets/logo.svg" alt="PyCon mini 東海のロゴ"></h1>
8080
<ul>
8181
<li><a href="#overview">開催概要</a></li>
8282
<li><a href="#access">会場案内</a></li>
83+
<li><a href="#timetable">タイムテーブル</a></li>
8384
<li><a href="#coc">行動規範</a></li>
8485
</ul>
8586
</div>
@@ -353,10 +354,10 @@ <h3>ノーコードデータ分析ツールで体験する時系列データ分
353354
<div id="event_detail">
354355
<div class="flame">
355356
<div id="detail_close">×</div>
356-
<div id="detail_keynote">
357+
<div class="event-detail-talk" id="detail_keynote">
357358
<div class="keynote label">キーノート</div>
358359
<p class="time2">10:25~11:15</p>
359-
<!--h4>キーノート</h4-->
360+
<h4>キーノート</h4>
360361
<p class="name">小田切 篤 (@aodag)</p>
361362
<div class="flex">
362363
<!-- <div><img src="" alt="ここに画像"></div> -->
@@ -365,12 +366,12 @@ <h3>ノーコードデータ分析ツールで体験する時系列データ分
365366
</div>
366367
</div>
367368
</div>
368-
<div id="detail_talk1">
369+
<div class="event-detail-talk" id="detail_talk_1">
369370
<div class="talk label">トーク</div>
370371
<p class="time2">11:30~12:00<br>(発表20分・質疑応答5分・機材準備5分)</p>
371372
<h4>Python開発の変遷をPythonプロフェッショナルプログラミングの改定の歴史から知る</h4>
372373
<p class="name">鈴木 たかのり</p>
373-
<div class="scroll-auto detail-size">
374+
<div class="scroll-auto detail-size">
374375
私が所属するビープラウドが執筆する「Pythonプロフェッショナルプログラミング」は2012年の初版から改定を繰り返し、2024年に第4版が出版されました。<br><br>
375376
本書には、ビープラウドがPythonでの開発を行う上での、当時のノウハウがまとめられています。版を重ねる中で、書籍からさまざまな内容が削除、変更、追加されています。<br><br>
376377
本トークでは書籍の改定によって変更された内容を紹介しながら、Pythonでのチーム開発の歴史や進歩、変わったもの変わらないものについて見ていき、自身のプロジェクトに活用できる内容を知ることができます。
@@ -386,7 +387,7 @@ <h4>Python開発の変遷をPythonプロフェッショナルプログラミン
386387
website: slides.takanory.net<br>
387388
</div>
388389
</div>
389-
<div id="detail_talk2">
390+
<div class="event-detail-talk" id="detail_talk_2">
390391
<div class="talk label">トーク</div>
391392
<p class="time2">12:00~12:30<br>(発表20分・質疑応答5分・機材準備5分)</p>
392393
<h4>pytestでRust製CLIをe2eテストしてみよう</h4>
@@ -409,7 +410,7 @@ <h4>pytestでRust製CLIをe2eテストしてみよう</h4>
409410
<a href="https://github.com/attakei" target="_blank">https://github.com/attakei</a><br>
410411
</div>
411412
</div>
412-
<div id="detail_talk3">
413+
<div class="event-detail-talk" id="detail_talk_3">
413414
<div class="talk label">トーク</div>
414415
<p class="time2">14:00~14:30<br>(発表20分・質疑応答5分・機材準備5分)</p>
415416
<h4>Pythonはどうやってlen関数で長さを手にいれているの?</h4>
@@ -421,7 +422,7 @@ <h4>Pythonはどうやってlen関数で長さを手にいれているの?</h4
421422
<br>株式会社ビープラウド所属。<br>一般社団法人PyCon JP Association会計理事。<br>2003年にZope2をきっかけにPythonを使い始めた。最近では、Python Boot CampでイベントでPython講師を務め、日本各地でPythonを広める活動を行っている。Python mini Hack-a-thonやSphinx-users.jpなどPython関連イベント運営のかたわら、カンファレンスや書籍、OSS開発を通じて技術情報を発信している。<br><br>著書/訳書:『エキスパートPythonプログラミング 改訂4版(2023 アスキードワンゴ)』『独学コンピューターサイエンティスト(2022年 日経BP社)』『Sphinxをはじめよう第3版(2022 オライリー・ジャパン)』『自走プログラマー(2020年 技術評論社刊)』『独学プログラマー(2018 日経BP社刊)
422423
</div>
423424
</div>
424-
<div id="detail_talk4">
425+
<div class="event-detail-talk" id="detail_talk_4">
425426
<div class="talk label">トーク</div>
426427
<p class="time2">14:30~15:00<br>(発表20分・質疑応答5分・機材準備5分)</p>
427428
<h4>Python(PYNQ)がテーマのAMD主催のFPGAコンテストに参加してきた</h4>
@@ -449,7 +450,7 @@ <h4>Python(PYNQ)がテーマのAMD主催のFPGAコンテストに参加してき
449450
</div>
450451
</div>
451452

452-
<div id="detail_talk5">
453+
<div class="event-detail-talk" id="detail_talk_5">
453454
<div class="talk label">トーク</div>
454455
<p class="time2">15:00~15:30<br>(発表20分・質疑応答5分・機材準備5分)</p>
455456
<h4>Google Colaboratoryで試すVLM</h4>
@@ -467,7 +468,7 @@ <h4>Google Colaboratoryで試すVLM</h4>
467468
</div>
468469
</div>
469470

470-
<div id="detail_talk6">
471+
<div class="event-detail-talk" id="detail_talk_6">
471472
<div class="talk label">トーク</div>
472473
<p class="time2">15:45~16:15<br>(発表20分・質疑応答5分・機材準備5分)</p>
473474
<h4>asgirefのクラスasgiref.local.Localは何のためにあるのか?</h4>
@@ -489,7 +490,7 @@ <h4>asgirefのクラスasgiref.local.Localは何のためにあるのか?</h4>
489490
</div>
490491
</div>
491492

492-
<div id="detail_talk7">
493+
<div class="event-detail-talk" id="detail_talk_7">
493494
<div class="talk label">トーク</div>
494495
<p class="time2">16:15~16:45<br>(発表20分・質疑応答5分・機材準備5分)</p>
495496
<h4>ReflexによるPython onlyでの高速なWebアプリケーションプロトタイピング</h4>
@@ -502,7 +503,7 @@ <h4>ReflexによるPython onlyでの高速なWebアプリケーションプロ
502503
</div>
503504
</div>
504505

505-
<div id="detail_workshop1">
506+
<div class="event-detail-talk" id="detail_workshop_1">
506507
<div class="workshop label">ワークショップ</div>
507508
<p class="time2">11:30~12:30</p>
508509
<h4>Streamlitで作るRAGチャットアプリ</h4>
@@ -517,7 +518,7 @@ <h4>Streamlitで作るRAGチャットアプリ</h4>
517518
</div>
518519
</div>
519520

520-
<div id="detail_workshop2">
521+
<div class="event-detail-talk" id="detail_workshop_2">
521522
<div class="workshop label">ワークショップ</div>
522523
<p class="time2">14:00~15:30</p>
523524
<h4>pytestを使ったテスト駆動開発を体験してみよう</h4>
@@ -542,7 +543,7 @@ <h4>pytestを使ったテスト駆動開発を体験してみよう</h4>
542543
</div>
543544
</div>
544545

545-
<div id="detail_workshop3">
546+
<div class="event-detail-talk" id="detail_workshop_3">
546547
<div class="workshop label">ワークショップ</div>
547548
<p class="time2">15:45~16:45</p>
548549
<h4>ノーコードデータ分析ツールで体験する時系列データ分析超入門</h4>

2024/index.js

+16-98
Original file line numberDiff line numberDiff line change
@@ -1,99 +1,17 @@
11
/* イベント詳細の表示切替 */
2-
const event_detail = document.getElementById('event_detail');
3-
const detail_close = document.getElementById('detail_close');
4-
5-
detail_close.addEventListener('click', () => {
6-
event_detail.style.display="none";
7-
detail_keynote.style.display="none";
8-
detail_talk1.style.display="none";
9-
detail_talk2.style.display="none";
10-
detail_talk3.style.display="none";
11-
detail_talk4.style.display="none";
12-
detail_talk5.style.display="none";
13-
detail_talk6.style.display="none";
14-
detail_talk7.style.display="none";
15-
detail_workshop1.style.display="none";
16-
detail_workshop2.style.display="none";
17-
detail_workshop3.style.display="none";
18-
});
19-
20-
const keynote = document.getElementById('keynote');
21-
const detail_keynote =document.getElementById('detail_keynote');
22-
23-
const talk_1 = document.getElementById('talk_1');
24-
const detail_talk1 =document.getElementById('detail_talk1');
25-
const talk_2 = document.getElementById('talk_2');
26-
const detail_talk2 =document.getElementById('detail_talk2');
27-
const talk_3 = document.getElementById('talk_3');
28-
const detail_talk3 =document.getElementById('detail_talk3');
29-
const talk_4 = document.getElementById('talk_4');
30-
const detail_talk4 =document.getElementById('detail_talk4');
31-
const talk_5 = document.getElementById('talk_5');
32-
const detail_talk5 =document.getElementById('detail_talk5');
33-
const talk_6 = document.getElementById('talk_6');
34-
const detail_talk6 =document.getElementById('detail_talk6');
35-
const talk_7 = document.getElementById('talk_7');
36-
const detail_talk7 =document.getElementById('detail_talk7');
37-
38-
const workshop_1 = document.getElementById('workshop_1');
39-
const detail_workshop1 = document.getElementById('detail_workshop1');
40-
const workshop_2 = document.getElementById('workshop_2');
41-
const detail_workshop2 = document.getElementById('detail_workshop2');
42-
const workshop_3 = document.getElementById('workshop_3');
43-
const detail_workshop3 = document.getElementById('detail_workshop3');
44-
45-
keynote.addEventListener('click', () => {
46-
event_detail.style.display="block";
47-
detail_keynote.style.display="block";
48-
});
49-
50-
talk_1.addEventListener('click', () => {
51-
event_detail.style.display="block";
52-
detail_talk1.style.display="block";
53-
});
54-
55-
talk_2.addEventListener('click', () => {
56-
event_detail.style.display="block";
57-
detail_talk2.style.display="block";
58-
});
59-
60-
talk_3.addEventListener('click', () => {
61-
event_detail.style.display="block";
62-
detail_talk3.style.display="block";
63-
});
64-
65-
talk_4.addEventListener('click', () => {
66-
event_detail.style.display="block";
67-
detail_talk4.style.display="block";
68-
});
69-
70-
talk_5.addEventListener('click', () => {
71-
event_detail.style.display="block";
72-
detail_talk5.style.display="block";
73-
});
74-
75-
talk_6.addEventListener('click', () => {
76-
event_detail.style.display="block";
77-
detail_talk6.style.display="block";
78-
});
79-
80-
talk_7.addEventListener('click', () => {
81-
event_detail.style.display="block";
82-
detail_talk7.style.display="block";
83-
});
84-
85-
workshop_1.addEventListener('click', () => {
86-
event_detail.style.display="block";
87-
detail_workshop1.style.display="block";
88-
89-
});
90-
91-
workshop_2.addEventListener('click', () => {
92-
event_detail.style.display="block";
93-
detail_workshop2.style.display="block";
94-
});
95-
96-
workshop_3.addEventListener('click', () => {
97-
event_detail.style.display="block";
98-
detail_workshop3.style.display="block";
99-
});
2+
const event_detail = document.getElementById("event_detail");
3+
4+
document.getElementById("detail_close").addEventListener("click", () => {
5+
event_detail.style.display = "none";
6+
for (const talk of document.querySelectorAll(".event-detail-talk")) {
7+
talk.style.display = "none";
8+
}
9+
});
10+
11+
for (const event_box of document.querySelectorAll(".event-box")) {
12+
event_box.addEventListener("click", (e) => {
13+
const id = `detail_${e.currentTarget.id}`;
14+
event_detail.style.display = "block";
15+
document.getElementById(id).style.display = "block";
16+
});
17+
}

0 commit comments

Comments
 (0)