Work on adapt-it#507

Split out KBView / TargetUnit template to service both a KB item view (without a selected source phrase) and a "Show Translations" screen (with a selected source phrase)
eb1 · Oct 3, 2023 · 356adf1 · 356adf1
1 parent d237c16
commit 356adf1
Show file tree

Hide file tree

Showing 3 changed files with 36 additions and 25 deletions.
diff --git a/www/js/Application.js b/www/js/Application.js
@@ -463,14 +463,16 @@ define(function (require) {
                 // update the KB and source phrase list, then display the Translations screen with the currently-selected sourcephrase
                 $.when(window.Application.kbList.fetch({reset: true, data: {projectid: window.Application.currentProject.get('projectid')}})).done(function () {
                     $.when(window.Application.spList.fetch({reset: true, data: {spid: window.Application.currentProject.get('lastAdaptedSPID')}})).done(function () {
-                        var tu = window.Application.kbList.where({tuid: id});
-                        if (tu === null) {
-                            console.log("KB Entry not found:" + id);
+                        var sp = window.Application.spList.where({spid: id});
+                        if (sp === null || sp.length === 0) {
+                            console.log("sp Entry not found:" + id);
+                        } else {
+                            var tu = window.Application.kbList.findWhere({'source': sp[0].get("source").toLowerCase(), 'isGloss': 0});
+                            showTransView = new SearchViews.TUView({model: tu});
+                            showTransView.spObj = sp[0];
+                            showTransView.delegateEvents();
+                            window.Application.main.show(showTransView);    
                         }
-                        showTransView = new SearchViews.TUView({model: tu[0]});
-                        showTransView.spObj = window.Application.spList[0];
-                        showTransView.delegateEvents();
-                        window.Application.main.show(showTransView);
                     });
                 });
             },

diff --git a/www/js/views/SearchViews.js b/www/js/views/SearchViews.js
@@ -315,10 +315,16 @@ define(function (require) {
 
             },
             onClickRefString: function (event) {
-                var RS_ACTIONS = "<div class=\"control-row\"><button id=\"btnRSSelect\" class=\"btnSelect\" title=\"" + i18next.t("view.lblUseTranslation") + "\"><span class=\"btn-check\" role=\"img\"></span>" + i18next.t("view.lblUseTranslation") + "</button></div><div class=\"control-row\"><button id=\"btnRSEdit\" title=\"" + i18next.t("view.lblEditTranslation") + "\" class=\"btnEdit\"><span class=\"btn-pencil\" role=\"img\"></span>" + i18next.t("view.lblEditTranslation") + "</button></div><div class=\"control-row\"><button id=\"btnRSSearch\" title=\"" + i18next.t("view.lblFindInDocuments") + "\" class=\"btnSearch\"><span class=\"btn-search\" role=\"img\"></span>" + i18next.t("view.lblFindInDocuments") + "</button></div><div id=\"rsResults\" class=\"control-group rsResults\"></div><div class=\"control-row\"><button id=\"btnRSDelete\" title=\"" + i18next.t("view.lblDeleteTranslation") + "\" class=\"btnDelete danger\"><span class=\"btn-delete\" role=\"img\"></span>" + i18next.t("view.lblDeleteTranslation") + "</button></div>",
+                var RS_ACTIONS = "",
                     RS_HIDDEN = "<div class=\"control-row\">" + i18next.t("view.dscHiddenTranslation") + "</div><div class=\"control-row\"><button id=\"btnRSRestore\" class=\"btnRestore\" title=\"" + i18next.t("view.lblRestoreTranslation") + "\"><span class=\"btn-check\" role=\"img\"></span>" + i18next.t("view.lblRestoreTranslation") + "</button></div>",
                     refstrings = this.model.get("refstring"),
                     index = event.currentTarget.id.substr(3);
+                if (this.spObj !== null) {
+                    // only add the "select this translation" if we have a current source phrase
+                    RS_ACTIONS = "<div class=\"control-row\"><button id=\"btnRSSelect\" class=\"btnSelect\" title=\"" + i18next.t("view.lblUseTranslation") + "\"><span class=\"btn-check\" role=\"img\"></span>" + i18next.t("view.lblUseTranslation") + "</button></div>";
+                }
+                // add the rest of the actions
+                RS_ACTIONS += "<div class=\"control-row\"><button id=\"btnRSEdit\" title=\"" + i18next.t("view.lblEditTranslation") + "\" class=\"btnEdit\"><span class=\"btn-pencil\" role=\"img\"></span>" + i18next.t("view.lblEditTranslation") + "</button></div><div class=\"control-row\"><button id=\"btnRSSearch\" title=\"" + i18next.t("view.lblFindInDocuments") + "\" class=\"btnSearch\"><span class=\"btn-search\" role=\"img\"></span>" + i18next.t("view.lblFindInDocuments") + "</button></div><div id=\"rsResults\" class=\"control-group rsResults\"></div><div class=\"control-row\"><button id=\"btnRSDelete\" title=\"" + i18next.t("view.lblDeleteTranslation") + "\" class=\"btnDelete danger\"><span class=\"btn-delete\" role=\"img\"></span>" + i18next.t("view.lblDeleteTranslation") + "</button></div>";
                 // Toggle the visibility of the action menu bar
                 if ($("#lia-" + index).hasClass("show")) {
                     // hide it
@@ -639,15 +645,9 @@ define(function (require) {
 //                window.Application.router.navigate("adapt/" + cid, {trigger: true});
             },
             onShow: function () {
+                // fill current translation info
                 var srcLang = window.Application.currentProject.get('SourceLanguageName');
                 var tgtLang = window.Application.currentProject.get('TargetLanguageName');
-                if (window.Application.spList.length > 0) {
-                    // found a sourcephrase -- fill out the UI
-                    var sp = window.Application.spList.at(0);
-                    $("#srcPhrase").html(sp.get("source"));
-                    $("#tgtPhrase").html(sp.get("target"));
-                }
-                // fill current translation info
                 $("#lblSourceLang").html(srcLang);
                 $("#lbltargetLang").html(tgtLang);
                 // load the source / target punctuation pairs
@@ -660,12 +660,19 @@ define(function (require) {
                     caseSource.push(elt.s);
                     caseTarget.push(elt.t);
                 });
+                // source we're looking at
+                $("#srcPhrase").html(this.model.get("source"));
+                // are we looking at a current point in the translation, or just the possible TU refstrings?
                 if (this.spObj === null) {
-                    // no spObj passed in -- we're looking at the possible translations for a target unit,
-                    // NOT the "show translations" dialog
-                    $("#curSP").hide();
-                }
-
+                    // no spObj passed in -- we're looking at the possible refstrings for a target unit,
+                    // NOT the "show translations" dialog -- hide the current translation stuff
+                    $("#lblCurrentTrans").hide();
+                    $(".tgtbox").hide();
+                } else {
+                    // looking at a current point in the translation (i.e, the Show Translations dialog) -
+                    // show what the current translation for this sourcephrase is
+                    $("#tgtPhrase").html(this.spObj.get("target"));
+                }                
                 // display the refstrings (and their relative frequency)
                 this.showRefStrings(""); // empty param --> don't select anything
             }

diff --git a/www/tpl/TargetUnit.html b/www/tpl/TargetUnit.html
@@ -1,5 +1,9 @@
 {{! TargetUnit.html
     Template for displaying an individual KB target unit (one or more translations for a single source phrase).
+    This template does double duty:
+    - Individual item view for the KB editor (accessed through the settings)
+    - "Show translations" screen (accessed when adapting)
+    TUView in SearchViews.js creates this template.
 }}
 <div class="topcoat-navigation-bar main_title bg-lightblue">
     <div class="topcoat-navigation-bar__item">
@@ -9,11 +13,9 @@
 </div>
 <div id="mobileSelect" class="scroller-notb">
     <div class="chapter-list topcoat-list__container" id="Container" style="width:100%">
-        <div id="curSP">
-            <div class="topcoat-list__header" id="lblCurrentTrans">{{t 'view.lblCurrentTranslation'}}</div>
-            <div class="srcbox"><div class="emphasized-small" id="lblSourceLang"></div><div class="center emphasized" id="srcPhrase">{{source}}</div></div><div class="tgtbox"><div><div class="emphasized-small" id="lbltargetLang"></div><div class="emphasized center"><span id="tgtPhrase" contenteditable="true"></span></div></div></div>
-        </div>
-        <div id="noCurSP"></div>
+        <div class="topcoat-list__header" id="lblCurrentTrans">{{t 'view.lblCurrentTranslation'}}</div>
+        <div class="srcbox"><div class="emphasized-small" id="lblSourceLang"></div><div class="emphasized center"><span id="srcPhrase"></span></div></div>
+        <div class="tgtbox"><div class="emphasized-small" id="lbltargetLang"></div><div class="emphasized center"><span id="tgtPhrase" contenteditable="true"></span></div></div>
         <div class="topcoat-list__header" id="lblAllTrans">{{t 'view.lblAllTranslations'}} <span class="right">{{t 'view.lblFrequency'}}</span></div>
         <ul class="topcoat-list__container chapter-list" id="RefStrings"></ul>
     </div>