Implement the poll feature

Closes #164

3 files changed, 22 insertions, 0 deletions

diff --git a/src/web/app/desktop/tags/notifications.tag b/src/web/app/desktop/tags/notifications.tag
index aaf72bb2ca..3c5f3d89e2 100644
--- a/src/web/app/desktop/tags/notifications.tag
+++ b/src/web/app/desktop/tags/notifications.tag
@@ -39,6 +39,12 @@
 						<p><i class="fa fa-at"></i><a href={ CONFIG.url + '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p><a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
 					</div>
 				</virtual>
+				<virtual if={ notification.type == 'poll_vote' }>
+					<a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username } data-user-preview={ notification.user.id }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/></a>
+					<div class="text">
+						<p><i class="fa fa-pie-chart"></i><a href={ CONFIG.url + '/' + notification.user.username } data-user-preview={ notification.user.id }>{ notification.user.name }</a></p><a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+					</div>
+				</virtual>
 			</div>
 			<p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span><i class="fa fa-angle-up"></i>{ notification._datetext }</span><span><i class="fa fa-angle-down"></i>{ notifications[i + 1]._datetext }</span></p>
 		</virtual>
diff --git a/src/web/app/desktop/tags/post-form.tag b/src/web/app/desktop/tags/post-form.tag
index 872e928816..d4b93a6a18 100644
--- a/src/web/app/desktop/tags/post-form.tag
+++ b/src/web/app/desktop/tags/post-form.tag
@@ -10,9 +10,11 @@
 		<p class="remain">残り{ 4 - files.length }</p>
 	</div>
 	<mk-uploader ref="uploader"></mk-uploader>
+	<div ref="pollZone"></div>
 	<button ref="upload" title="PCからファイルを添付" onclick={ selectFile }><i class="fa fa-upload"></i></button>
 	<button ref="drive" title="ドライブからファイルを添付" onclick={ selectFileFromDrive }><i class="fa fa-cloud"></i></button>
 	<button class="cat" title="Insert The Cat" onclick={ cat }><i class="fa fa-smile-o"></i></button>
+	<button class="poll" title="投票を作成" onclick={ addPoll }><i class="fa fa-pie-chart"></i></button>
 	<p class="text-count { over: refs.text.value.length > 1000 }">のこり{ 1000 - refs.text.value.length }文字</p>
 	<button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0 && files.length == 0) } onclick={ post }>{ wait ? '投稿中' : opts.reply ? '返信' : '投稿' }
 		<mk-ellipsis if={ wait }></mk-ellipsis>
@@ -239,6 +241,7 @@
 			[ref='upload']
 			[ref='drive']
 			.cat
+			.poll
 				display inline-block
 				cursor pointer
 				padding 0
@@ -295,6 +298,7 @@
 		@uploadings = []
 		@files = []
 		@autocomplete = null
+		@poll = null
 
 		@in-reply-to-post = @opts.reply
 
@@ -409,6 +413,13 @@
 			@trigger \change-files @files
 			@update!
 
+		@add-poll = ~>
+			if @poll?
+				@poll.unmount!
+				@poll = null
+				return
+			@poll = riot.mount(@refs.pollZone.append-child document.create-element \mk-poll-editor).0
+
 		@post = (e) ~>
 			@wait = true
 
@@ -420,6 +431,7 @@
 				text: @refs.text.value
 				media_ids: files
 				reply_to_id: if @in-reply-to-post? then @in-reply-to-post.id else undefined
+				poll: if @poll? then @poll.get! else undefined
 			.then (data) ~>
 				@trigger \post
 				@notify if @in-reply-to-post? then '返信しました！' else '投稿しました！'
diff --git a/src/web/app/desktop/tags/timeline-post.tag b/src/web/app/desktop/tags/timeline-post.tag
index dd26f79e2d..b4e83ae1f3 100644
--- a/src/web/app/desktop/tags/timeline-post.tag
+++ b/src/web/app/desktop/tags/timeline-post.tag
@@ -40,6 +40,7 @@
 				<div class="media" if={ p.media }>
 					<mk-images-viewer images={ p.media }></mk-images-viewer>
 				</div>
+				<mk-poll if={ p.poll } post={ p }></mk-poll>
 				<div class="repost" if={ p.repost }><i class="fa fa-quote-right fa-flip-horizontal"></i>
 					<mk-post-preview class="repost" post={ p.repost }></mk-post-preview>
 				</div>
@@ -258,6 +259,9 @@
 								display block
 								max-width 100%
 
+						> mk-poll
+							font-size 80%
+
 						> .repost
 							margin 8px 0