slightly nicer on different sized devices

teamtemp/responses/admin.py

@@ -30,6 +30,8 @@ class WordCloudImageAdmin(admin.ModelAdmin):
     list_display = (
         "id",
         "word_hash",
+        "width",
+        "height",
         "image_url",
         "creation_date",
         "modified_date")
@@ -39,6 +41,8 @@ class WordCloudImageAdmin(admin.ModelAdmin):
         "creation_date",
         "modified_date",
         "word_list",
+        "width",
+        "height",
         "word_hash")
     search_fields = ("id", "word_hash", "word_list")
 

teamtemp/responses/migrations/0026_auto_20200513_1412.py

@@ -0,0 +1,32 @@
+# Generated by Django 2.2.12 on 2020-05-13 04:12
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('responses', '0025_auto_20200429_0918'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='wordcloudimage',
+            name='height',
+            field=models.PositiveSmallIntegerField(default=400),
+        ),
+        migrations.AddField(
+            model_name='wordcloudimage',
+            name='width',
+            field=models.PositiveSmallIntegerField(default=400),
+        ),
+        migrations.AlterField(
+            model_name='wordcloudimage',
+            name='word_hash',
+            field=models.CharField(max_length=40),
+        ),
+        migrations.AlterUniqueTogether(
+            name='wordcloudimage',
+            unique_together={('word_hash', 'width', 'height')},
+        ),
+    ]

teamtemp/responses/migrations/0027_auto_20200513_2253.py

@@ -0,0 +1,23 @@
+# Generated by Django 2.2.12 on 2020-05-13 12:53
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('responses', '0026_auto_20200513_1412'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='wordcloudimage',
+            name='height',
+            field=models.PositiveSmallIntegerField(null=True),
+        ),
+        migrations.AlterField(
+            model_name='wordcloudimage',
+            name='width',
+            field=models.PositiveSmallIntegerField(null=True),
+        ),
+    ]

teamtemp/responses/migrations/0028_auto_20200513_2254.py

@@ -0,0 +1,23 @@
+# Generated by Django 2.2.12 on 2020-05-13 12:54
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('responses', '0027_auto_20200513_2253'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='wordcloudimage',
+            name='height',
+            field=models.PositiveSmallIntegerField(blank=True, null=True),
+        ),
+        migrations.AlterField(
+            model_name='wordcloudimage',
+            name='width',
+            field=models.PositiveSmallIntegerField(blank=True, null=True),
+        ),
+    ]

teamtemp/responses/models.py

@@ -13,18 +13,25 @@
 
 @python_2_unicode_compatible
 class WordCloudImage(models.Model):
+    class Meta(object):
+      unique_together = ("word_hash", "width", "height")
+
     id = models.AutoField(primary_key=True)
-    word_hash = models.CharField(max_length=40, unique=True)
+    word_hash = models.CharField(max_length=40)
     word_list = models.CharField(max_length=5000)
+    width = models.PositiveSmallIntegerField(null=True, blank=True)
+    height = models.PositiveSmallIntegerField(null=True, blank=True)
     image_url = models.CharField(max_length=255, null=True, blank=True)
     creation_date = models.DateTimeField(auto_now_add=True)
     modified_date = models.DateTimeField(auto_now=True, db_index=True)
 
     def __str__(self):
-        return "{}: {} {} {} {}".format(
+        return "{}: {} {} {} {} {} {}".format(
             self.id,
             self.creation_date,
             self.word_hash,
+            self.width,
+            self.height,
             self.word_list,
             self.image_url)
 

teamtemp/responses/serializers.py

@@ -23,6 +23,8 @@ class Meta(object):
             'id',
             'creation_date',
             'word_list',
+            'width',
+            'height',
             'word_hash',
             'image_url')
 

teamtemp/static/style.css

@@ -39,7 +39,7 @@ div.help-block {
   color: green;
   border: 2px solid grey;
   border-radius: 25px;
-  min-height: 400px;
+  min-height: 350px;
   background-color: #eee;
   word-spacing: 10px;
   line-height: 200%;
@@ -50,9 +50,15 @@ div.help-block {
   display: none;
 }
 
+#wordcloud-image {
+  height: 350px;
+  width: 300px;
+  margin-top: 13px;
+}
+
 .centregauge {
   width: 100%;
-  min-height: 400px;
+  min-height: 350px;
   display: block;
   margin-left: auto;
   margin-right: auto;
@@ -64,7 +70,7 @@ div.help-block {
   margin-right: auto;
   page-break-after: always;
   page-break-inside: avoid;
-  min-height: 400px;
+  min-height: 350px;
   padding-top: 10px;
   padding-bottom: 10px;
 }
@@ -75,6 +81,18 @@ div.help-block {
   }
 }
 
+@media only screen and (min-device-width: 768px) {
+  #wordcloud-image {
+    width: 400px !important;
+  }
+}
+
+@media only screen and (min-device-width: 992px) {
+  #wordcloud-image {
+    width: 500px !important;
+  }
+}
+
 ul {
   list-style-type: none;
   padding: 0;

teamtemp/templates/bvc.html

@@ -7,6 +7,17 @@
 
 {% block form_extra_head %}
   <script type='text/javascript' src="{% static "spin.min.js" %}"></script><script type='text/javascript' src="{% static "jquery.spin.min.js" %}"></script>
+  <style>
+    #wordcloud-image {
+      background-image: url("{{ bvc_data.word_cloud_small_url }}") !important;
+    }
+
+    @media only screen and (min-device-width: 768px) {
+      #wordcloud-image {
+        background-image: url("{{ bvc_data.word_cloud_medium_url }}") !important;
+      }
+    }
+  </style>
 {% endblock %}
 
 {% block bootstrap3_extra_script %}
@@ -46,7 +57,7 @@
       ]);
 
       var gauge_options = {
-        width: 400, height: 400,
+        width: 350, height: 350,
         redFrom: 0, redTo: 2.5,
         yellowFrom: 2.5, yellowTo: 5,
         greenFrom: 7.5, greenTo: 10,
@@ -284,12 +295,12 @@ <h6 align="center"><a
       {% endif %}
       </div>
       <div class="col-md-6">
-        <h3 align="center">{{ bvc_data.stats.count }} Response{% if bvc_data.stats.count != 1 %}s{% endif %}:</h3>
+        <h2 align="center">{{ bvc_data.stats.count }} Response{% if bvc_data.stats.count != 1 %}s{% endif %}:</h3>
 
         <div class="wordcloud">
-          {% if bvc_data.word_cloud_url %}
-            <a href="{{ bvc_data.word_cloud_url }}" id="wordcloud-link">
-              <img src="{{ bvc_data.word_cloud_url }}" width="{{ bvc_data.word_cloud_width }}" height="{{ bvc_data.word_cloud_height }}" title="{{ bvc_data.word_list }}" id="wordcloud-image">
+          {% if bvc_data.word_cloud_medium_url %}
+            <a href="{{ bvc_data.word_cloud_medium_url }}" id="wordcloud-link">
+              <div title="{{ bvc_data.word_list }}" id="wordcloud-image"> </div>
             </a>
           {% elif bvc_data.word_list %}
             <div class="wordcloud-text">{{ bvc_data.word_list }}</div>

teamtemp/tests/factories.py

@@ -13,6 +13,7 @@
 from teamtemp import utils
 from teamtemp.responses.models import TeamResponseHistory, Teams, \
     TeamTemperature, TemperatureResponse, User, WordCloudImage
+from teamtemp.views import DEFAULT_WORDCLOUD_HEIGHT, DEFAULT_WORDCLOUD_WIDTH
 
 fake = Faker()
 
@@ -88,6 +89,8 @@ class Meta(object):
         model = WordCloudImage
 
     word_list = ' '.join(fake.words(nb=random.randint(1, 25)))
+    width = DEFAULT_WORDCLOUD_WIDTH
+    height = DEFAULT_WORDCLOUD_HEIGHT
     image_url = "/%s/%s" % (fake.uri_path(), fake.file_name(category='image'))
     creation_date = factory.LazyFunction(timezone.now)
 

teamtemp/tests/models/test_word_cloud_image.py

@@ -6,17 +6,19 @@
 
 class WordCloudImageTestCases(TestCase):
     def test_wordcloud(self):
-        wordcloud = WordCloudImageFactory()
+        wordcloud = WordCloudImageFactory(width=666, height=333)
         self.assertTrue(len(wordcloud.word_list) > 0)
         self.assertTrue(len(wordcloud.word_hash) > 0)
         self.assertTrue(len(wordcloud.image_url) > 0)
         self.assertIsNotNone(wordcloud.creation_date)
         self.assertIsNotNone(wordcloud.modified_date)
         self.assertEqual(
             str(wordcloud),
-            "%s: %s %s %s %s" %
+            "%s: %s %s %s %s %s %s" %
             (wordcloud.id,
                 wordcloud.creation_date,
                 wordcloud.word_hash,
+                wordcloud.width,
+                wordcloud.height,
                 wordcloud.word_list,
                 wordcloud.image_url))

teamtemp/tests/view/test_wordcloud_view.py

@@ -1,3 +1,5 @@
+import sys
+
 from django.urls import reverse
 from django.test import TestCase
 from rest_framework import status
@@ -6,20 +8,11 @@
 
 
 class WordcloudViewTestCases(TestCase):
-    def assertWordCloudImage(
-            self,
-            response,
-            expected_url='/media/blank.png',
-            status_code=status.HTTP_302_FOUND):
-        self.assertRedirects(
-            response,
-            expected_url=expected_url,
-            status_code=status_code)
+    def assertWordCloudImage(self, response, expected_url='/media/blank.png', status_code=status.HTTP_302_FOUND):
+        self.assertRedirects(response, expected_url=expected_url, status_code=status_code)
         self.assertEqual(response.status_code, status.HTTP_200_OK)
         self.assertEqual(response['Content-Type'], 'image/png')
-        self.assertEqual(
-            response['Cache-Control'],
-            'public, max-age=315360000')
+        self.assertEqual(response['Cache-Control'], 'public, max-age=315360000')
         self.assertGreater(len(response.getvalue()), 0)
 
     def test_wordcloud_view_blank(self):
@@ -52,3 +45,19 @@ def test_wordcloud_view_found(self):
             response,
             word_cloud_image.image_url,
             status.HTTP_302_FOUND)
+
+    def test_wordcloud_view_found_with_size(self):
+        word_cloud_image = WordCloudImageFactory(image_url='/media/test.png', width=600, height=300)
+        response = self.client.get(
+            reverse(
+                'wordcloud',
+                kwargs={
+                    'word_hash': word_cloud_image.word_hash,
+                    'width': 600,
+                    'height': 300
+                }),
+            follow=True)
+        self.assertWordCloudImage(
+            response,
+            word_cloud_image.image_url,
+            status.HTTP_302_FOUND)

teamtemp/urls.py

@@ -72,6 +72,8 @@
     re_path(r'^team/(?P<survey_id>[0-9a-zA-Z]{8})/(?P<team_name>[-\w]{1,64})$', team_view, name='team'),
     re_path(r'^team/(?P<survey_id>[0-9a-zA-Z]{8})/?$', team_view, name='team'),
     re_path(r'^wordcloud/(?P<word_hash>[a-f0-9]{40})?$', wordcloud_view, name='wordcloud'),
+    re_path(r'^wordcloud/(?P<width>[1-9][0-9]{2,3})x(?P<height>[1-9][0-9]{2,3})/(?P<word_hash>[a-f0-9]{40})?$', wordcloud_view,
+        name='wordcloud'),
     re_path(r'^static/(.*)$', serve_static, {'document_root': settings.STATIC_ROOT}, name='static'),
     re_path(r'^media/(.*)$', media_view, {'document_root': settings.MEDIA_ROOT}, name='media'),
     re_path(r'^healthcheck/?$', health_check_view, name='healthcheck'),