Upgrade: user and comment referencing

allows commenters to reference other comments or usernames by using @ and # symbols: @username, eg. #john_78 #comment_id, eg. #1895
quickapps · Jul 15, 2013 · 283537b · 283537b
1 parent 754012a
commit 283537b
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 4 deletions.
diff --git a/QuickApps/Plugin/Comment/Model/Behavior/BBCodeBehavior.php b/QuickApps/Plugin/Comment/Model/Behavior/BBCodeBehavior.php
@@ -87,21 +87,32 @@ public function bb_parse(&$Model, $string) {
 			array(
 				'mode' => BBCODE_MODE_ENHANCED,
 				'template' => '<blockquote><cite>{$username} ' . __t('wrote') . ':</cite>{$_content}</blockquote>',
-				'allow_in' => Array('listitem', 'block', 'columns')
+				'allow_in' => array('listitem', 'block', 'columns')
 			)
 		);
 
 		$bbcode->AddRule('video',
 			array(
 				'mode' => BBCODE_MODE_CALLBACK,
 				'method' => 'BBCodeBehavior::videoTag',
-				'allow_in' => Array('listitem', 'block', 'columns')
+				'allow_in' => array('listitem', 'block', 'columns')
 			)
 		);
 
 		$Model->hook('before_parse_comment_bbcode', $string);
 
 		$string = $bbcode->Parse($string);
+		$string = preg_replace(
+			array(
+				'/(^|\s)\#(\d+)/',
+				'/(^|\s)\@(\w+)/i',
+			),
+			array(
+				'<a href="#comment-\2" class="comment-reference"><span>#\2</span></a>',
+				'<a href="' . Router::url('/user/profile/', true) . '\2" class="user-reference"><span>@\2</span></a>'
+			),
+			$string
+		);
 
 		$Model->hook('after_parse_comment_bbcode', $string);
 
@@ -127,6 +138,7 @@ public function videoTag($bbcode, $action, $name, $default, $params, $content) {
 			if (strpos($videourl['host'], 'google.com') !== false) {
 				$replacement = '<embed src="http://video.google.com/googleplayer.swf?docid=' . $videoquery['docid'] . '" width="400" height="326" type="application/x-shockwave-flash"></embed>';
 			}
+
 			return $replacement;
 		}
 	}

diff --git a/QuickApps/View/Elements/theme_comment.ctp b/QuickApps/View/Elements/theme_comment.ctp
@@ -52,9 +52,13 @@
 					echo $this->Html->nestedList($comment_actions, array('class' => 'comment-actions-list', 'id' => "comment-actions-{$comment['Comment']['id']}"));
 				?>
 			</div>
+
+			<p class="comment-number">#<?php echo $comment['Comment']['id']; ?></p>
+
 			<?php if ($Layout['node']['NodeType']['comments_subject_field']): ?>
 				<h3><?php echo $this->Html->link($comment['Comment']['subject'], "/{$Layout['node']['Node']['node_type_id']}/{$Layout['node']['Node']['slug']}.html#comment-{$comment['Comment']['id']}", array('class' => 'permalink')); ?></h3>
 			<?php endif; ?>
+
 			<p><?php echo $comment['Comment']['body']; ?></p>
 			<p id="raw-comment-<?php echo $comment['Comment']['id']; ?>" style="display:none;"><?php echo $comment['Comment']['raw_body']; ?></p>
 		</div>

diff --git a/QuickApps/View/Themed/Default/webroot/css/styles.css b/QuickApps/View/Themed/Default/webroot/css/styles.css
@@ -517,23 +517,29 @@ div.node-comments { border-top:1px solid #333; overflow:hidden; margin-top:15px;
 
 /* submited */
 #comments-list div.attribution div.submited { width:80px; float:left; }
+#comments-list div.attribution div.submited p { padding:0; }
 #comments-list div.attribution div.submited div.avatar { border:2px solid #303030; margin:0 auto; width:64px; height:64px; overflow:hidden; }
 #comments-list div.attribution .submited div.avatar img { width:100%; }
 #comments-list div.attribution .submited a.username { text-align:center; display:block; }
-#comments-list div.attribution .submited p.comment-time span { font-style:italic; }
+#comments-list div.attribution .submited p.comment-time, 
+#comments-list div.attribution .submited p.comment-permalink { display:block; text-align:center; }
+#comments-list div.attribution .submited p.comment-time { font-style:italic; font-size:9px; }
 
 @media screen and (max-width: 650px) {
 	#comments-list div.attribution { width:98%; overflow:hidden; }
 	#comments-list div.attribution div.submited { width:100%; }
 	#comments-list div.attribution div.submited div.avatar { float:left; margin-right:10px; }
 	#comments-list div.attribution .submited a.username { text-align:left; }
+	#comments-list div.attribution .submited p.comment-time,
+	#comments-list div.attribution .submited p.comment-permalink { text-align:left; }
 }
 
 /* comment content box */
-#comments-list div.comment-text  { background:#303030; border:1px solid #333; width:475px; float:left; padding:10px; }
+#comments-list div.comment-text { background:#303030; border:1px solid #333; width:475px; float:left; padding:10px; }
 #comments-list div.comment-text h3 { font-size:16px; }
 #comments-list div.comment-text blockquote { background:#F9F8F8;  }
 #comments-list div.comment-text blockquote cite { background:url(../img/comment-quote.gif) center left no-repeat; padding-left:20px;  display:block; font-weight:bold; }
+#comments-list div.comment-text p.comment-number { text-align:right; font-size:14px; font-weight:bold; }
 #comments-list .comment-actions ul { display:block; }
 #comments-list .comment-actions ul li { display:inline; }
 #comments-list .comment-actions { text-align:right; }