Cleaned up behaviour of comment editing/quoting.

app/assets/javascripts/angular/work_packages/tabs/user-activity-directive.js

@@ -28,7 +28,7 @@
 
 angular.module('openproject.workPackages.tabs')
 
-.directive('userActivity', ['I18n', 'PathHelper', 'ActivityService', function(I18n, PathHelper, ActivityService) {
+.directive('userActivity', ['$uiViewScroll', 'I18n', 'PathHelper', 'ActivityService', function($uiViewScroll, I18n, PathHelper, ActivityService) {
   return {
     restrict: 'E',
     replace: true,
@@ -43,6 +43,7 @@ angular.module('openproject.workPackages.tabs')
       scope.I18n = I18n;
       scope.userPath = PathHelper.staticUserPath;
       scope.inEdit = false;
+      scope.inFocus = false;
 
       scope.activity.links.user.fetch().then(function(user) {
         scope.userId = user.props.id;
@@ -59,7 +60,9 @@ angular.module('openproject.workPackages.tabs')
       };
 
       scope.quoteComment = function() {
-        angular.element('#' + scope.inputElementId).val(quotedText(scope.activity.props.rawComment));
+        var elem = angular.element('#' + scope.inputElementId);
+        elem.val(quotedText(scope.activity.props.rawComment));
+        $uiViewScroll(elem);
       };
 
       scope.updateComment = function(comment) {
@@ -70,6 +73,14 @@ angular.module('openproject.workPackages.tabs')
         });
       };
 
+      scope.showActions = function() {
+        scope.inFocus = true;
+      };
+
+      scope.hideActions = function() {
+        scope.inFocus = false;
+      };
+
       // TODO RS: Move this into WorkPackageDetailsHepler once it has been merge in from attachments branch
       function quotedText(rawComment) {
         quoted = rawComment.split("\n")

app/assets/stylesheets/_work_packages.scss

@@ -43,6 +43,10 @@ See doc/COPYRIGHT.rdoc for more details.
   cursor: pointer;
 }
 
+.action-icon {
+  cursor: pointer;
+}
+
 select.to-validate.ng-dirty.ng-valid, input.to-validate.ng-dirty.ng-valid { border:1px solid Green; }
 select.to-validate.ng-dirty.ng-invalid, input.to-validate.ng-dirty.ng-invalid { border:1px solid Red; }
 select.to-validate.ng-dirty.ng-valid ~ span.ok, input.to-validate.ng-dirty.ng-valid ~ span.ok { color:green; display:inline; }

public/templates/components/activity_comment.html

@@ -1,7 +1,7 @@
 <div class="activity-comment">
   <label>
     <h3>{{ title }}</h3>
-    <textarea id="add-comment-text"></textarea>
+    <textarea id="add-comment-text" name="add-comment"></textarea>
     <button class="button" ng-click="createComment()">{{ buttonTitle }}</button>
   </label>
 </div>

public/templates/work_packages/tabs/_user_activity.html

@@ -1,6 +1,12 @@
-<div class="work-package-details-activities-activity-contents">
+<div class="work-package-details-activities-activity-contents"
+     ng-mouseover="showActions()"
+     ng-mouseout="hideActions()">
   <div class="comments-number"><a ng-href="#{{ currentAnchor }}" ng-bind="'#' + activityNo"></a>
-    <div class="comments-icons"><i class="icon-quote" ng-click="quoteComment()"></i><i class="icon-edit" ng-click="editComment()"></i></div>
+    <div class="comments-icons"
+         ng-show="activity.props._type == 'Activity::Comment' && inFocus">
+      <i class="icon-quote action-icon" ng-click="quoteComment()"></i>
+      <i class="icon-edit action-icon" ng-click="editComment()"></i>
+    </div>
   </div>
   <img class="avatar" ng-src="{{ userAvatar }}" />
   <span class="user"><a ng-href="{{ userPath(userId) }}" name="{{ currentAnchor }}" ng-bind="userName"></a></span>

public/templates/work_packages/tabs/overview.html

@@ -44,7 +44,8 @@
                  activityNo = activities.length - $index;">
       <user-activity activity="activity"
                      activity-no="activityNo"
-                     currentAnchor="currentAnchor">
+                     currentAnchor="currentAnchor"
+                     input-element-id="'add-comment-text'">
     </li>
   </ul>
   <activity-comment work-package="workPackage"