Merge pull request #4897 from hpetru/update-poll-view-in-stream
I update design for poll in post stream
This commit is contained in:
Jonne Haß
commit
be19c2f104
6 changed files with 34 additions and 96 deletions
|
|
@ -41,7 +41,7 @@
|
|||
* Added comment count to statistic to enable calculations of posts/comments ratios [#4799](https://github.com/diaspora/diaspora/pull/4799)
|
||||
* Add filters to notifications controller [#4814](https://github.com/diaspora/diaspora/pull/4814)
|
||||
* Activate hovercards in SPV and conversations [#4870](https://github.com/diaspora/diaspora/pull/4870)
|
||||
* Added possibility to conduct polls [#4861](https://github.com/diaspora/diaspora/pull/4861) [#4894](https://github.com/diaspora/diaspora/pull/4894)
|
||||
* Added possibility to conduct polls [#4861](https://github.com/diaspora/diaspora/pull/4861) [#4894](https://github.com/diaspora/diaspora/pull/4894) [#4897](https://github.com/diaspora/diaspora/pull/4897)
|
||||
|
||||
# 0.3.0.3
|
||||
|
||||
|
|
|
|||
|
|
@ -1,17 +0,0 @@
|
|||
//= require ./poll_view
|
||||
app.views.PollBlueprint = app.views.Poll.extend({
|
||||
templateName: 'poll_blueprint',
|
||||
|
||||
initialize: function(options) {
|
||||
this.constructor.__super__.initialize.apply(this, options);
|
||||
this.progressBarFactor = 3;
|
||||
},
|
||||
setProgressBarData: function(progressBar, percent) {
|
||||
progressBar.css('width', percent * this.progressBarFactor + 'px');
|
||||
progressBar.parent().next().html(" - " + percent + "%");
|
||||
},
|
||||
toggleElements: function() {
|
||||
this.$('.poll_progress_bar_wrapper').toggle();
|
||||
this.$('.percentage').toggle();
|
||||
}
|
||||
});
|
||||
|
|
@ -32,7 +32,7 @@ app.views.StreamPost = app.views.Post.extend({
|
|||
this.commentStreamView = new app.views.CommentStream({model : this.model});
|
||||
this.oEmbedView = new app.views.OEmbed({model : this.model});
|
||||
this.openGraphView = new app.views.OpenGraph({model : this.model});
|
||||
this.pollView = new app.views.PollBlueprint({model : this.model});
|
||||
this.pollView = new app.views.Poll({model : this.model});
|
||||
},
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,45 +1,32 @@
|
|||
@import 'new_styles/poll';
|
||||
|
||||
.poll_form {
|
||||
display: block;
|
||||
margin: 10px 0px 10px 0px;
|
||||
border-top: solid 1px $border-grey;
|
||||
border-bottom: solid 1px $border-grey;
|
||||
padding: 10px 0px 5px 0px;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.poll_form input[type="radio"] {
|
||||
display:inline !important;
|
||||
}
|
||||
|
||||
.poll_result {
|
||||
width:100%px;
|
||||
}
|
||||
|
||||
.poll_progress_bar {
|
||||
position:absolute;
|
||||
width:0px;
|
||||
height:15px;
|
||||
top:-12px;
|
||||
z-index:-1;
|
||||
background-color:$background-grey;
|
||||
}
|
||||
|
||||
.poll_statistic{
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
label {
|
||||
display: block;
|
||||
font-size: 13px;
|
||||
font-weight: normal;
|
||||
line-height: 20px;
|
||||
padding-left: 20px;
|
||||
|
||||
.poll_progress_bar_wrapper {
|
||||
position: relative;
|
||||
width: 0;
|
||||
height: 0;
|
||||
display:inline-block;
|
||||
input[type=radio] {
|
||||
float: left;
|
||||
margin-left: -20px;
|
||||
}
|
||||
&:HOVER {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.progress {
|
||||
overflow: hidden;
|
||||
background-color: #f6f6f6;
|
||||
@include border-radius(4px);
|
||||
|
||||
.poll_answer_entry{
|
||||
width:100%;
|
||||
.bar {
|
||||
height: 100%;
|
||||
float: left;
|
||||
}
|
||||
}
|
||||
|
||||
.percentage {
|
||||
display:inline;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,32 +0,0 @@
|
|||
{{#if poll}}
|
||||
<div class="poll_form">
|
||||
<p class="poll_statistic">{{t "poll.count" count=poll.participation_count}}</p>
|
||||
<strong>{{poll.question}}</strong><br/>
|
||||
{{#unless already_participated_in_poll}}
|
||||
<form action="/posts/{{poll.post_id}}/poll_participations" method="POST">
|
||||
{{#poll.poll_answers}}
|
||||
<input type="radio" name="vote" value="{{id}}"/>
|
||||
<div class="poll_progress_bar_wrapper" style="display:none;">
|
||||
<div class="poll_progress_bar" data-answerid="{{id}}"></div>
|
||||
</div>
|
||||
{{answer}}
|
||||
<p class="percentage" style="display:none;"></p>
|
||||
<br/>
|
||||
{{/poll.poll_answers}}
|
||||
<input type="submit" class="button submit" style="float:right;" value="{{t "poll.vote"}}"/>
|
||||
</form>
|
||||
<p class="toggle_result_wrapper">
|
||||
<br/><a href="#" class="toggle_result">{{t "poll.show_result"}}</a><br/>
|
||||
</p>
|
||||
{{else}}
|
||||
{{#poll.poll_answers}}
|
||||
<div class="poll_progress_bar_wrapper">
|
||||
<div class="poll_progress_bar" data-answerid="{{id}}"></div>
|
||||
</div>
|
||||
{{answer}}
|
||||
<p class="percentage"></p>
|
||||
<br/>
|
||||
{{/poll.poll_answers}}
|
||||
{{/unless}}
|
||||
</div>
|
||||
{{/if}}
|
||||
|
|
@ -1,15 +1,15 @@
|
|||
describe("app.views.PollBlueprint", function(){
|
||||
describe("app.views.Poll", function(){
|
||||
beforeEach(function() {
|
||||
loginAs({name: "alice", avatar : {small : "http://avatar.com/photo.jpg"}});
|
||||
this.view = new app.views.PollBlueprint({ model: factory.postWithPoll()});
|
||||
this.view = new app.views.Poll({ model: factory.postWithPoll()});
|
||||
this.view.render();
|
||||
});
|
||||
|
||||
describe("setProgressBar", function(){
|
||||
it("sets the progress bar according to the voting result", function(){
|
||||
var percentage = (this.view.poll.poll_answers[0].vote_count / this.view.poll.participation_count)*100;
|
||||
expect(this.view.$('.poll_progress_bar:first').css('width')).toBe(this.view.progressBarFactor * percentage+"px");
|
||||
expect(this.view.$(".percentage:first").text()).toBe(" - " + percentage + "%");
|
||||
expect(this.view.$('.poll_progress_bar:first').css('width')).toBe(percentage+"%");
|
||||
expect(this.view.$(".percentage:first").text()).toBe(percentage + "%");
|
||||
})
|
||||
});
|
||||
|
||||
Loading…
Reference in a new issue