Merge pull request #964 from LibraryOfCongress/activity-ui-text-modif…

…ication-tracking Transcription View: avoid updates for unmodified sources
LibraryOfCongress · May 16, 2019 · 6c734e6 · 6c734e6
2 parents 21aca8b + e401be6
commit 6c734e6
Show file tree

Hide file tree

Showing 6 changed files with 121 additions and 74 deletions.
diff --git a/concordia/api_views.py b/concordia/api_views.py
@@ -13,7 +13,7 @@
 The base APIViewMixin implements a base implementation of serialize_object which
 uses the generic django.forms.models.model_to_dict and can be overridden as needed.
 """
-import time
+from time import time
 
 from django.core.serializers.json import DjangoJSONEncoder
 from django.forms.models import model_to_dict
@@ -107,7 +107,7 @@ def get_paginate_by(self, queryset):
     def serialize_context(self, context):
         data = {
             "objects": [self.serialize_object(i) for i in context["object_list"]],
-            "sent": int(time.time()),
+            "sent": time(),
         }
 
         page_obj = context["page_obj"]

diff --git a/concordia/signals/handlers.py b/concordia/signals/handlers.py
@@ -1,3 +1,5 @@
+from time import time
+
 from asgiref.sync import AsyncToSync
 from channels.layers import get_channel_layer
 from django.conf import settings
@@ -105,5 +107,6 @@ def send_asset_reservation_message(
             "type": message_type,
             "asset_pk": asset_pk,
             "reservation_token": reservation_token,
+            "sent": time(),
         },
     )
diff --git a/concordia/static/js/action-app/components.js b/concordia/static/js/action-app/components.js
@@ -259,7 +259,7 @@ class Li {
 class AssetListItem {
     constructor([assetListObserver]) {
         this.el = html('li', {
-            class: 'asset border',
+            class: 'asset',
             tabIndex: 0
         });
 
@@ -279,7 +279,7 @@ class AssetListItem {
         }
 
         this.el.id = assetData.id;
-        this.el.classList.add('asset', 'border');
+        this.el.classList.add('asset');
         this.el.dataset.image = thumbnailUrl;
         this.el.dataset.id = assetData.id;
         this.el.dataset.status = assetData.status;
@@ -295,7 +295,7 @@ class AssetListItem {
 }
 
 export class AssetList extends List {
-    constructor(assets, callbacks) {
+    constructor(callbacks) {
         // TODO: refactor this into a utility function
         let assetListObserver = new IntersectionObserver(entries => {
             entries
@@ -337,17 +337,17 @@ export class AssetList extends List {
             }
         });
 
-        this.setupTooltip(assets);
+        this.setupTooltip(callbacks.getAssetData);
     }
 
-    setupTooltip(assets) {
+    setupTooltip(getAssetData) {
         /* Tooltips */
         let tooltip = new AssetTooltip();
 
         const handleTooltipShowEvent = event => {
             let target = event.target;
             if (target && target.classList.contains('asset')) {
-                const asset = assets.get(target.dataset.id);
+                const asset = getAssetData(target.dataset.id);
                 tooltip.update(asset);
                 mount(target, tooltip);
             }
@@ -397,14 +397,13 @@ export class AssetList extends List {
     }
 
     setActiveAsset(assetElement) {
-        // TODO: stop using Bootstrap classes directly and toggle semantic classes only
         $$('.asset.asset-active', this.el).forEach(element => {
             if (element != assetElement) {
-                element.classList.remove('asset-active', 'border-primary');
+                element.classList.remove('asset-active');
             }
         });
 
-        assetElement.classList.add('asset-active', 'border-primary');
+        assetElement.classList.add('asset-active');
 
         this.scrollToActiveAsset();
     }
@@ -620,6 +619,23 @@ class TranscriberView {
     }
 
     update(asset) {
+        if (
+            this.currentAsset &&
+            this.currentAsset.id == asset.id &&
+            asset.latest_transcription &&
+            this.currentAsset.latest_transcription &&
+            this.currentAsset.latest_transcription.id ==
+                asset.latest_transcription.id &&
+            this.currentAsset.latest_transcription.text ==
+                asset.latest_transcription.text
+        ) {
+            // eslint-disable-next-line no-console
+            console.debug(
+                `Asset ${asset.id} unmodified; not resetting transcription view`
+            );
+            return;
+        }
+
         this.currentAsset = asset;
         let text = '';
         if (asset.latest_transcription && asset.latest_transcription.text) {