Fix issue sillsdev/web-languageforge/#102 Display sentence translations

User requested "List View" to also display translations of the example sentence.

Former-commit-id: 70bdea6

Author: darcywong00

src/angular-app/languageforge/lexicon/directive/dc-rendered.html

@@ -10,6 +10,7 @@
         <span class="dc-rendered-definition" ng-bind-html="sense.meaning"></span>
         <span class="dc-rendered-exampleContainer" ng-repeat="example in sense.examples">
             <span class="dc-rendered-exampleSentence" ng-bind-html="example.sentence"></span>
+            <span class="dc-rendered-exampleSentenceTranslation" ng-bind-html="example.sentenceTranslation"></span>
         </span>
     </span>
-</div>
+</div>

src/angular-app/languageforge/lexicon/directive/dc-rendered.js

@@ -41,8 +41,11 @@ angular.module('palaso.ui.dc.rendered', ['lexicon.services'])
           angular.forEach(senseModel.examples, function (exampleModel) {
             sense.examples.push({
               sentence:
-                utils.getExampleSentence($scope.config.fields.senses.fields.examples, exampleModel)
-            });
+                utils.getExample($scope.config.fields.senses.fields.examples,
+                  exampleModel, 'sentence') }, {
+              sentenceTranslation:
+                utils.getExample($scope.config.fields.senses.fields.examples,
+                  exampleModel, 'translation') });
           });
 
           $scope.entry.senses.push(sense);

src/angular-app/languageforge/lexicon/directive/dc-rendered.scss

@@ -14,6 +14,10 @@
 }
 .dc-rendered-exampleContainer {}
 .dc-rendered-exampleSentence {
-  margin: 0 3px 0 3px;
+  margin: 0 1px 0 1px;
   font-style: italic;
 }
+.dc-rendered-exampleSentenceTranslation {
+  margin: 0 1px 0 1px;
+  font-style: normal;
+}

src/angular-app/languageforge/lexicon/directive/dc-sense.js

@@ -26,8 +26,8 @@ angular.module('palaso.ui.dc.sense', ['palaso.ui.dc.fieldrepeat', 'palaso.ui.dc.
 
       $scope.deleteExample = function deleteExample(index) {
         var deletemsg = "Are you sure you want to delete the example <b>' " +
-          utils.getExampleSentence($scope.config.fields.examples, $scope.model.examples[index]) +
-          " '</b>";
+          utils.getExample($scope.config.fields.examples, $scope.model.examples[index],
+            'sentence') + " '</b>";
         modal.showModalSimple('Delete Example', deletemsg, 'Cancel', 'Delete Example')
           .then(function () {
             $scope.model.examples.splice(index, 1);

src/angular-app/languageforge/lexicon/js/lexicon.services.utils.js

@@ -127,8 +127,15 @@ angular.module('lexicon.services')
       return meaning;
     };
 
-    this.getExampleSentence = function getExampleSentence(config, example) {
-      return getFields(config, example, 'sentence');
+    /**
+     * @param config example config obj
+     * @param example
+     * @field string 'sentence' or 'translation'
+     */
+    this.getExample = function getExampleSentence(config, example, field) {
+      if (field == 'sentence' || field == 'translation') {
+        return getFields(config, example, field);
+      }
     };
 
     this.getPartOfSpeechAbbreviation = function getPartOfSpeechAbbreviation(posModel, optionlists) {

test/app/languageforge/lexicon/editor/e2e/editor-entry.spec.js

@@ -384,6 +384,25 @@ describe('Editor List and Entry', function () {
     editorPage.edit.senses.first().click();
   });
 
+  it('dictionary citation reflects example sentences and translations', function () {
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[0].examples[0].sentence.th.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[0].examples[0].translation.en.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[0].examples[1].sentence.th.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[0].examples[1].translation.en.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[1].examples[0].sentence.th.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[1].examples[0].translation.en.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[1].examples[1].sentence.th.value);
+    expect(editorPage.edit.renderedDiv.getText()).toContain(
+      constants.testMultipleMeaningEntry1.senses[1].examples[1].translation.en.value);
+  });
+
   it('word with multiple definitions: edit page has correct definitions, parts of speech',
   function () {
     expect(editorPage.edit.getFieldValues('Definition')).toEqual([