[Client] Better poll tag
This commit is contained in:
parent
fd28d8b779
commit
cf85de5d05
|
@ -1,4 +1,4 @@
|
||||||
<mk-poll>
|
<mk-poll data-is-voted={ isVoted }>
|
||||||
<ul>
|
<ul>
|
||||||
<li each={ poll.choices } onclick={ vote.bind(null, id) } class={ voted: voted }>
|
<li each={ poll.choices } onclick={ vote.bind(null, id) } class={ voted: voted }>
|
||||||
<div class="backdrop" if={ parent.result } style={ 'width:' + (votes / parent.total * 100) + '%' }></div>
|
<div class="backdrop" if={ parent.result } style={ 'width:' + (votes / parent.total * 100) + '%' }></div>
|
||||||
|
@ -9,7 +9,12 @@
|
||||||
</span>
|
</span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<p>{ total }人が投票</p>
|
<p if={ total > 0 }>
|
||||||
|
<span>{ total }人が投票</span>
|
||||||
|
・
|
||||||
|
<a if={ !isVoted } onclick={ toggleResult }>{ result ? '投票する' : '結果を見る' }</a>
|
||||||
|
<span if={ isVoted }>投票済み</span>
|
||||||
|
</p>
|
||||||
<style type="stylus">
|
<style type="stylus">
|
||||||
:scope
|
:scope
|
||||||
display block
|
display block
|
||||||
|
@ -45,6 +50,20 @@
|
||||||
> .votes
|
> .votes
|
||||||
margin-left 4px
|
margin-left 4px
|
||||||
|
|
||||||
|
> p
|
||||||
|
a
|
||||||
|
color inherit
|
||||||
|
|
||||||
|
&[data-is-voted]
|
||||||
|
> ul > li
|
||||||
|
cursor default
|
||||||
|
|
||||||
|
&:hover
|
||||||
|
background transparent
|
||||||
|
|
||||||
|
&:active
|
||||||
|
background transparent
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
@mixin \api
|
@mixin \api
|
||||||
|
@ -52,7 +71,11 @@
|
||||||
@post = @opts.post
|
@post = @opts.post
|
||||||
@poll = @post.poll
|
@poll = @post.poll
|
||||||
@total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
|
@total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
|
||||||
@result = @poll.choices.some (c) -> c.is_voted
|
@is-voted = @poll.choices.some (c) -> c.is_voted
|
||||||
|
@result = @is-voted
|
||||||
|
|
||||||
|
@toggle-result = ~>
|
||||||
|
@result = !@result
|
||||||
|
|
||||||
@vote = (id) ~>
|
@vote = (id) ~>
|
||||||
if (@poll.choices.some (c) -> c.is_voted) then return
|
if (@poll.choices.some (c) -> c.is_voted) then return
|
||||||
|
@ -66,6 +89,7 @@
|
||||||
c.is_voted = true
|
c.is_voted = true
|
||||||
@update do
|
@update do
|
||||||
poll: @poll
|
poll: @poll
|
||||||
|
is-voted: true
|
||||||
result: true
|
result: true
|
||||||
total: @total + 1
|
total: @total + 1
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue