Restyle subscriptions page.

(imported from commit 41339c5af38ae5ea4801fc1e23b7184c277145f3)
This commit is contained in:
Waseem Daher
2012-09-21 14:34:00 -04:00
parent 8be02ce8a3
commit a27edbce7d
5 changed files with 40 additions and 34 deletions

View File

@@ -2,28 +2,16 @@
{% icanhazjs "subscription" %} {% icanhazjs "subscription" %}
<h1>Current subscriptions</h1>
<div class="row-fluid"> <div class="row-fluid">
<div id="current_subscriptions" class="span12"> <h1>Subscriptions</h1>
<form action="/subscriptions/manage/" method="post" class="subscriptions">{% csrf_token %} <form id="add_new_subscriptions" action="/subscriptions/add/" method="post" class="form-inline">{% csrf_token %}
<table id="current_subscriptions_table"> <input type="text" name="new_subscriptions" id="new_subscriptions" placeholder="Stream name" value="" class="input-xlarge" />
<tr> <input type="submit" name="add_subscriptions" value="Subscribe" class="btn btn-primary" />
<th>Unsubscribe?</th> </form>
<th>Class</th> <form id="current_subscriptions" action="/subscriptions/manage/" method="post" class="subscriptions">{% csrf_token %}
</tr> <table class="table table-condensed" id="subscriptions_table">
</table> <tr></tr>
<input type="submit" name="change_subscriptions" value="Change subscriptions" class="btn" /> </table>
</form> </form>
</div>
</div>
<h1>Add new subscriptions</h1>
<div class="row-fluid">
<div id="add_new_subscriptions" class="span12">
<form action="/subscriptions/add/" method="post" class="subscriptions">{% csrf_token %}
<label>Please enter a comma-separated list of classes</label>
<input type="text" name="new_subscriptions" id="new_subscriptions" value="" /><br />
<input type="submit" name="add_subscriptions" value="Add subscriptions" class="btn" />
</form>
</div>
</div> </div>

View File

@@ -1,9 +1,9 @@
{{! Client-side Mustache template for rendering subscriptions.}} {{! Client-side Mustache template for rendering subscriptions.}}
<tr> <tr>
<td class="checkbox"> <td class="subscription_entry">
<input type="checkbox" name="subscription" value="{{subscription}}" /></input>
</td>
<td class="subscription">
{{subscription}} {{subscription}}
</td> </td>
<td>
<button class="btn" type="submit" name="subscription" value="{{subscription}}">Unsubscribe</button>
</td>
</tr> </tr>

View File

@@ -46,10 +46,10 @@ $(function () {
dataType: 'json', dataType: 'json',
timeout: 10*1000, timeout: 10*1000,
success: function (data) { success: function (data) {
$('#current_subscriptions_table tr').remove(); $('#subscriptions_table tr').remove();
if (data) { if (data) {
$.each(data.subscriptions, function (index, name) { $.each(data.subscriptions, function (index, name) {
$('#current_subscriptions_table').append(ich.subscription({subscription: name})); $('#subscriptions_table').append(ich.subscription({subscription: name}));
}); });
} }
$('#new_subscriptions').focus().select(); $('#new_subscriptions').focus().select();
@@ -210,12 +210,12 @@ $(function () {
dataType: 'json', // This seems to be ignored. We still get back an xhr. dataType: 'json', // This seems to be ignored. We still get back an xhr.
success: function (resp, statusText, xhr, form) { success: function (resp, statusText, xhr, form) {
$.each($.parseJSON(xhr.responseText).data, function (index, name) { $.each($.parseJSON(xhr.responseText).data, function (index, name) {
$('#current_subscriptions_table').find('input[value=' + name + ']').parents('tr').remove(); $('#subscriptions_table').find('button[value=' + name + ']').parents('tr').remove();
}); });
}, },
// TODO: error handling // TODO: error handling
}; };
$("#current_subscriptions form").ajaxForm(options); $("#current_subscriptions").ajaxForm(options);
}); });
$(function () { $(function () {
@@ -224,13 +224,13 @@ $(function () {
success: function (resp, statusText, xhr, form) { success: function (resp, statusText, xhr, form) {
$("#new_subscriptions").val(""); $("#new_subscriptions").val("");
$.each($.parseJSON(xhr.responseText).data, function (index, name) { $.each($.parseJSON(xhr.responseText).data, function (index, name) {
$('#current_subscriptions_table').append(ich.subscription({subscription: name})); $('#subscriptions_table').prepend(ich.subscription({subscription: name}));
class_list.push(name); class_list.push(name);
}); });
}, },
// TODO: error handling // TODO: error handling
}; };
$("#add_new_subscriptions form").ajaxForm(options); $("#add_new_subscriptions").ajaxForm(options);
}); });
$(function () { $(function () {

View File

@@ -280,3 +280,21 @@ input.send_zephyr {
margin-top: 10px; margin-top: 10px;
margin-bottom: 0px; margin-bottom: 0px;
} }
#subscriptions {
top: 0;
bottom: 0;
position: absolute;
overflow: auto;
width: 640px;
background-color: antiquewhite;
padding: 1em;
}
#subscriptions_table {
width: 63%;
}
.subscription_entry {
width: 85%;
}

View File

@@ -264,8 +264,8 @@ def zephyr_backend(request, sender):
def gather_subscriptions(user_profile): def gather_subscriptions(user_profile):
subscriptions = Subscription.objects.filter(userprofile=user_profile, active=True) subscriptions = Subscription.objects.filter(userprofile=user_profile, active=True)
# For now, don't display the subscription for your ability to receive personals. # For now, don't display the subscription for your ability to receive personals.
return [get_display_recipient(sub.recipient) for sub in subscriptions return sorted([get_display_recipient(sub.recipient) for sub in subscriptions
if sub.recipient.type == Recipient.CLASS] if sub.recipient.type == Recipient.CLASS])
@login_required @login_required
def subscriptions(request): def subscriptions(request):