Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MA-614 Mobile Push Notification Studio UI

Browse Source
This commit is contained in:
Nimisha Asthagiri
2015-04-10 17:16:09 -04:00
parent b124485ed6
commit 11044ebdf2
9 changed files with 110 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
cms/djangoapps/contentstore/features/course-updates.py
View File

@@ -45,37 +45,37 @@ def check_no_update(_step, text):
@step(u'I modify the text to "([^"]*)"$')
def modify_update(_step, text):
button_css = 'div.post-preview a.edit-button'
button_css = 'div.post-preview .edit-button'
world.css_click(button_css)
change_text(text)
@step(u'I change the update from "([^"]*)" to "([^"]*)"$')
def change_existing_update(_step, before, after):
verify_text_in_editor_and_update('div.post-preview a.edit-button', before, after)
verify_text_in_editor_and_update('div.post-preview .edit-button', before, after)
@step(u'I change the handout from "([^"]*)" to "([^"]*)"$')
def change_existing_handout(_step, before, after):
verify_text_in_editor_and_update('div.course-handouts a.edit-button', before, after)
verify_text_in_editor_and_update('div.course-handouts .edit-button', before, after)
@step(u'I delete the update$')
def click_button(_step):
button_css = 'div.post-preview a.delete-button'
button_css = 'div.post-preview .delete-button'
world.css_click(button_css)
@step(u'I edit the date to "([^"]*)"$')
def change_date(_step, new_date):
button_css = 'div.post-preview a.edit-button'
button_css = 'div.post-preview .edit-button'
world.css_click(button_css)
date_css = 'input.date'
date = world.css_find(date_css)
for i in range(len(date.value)):
date._element.send_keys(Keys.END, Keys.BACK_SPACE)
date._element.send_keys(new_date)
save_css = 'a.save-button'
save_css = '.save-button'
world.css_click(save_css)
@@ -87,7 +87,7 @@ def check_date(_step, date):
@step(u'I modify the handout to "([^"]*)"$')
def edit_handouts(_step, text):
edit_css = 'div.course-handouts > a.edit-button'
edit_css = 'div.course-handouts > .edit-button'
world.css_click(edit_css)
change_text(text)
@@ -114,7 +114,7 @@ def check_handout_error(_step):
@step(u'I see handout save button disabled')
def check_handout_error(_step):
handout_save_button = 'form.edit-handouts-form a.save-button'
handout_save_button = 'form.edit-handouts-form .save-button'
assert world.css_has_class(handout_save_button, 'is-disabled')
@@ -125,19 +125,19 @@ def edit_handouts(_step, text):
@step(u'I see handout save button re-enabled')
def check_handout_error(_step):
handout_save_button = 'form.edit-handouts-form a.save-button'
handout_save_button = 'form.edit-handouts-form .save-button'
assert not world.css_has_class(handout_save_button, 'is-disabled')
@step(u'I save handout edit')
def check_handout_error(_step):
save_css = 'a.save-button'
save_css = '.save-button'
world.css_click(save_css)
def change_text(text):
type_in_codemirror(0, text)
save_css = 'a.save-button'
save_css = '.save-button'
world.css_click(save_css)

48
cms/static/coffee/spec/views/course_info_spec.coffee
View File

@@ -22,7 +22,7 @@ define ["js/views/course_info_handout", "js/views/course_info_update", "js/model
delete window.analytics
delete window.course_location_analytics
describe "Course Updates", ->
describe "Course Updates without Push notification", ->
courseInfoTemplate = readFixtures('course_info_update.underscore')
beforeEach ->
@@ -100,7 +100,7 @@ define ["js/views/course_info_handout", "js/views/course_info_update", "js/model
else
modalCover.click()
it "does not rewrite links on save", ->
it "does send expected data on save", ->
requests = AjaxHelpers["requests"](this)
# Create a new update, verifying that the model is created
@@ -116,9 +116,12 @@ define ["js/views/course_info_handout", "js/views/course_info_update", "js/model
@courseInfoEdit.$el.find('.save-button').click()
expect(model.save).toHaveBeenCalled()
# Verify content sent to server does not have rewritten links.
contentSaved = JSON.parse(requests[requests.length - 1].requestBody).content
expect(contentSaved).toEqual('/static/image.jpg')
# Verify push_notification_selected is set to false.
requestSent = JSON.parse(requests[requests.length - 1].requestBody)
expect(requestSent.push_notification_selected).toEqual(false)
# Verify the link is not rewritten when saved.
expect(requestSent.content).toEqual('/static/image.jpg')
it "does rewrite links for preview", ->
# Create a new update.
@@ -147,6 +150,41 @@ define ["js/views/course_info_handout", "js/views/course_info_update", "js/model
it "does not remove existing course info on click outside modal", ->
@cancelExistingCourseInfo(false)
describe "Course Updates WITH Push notification", ->
courseInfoTemplate = readFixtures('course_info_update.underscore')
beforeEach ->
setFixtures($("<script>", {id: "course_info_update-tpl", type: "text/template"}).text(courseInfoTemplate))
appendSetFixtures courseInfoPage
@collection = new CourseUpdateCollection()
@collection.url = 'course_info_update/'
@courseInfoEdit = new CourseInfoUpdateView({
el: $('.course-updates'),
collection: @collection,
base_asset_url : 'base-asset-url/',
push_notification_enabled : true
})
@courseInfoEdit.render()
@event = {preventDefault : () -> 'no op'}
@courseInfoEdit.onNew(@event)
@requests = AjaxHelpers["requests"](this)
it "shows push notification checkbox as selected by default", ->
expect(@courseInfoEdit.$el.find('.toggle-checkbox')).toBeChecked()
it "sends correct default value for push_notification_selected", ->
@courseInfoEdit.$el.find('.save-button').click()
requestSent = JSON.parse(@requests[@requests.length - 1].requestBody)
expect(requestSent.push_notification_selected).toEqual(true)
it "sends correct value for push_notification_selected when it is unselected", ->
# unselect push notification
@courseInfoEdit.$el.find('.toggle-checkbox').attr('checked', false);
@courseInfoEdit.$el.find('.save-button').click()
requestSent = JSON.parse(@requests[@requests.length - 1].requestBody)
expect(requestSent.push_notification_selected).toEqual(false)
describe "Course Handouts", ->
handoutsTemplate = readFixtures('course_info_handouts.underscore')

5
cms/static/js/factories/course_info.js
View File

@@ -3,7 +3,7 @@ define([
'js/models/course_info', 'js/views/course_info_edit'
], function($, CourseUpdateCollection, ModuleInfoModel, CourseInfoModel, CourseInfoEditView) {
'use strict';
return function (updatesUrl, handoutsLocator, baseAssetUrl) {
return function (updatesUrl, handoutsLocator, baseAssetUrl, push_notification_enabled) {
var course_updates = new CourseUpdateCollection(),
course_handouts, editor;
@@ -18,7 +18,8 @@ define([
updates : course_updates,
base_asset_url : baseAssetUrl,
handouts : course_handouts
})
}),
push_notification_enabled: push_notification_enabled
});
editor.render();
};

4
cms/static/js/models/course_update.js
View File

@@ -3,7 +3,9 @@ define(["backbone", "jquery", "jquery.ui"], function(Backbone, $) {
var CourseUpdate = Backbone.Model.extend({
defaults: {
"date" : $.datepicker.formatDate('MM d, yy', new Date()),
"content" : ""
"content" : "",
"push_notification_enabled": false,
"push_notification_selected" : false
}
});
return CourseUpdate;

0
cms/static/js/spec/views/course_info_spec.js
View File

3
cms/static/js/views/course_info_edit.js
View File

@@ -15,7 +15,8 @@ var CourseInfoEdit = BaseView.extend({
new CourseInfoUpdateView({
el: $('body.updates'),
collection: this.model.get('updates'),
base_asset_url: this.model.get('base_asset_url')
base_asset_url: this.model.get('base_asset_url'),
push_notification_enabled: this.options.push_notification_enabled
});
new CourseInfoHandoutView({

41
cms/static/js/views/course_info_update.js
View File

@@ -3,6 +3,7 @@ define(["js/views/baseview", "codemirror", "js/models/course_update",
function(BaseView, CodeMirror, CourseUpdateModel, PromptView, NotificationView, CourseInfoHelper, ModalUtils) {
var CourseInfoUpdateView = BaseView.extend({
// collection is CourseUpdateCollection
events: {
"click .new-update-button" : "onNew",
@@ -29,7 +30,8 @@ define(["js/views/baseview", "codemirror", "js/models/course_update",
try {
CourseInfoHelper.changeContentToPreview(
update, 'content', self.options['base_asset_url']);
var newEle = self.template({ updateModel : update });
// push notification is always disabled for existing updates
var newEle = self.template({ updateModel : update, push_notification_enabled : false });
$(updateEle).append(newEle);
} catch (e) {
// ignore
@@ -47,7 +49,12 @@ define(["js/views/baseview", "codemirror", "js/models/course_update",
var newModel = new CourseUpdateModel();
this.collection.add(newModel, {at : 0});
var $newForm = $(this.template({ updateModel : newModel }));
var $newForm = $(
this.template({
updateModel : newModel,
push_notification_enabled : this.options.push_notification_enabled
})
);
var updateEle = this.$el.find("#course-update-list");
$(updateEle).prepend($newForm);
@@ -74,7 +81,11 @@ define(["js/views/baseview", "codemirror", "js/models/course_update",
onSave: function(event) {
event.preventDefault();
var targetModel = this.eventModel(event);
targetModel.set({ date : this.dateEntry(event).val(), content : this.$codeMirror.getValue() });
targetModel.set({
date : this.dateEntry(event).val(),
content : this.$codeMirror.getValue(),
push_notification_selected : this.push_notification_selected(event)
});
// push change to display, hide the editor, submit the change
var saving = new NotificationView.Mini({
title: gettext('Saving')
@@ -196,6 +207,11 @@ define(["js/views/baseview", "codemirror", "js/models/course_update",
}
this.$currentPost.find('form').hide();
this.$currentPost.find('.CodeMirror').remove();
// hide the push notification checkbox for subsequent edits to the Post
var push_notification_ele = this.$currentPost.find(".new-update-push-notification");
if (push_notification_ele)
push_notification_ele.hide();
}
ModalUtils.hideModalCover(this.$modalCover);
@@ -222,16 +238,15 @@ define(["js/views/baseview", "codemirror", "js/models/course_update",
if (li) return $(li).find(".date").first();
},
contentEntry: function(event) {
return $(event.currentTarget).closest("li").find(".new-update-content").first();
},
dateDisplay: function(event) {
return $(event.currentTarget).closest("li").find("#date-display").first();
},
contentDisplay: function(event) {
return $(event.currentTarget).closest("li").find(".update-contents").first();
push_notification_selected: function(event) {
var push_notification_checkbox;
var li = $(event.currentTarget).closest("li");
if (li) {
push_notification_checkbox = li.find(".new-update-push-notification .toggle-checkbox");
if (push_notification_checkbox) {
return push_notification_checkbox.is(":checked");
}
}
}
});

8
cms/templates/course_info.html
View File

@@ -5,6 +5,7 @@
<%inherit file="base.html" />
<%def name="online_help_token()"><% return "updates" %></%def>
<%namespace name='static' file='static_content.html'/>
<%! import json %>
<!-- TODO decode course # from context_course into title -->
<%block name="title">${_("Course Updates")}</%block>
@@ -21,7 +22,12 @@
<%block name="requirejs">
require(["js/factories/course_info"], function(CourseInfoFactory) {
CourseInfoFactory("${updates_url}", "${handouts_locator | escapejs}", "${base_asset_url}");
CourseInfoFactory(
"${updates_url}",
"${handouts_locator | escapejs}",
"${base_asset_url}",
${json.dumps(push_notification_enabled)}
);
});
</%block>

20
cms/templates/js/course_info_update.underscore
View File

@@ -2,23 +2,29 @@
<!-- FIXME what style should we use for initially hidden? --> <!-- TODO decide whether this should use codemirror -->
<form class="new-update-form">
<div class="row">
<label class="inline-label">Date:</label>
<label for="update-date-<%= updateModel.cid %>" class="inline-label">Date:</label>
<!-- TODO replace w/ date widget and actual date (problem is that persisted version is "Month day" not an actual date obj -->
<input type="text" class="date" value="<%= updateModel.get('date') %>">
<input id="update-date-<%= updateModel.cid %>" type="text" class="date" value="<%= updateModel.get('date') %>">
</div>
<div class="row">
<textarea class="new-update-content text-editor"><%= updateModel.get('content') %></textarea>
</div>
<%if (push_notification_enabled) { %>
<div class="row new-update-push-notification">
<input id="update-notification-checkbox-<%= updateModel.cid %>" type="checkbox" class="toggle-checkbox" data-tooltip="<%= gettext('Send push notification to mobile apps') %>" checked />
<label for="update-notification-checkbox-<%= updateModel.cid %>" class="inline-label"><%= gettext('Send notification to mobile apps') %></label>
</div>
<% } %>
<div class="row">
<!-- cid rather than id b/c new ones have cid's not id's -->
<a href="#" class="save-button" name="<%= updateModel.cid %>">Save</a>
<a href="#" class="cancel-button" name="<%= updateModel.cid %>">Cancel</a>
<button class="save-button" name="<%= updateModel.cid %>"><%= gettext('Post') %></button>
<button class="cancel-button" name="<%= updateModel.cid %>"><%= gettext('Cancel') %></button>
</div>
</form>
<div class="post-preview">
<div class="post-actions">
<a href="#" class="edit-button" name="<%- updateModel.cid %>"><span class="edit-icon"></span>Edit</a>
<a href="#" class="delete-button" name="<%- updateModel.cid %>"><span class="delete-icon"></span>Delete</a>
<button class="edit-button" name="<%= updateModel.cid %>"><span class="edit-icon"></span>Edit</button>
<button class="delete-button" name="<%= updateModel.cid %>"><span class="delete-icon"></span>Delete</button>
</div>
<h2>
<span class="calendar-icon"></span><span class="date-display"><%=
@@ -26,4 +32,4 @@
</h2>
<div class="update-contents"><%= updateModel.get('content') %></div>
</div>
</li>
</li>