Improved keyboard-based navigation in comments

diff --git a/com.woltlab.wcf/templates/commentList.tpl b/com.woltlab.wcf/templates/commentList.tpl
index 440492168055cd3eb81215bcf65db59095feafd1..fcdb97d52fc4bb4a0077efea44e0f46e946fdafe 100644 (file)
--- a/com.woltlab.wcf/templates/commentList.tpl
+++ b/com.woltlab.wcf/templates/commentList.tpl
@@ -29,7 +29,7 @@
                                        <nav class="jsMobileNavigation buttonGroupNavigation">
                                                <ul class="commentOptions">
                                                        {if $commentManager->supportsReport() && $__wcf->session->getPermission('user.profile.canReportContent')}
-                                                               <li class="jsReportCommentComment jsOnly" data-object-id="{@$comment->commentID}"><a title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 icon-warning-sign"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
+                                                               <li class="jsReportCommentComment jsOnly" data-object-id="{@$comment->commentID}"><a href="#" title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 icon-warning-sign"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
                                                        {/if}
                                                        
                                                        {event name='commentOptions'}

diff --git a/com.woltlab.wcf/templates/commentResponseList.tpl b/com.woltlab.wcf/templates/commentResponseList.tpl
index 9aaaa032469e9cccd017f127af4e20c866c30419..c49cfba33752028d415a2ea8705923d2a9020ddd 100644 (file)
--- a/com.woltlab.wcf/templates/commentResponseList.tpl
+++ b/com.woltlab.wcf/templates/commentResponseList.tpl
@@ -27,7 +27,7 @@
                                <nav class="jsMobileNavigation buttonGroupNavigation">
                                        <ul class="commentOptions">
                                                {if $commentManager->supportsReport() && $__wcf->session->getPermission('user.profile.canReportContent')}
-                                                       <li class="jsReportCommentResponse jsOnly" data-object-id="{@$response->responseID}"><a title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 icon-warning-sign"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
+                                                       <li class="jsReportCommentResponse jsOnly" data-object-id="{@$response->responseID}"><a href="#" title="{lang}wcf.moderation.report.reportContent{/lang}" class="jsTooltip"><span class="icon icon16 icon-warning-sign"></span> <span class="invisible">{lang}wcf.moderation.report.reportContent{/lang}</span></a></li>
                                                {/if}
                                                
                                                {event name='commentOptions'}

diff --git a/wcfsetup/install/files/js/WCF.Comment.js b/wcfsetup/install/files/js/WCF.Comment.js
index 833d41d60e0176f5df368e7e3d159230c89e76b3..5ca2616d17d604afd3efff01360b92a4a04e6559 100644 (file)
--- a/wcfsetup/install/files/js/WCF.Comment.js
+++ b/wcfsetup/install/files/js/WCF.Comment.js
@@ -272,12 +272,12 @@ WCF.Comment.Handler = Class.extend({
                }
                
                if (comment.data('canEdit')) {
-                       var $editButton = $('<li><a class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.edit') + '"><span class="icon icon16 icon-pencil" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.edit') + '</span></a></li>');
+                       var $editButton = $('<li><a href="#" class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.edit') + '"><span class="icon icon16 icon-pencil" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.edit') + '</span></a></li>');
                        $editButton.data('commentID', commentID).appendTo(comment.find('ul.commentOptions:eq(0)')).click($.proxy(this._prepareEdit, this));
                }
                
                if (comment.data('canDelete')) {
-                       var $deleteButton = $('<li><a class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.delete') + '"><span class="icon icon16 icon-remove" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.delete') + '</span></a></li>');
+                       var $deleteButton = $('<li><a href="#" class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.delete') + '"><span class="icon icon16 icon-remove" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.delete') + '</span></a></li>');
                        $deleteButton.data('commentID', commentID).appendTo(comment.find('ul.commentOptions:eq(0)')).click($.proxy(this._delete, this));
                }
        },
@@ -304,14 +304,14 @@ WCF.Comment.Handler = Class.extend({
         */
        _initResponse: function(responseID, response) {
                if (response.data('canEdit')) {
-                       var $editButton = $('<li><a class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.edit') + '"><span class="icon icon16 icon-pencil" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.edit') + '</span></a></li>');
+                       var $editButton = $('<li><a href="#" class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.edit') + '"><span class="icon icon16 icon-pencil" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.edit') + '</span></a></li>');
                        
                        var self = this;
                        $editButton.data('responseID', responseID).appendTo(response.find('ul.commentOptions:eq(0)')).click(function(event) { self._prepareEdit(event, true); });
                }
                
                if (response.data('canDelete')) {
-                       var $deleteButton = $('<li><a class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.delete') + '"><span class="icon icon16 icon-remove" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.delete') + '</span></a></li>');
+                       var $deleteButton = $('<li><a href="#" class="jsTooltip" title="' + WCF.Language.get('wcf.global.button.delete') + '"><span class="icon icon16 icon-remove" /> <span class="invisible">' + WCF.Language.get('wcf.global.button.delete') + '</span></a></li>');
                        
                        var self = this;
                        $deleteButton.data('responseID', responseID).appendTo(response.find('ul.commentOptions:eq(0)')).click(function(event) { self._delete(event, true); });
@@ -360,6 +360,7 @@ WCF.Comment.Handler = Class.extend({
         * @param       boolean         isResponse
         */
        _prepareEdit: function(event, isResponse) {
+               event.preventDefault();
                var $button = $(event.currentTarget);
                var $data = {
                        objectID: this._container.data('objectID'),
@@ -487,6 +488,7 @@ WCF.Comment.Handler = Class.extend({
         * @param       boolean         isResponse
         */
        _delete: function(event, isResponse) {
+               event.preventDefault();
                WCF.System.Confirmation.show(WCF.Language.get('wcf.comment.delete.confirmMessage'), $.proxy(function(action) {
                        if (action === 'confirm') {
                                var $data = {