Added comment permalink and location hash sharing

See #2223

diff --git a/wcfsetup/install/files/js/WCF.Comment.js b/wcfsetup/install/files/js/WCF.Comment.js
index 15440b9a796a1b8d39820cee4624b00107abee2a..5006bb6c6b0c2ca8cac33ef3b1b34946ec9e85e5 100644 (file)
--- a/wcfsetup/install/files/js/WCF.Comment.js
+++ b/wcfsetup/install/files/js/WCF.Comment.js
@@ -142,6 +142,19 @@ WCF.Comment.Handler = Class.extend({
                WCF.DOMNodeInsertedHandler.addCallback('WCF.Comment.Handler', $.proxy(this._domNodeInserted, this));
                
                WCF.System.ObjectStore.add('WCF.Comment.Handler', this);
+               
+               window.addEventListener('hashchange', function () {
+                       var hash = window.location.hash;
+                       if (hash && hash.match(/.+\/(comment\d+)/)) {
+                               var commentId = RegExp.$1;
+                               
+                               // delay scrolling in case a tab menu change was requested
+                               window.setTimeout(function () {
+                                       var comment = elById(commentId);
+                                       if (comment) comment.scrollIntoView({ behavior: 'smooth' });
+                               }, 100);
+                       }
+               });
        },
        
        /**
@@ -249,6 +262,20 @@ WCF.Comment.Handler = Class.extend({
         * Initializes available comments.
         */
        _initComments: function() {
+               var link = elBySel('link[rel="canonical"]');
+               if (link) {
+                       link = link.href;
+               }
+               else {
+                       link = window.location.toString().replace(/#.+$/, '');
+               }
+               
+               // check if comments are within a tab menu
+               var tab = this._container[0].closest('.tabMenuContent');
+               if (tab) {
+                       link += '#' + elData(tab, 'name');
+               }
+               
                var self = this;
                var $loadedComments = false;
                this._container.find('.jsComment').each(function(index, comment) {
@@ -256,6 +283,9 @@ WCF.Comment.Handler = Class.extend({
                        var $commentID = $comment.data('commentID');
                        self._comments[$commentID] = $comment;
                        
+                       // permalink anchor
+                       $comment[0].id = 'comment' + $commentID;
+                       
                        var $insertAfter = $comment.find('ul.commentResponseList');
                        if (!$insertAfter.length) $insertAfter = $comment.find('.commentContent');
                        
@@ -264,6 +294,7 @@ WCF.Comment.Handler = Class.extend({
                        
                        self._handleLoadNextResponses($commentID);
                        self._initComment($commentID, $comment);
+                       self._initPermalink($comment[0], link);
                        self._displayedComments++;
                        
                        $loadedComments = true;
@@ -296,6 +327,15 @@ WCF.Comment.Handler = Class.extend({
                }
        },
        
+       _initPermalink: function(comment, link) {
+               var anchor = elCreate('a');
+               anchor.href = link + (link.indexOf('#') === -1 ? '#' : '/') + 'comment' + elData(comment, 'object-id');
+               
+               var time = elBySel('.commentContent .containerHeadline time', comment);
+               time.parentNode.insertBefore(anchor, time);
+               anchor.appendChild(time);
+       },
+       
        /**
         * Initializes available responses.
         */

diff --git a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/TabMenu/Simple.js b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/TabMenu/Simple.js
index 8a9fd3291145fe3d140e2721fed603d745d54ee5..00f736b5ca8835faa0d497db923de3ec2ab27531 100644 (file)
--- a/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/TabMenu/Simple.js
+++ b/wcfsetup/install/files/js/WoltLabSuite/Core/Ui/TabMenu/Simple.js
@@ -131,6 +131,10 @@ define(['Dictionary', 'EventHandler', 'Dom/Traverse', 'Dom/Util'], function(Dict
                        if (!oldTabs) {
                                var hash = window.location.hash.replace(/^#/, ''), selectTab = null;
                                if (hash !== '') {
+                                       if (hash.match(/^(.+)\/.*$/)) {
+                                               hash = RegExp.$1;
+                                       }
+                                       
                                        selectTab = this._tabs.get(hash);
                                        
                                        // check for parent tab menu