Fix preview in description and comment for all modes

frontend/app/components/inplace-edit/field-directives/edit-wiki-textarea/edit-wiki-textarea.directive.html

@@ -11,7 +11,7 @@
           class="focus-input inplace-edit--textarea -animated"
           id="inplace-edit--write-value--{{::field.name}}"
           ng-hide="isPreview && !fieldController.state.isBusy"
-          preview-toggle="customEditorController.togglePreview"
+          preview-toggle="customEditorController.togglePreview()"
           name="value"
           ng-disabled="fieldController.state.isBusy"
           ng-required="fieldController.isRequired"

frontend/app/components/wp-edit/field-types/wp-edit-wiki-textarea-field.directive.html

@@ -2,7 +2,7 @@
   <textarea
           wiki-toolbar
           msd-elastic="\n"
-          preview-toggle="vm.field.togglePreview"
+          preview-toggle="vm.field.togglePreview()"
           style="min-height: 114px"
           class="focus-input wp-inline-edit--field inplace-edit--textarea -animated"
           name="value"

frontend/app/templates/work_packages/activities/_user.html

@@ -41,17 +41,17 @@
   <span class="user-comment wiki">
     <div ng-if="inEdit" class="inplace-edit">
       <div class="user-comment--form inplace-edit--write-value">
-        <div class="textarea-wrapper" ng-class="{'-preview': inPreview}">
+        <div class="textarea-wrapper" ng-class="{'-preview': isPreview}">
           <textarea wiki-toolbar
                     msd-elastic="\n"
                     class="edit-comment-text focus-input inplace-edit--textarea"
                     id="inplace-edit--write-value--activity-comment"
-                    ng-hide="inPreview"
+                    ng-hide="isPreview"
                     ng-model="activity.editedComment"
                     preview-toggle="toggleCommentPreview()"
                     required>
           </textarea>
-          <div class="inplace-edit--preview" ng-if="inPreview">
+          <div class="inplace-edit--preview" ng-if="isPreview">
             <span ng-bind-html="previewHtml"></span>
           </div>
           <div class="inplace-edit--dashboard">

frontend/app/ui_components/wiki-toolbar-directive.js

@@ -61,7 +61,7 @@ module.exports = function() {
         var title = scope.isPreview ? PREVIEW_DISABLE_TEXT : PREVIEW_ENABLE_TEXT;
         var toggledClasses = 'icon-preview icon-ticket-edit -active';
 
-        element.closest('.wp-edit-field')
+        element.closest('.textarea-wrapper')
                .find('.' + PREVIEW_BUTTON_CLASS).attr('title', title)
                                                 .attr('aria-label', title)
                                                 .toggleClass(toggledClasses);
@@ -69,7 +69,7 @@ module.exports = function() {
     };
 
     element
-      .closest('.wp-edit-field')
+      .closest('.textarea-wrapper')
       .find('.jstb_help')
       .after(jQuery('<button>', previewButtonAttributes));
     // changes are made by jQuery, we trigger input event so that
@@ -84,7 +84,7 @@ module.exports = function() {
     transclude: false,
     link: link,
     scope: {
-      previewToggle: '='
+      previewToggle: '&'
     }
   };
 };

frontend/app/work_packages/activities/user-activity-directive.js

@@ -127,18 +127,16 @@ module.exports = function($uiViewScroll,
       };
 
       scope.toggleCommentPreview = function() {
-        scope.inPreview = !scope.inPreview;
+        scope.isPreview = !scope.isPreview;
         scope.previewHtml = '';
-        if (scope.inPreview) {
+        if (scope.isPreview) {
           TextileService.renderWithWorkPackageContext(
             EditableFieldsState.workPackage.form,
             scope.activity.editedComment
           ).then(function(r) {
             scope.previewHtml = $sce.trustAsHtml(r.data);
-
-
           }, function() {
-            this.inPreview = false;
+            scope.isPreview = false;
           });
         }
       };