Add unconf

bingluen · Mar 8, 2017 · e64e83d · e64e83d
1 parent 321c6d0
commit e64e83d
Show file tree

Hide file tree

Showing 7 changed files with 203 additions and 20 deletions.
diff --git a/assets/submissions.json b/assets/submissions.json
@@ -336,5 +336,109 @@
     "room": "R0",
     "subject": "特別分享 - 香港與台灣 SITCON 之差別與執行之難度",
     "summary": "在 2015 年，Tony 在 SITCON 講了 SITCON x HK 之後，便以獨立軌的形式在 HKOSCon 2015 中舉辦了第一次的 SITCON x HK。 SITCON x HK 2016 在 10 月完滿落幕，這是 SITCON x HK 第一次完全獨立舉辦。在籌備的過程中，出現了各種跟台灣 SITCON 情況不同的事情。今次希望跟大家分享一下今年籌備過程，包括網頁經歷多次改版以及當中的苦與樂。 同時，也會講及 SITCON x HK 2017 的預告和社群的發展。"
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T11:10:00+08:00",
+    "end": "2017-03-18T11:30:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T11:30:00+08:00",
+    "end": "2017-03-18T11:50:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T14:40:00+08:00",
+    "end": "2017-03-18T15:00:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T15:00:00+08:00",
+    "end": "2017-03-18T15:20:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T16:00:00+08:00",
+    "end": "2017-03-18T16:20:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T16:20:00+08:00",
+    "end": "2017-03-18T16:40:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T16:50:00+08:00",
+    "end": "2017-03-18T17:10:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
+  },
+  {
+    "speaker": {
+      "name": "",
+      "avatar": "images/panel.jpg",
+      "bio": ""
+    },
+    "start": "2017-03-18T17:10:00+08:00",
+    "end": "2017-03-18T17:20:00+08:00",
+    "type": "U",
+    "room": "Saloon",
+    "subject": "Unconf",
+    "summary": ""
   }
 ]
diff --git a/src/react/components/schedule/col.jsx b/src/react/components/schedule/col.jsx
@@ -18,6 +18,15 @@ export default class extends Component {
 			backgroundImage: "url("+data.speaker.avatar+")",
 		}
 		const name = data.speaker.name
+		if (data.type === "U")
+			return (
+				<div className="col">
+					<div role="talk-title">{data.subject}</div>
+					<div role="talk-speaker" style={{display: name==='' ? 'none' : 'block'}}>
+						{name}
+					</div>
+				</div>
+			)
 		return (
 			<div className="col">
 				<div role="talk-title">{data.subject}</div>

diff --git a/src/react/components/schedule/index.jsx b/src/react/components/schedule/index.jsx
@@ -8,18 +8,22 @@ const bucket = {
 	"09:10": {},
 	"10:10": {},
 	"11:10": {},
+	"11:30": {},
 	"12:50": {},
 	"14:40": {},
 	"14:55": {},
+	"15:00": {},
 	"15:10": {},
 	"16:00": {},
+	"16:20": {},
 	"16:50": {},
+	"17:10": {},
 	"18:20": {},
 	"18:35": {},
 }
 submissions.forEach((data) => {
 	const start = data.start.slice(11, 16)
-	const room = data.room.slice(0, 2)
+	const room = data.room.replace(/[^a-zA-Z0-9]/, '')
 	if( !bucket[start] ) {
 		console.error('Timetable key', start, 'not found')
 		return

diff --git a/src/react/components/schedule/makeContent.jsx b/src/react/components/schedule/makeContent.jsx
@@ -8,8 +8,21 @@ export default function makeContent(props) {
 	const slide = props.slides
 	const name = props.speaker.name
 	const bio = props.speaker.bio
-
+	const type = props.type
 	return () => {
+		if (type === 'U')
+			return (
+				<div>
+					<section>
+						<h2>{name} - {subject}</h2>
+						{summary.split('\n').map((paragraph, idx) => {
+							return <p key={idx}>{paragraph}</p>
+						})}
+						<p></p>
+					</section>
+				</div>
+			)
+
 		return (
 			<div>
 				<section style={{display: name==='' ? 'none' : 'block'}}>

diff --git a/src/react/components/schedule/row.jsx b/src/react/components/schedule/row.jsx
@@ -9,21 +9,58 @@ export default function(props) {
 	const contentR1 = makeContent(props.data["R1"])
 	const contentR2 = makeContent(props.data["R2"])
 	const contentR3 = makeContent(props.data["R3"])
-	return (
-		<tr>
-			<Timecol start={props.start} />
-			<td onClick={() => { fancybox(contentR2) }} className="clickable">
-				<Col data={props.data["R2"]} />
-			</td>
-			<td onClick={() => { fancybox(contentR0) }} className="clickable">
-				<Col data={props.data["R0"]} />
-			</td>
-			<td onClick={() => { fancybox(contentR1) }} className="clickable">
-				<Col data={props.data["R1"]} />
-			</td>
-			<td onClick={() => { fancybox(contentR3) }} className="clickable">
-				<Col data={props.data["R3"]} />
-			</td>
-		</tr>
-	)
+
+	const timeHasSaloon = ['1110', '1130', '1440', '1500', '1600', '1620', '1650', '1710']
+	const timeHasConf = ['1110', '1140', '1440', '1455', '1510', '1600', '1650']
+	const SaloonRowSpan = ['1440', '1500'].indexOf(props.start) >= 0 ? 3 : 1
+
+	if (timeHasConf.indexOf(props.start) >= 0 && timeHasSaloon.indexOf(props.start) >= 0) {
+		return (
+			<tr>
+				<Timecol start={props.start} />
+				<td rowSpan="2" onClick={() => { fancybox(contentR2) }} className="clickable">
+					<Col data={props.data["R2"]} />
+				</td>
+				<td rowSpan="2" onClick={() => { fancybox(contentR0) }} className="clickable">
+					<Col data={props.data["R0"]} />
+				</td>
+				<td rowSpan="2" onClick={() => { fancybox(contentR1) }} className="clickable">
+					<Col data={props.data["R1"]} />
+				</td>
+				<td rowSpan="2" onClick={() => { fancybox(contentR3) }} className="clickable">
+					<Col data={props.data["R3"]} />
+				</td>
+				<td rowSpan={ SaloonRowSpan } className="clickable" role="unconf">
+					<Col data={props.data["Saloon"]} />
+				</td>
+			</tr>
+		)
+	} else if (timeHasConf.indexOf(props.start) >= 0 && timeHasSaloon.indexOf(props.start) === -1) {
+		return (
+			<tr>
+				<Timecol start={props.start} />
+				<td rowSpan="2" onClick={() => { fancybox(contentR2) }} className="clickable">
+					<Col data={props.data["R2"]} />
+				</td>
+				<td rowSpan="2" onClick={() => { fancybox(contentR0) }} className="clickable">
+					<Col data={props.data["R0"]} />
+				</td>
+				<td rowSpan="2" onClick={() => { fancybox(contentR1) }} className="clickable">
+					<Col data={props.data["R1"]} />
+				</td>
+				<td rowSpan="2" onClick={() => { fancybox(contentR3) }} className="clickable">
+					<Col data={props.data["R3"]} />
+				</td>
+			</tr>
+		)
+	} else if(timeHasSaloon.indexOf(props.start) >= 0 && timeHasConf.indexOf(props.start) === -1) {
+		return (
+			<tr>
+				<Timecol start={props.start} />
+				<td rowSpan={ SaloonRowSpan } className="clickable" role="unconf">
+					<Col data={props.data["Saloon"]} />
+				</td>
+			</tr>
+		)
+	}
 }
diff --git a/src/react/components/schedule/tablebody.jsx b/src/react/components/schedule/tablebody.jsx
@@ -43,6 +43,12 @@ const TBody = (props) => {
 						<a href="#" target="blank" className="not-yet">共筆</a>
 					</div>
 				</th>
+				<th>
+					交誼廳
+					<div style={{display: 'none'}}>
+						<a href="#" target="blank" className="not-yet">共筆</a>
+					</div>
+				</th>
 			</tr>
 			<tr>
 				<Timecol start="0830" />
@@ -65,6 +71,7 @@ const TBody = (props) => {
 				</td>
 			</tr>
 			<Row start="1110" data={datas["11:10"]} />
+			<Row start="1130" data={datas["11:30"]} />
 			<tr>
 				<Timecol start="1150" />
 				<td colSpan="4"><div>午餐</div></td>
@@ -77,14 +84,19 @@ const TBody = (props) => {
 				</td>
 			</tr>
 			<Row start="1440" data={datas["14:40"]} />
+			<tr></tr>
 			<Row start="1455" data={datas["14:55"]} />
+			<Row start="1500" data={datas["15:00"]} />
 			<Row start="1510" data={datas["15:10"]} />
+			<tr></tr>
 			<tr>
 				<Timecol start="1520" />
 				<td colSpan="4"><div>點心</div></td>
 			</tr>
 			<Row start="1600" data={datas["16:00"]} />
+			<Row start="1620" data={datas["16:20"]} />
 			<Row start="1650" data={datas["16:50"]} />
+			<Row start="1710" data={datas["17:10"]} />
 			<tr>
 				<Timecol start="1730" />
 				<td colSpan="4"><div>Lightning talk</div></td>

diff --git a/src/sass/components/schedule.scss b/src/sass/components/schedule.scss
@@ -44,8 +44,8 @@
 	}
 
 	td {
+		max-width: 250px;
 		padding: 1.5em .5em;
-		vertical-align: top;
 		text-align: center;
 		background-color: white;
 		opacity: .8;
@@ -59,6 +59,10 @@
 			}
 		}
 
+		&[role="unconf"] {
+			padding: .5em .5em;
+		}
+
 		&.time {
 			width: 3.5em;
 			position: relative;