Refactored polls for UIKit support
This commit is contained in:
parent
1119059a6d
commit
7e46e020b9
6 changed files with 165 additions and 153 deletions
|
|
@ -1,32 +1,27 @@
|
|||
<% #main %>
|
||||
<tr>
|
||||
<td valign="top" width="5%">
|
||||
<input type="radio" id="<% choice.id %>" name="choice"
|
||||
value="<% choice.id %>" <% if <% choice.selected %> is true then
|
||||
'checked="checked"'
|
||||
%> />
|
||||
</td>
|
||||
<td><label for="<% choice.id %>"><% choice.title %></label></td>
|
||||
</tr>
|
||||
<div class='uk-form-row'>
|
||||
<label for='<% choice.id %>'>
|
||||
<input type='radio' id='<% choice.id %>' name='choice' value='<% choice.id %>' <% if <% choice.selected %> is true then 'checked='checked'' %> />
|
||||
<% choice.title %>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<% #edit %>
|
||||
<div class="choice" style="margin-top: 5px;">
|
||||
<span class="small"><% gettext Choice %> #<% param.index %>:</span>
|
||||
<div class='choice uk-form-row'>
|
||||
<div class='uk-form-label'>#<% param.index %></div>
|
||||
<div>
|
||||
<input type="text" name="title" class="formText"
|
||||
value="<% choice.title %>" />
|
||||
<input type='text' name='title' class='uk-width-1-1' value='<% choice.title %>' />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<% #result %>
|
||||
<p>
|
||||
<div style="width: <% choice.votes 300 default="1" %>px;"
|
||||
class="pollResultsBar"></div>
|
||||
<span class="small"><% choice.votes % | format #.#% %>
|
||||
<% ngettext "{0} vote" "{0} votes" <% choice.votes %>
|
||||
prefix="(" suffix=")" %></span><br />
|
||||
<% choice.title %>
|
||||
<div class='uk-text-bold'><% choice.title %></div>
|
||||
<div style='width: <% choice.votes 300 default=1 %>px;' class='pollResultsBar'></div>
|
||||
<div>
|
||||
<% choice.votes % | format #.#% %>
|
||||
<% ngettext '{0} vote' '{0} votes' <% choice.votes %> prefix='(' suffix=')' %>
|
||||
</div>
|
||||
</p>
|
||||
|
||||
<% #graph %>
|
||||
<div style="width:<% param.width %>px;" class="pollResultsBar"> </div>
|
||||
<div style='width: <% param.width %>px;' class='pollResultsBar'> </div>
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@ Choice.remove = function() {
|
|||
*/
|
||||
Choice.prototype.constructor = function(title) {
|
||||
HopObject.confirmConstructor.call(this);
|
||||
this.title = title;
|
||||
this.title = stripTags(title || String.EMPTY);
|
||||
return this;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,122 +1,139 @@
|
|||
<% #header %>
|
||||
<div class="storyTitle"><% poll.question %></div>
|
||||
<div class="small"><% gettext "{0} on {1}" <% poll.creator %> <% poll.created %> %></div>
|
||||
<h1><% poll.question | stripTags %></h1>
|
||||
<div class='uk-article-meta'>
|
||||
<% gettext "Last modified {0} by {1}" <% poll.created text %> <% poll.creator %> %>
|
||||
</div>
|
||||
|
||||
<% #footer %>
|
||||
<p class="small">
|
||||
<% poll.link edit <% gettext Edit %> prefix="... " %>
|
||||
<% poll.link rotate prefix="... " %>
|
||||
<% poll.link delete <% gettext Delete %> prefix="... " %>
|
||||
</p>
|
||||
<div class='uk-margin-top'>
|
||||
<% poll.link edit <% gettext Edit %> class='uk-button uk-button-primary' style='color: #fff;' %>
|
||||
<% poll.link status <% if <% poll.status %> is open then <% gettext Stop %> else <% gettext Run %> %> class='uk-button' %>
|
||||
<% poll.link delete <% gettext Delete %> class='uk-button' %>
|
||||
</div>
|
||||
|
||||
<% #main %>
|
||||
<% if <% param.header %> is true then <% poll.skin #header suffix="<br />" %> else
|
||||
<% poll.question prefix='<div class="pollTitle">' suffix="</div> %> %>
|
||||
<form method="post" action="<% poll.href %>">
|
||||
<table border="0" cellspacing="2" cellpadding="2">
|
||||
<% poll.loop skin="$Choice#main" %>
|
||||
<tr>
|
||||
<td colspan="2">
|
||||
<br />
|
||||
<button type="submit" name="vote" value="1"><% gettext Vote %></button>
|
||||
<% poll.link result <% gettext "Results" %> %>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
<% if <% param.header %> is true then
|
||||
<% poll.skin #header %>
|
||||
else
|
||||
<% poll.question prefix='<div class="pollTitle">' suffix="</div>" %>
|
||||
%>
|
||||
<form class='uk-margin-top uk-panel uk-panel-box uk-form uk-form-stacked' method="post" action="<% poll.href %>">
|
||||
<% poll.loop skin="$Choice#main" %>
|
||||
<div class='uk-margin-top'>
|
||||
<button class='uk-button uk-button-primary' type="submit" id="submit" name="submit" value="1">
|
||||
<% gettext Vote %>
|
||||
</button>
|
||||
<% poll.link result <% gettext "Results" %> class='uk-button uk-button-link' %>
|
||||
</div>
|
||||
</form>
|
||||
<% poll.skin #footer %>
|
||||
|
||||
<% #results %>
|
||||
<% if <% param.header %> is true then <% poll.skin #header %> else
|
||||
<% poll.question prefix=<strong> suffix="</strong> %> %>
|
||||
<% poll.loop skin="$Choice#result" %>
|
||||
<div class="small">
|
||||
<% gettext Total suffix=: %>
|
||||
<% ngettext "{0} vote" "{0} votes" <% poll.votes %> %>
|
||||
<% if <% poll.status %> is open then "" else
|
||||
<% if <% poll.closed %> is null then "" else
|
||||
<% gettext "This poll was closed by {0} on {1}"
|
||||
<% poll.modifier %> <% poll.closed short %> prefix="<br />" %>
|
||||
<% if <% param.header %> is true then
|
||||
<% poll.skin #header %>
|
||||
else
|
||||
<% poll.question prefix=<strong> suffix=</strong> %>
|
||||
%>
|
||||
<div class='uk-margin-top uk-panel uk-panel-box'>
|
||||
<% poll.loop skin="$Choice#result" %>
|
||||
<div style='float: left;'>
|
||||
<strong><% gettext Total suffix=: %></strong>
|
||||
<% ngettext "{0} vote" "{0} votes" <% poll.votes %> %>
|
||||
</div>
|
||||
<div class='uk-text-right'>
|
||||
<% if <% poll.status %> is open then
|
||||
<% poll.link main <% gettext 'Add Your Vote' %> class='uk-button uk-button-primary uk-button-mini' style='color: #fff;' %>
|
||||
else
|
||||
<% gettext "This poll was closed {0} by {1}" <% poll.closed text %> <% poll.modifier %> %>
|
||||
%>
|
||||
</div>
|
||||
<% if <% poll.status %> is open then
|
||||
%>
|
||||
</div>
|
||||
<% if <% poll.status %> is open then
|
||||
<% poll.link main <% gettext "Add Your Vote %> prefix=<p> suffix=</p> %>
|
||||
%>
|
||||
<% poll.skin #footer %>
|
||||
|
||||
<% #listItem %>
|
||||
<a name="<% poll.id %>" id="<% poll.id %>"></a>
|
||||
<div class="listSeparator"> </div>
|
||||
<table border="0" cellspacing="0" cellpadding="0" width="100%">
|
||||
<tr>
|
||||
<% if <% poll.status %> is closed then
|
||||
<% listItemFlag <% gettext closed %> %>
|
||||
%>
|
||||
<td colspan="3" class="small">
|
||||
<strong><% gettext Macro suffix=: %></strong> <% poll.macro %>
|
||||
<div class="ample"><strong><% gettext Status suffix=: %></strong>
|
||||
<% ngettext "{0} vote" "{0} votes" <% poll.votes %> %>
|
||||
</td>
|
||||
<td><% poll.votes %></td>
|
||||
<td style='max-width: 200px; overflow: hidden;'>
|
||||
<% poll.question | stripTags | poll.link %>
|
||||
</td>
|
||||
<td><% poll.creator %></td>
|
||||
<td><% poll.created text %></td>
|
||||
<td><% poll.status %></td>
|
||||
<td>
|
||||
<% poll.link status <% if <% poll.status %> is open then "<i class='uk-icon-pause'></i>" else "<i class='uk-icon-play'></i>" %> %>
|
||||
</td>
|
||||
<td style='white-space: nowrap;' class='uk-text-right'>
|
||||
<% poll.link edit "<i class='uk-icon-pencil'></i>" %>
|
||||
<% poll.link delete "<i class='uk-icon-trash-o'></i>" %>
|
||||
<a href='' class='av-clipboard-copy' data-text='<% gettext 'Please use the copy command.' %>' data-value="<% poll.macro %>"><i class='uk-icon-clipboard'></i></a><span title='' data-uk-tooltip="{pos: 'left'}">
|
||||
</td>
|
||||
</tr>
|
||||
<tr valign="top">
|
||||
<td>
|
||||
<div class="storytitle"><% poll.question %></div>
|
||||
<div class="storyDate"><% poll.creator link %>,
|
||||
<% poll.created short %></div>
|
||||
</td>
|
||||
<td width="10" nowrap="nowrap"> </td>
|
||||
<td align="right" class="small">
|
||||
<% poll.link main <% gettext Vote %> prefix='<div class="nowrap">... ' suffix="</div>" %>
|
||||
<% poll.link results <% gettext Results %> prefix='<div class="nowrap">... ' suffix="</div>" %>
|
||||
<% poll.link edit <% gettext Edit %> prefix='<div class="nowrap">... ' suffix="</div>" %>
|
||||
<% poll.link rotate prefix='<div class="nowrap">... ' suffix="</div>" %>
|
||||
<% poll.link delete <% gettext Delete %> prefix='<div class="nowrap">... ' suffix="</div>" %>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<% #edit %>
|
||||
<h1>
|
||||
<% response.title %>
|
||||
<% poll.link . ' ' class='uk-icon-button uk-icon-link uk-text-middle' %>
|
||||
</h1>
|
||||
<form class='uk-form uk-form-stacked' method="post" action="<% response.action %>">
|
||||
<div class='uk-form-row'>
|
||||
<div class='uk-form-label'><% gettext Question %></div>
|
||||
<div class='uk-form-controls'>
|
||||
<% poll.input question rows=3 class=uk-width-1-1 %>
|
||||
</div>
|
||||
</div>
|
||||
<legend class='uk-margin-top'><% gettext Choices %></legend>
|
||||
<% poll.input choices %>
|
||||
<div class="uk-text-small uk-form-row">
|
||||
<a href='' id="add">
|
||||
<i class='uk-icon-plus'></i>
|
||||
<% gettext "Add Choice" %>
|
||||
</a>
|
||||
</div>
|
||||
<fieldset class='uk-margin-top'>
|
||||
<legend><% gettext Information %></legend>
|
||||
<div class='uk-form-row uk-grid'>
|
||||
<div class='uk-width-1-2'>
|
||||
<div>
|
||||
<% if <% poll.creator %> is null then '' else
|
||||
<% gettext 'Created {0} by {1}' <% poll.created text %> <% poll.creator %> %>
|
||||
%>
|
||||
</div>
|
||||
<div>
|
||||
<% if <% poll.created %> is <% poll.modified %> then '' else
|
||||
<% gettext 'Last modified {0} by {1}' <% poll.modified text %> <% poll.modifier %> %>
|
||||
%>
|
||||
</div>
|
||||
</div>
|
||||
<div class='uk-width-1-2 uk-text-right'>
|
||||
<% poll.macro | link 'javascript:' data-value=<% poll.macro %> data-text=<% gettext "Use keyboard shortcut to copy." %> class='av-clipboard-copy uk-button' %>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<div class='uk-margin-top'>
|
||||
<button class='uk-button uk-button-primary' type="submit" name="save" value="<% poll.status default=closed %>">
|
||||
<% gettext Save %>
|
||||
</button>
|
||||
<% if <% poll.status %> is open then '' else
|
||||
<% gettext "Save and Run" prefix="<button class='uk-button uk-button-success' type='submit' name='save' value='open'>" suffix=</button> %>
|
||||
%>
|
||||
<% poll.link delete <% gettext Delete %> class='uk-button' %>
|
||||
<a href='' class='cancel uk-button uk-button-link'><% gettext Cancel %></a>
|
||||
</div>
|
||||
</form>
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
var index = $(".choice").length + 1;
|
||||
$("#add").click(function(event) {
|
||||
$("#add").on('click', function (event) {
|
||||
event.preventDefault();
|
||||
var choice = $(".choice:last").clone();
|
||||
choice.find(".small").text('<% gettext Choice %> #' + index + ':');
|
||||
choice.find("input").attr("value", "");
|
||||
choice.find(".uk-form-label").text('#' + index);
|
||||
choice.find("input").attr("value", '');
|
||||
$(".choice:last").after(choice);
|
||||
$(".choice:last").find("input").focus();
|
||||
index += 1;
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<p class="storyTitle"><% response.title %></p>
|
||||
<form method="post" action="<% response.action %>">
|
||||
<div class="small"><% gettext Question suffix=: %></div>
|
||||
<div><% poll.input question cols="30" rows="3" class="formTitle" %></div>
|
||||
<% poll.input choices %>
|
||||
<div class="small">
|
||||
<a href="" id="add"><% gettext "Add Choice" %></a>
|
||||
</div>
|
||||
<p class="small">
|
||||
<% if <% poll.created %> then <% gettext "Created by {0} on {1}"
|
||||
<% poll.creator %> <% poll.created short %> %> %>
|
||||
<% if <% poll.created %> is <% poll.modified %> then "" else
|
||||
<% gettext "Last modified by {0} on {1}" <% poll.modifier link %>
|
||||
<% poll.modified short %> prefix="<br />" %>
|
||||
%>
|
||||
</p>
|
||||
<br />
|
||||
<div>
|
||||
<button type="submit" name="save" value="<% poll.status default=closed %>">
|
||||
<% gettext Save %>
|
||||
</button>
|
||||
<% if <% poll.status %> is open then "" else
|
||||
<% gettext "Save and Run" prefix='<button type="submit"
|
||||
name="save" value="open"><strong>' suffix=</strong></button> %>
|
||||
%>
|
||||
<a href="" class="cancel"><% gettext Cancel %></a>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -93,8 +93,8 @@ Poll.prototype.getPermission = function(action) {
|
|||
case 'edit':
|
||||
return Membership.require(Membership.OWNER) ||
|
||||
User.require(User.PRIVILEGED);
|
||||
case 'rotate':
|
||||
case 'delete':
|
||||
case 'status':
|
||||
return this.creator === session.user ||
|
||||
Membership.require(Membership.MANAGER) ||
|
||||
User.require(User.PRIVILEGED);
|
||||
|
|
@ -120,7 +120,7 @@ Poll.prototype.main_action = function() {
|
|||
res.redirect(this.href('result'));
|
||||
return;
|
||||
}
|
||||
if (req.postParams.vote) {
|
||||
if (req.postParams.submit) {
|
||||
try {
|
||||
this.vote(req.postParams);
|
||||
res.message = gettext('Thanks, your vote was registered. You can change your mind until the poll is closed.');
|
||||
|
|
@ -161,19 +161,27 @@ Poll.prototype.edit_action = function() {
|
|||
try {
|
||||
this.update(req.postParams);
|
||||
res.message = gettext('The poll was updated successfully.');
|
||||
res.redirect(this.href());
|
||||
res.redirect(this.href('edit'));
|
||||
} catch (ex) {
|
||||
res.message = ex;
|
||||
app.log(ex);
|
||||
}
|
||||
}
|
||||
res.data.action = this.href(req.action);
|
||||
res.data.title = gettext('Edit Poll: {0}', this.question);
|
||||
res.data.title = gettext('Edit Poll');
|
||||
res.data.body = this.renderSkinAsString('$Poll#edit');
|
||||
this.site.renderSkin('Site#page');
|
||||
return;
|
||||
}
|
||||
|
||||
Poll.prototype.status_action = function () {
|
||||
this.status = (this.status === Poll.OPEN ? Poll.CLOSED : Poll.OPEN);
|
||||
if (this.status === Poll.CLOSED) {
|
||||
this.closed = new Date();
|
||||
}
|
||||
res.redirect(req.data.http_referer);
|
||||
}
|
||||
|
||||
/**
|
||||
*
|
||||
* @param {Object} data
|
||||
|
|
@ -210,7 +218,7 @@ Poll.prototype.update = function(data) {
|
|||
this.closed = new Date;
|
||||
}
|
||||
this.status = data.save;
|
||||
this.question = data.question;
|
||||
this.question = stripTags(data.question);
|
||||
this.touch();
|
||||
return;
|
||||
}
|
||||
|
|
@ -222,17 +230,6 @@ Poll.prototype.result_action = function() {
|
|||
return;
|
||||
}
|
||||
|
||||
Poll.prototype.rotate_action = function() {
|
||||
if (this.status === Poll.CLOSED) {
|
||||
this.status = Poll.OPEN;
|
||||
} else if (this.status === Poll.OPEN) {
|
||||
this.status = Poll.CLOSED;
|
||||
this.closed = new Date;
|
||||
}
|
||||
this.touch();
|
||||
return res.redirect(this.href());
|
||||
}
|
||||
|
||||
/**
|
||||
* @returns {String}
|
||||
*/
|
||||
|
|
@ -256,13 +253,6 @@ Poll.prototype.link_macro = function(param, action, text) {
|
|||
return;
|
||||
}
|
||||
break;
|
||||
case 'rotate':
|
||||
if (this.status === Poll.OPEN) {
|
||||
text = gettext('Stop');
|
||||
} else {
|
||||
text = this.closed ? gettext('Re-run') : gettext('Run');
|
||||
}
|
||||
break;
|
||||
}
|
||||
return HopObject.prototype.link_macro.call(this, param, action, text);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,26 @@
|
|||
<% #main %>
|
||||
<p class="storyTitle"><% response.title %></p>
|
||||
<div class="ample">
|
||||
<% polls.link create <% gettext "Add Poll" %> prefix="... " %>
|
||||
</div>
|
||||
...
|
||||
<h1>
|
||||
<% response.title %>
|
||||
<% polls.link create ' ' class='uk-icon-button uk-icon-plus uk-text-middle' %>
|
||||
</h1>
|
||||
<% polls.link main <% gettext "By {0}" <% membership.name %> %> %>
|
||||
<% polls.link running <% gettext Running %> prefix=" | " %>
|
||||
<% polls.link all <% gettext All %> prefix=" | " %>
|
||||
<% response.pager %>
|
||||
<% response.list %>
|
||||
<table class='uk-table uk-table-striped uk-table-hover uk-table-condensed'>
|
||||
<thead>
|
||||
<tr>
|
||||
<td><% image /ant-icon.png %></td>
|
||||
<td><% gettext Question %></td>
|
||||
<td><% gettext Author %></td>
|
||||
<td><% gettext Modified %></td>
|
||||
<td><% gettext Status %></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% response.list %>
|
||||
</tbody>
|
||||
</table>
|
||||
<% response.pager %>
|
||||
|
|
|
|||
|
|
@ -56,10 +56,9 @@ Polls.prototype.getPermission = function(action) {
|
|||
|
||||
Polls.prototype.main_action = function() {
|
||||
var polls = User.getMembership().polls;
|
||||
res.data.list = renderList(polls, '$Poll#listItem', 10, req.queryParams.page);
|
||||
res.data.pager = renderPager(polls, this.href(req.action),
|
||||
10, req.queryParams.page);
|
||||
res.data.title = gettext('Member Polls');
|
||||
res.data.list = renderList(polls, '$Poll#listItem', 25, req.queryParams.page);
|
||||
res.data.pager = renderPager(polls, this.href(req.action), 25, req.queryParams.page);
|
||||
res.data.title = gettext('Polls by {0}', session.user.name);
|
||||
res.data.body = this.renderSkinAsString('$Polls#main');
|
||||
this._parent.renderSkin('Site#page');
|
||||
return;
|
||||
|
|
@ -87,10 +86,8 @@ Polls.prototype.create_action = function() {
|
|||
}
|
||||
|
||||
Polls.prototype.running_action = function() {
|
||||
res.data.list = renderList(this.running,
|
||||
'$Poll#listItem', 10, req.queryParams.page);
|
||||
res.data.pager = renderPager(this.running,
|
||||
this.href(req.action), 10, req.queryParams.page);
|
||||
res.data.list = renderList(this.running, '$Poll#listItem', 25, req.queryParams.page);
|
||||
res.data.pager = renderPager(this.running, this.href(req.action), 25, req.queryParams.page);
|
||||
res.data.title = gettext('Running Polls');
|
||||
res.data.body = this.renderSkinAsString('$Polls#main');
|
||||
this._parent.renderSkin('Site#page');
|
||||
|
|
@ -98,9 +95,8 @@ Polls.prototype.running_action = function() {
|
|||
}
|
||||
|
||||
Polls.prototype.all_action = function() {
|
||||
res.data.list = renderList(this, '$Poll#listItem', 10, req.queryParams.page);
|
||||
res.data.pager = renderPager(this,
|
||||
this.href(), 10, req.queryParams.page);
|
||||
res.data.list = renderList(this, '$Poll#listItem', 25, req.queryParams.page);
|
||||
res.data.pager = renderPager(this, this.href(), 25, req.queryParams.page);
|
||||
res.data.title = gettext('All Polls');
|
||||
res.data.body = this.renderSkinAsString('$Polls#main');
|
||||
this._parent.renderSkin('Site#page');
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue