diff --git a/cms/migrations/0013_programpage_thumbnail_image.py b/cms/migrations/0013_programpage_thumbnail_image.py new file mode 100644 index 0000000000..64732bf253 --- /dev/null +++ b/cms/migrations/0013_programpage_thumbnail_image.py @@ -0,0 +1,22 @@ +# -*- coding: utf-8 -*- +# Generated by Django 1.9.7 on 2016-06-22 15:41 +from __future__ import unicode_literals + +from django.db import migrations, models +import django.db.models.deletion + + +class Migration(migrations.Migration): + + dependencies = [ + ('wagtailimages', '0012_copy_image_permissions_to_collections'), + ('cms', '0012_programpage_external_program_page_url'), + ] + + operations = [ + migrations.AddField( + model_name='programpage', + name='thumbnail_image', + field=models.ForeignKey(blank=True, null=True, on_delete=django.db.models.deletion.SET_NULL, related_name='+', to='wagtailimages.Image'), + ), + ] diff --git a/cms/models.py b/cms/models.py index e61f3760c7..3352c2aaf3 100644 --- a/cms/models.py +++ b/cms/models.py @@ -78,9 +78,18 @@ class ProgramPage(Page): contact_us = RichTextField(blank=True) title_over_image = RichTextField(blank=True) + thumbnail_image = models.ForeignKey( + Image, + null=True, + blank=True, + on_delete=models.SET_NULL, + related_name='+' + ) + content_panels = Page.content_panels + [ FieldPanel('description', classname="full"), FieldPanel('program'), + FieldPanel('thumbnail_image'), FieldPanel('external_program_page_url'), FieldPanel('background_image'), FieldPanel('contact_us'), diff --git a/cms/templates/cms/home_page.html b/cms/templates/cms/home_page.html index 81ceaf6d6d..9dbbead591 100644 --- a/cms/templates/cms/home_page.html +++ b/cms/templates/cms/home_page.html @@ -79,7 +79,13 @@

MicroMasters

- course image for {{program}} + {% if program.programpage and program.programpage.thumbnail_image %} + {% image program.programpage.thumbnail_image fill-378x225 as thumbnail_image %} + course image for {{program}} + {% else %} + course image for {{program}} + {% endif %}
diff --git a/static/images/course-thumbnail.png b/static/images/course-thumbnail.png new file mode 100644 index 0000000000..028afe8f32 Binary files /dev/null and b/static/images/course-thumbnail.png differ diff --git a/static/scss/homepage.scss b/static/scss/homepage.scss index 4a2573447a..b11b0c9df1 100644 --- a/static/scss/homepage.scss +++ b/static/scss/homepage.scss @@ -197,9 +197,12 @@ body.app-media { .app-media .media-list { padding-bottom: 25px; } -.app-media .media-list .image-wrap > .image { - width:100%; - max-width: 100%; +.app-media .media-list .image-wrap { + // edX course images are 378x225 + > .image { + width: 100%; + height: auto; + } } .app-media .media-list .media-item-actions { display: none; diff --git a/ui/views_test.py b/ui/views_test.py index bd225fa843..c7bca5c9e0 100644 --- a/ui/views_test.py +++ b/ui/views_test.py @@ -10,6 +10,8 @@ from factory.fuzzy import FuzzyText from mock import patch, Mock from rest_framework import status +from wagtail.wagtailimages.models import Image +from wagtail.wagtailimages.tests.utils import get_test_image_file from cms.models import HomePage, ProgramPage from courses.models import Program @@ -304,6 +306,37 @@ def test_sign_out_button(self): response = self.client.get(self.program_page.url) self.assertContains(response, 'Sign out') + def test_program_thumbnail_default(self): + """Verify that a default thumbnail shows up for a live program""" + self.create_and_login_user() + + default_image = 'images/course-thumbnail.png' + # the default image should not show up if no program is live + program = self.program_page.program + program.live = False + program.save() + resp = self.client.get('/') + self.assertNotContains(resp, default_image) + + # default image should show up if a program is live and no thumbnail image was set + program.live = True + program.save() + resp = self.client.get('/') + self.assertContains(resp, default_image) + + def test_program_thumbnail(self): + """Verify that a thumbnail shows up if specified for a ProgramPage""" + self.create_and_login_user() + + image = Image.objects.create(title='Test image', + file=get_test_image_file()) + + self.program_page.thumbnail_image = image + self.program_page.save() + + resp = self.client.get('/') + self.assertContains(resp, image.get_rendition('fill-378x225').url) + class TestUsersPage(ViewsTests): """