diff --git a/lms/djangoapps/teams/static/teams/js/models/team.js b/lms/djangoapps/teams/static/teams/js/models/team.js index be480904d3..f8771f6e80 100644 --- a/lms/djangoapps/teams/static/teams/js/models/team.js +++ b/lms/djangoapps/teams/static/teams/js/models/team.js @@ -15,7 +15,8 @@ description: '', country: '', language: '', - membership: [] + membership: [], + last_activity_at: '' }, initialize: function(options) { diff --git a/lms/djangoapps/teams/static/teams/js/spec/views/edit_team_spec.js b/lms/djangoapps/teams/static/teams/js/spec/views/edit_team_spec.js index f10d4b41ca..427ea232d5 100644 --- a/lms/djangoapps/teams/static/teams/js/spec/views/edit_team_spec.js +++ b/lms/djangoapps/teams/static/teams/js/spec/views/edit_team_spec.js @@ -20,7 +20,8 @@ define([ description: "TeamDescription", country: "c", language: "a", - membership: [] + membership: [], + last_activity_at: '' }, verifyValidation = function (requests, teamEditView, fieldsData) { _.each(fieldsData, function (fieldData) { diff --git a/lms/djangoapps/teams/static/teams/js/spec/views/team_card_spec.js b/lms/djangoapps/teams/static/teams/js/spec/views/team_card_spec.js new file mode 100644 index 0000000000..c83da4b963 --- /dev/null +++ b/lms/djangoapps/teams/static/teams/js/spec/views/team_card_spec.js @@ -0,0 +1,55 @@ +define(['jquery', + 'underscore', + 'teams/js/views/team_card', + 'teams/js/models/team'], + function ($, _, TeamCardView, Team) { + describe('TeamCardView', function () { + var createTeamCardView, view; + createTeamCardView = function () { + var model = new Team({ + id: 'test-team', + name: 'Test Team', + is_active: true, + course_id: 'test/course/id', + topic_id: 'test-topic', + description: 'A team for testing', + last_activity_at: "2015-08-21T18:53:01.145Z", + country: 'us', + language: 'en' + }), + teamCardClass = TeamCardView.extend({ + maxTeamSize: '100', + srInfo: { + id: 'test-sr-id', + text: 'Screenreader text' + }, + countries: {us: 'United States of America'}, + languages: {en: 'English'} + }); + return new teamCardClass({ + model: model + }); + }; + + beforeEach(function () { + view = createTeamCardView(); + view.render(); + }); + + it('can render itself', function () { + expect(view.$el).toHaveClass('list-card'); + expect(view.$el.find('.card-title').text()).toContain('Test Team'); + expect(view.$el.find('.card-description').text()).toContain('A team for testing'); + expect(view.$el.find('.team-activity abbr').attr('title')).toEqual("2015-08-21T18:53:01.145Z"); + expect(view.$el.find('.team-activity').text()).toContain('Last Activity'); + expect(view.$el.find('.card-meta').text()).toContain('0 / 100 Members'); + expect(view.$el.find('.team-location').text()).toContain('United States of America'); + expect(view.$el.find('.team-language').text()).toContain('English'); + }); + + it('navigates to the associated team page when its action button is clicked', function () { + expect(view.$('.action').attr('href')).toEqual('#teams/test-topic/test-team'); + }); + }); + } +); diff --git a/lms/djangoapps/teams/static/teams/js/spec_helpers/team_spec_helpers.js b/lms/djangoapps/teams/static/teams/js/spec_helpers/team_spec_helpers.js index 50a4f0841f..a210bf7c4e 100644 --- a/lms/djangoapps/teams/static/teams/js/spec_helpers/team_spec_helpers.js +++ b/lms/djangoapps/teams/static/teams/js/spec_helpers/team_spec_helpers.js @@ -33,7 +33,8 @@ define([ language: testLanguages[i%4][0], country: testCountries[i%4][0], is_active: true, - membership: [] + membership: [], + last_activity_at: '' }; }); }; diff --git a/lms/djangoapps/teams/static/teams/js/views/team_card.js b/lms/djangoapps/teams/static/teams/js/views/team_card.js index b0b64fd1f9..afaf8200e8 100644 --- a/lms/djangoapps/teams/static/teams/js/views/team_card.js +++ b/lms/djangoapps/teams/static/teams/js/views/team_card.js @@ -4,11 +4,13 @@ 'backbone', 'underscore', 'gettext', + 'jquery.timeago', 'js/components/card/views/card', 'teams/js/views/team_utils', - 'text!teams/templates/team-country-language.underscore' - ], function (Backbone, _, gettext, CardView, TeamUtils, teamCountryLanguageTemplate) { - var TeamMembershipView, TeamCountryLanguageView, TeamCardView; + 'text!teams/templates/team-country-language.underscore', + 'text!teams/templates/team-activity.underscore' + ], function (Backbone, _, gettext, timeago, CardView, TeamUtils, teamCountryLanguageTemplate, teamActivityTemplate) { + var TeamMembershipView, TeamCountryLanguageView, TeamActivityView, TeamCardView; TeamMembershipView = Backbone.View.extend({ tagName: 'div', @@ -54,6 +56,28 @@ } }); + TeamActivityView = Backbone.View.extend({ + tagName: 'div', + className: 'team-activity', + template: _.template(teamActivityTemplate), + + initialize: function (options) { + this.date = options.date; + }, + + render: function () { + this.$el.html( + interpolate( + // Translators: 'date' is a placeholder for a fuzzy, relative timestamp (see: https://github.com/rmm5t/jquery-timeago) + gettext("Last Activity %(date)s"), + {date: this.template({date: this.date})}, + true + ) + ); + this.$('abbr').timeago(); + } + }); + TeamCardView = CardView.extend({ initialize: function () { CardView.prototype.initialize.apply(this, arguments); @@ -64,7 +88,8 @@ model: this.teamModel(), countries: this.countries, languages: this.languages - }) + }), + new TeamActivityView({date: this.teamModel().get('last_activity_at')}) ]; }, diff --git a/lms/djangoapps/teams/static/teams/templates/team-activity.underscore b/lms/djangoapps/teams/static/teams/templates/team-activity.underscore new file mode 100644 index 0000000000..dcf5083f62 --- /dev/null +++ b/lms/djangoapps/teams/static/teams/templates/team-activity.underscore @@ -0,0 +1 @@ + diff --git a/lms/static/js/spec/main.js b/lms/static/js/spec/main.js index 8e21940555..5c256b53e5 100644 --- a/lms/static/js/spec/main.js +++ b/lms/static/js/spec/main.js @@ -794,6 +794,7 @@ 'lms/include/teams/js/spec/teams_tab_factory_spec.js', 'lms/include/teams/js/spec/views/edit_team_spec.js', 'lms/include/teams/js/spec/views/my_teams_spec.js', + 'lms/include/teams/js/spec/views/team_card_spec.js', 'lms/include/teams/js/spec/views/team_discussion_spec.js', 'lms/include/teams/js/spec/views/team_profile_spec.js', 'lms/include/teams/js/spec/views/teams_spec.js', diff --git a/lms/static/lms/js/require-config.js b/lms/static/lms/js/require-config.js index 13270a1993..a40ac7f362 100644 --- a/lms/static/lms/js/require-config.js +++ b/lms/static/lms/js/require-config.js @@ -44,6 +44,7 @@ "underscore.string": "js/vendor/underscore.string.min", "jquery": "js/vendor/jquery.min", "jquery.cookie": "js/vendor/jquery.cookie", + 'jquery.timeago': 'js/vendor/jquery.timeago', "jquery.url": "js/vendor/url.min", "jquery.ui": "js/vendor/jquery-ui.min", "jquery.iframe-transport": "js/vendor/jQuery-File-Upload/js/jquery.iframe-transport", @@ -94,6 +95,10 @@ deps: ["jquery"], exports: "jQuery.fn.cookie" }, + "jquery.timeago": { + deps: ["jquery"], + exports: "jQuery.timeago" + }, "jquery.url": { deps: ["jquery"], exports: "jQuery.url"